From db610746a0baf289aeacf4a225897e035eb9c9bc Mon Sep 17 00:00:00 2001
From: codecalm <codecalm@gmail.com>
Date: Sat, 21 Dec 2019 15:35:40 +0100
Subject: [PATCH] leading -> lh

---
 build/browsersync.js                         |  3 +--
 pages/_docs/typography.md                    |  8 ++++----
 pages/_includes/cards/gallery.html           |  2 +-
 pages/_includes/cards/order-statistics.html  |  2 +-
 pages/_includes/cards/pricing-card.html      |  2 +-
 pages/_includes/cards/small-stats.html       |  2 +-
 pages/_includes/cards/user-card.html         |  2 +-
 pages/_includes/layout/menu-aside.html       |  8 ++++----
 pages/_includes/layout/navbar.html           |  2 +-
 pages/_includes/ui/progress-description.html |  2 +-
 pages/_includes/ui/trending.html             |  2 +-
 pages/tmp2.html                              |  2 +-
 pages/users.html                             |  4 ++--
 scss/_utilities.scss                         | 10 ----------
 scss/_variables.scss                         |  5 ++++-
 scss/layout/_layout.scss                     | 15 +++++++++++++++
 16 files changed, 39 insertions(+), 32 deletions(-)

diff --git a/build/browsersync.js b/build/browsersync.js
index 09678293c..3fb29d217 100755
--- a/build/browsersync.js
+++ b/build/browsersync.js
@@ -13,13 +13,12 @@ bs.init({
     routes: {
       '/': 'tmp',
       '/dist': 'tmp-dist',
-      '/dist/fonts': 'fonts',
       '/libs': 'static/libs',
       '/img': 'static/img',
       '/node_modules': 'node_modules',
     },
   },
-  files: ['tmp/**/*', 'dist/css/*.css', 'dist/js/*.js'],
+  files: ['tmp/**/*', 'tmp-dist/css/*.css', 'tmp-dist/js/*.js'],
   watchOptions: {
     ignoreInitial: true,
   },
diff --git a/pages/_docs/typography.md b/pages/_docs/typography.md
index 93e0d9140..6812476bc 100644
--- a/pages/_docs/typography.md
+++ b/pages/_docs/typography.md
@@ -133,10 +133,10 @@ Utilities for controlling the tracking (letter spacing) of an element.
 Utilities for controlling the leading (line height) of an element.
 
 {% example %}
-<p class="leading-none">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
-<p class="leading-tight">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
-<p class="leading-normal">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
-<p class="leading-loose">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
+<p class="lh-1">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
+<p class="lh-sm">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
+<p class="lh-base">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
+<p class="lh-lg">Lorem ipsum dolor sit amet.<br>Dolor sit amet.</p>
 {% endexample %}
 
 ### Antialiasing
diff --git a/pages/_includes/cards/gallery.html b/pages/_includes/cards/gallery.html
index 50bcd6cb8..459f5a5c8 100644
--- a/pages/_includes/cards/gallery.html
+++ b/pages/_includes/cards/gallery.html
@@ -3,7 +3,7 @@
     <a href="#" class="mb-3 d-block"><img src="{{ site.base }}/img/photos/{{ photo.file }}" class="rounded"></a>
     <div class="d-flex align-items-center">
       {% include ui/avatar.html person=include.person class="mr-3 rounded" %}
-      <div class="leading-tight">
+      <div class="lh-sm">
         <div>{{ include.person.full_name }}</div>
         <div class="text-muted">{{ forloop.index | random_date_ago: 10 | timeago }}</div>
       </div>
diff --git a/pages/_includes/cards/order-statistics.html b/pages/_includes/cards/order-statistics.html
index a82392ed1..cb1063d72 100644
--- a/pages/_includes/cards/order-statistics.html
+++ b/pages/_includes/cards/order-statistics.html
@@ -12,7 +12,7 @@
 
       <ul class="list-unstyled">
          {% for item in site.data.orders %}
-         <li class="row row-sm leading-tight align-items-center mb-2">
+         <li class="row row-sm lh-sm align-items-center mb-2">
             <div class="col-auto"><span class="legend bg-{{ item.color }}"></span></div>
             <div class="col">
                {{ item.title }}
diff --git a/pages/_includes/cards/pricing-card.html b/pages/_includes/cards/pricing-card.html
index 06812f047..959b5ea61 100644
--- a/pages/_includes/cards/pricing-card.html
+++ b/pages/_includes/cards/pricing-card.html
@@ -9,7 +9,7 @@
 		<div class="text-uppercase text-muted">{{ include.category | default: 'Enterprise' }}</div>
 		<div class="h1 my-4">${{ include.price | default: '79' }}</div>
 
-		<ul class="list-unstyled leading-loose">
+		<ul class="list-unstyled lh-lg">
 			<li><strong>{{ include.users | default: 10 }}</strong> Users</li>
 			{% for feature in features %}
 			<li>
diff --git a/pages/_includes/cards/small-stats.html b/pages/_includes/cards/small-stats.html
index 2badb5462..d2aca323d 100644
--- a/pages/_includes/cards/small-stats.html
+++ b/pages/_includes/cards/small-stats.html
@@ -14,7 +14,7 @@
     </div>
     {% endif %}
 
-    <div class="mr-3 leading-tight">
+    <div class="mr-3 lh-sm">
       <div class="strong">
         {{ include.count | default: 1700 | format_number }} {{ include.subtitle }}
         {% if include.small-icon %}
diff --git a/pages/_includes/cards/user-card.html b/pages/_includes/cards/user-card.html
index f700a4b6a..9c7c3fdbc 100644
--- a/pages/_includes/cards/user-card.html
+++ b/pages/_includes/cards/user-card.html
@@ -5,7 +5,7 @@
     <div class="float-{% if include.right %}right{% else %}left mr-3{% endif %}">
       {% include ui/avatar.html person=person class="rounded" %}
     </div>
-    <div class="leading-tight">
+    <div class="lh-sm">
       <div class="strong">{{ person.full_name }}</div>
       <div class="text-muted">{{ person.job_title }}</div>
     </div>
diff --git a/pages/_includes/layout/menu-aside.html b/pages/_includes/layout/menu-aside.html
index 1a8084e63..1871656bb 100644
--- a/pages/_includes/layout/menu-aside.html
+++ b/pages/_includes/layout/menu-aside.html
@@ -18,11 +18,11 @@
 			{% assign badge-color = level-1[1].badge-color | default: 'green' %}
 			{% include ui/badge.html text=badge color=badge-color %}
 			{% endif %}
-		</a>
 
-		{% comment %}
-		<div class="sidebar-nav-title">{{ level-1[1].title }}</div>
-		{% endcomment %}
+        {% if level-1[1].children %}
+        <span class="sidebar-nav-arrow"></span>
+        {% endif %}
+		</a>
 
 		{% if level-1[1].children %}
 		<ul class="sidebar-subnav">
diff --git a/pages/_includes/layout/navbar.html b/pages/_includes/layout/navbar.html
index 07e13e48e..774269680 100644
--- a/pages/_includes/layout/navbar.html
+++ b/pages/_includes/layout/navbar.html
@@ -16,7 +16,7 @@
       <a href="#" data-toggle="dropdown"
          class="nav-link d-flex align-items-center py-0 px-lg-0 px-2 text-reset ml-2">
          {% include ui/avatar.html src=person.photo size="sm" %}
-         <span class="ml-2 d-none d-lg-block leading-none">
+         <span class="ml-2 d-none d-lg-block lh-1">
             {{ person.full_name }}
             <span class="text-muted d-block mt-1 text-h6">Administrator</span>
          </span>
diff --git a/pages/_includes/ui/progress-description.html b/pages/_includes/ui/progress-description.html
index 72285f2e0..2ef7e54bc 100644
--- a/pages/_includes/ui/progress-description.html
+++ b/pages/_includes/ui/progress-description.html
@@ -2,7 +2,7 @@
 {% assign color = include.color | default: 'blue' %}
 
 <div{% if include.class %} class="{{ include.class }}"{% endif %}>
-   <div class="d-flex mb-1 align-items-center leading-none">
+   <div class="d-flex mb-1 align-items-center lh-1">
       <div class="text-h5 font-weight-bolder m-0">{{ include.label | default: 'Label' }}</div>
       {% if include.description %}
          <div class="text-h6 text-muted ml-2">{{ include.description }}</div>
diff --git a/pages/_includes/ui/trending.html b/pages/_includes/ui/trending.html
index 6da49b830..c73a4f160 100644
--- a/pages/_includes/ui/trending.html
+++ b/pages/_includes/ui/trending.html
@@ -10,6 +10,6 @@
    {% assign icon = 'trending-down' %}
 {% endif %}
 
-<span class="text-{{ color }} d-inline-flex align-items-center leading-none{% if include.class %} {{ include.class }}{% endif %}">
+<span class="text-{{ color }} d-inline-flex align-items-center lh-1{% if include.class %} {{ include.class }}{% endif %}">
    {{ value }}% {% include_cached ui/icon.html icon=icon class="icon-thin" class="ml-1" %}
 </span>
diff --git a/pages/tmp2.html b/pages/tmp2.html
index 92caae02b..136c9ca6e 100644
--- a/pages/tmp2.html
+++ b/pages/tmp2.html
@@ -13,7 +13,7 @@ page-title: Tabler licence
 					</div>
 					<div>
 						<small class="text-muted">tabler/tabler is licensed under the</small>
-						<h3 class="leading-none">MIT License</h3>
+						<h3 class="lh-1">MIT License</h3>
 					</div>
 				</div>
 
diff --git a/pages/users.html b/pages/users.html
index 484b06cec..3428d14c0 100644
--- a/pages/users.html
+++ b/pages/users.html
@@ -25,11 +25,11 @@ menu: users
                </div>
 
                {% if online_counter > 7 %}
-                  <div class="col-auto leading-none align-self-start">
+                  <div class="col-auto lh-1 align-self-start">
                      {% include ui/badge.html text="online" color="green-lt" %}
                   </div>
                {% elsif online_counter > 5 %}
-               <div class="col-auto leading-none align-self-start">
+               <div class="col-auto lh-1 align-self-start">
                   {% include ui/badge.html text="offline" color="gray-lt" %}
                </div>
                {% endif %}
diff --git a/scss/_utilities.scss b/scss/_utilities.scss
index 91884ea30..d95861a70 100644
--- a/scss/_utilities.scss
+++ b/scss/_utilities.scss
@@ -20,16 +20,6 @@ $utilities: (
       wide: .05em,
     )
   ),
-  "leading": (
-    property: line-height,
-    class: leading,
-    values: (
-      none: 1,
-      tight: 1.3333334,
-      normal: $line-height-base,
-      loose: 2 !important,
-    )
-  ),
   "cursor": (
     property: cursor,
     class: cursor,
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 714a3c084..dd0386c9c 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -113,9 +113,12 @@ $avatar-sizes: (
 //Fonts
 $font-size-base: .9375rem !default;
 $font-weight-bold: 600 !default;
-$line-height-base: 1.6 !default;
 $body-letter-spacing: null !default;
 
+$line-height-base: 1.6 !default;
+$line-height-sm: 1.3333334 !default;
+$line-height-lg: 2 !default;
+
 $border-width: 1px !default;
 $border-width-wide: 2px !default;
 $border-radius: 3px !default;
diff --git a/scss/layout/_layout.scss b/scss/layout/_layout.scss
index 7973a6afa..d95db22fb 100644
--- a/scss/layout/_layout.scss
+++ b/scss/layout/_layout.scss
@@ -355,6 +355,21 @@ Sidebar menu
   }
 }
 
+.sidebar-nav-arrow {
+  outline: 1px solid green;
+  display: block;
+  margin-left: auto;
+  @include caret(right);
+}
+
+.sidebar-subnav {
+  display: none;
+
+  .sidebar-nav-item.active & {
+    display: block;
+  }
+}
+
 .sidebar-nav-title {
   @include subheader(false);
   color: inherit;