buttons clean

pages/_includes/layout/navbar.html

@@ -3,6 +3,8 @@
 
 {% if include.menu-layout != 'vertical' %}
 	{% include_cached layout/navbar-logo.html class="mr-4" %}
+{% else %}
+	{% include_cached layout/navbar-search.html class="mr-4" %}
 {% endif %}
 
 <ul class="nav navbar-menu align-items-center ml-auto">

pages/_includes/layout/page-title-actions.html

@@ -17,7 +17,7 @@
 		</div>
 	{% elsif actions == 'buttons' %}
 		<span class="d-none d-sm-inline">
-			{% include_cached ui/button.html text="New view" color="secondary" icon="plus" %}
+			{% include_cached ui/button.html text="New view" color="secondary" icon="home" %}
 		</span>
 		{% include_cached ui/button.html text="Create new report" color="primary" class="ml-3" %}
 	{% endif %}

pages/_includes/ui/button.html

@@ -3,7 +3,7 @@
 {% assign provider = include.provider | default: 'fe' %}
 {% if include.text %}{% assign spinner-class="mr-2" %}{% endif %}
 {% assign e = include.element | default: 'a' %}
-<{{ e }}{% if e == 'a' %} href="{% if include.href %}{{ site.base }}/{{ include.href }}{% else %}#{% endif %}"{% endif %}{% if include.type %} type="{{ include.type }}"{% endif %} class="btn{% if include.height %} btn-{{ include.height }}{% endif %}{% if include.color %} btn-{% if include.outline %}outline-{% endif %}{{ include.color }}{% endif %}{% if include.disabled %} disabled{% endif %}{% if include.square %} btn-square{% endif %}{% if include.pill %} btn-pill{% endif %}{% if include['size'] %} btn-{{ include['size'] }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}{% if include.block %} btn-block{% endif %}{% if include.link %} btn-link{% endif %}{% if include.label %} btn-label{% endif %}{% if include.icon-only %} btn-icon{% endif %}">
+<{{ e }}{% if e == 'a' %} href="{% if include.href %}{{ site.base }}/{{ include.href }}{% else %}#{% endif %}"{% endif %}{% if include.type %} type="{{ include.type }}"{% endif %} class="btn{% if include.height %} btn-{{ include.height }}{% endif %}{% if include.color %} btn-{% if include.outline %}outline-{% endif %}{{ include.color }}{% endif %}{% if include.disabled %} disabled{% endif %}{% if include.square %} btn-square{% endif %}{% if include.pill %} btn-pill{% endif %}{% if include['size'] %} btn-{{ include['size'] }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}{% if include.block %} btn-block{% endif %}{% if include.link %} btn-link{% endif %}{% if include.icon-only %} btn-icon{% endif %}">
 {% if include.spinner %}
 {% include ui/spinner.html color=false size="sm" class=spinner-class element="span" %}{% endif %}
 {% if include.icon %}{% include_cached ui/icon.html icon=include.icon use-svg=true %}{% endif %}

scss/ui/_buttons.scss

 .btn {
-  letter-spacing: .01em;
-
   &:not([class^="btn-outline"]):not([class*=" btn-outline"]):not([class^="btn-ghost"]):not([class*=" btn-ghost"]):not(.btn-secondary) {
     text-shadow: 1px 1px 0 rgba(0, 0, 0, .05);
-    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .05), inset 0 2px 0 -1px rgba(255, 255, 255, .1);
+
+    &:not(:focus):not(.focus) {
+      box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .05), inset 0 2px 0 -1px rgba(255, 255, 255, .1);
+    }
 
     svg.icon {
       filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, .05));
@@ -16,7 +17,7 @@
   }
 
   .icon {
-    margin: 0 .5em 0 -.25em;
+    margin: 0 .25em 0 -.25em;
     font-size: 1.2em;
     vertical-align: sub;
   }
@@ -117,17 +118,6 @@
   }
 }
 
-.btn-loader {
-  display: none;
-  width: 1em;
-  height: 1em;
-  color: inherit;
-
-  @at-root .btn-loading & {
-    display: inline-block;
-  }
-}
-
 .btn-options {
   display: flex;
   align-items: center;
@@ -146,32 +136,3 @@
     height: 1rem;
   }
 }
-
-.btn-floating {
-  position: fixed;
-  right: 1.5rem;
-  bottom: 1.5rem;
-  z-index: 1030;
-}
-
-/**
-Button with label
- */
-.btn-label {
-  position: relative;
-  padding-left: px2rem(48px);
-}
-
-.btn-label-icon {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  width: px2rem(36px);
-  padding-top: px2rem(6px);
-  padding-bottom: px2rem(6px);
-  margin-bottom: 0;
-  line-height: inherit;
-  cursor: pointer;
-  background-color: rgba(0, 0, 0, .1);
-}