Modified class name

snack-ui · Aug 3, 2017 · 7a53178 · 7a53178
1 parent dc5bb2a
commit 7a53178
Show file tree

Hide file tree

Showing 15 changed files with 258 additions and 138 deletions.
diff --git a/dist/snack-themes.css b/dist/snack-themes.css
@@ -5,6 +5,7 @@
  */
 .theme-dark {
   background-color: #212121;
+  color: #5c5c5c;
 }
 
 .theme-dark body {
@@ -86,6 +87,10 @@
   border-color: #2d2d2d;
 }
 
+.theme-dark .boxes.inverted {
+  border-color: #fff;
+}
+
 .theme-dark .boxes.secondary > .box.heading {
   background-color: transparent;
 }

diff --git a/dist/snack-themes.min.css b/dist/snack-themes.min.css
diff --git a/dist/snack.css b/dist/snack.css
@@ -34,7 +34,6 @@ h6 {
   font-family: inherit;
   font-weight: 500;
   line-height: 1.1;
-  color: inherit;
 }
 
 small,
@@ -96,7 +95,7 @@ hr {
   background-color: #f59c1a;
 }
 
-.bg-dark {
+.bg-inverted {
   background-color: #2d353c;
 }
 
@@ -248,20 +247,20 @@ hr {
   background-color: #eb900a;
 }
 
-.btn.dark {
+.btn.inverted {
   color: #fff;
   background-color: #2d353c;
 }
 
-.btn.dark:hover {
+.btn.inverted:hover {
   background-color: #434f59;
 }
 
-.btn.dark:focus {
+.btn.inverted:focus {
   background-color: #434f59;
 }
 
-.btn.dark:active {
+.btn.inverted:active {
   background-color: #434f59;
 }
 
@@ -413,22 +412,22 @@ hr {
   background-color: #f59c1a;
 }
 
-.btn.outline.dark {
+.btn.outline.inverted {
   color: #2d353c;
   border-color: #2d353c;
 }
 
-.btn.outline.dark:hover {
+.btn.outline.inverted:hover {
   color: #fff;
   background-color: #2d353c;
 }
 
-.btn.outline.dark:focus {
+.btn.outline.inverted:focus {
   color: #fff;
   background-color: #2d353c;
 }
 
-.btn.outline.dark:active {
+.btn.outline.inverted:active {
   color: #fff;
   background-color: #2d353c;
 }
@@ -954,6 +953,10 @@ table {
   border-color: #f59c1a;
 }
 
+.boxes.inverted {
+  border-color: #2d353c;
+}
+
 .boxes.transparent {
   background-color: transparent;
 }

diff --git a/dist/snack.min.css b/dist/snack.min.css
diff --git a/examples/css/doc.css b/examples/css/doc.css
@@ -3,11 +3,16 @@ body {
   height: 100%;
 }
 
+* {
+  transition: background-color .5s;
+}
+
 .header {
   width: 100%;
   height: 50%;
   text-align: center;
   background-color: #f5f5f5;
+  color: #333;
 }
 
 .header:before {
@@ -77,7 +82,7 @@ body {
 }
 
 .theme-dark .header {
-  background-color: #383838;
+  background-color: #262626;
   color: #fff;
 }
 

diff --git a/examples/css/snack-themes.css b/examples/css/snack-themes.css
@@ -5,6 +5,7 @@
  */
 .theme-dark {
   background-color: #212121;
+  color: #5c5c5c;
 }
 
 .theme-dark body {
@@ -86,6 +87,10 @@
   border-color: #2d2d2d;
 }
 
+.theme-dark .boxes.inverted {
+  border-color: #fff;
+}
+
 .theme-dark .boxes.secondary > .box.heading {
   background-color: transparent;
 }

diff --git a/examples/css/snack.css b/examples/css/snack.css
@@ -34,7 +34,6 @@ h6 {
   font-family: inherit;
   font-weight: 500;
   line-height: 1.1;
-  color: inherit;
 }
 
 small,
@@ -96,7 +95,7 @@ hr {
   background-color: #f59c1a;
 }
 
-.bg-dark {
+.bg-inverted {
   background-color: #2d353c;
 }
 
@@ -248,20 +247,20 @@ hr {
   background-color: #eb900a;
 }
 
-.btn.dark {
+.btn.inverted {
   color: #fff;
   background-color: #2d353c;
 }
 
-.btn.dark:hover {
+.btn.inverted:hover {
   background-color: #434f59;
 }
 
-.btn.dark:focus {
+.btn.inverted:focus {
   background-color: #434f59;
 }
 
-.btn.dark:active {
+.btn.inverted:active {
   background-color: #434f59;
 }
 
@@ -413,22 +412,22 @@ hr {
   background-color: #f59c1a;
 }
 
-.btn.outline.dark {
+.btn.outline.inverted {
   color: #2d353c;
   border-color: #2d353c;
 }
 
-.btn.outline.dark:hover {
+.btn.outline.inverted:hover {
   color: #fff;
   background-color: #2d353c;
 }
 
-.btn.outline.dark:focus {
+.btn.outline.inverted:focus {
   color: #fff;
   background-color: #2d353c;
 }
 
-.btn.outline.dark:active {
+.btn.outline.inverted:active {
   color: #fff;
   background-color: #2d353c;
 }
@@ -954,6 +953,10 @@ table {
   border-color: #f59c1a;
 }
 
+.boxes.inverted {
+  border-color: #2d353c;
+}
+
 .boxes.transparent {
   background-color: transparent;
 }