Merge pull request #456 from picturepan2/0.5.3 v0.5.3

0.5.3

1 files changed, 81 insertions, 61 deletions

diff --git a/docs/dist/spectre-rtl.css b/docs/dist/spectre-rtl.css
index 1c21d5d..7cb84c6 100644
--- a/docs/dist/spectre-rtl.css
+++ b/docs/dist/spectre-rtl.css
@@ -1,5 +1,5 @@
 /*! Spectre.css RTL | MIT License | github.com/picturepan2/spectre */
-/*! Spectre.css v0.5.2 | MIT License | github.com/picturepan2/spectre */
+/*! Spectre.css v0.5.3 | MIT License | github.com/picturepan2/spectre */
 /* Manually forked from Normalize.css */
 /* normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
 /** 1. Change the default font family in all browsers (opinionated). 2. Correct the line height in all browsers. 3. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS. */
@@ -370,7 +370,7 @@ h6,
 }
 
 p {
-  margin: 0 0 1rem;
+  margin: 0 0 1.2rem;
 }
 
 a,
@@ -392,7 +392,7 @@ kbd {
   color: #fff;
   font-size: .7rem; 
   line-height: 1.2;
-  padding: .1rem .15rem;
+  padding: .1rem .2rem;
 }
 
 mark {
@@ -557,9 +557,9 @@ dl dd {
   display: inline-block;
   font-size: .8rem;
   height: 1.8rem;
-  line-height: 1rem;
+  line-height: 1.2rem;
   outline: none;
-  padding: .35rem .4rem;
+  padding: .25rem .4rem;
   text-align: center;
   text-decoration: none;
   transition: all .2s ease;
@@ -703,13 +703,13 @@ dl dd {
 .btn.btn-sm {
   font-size: .7rem;
   height: 1.4rem;
-  padding: .15rem .3rem;
+  padding: .05rem .3rem;
 }
 
 .btn.btn-lg {
   font-size: .9rem;
   height: 2rem;
-  padding: .45rem .6rem;
+  padding: .35rem .6rem;
 }
 
 .btn.btn-block {
@@ -814,18 +814,18 @@ legend {
 
 .form-label {
   display: block;
-  line-height: 1rem;
-  padding: .4rem 0;
+  line-height: 1.2rem;
+  padding: .3rem 0;
 }
 
 .form-label.label-sm {
   font-size: .7rem;
-  padding: .2rem 0;
+  padding: .1rem 0;
 }
 
 .form-label.label-lg {
   font-size: .9rem;
-  padding: .5rem 0;
+  padding: .4rem 0;
 }
 
 .form-input {
@@ -840,10 +840,10 @@ legend {
   display: block;
   font-size: .8rem;
   height: 1.8rem;
-  line-height: 1rem;
+  line-height: 1.2rem;
   max-width: 100%;
   outline: none;
-  padding: .35rem .4rem;
+  padding: .25rem .4rem;
   position: relative;
   transition: all .2s ease;
   width: 100%;
@@ -873,13 +873,13 @@ legend {
 .form-input.input-sm {
   font-size: .7rem;
   height: 1.4rem;
-  padding: .15rem .3rem;
+  padding: .05rem .3rem;
 }
 
 .form-input.input-lg {
   font-size: .9rem;
   height: 2rem;
-  padding: .45rem .6rem;
+  padding: .35rem .6rem;
 }
 
 .form-input.input-inline {
@@ -921,9 +921,9 @@ textarea.form-input {
   color: inherit;
   font-size: .8rem;
   height: 1.8rem;
-  line-height: 1rem;
+  line-height: 1.2rem;
   outline: none;
-  padding: .35rem .4rem;
+  padding: .25rem .4rem;
   vertical-align: middle;
   width: 100%;
 }
@@ -955,13 +955,13 @@ textarea.form-input {
 .form-select.select-sm {
   font-size: .7rem;
   height: 1.4rem;
-  padding: .15rem 1.1rem .15rem .3rem;
+  padding: .05rem 1.1rem .05rem .3rem;
 }
 
 .form-select.select-lg {
   font-size: .9rem;
   height: 2rem;
-  padding: .45rem 1.4rem .45rem .6rem;
+  padding: .35rem 1.4rem .35rem .6rem;
 }
 
 .has-icon-left,
@@ -972,7 +972,7 @@ textarea.form-input {
 .has-icon-left .form-icon,
 .has-icon-right .form-icon {
   height: .8rem;
-  margin: 0 .35rem;
+  margin: 0 .25rem;
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
@@ -985,7 +985,7 @@ textarea.form-input {
 }
 
 .has-icon-left .form-input {
-  padding-left: 1.5rem;
+  padding-left: 1.3rem;
 }
 
 .has-icon-right .form-icon {
@@ -993,17 +993,17 @@ textarea.form-input {
 }
 
 .has-icon-right .form-input {
-  padding-right: 1.5rem;
+  padding-right: 1.3rem;
 }
 
 .form-checkbox,
 .form-radio,
 .form-switch {
-  display: inline-block;
-  line-height: 1rem;
+  display: block;
+  line-height: 1.2rem;
   margin: .2rem 0;
   min-height: 1.2rem;
-  padding: .2rem .4rem .2rem 1.2rem;
+  padding: .1rem .4rem .1rem 1.2rem;
   position: relative;
 }
 
@@ -1167,19 +1167,19 @@ textarea.form-input {
   background: #f8f9fa;
   border: .05rem solid #caced7;
   border-radius: .1rem;
-  line-height: 1rem;
-  padding: .35rem .4rem;
+  line-height: 1.2rem;
+  padding: .25rem .4rem;
   white-space: nowrap;
 }
 
 .input-group .input-group-addon.addon-sm {
   font-size: .7rem;
-  padding: .15rem .3rem;
+  padding: .05rem .3rem;
 }
 
 .input-group .input-group-addon.addon-lg {
   font-size: .9rem;
-  padding: .45rem .6rem;
+  padding: .35rem .6rem;
 }
 
 .input-group .form-input,
@@ -1291,6 +1291,12 @@ textarea.form-input {
   box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2);
 }
 
+.has-error .form-checkbox input:indeterminate + .form-icon,
+.form-checkbox.is-error input:indeterminate + .form-icon {
+  background: #e85600;
+  border-color: #e85600;
+}
+
 .form-input:not(:placeholder-shown):invalid {
   border-color: #e85600;
 }
@@ -1339,13 +1345,17 @@ input.disabled + .form-icon {
   flex-wrap: wrap;
 }
 
+.form-inline {
+  display: inline-block;
+}
+
 .label {
   background: #f0f1f4;
   border-radius: .1rem;
   color: #5b657a;
   display: inline-block; 
   line-height: 1.2;
-  padding: .1rem .15rem;
+  padding: .1rem .2rem;
 }
 
 .label.label-rounded {
@@ -1385,7 +1395,7 @@ code {
   color: #d73e48;
   font-size: 85%; 
   line-height: 1.2;
-  padding: .1rem .15rem;
+  padding: .1rem .2rem;
 }
 
 .code {
@@ -2107,7 +2117,7 @@ summary.accordion-header::-webkit-details-marker {
   color: #fff;
   content: attr(data-badge);
   display: inline-block;
-  transform: translate(-.1rem, -.5rem);
+  transform: translate(-.05rem, -.5rem);
 }
 
 .badge[data-badge]::after {
@@ -2143,14 +2153,6 @@ summary.accordion-header::-webkit-details-marker {
   z-index: 100;
 }
 
-.badge.avatar-xs::after {
-  content: "";
-  height: .4rem;
-  min-width: .4rem;
-  padding: 0;
-  width: .4rem;
-}
-
 .breadcrumb {
   list-style: none;
   margin: .2rem 0;
@@ -2276,6 +2278,11 @@ summary.accordion-header::-webkit-details-marker {
   padding-bottom: .8rem;
 }
 
+.card .card-body {
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+}
+
 .card .card-image {
   padding-top: .8rem;
 }
@@ -2322,6 +2329,10 @@ summary.accordion-header::-webkit-details-marker {
   margin-right: .2rem;
 }
 
+.chip .btn-clear {
+  transform: scale(.75);
+}
+
 .dropdown {
   display: inline-block;
   position: relative;
@@ -2672,11 +2683,10 @@ summary.accordion-header::-webkit-details-marker {
 }
 
 .popover *:focus + .popover-container,
-.popover:hover .popover-container,
-.popover .popover-container:hover {
+.popover:hover .popover-container {
   display: block;
   opacity: 1;
-  transform: translate(-50%, -100%) scale(1);
+  transform: translate(-50%, -100%);
 }
 
 .popover.popover-right .popover-container {
@@ -2684,10 +2694,9 @@ summary.accordion-header::-webkit-details-marker {
   top: 50%;
 }
 
-.popover.popover-right :focus + .popover-container,
-.popover.popover-right:hover .popover-container,
-.popover.popover-right .popover-container:hover {
-  transform: translate(0, -50%) scale(1);
+.popover.popover-right *:focus + .popover-container,
+.popover.popover-right:hover .popover-container {
+  transform: translate(0, -50%);
 }
 
 .popover.popover-bottom .popover-container {
@@ -2695,10 +2704,9 @@ summary.accordion-header::-webkit-details-marker {
   top: 100%;
 }
 
-.popover.popover-bottom :focus + .popover-container,
-.popover.popover-bottom:hover .popover-container,
-.popover.popover-bottom .popover-container:hover {
-  transform: translate(-50%, 0) scale(1);
+.popover.popover-bottom *:focus + .popover-container,
+.popover.popover-bottom:hover .popover-container {
+  transform: translate(-50%, 0);
 }
 
 .popover.popover-left .popover-container {
@@ -2706,10 +2714,9 @@ summary.accordion-header::-webkit-details-marker {
   top: 50%;
 }
 
-.popover.popover-left :focus + .popover-container,
-.popover.popover-left:hover .popover-container,
-.popover.popover-left .popover-container:hover {
-  transform: translate(-100%, -50%) scale(1);
+.popover.popover-left *:focus + .popover-container,
+.popover.popover-left:hover .popover-container {
+  transform: translate(-100%, -50%);
 }
 
 .popover .card {
@@ -2878,7 +2885,7 @@ summary.accordion-header::-webkit-details-marker {
 
 .tile .tile-title,
 .tile .tile-subtitle {
-  line-height: 1rem;
+  line-height: 1.2rem;
 }
 
 .tile.tile-centered {
@@ -3088,6 +3095,19 @@ a.text-light:visited {
   color: white;
 }
 
+.text-dark {
+  color: #50596c;
+}
+
+a.text-dark:focus,
+a.text-dark:hover {
+  color: #454d5d;
+}
+
+a.text-dark:visited {
+  color: #5b657a;
+}
+
 .text-success {
   color: #32b643;
 }
@@ -3549,11 +3569,11 @@ a.text-error:visited {
   padding-top: .4rem !important;
 }
 
-.rounded {
+.s-rounded {
   border-radius: .1rem;
 }
 
-.circle {
+.s-circle {
   border-radius: 50%;
 }
 
@@ -3621,7 +3641,7 @@ a.text-error:visited {
   word-wrap: break-word;
 }
 
-/*! Spectre.css Icons v0.5.2 | MIT License | github.com/picturepan2/spectre */
+/*! Spectre.css Icons v0.5.3 | MIT License | github.com/picturepan2/spectre */
 .icon {
   box-sizing: border-box;
   display: inline-block;
@@ -4241,7 +4261,7 @@ a.text-error:visited {
   width: .5em;
 }
 
-/*! Spectre.css Experimentals v0.5.2 | MIT License | github.com/picturepan2/spectre */
+/*! Spectre.css Experimentals v0.5.3 | MIT License | github.com/picturepan2/spectre */
 .form-autocomplete {
   position: relative;
 }
@@ -5279,7 +5299,7 @@ a.text-error:visited {
 
 .timeline .timeline-item .timeline-icon.icon-lg {
   background: #5755d9;
-  line-height: 1rem;
+  line-height: 1.2rem;
 }
 
 .timeline .timeline-item .timeline-icon.icon-lg::before {