Merge pull request mmistakes#335 from mpdeimos/accent_color

Provide accent color to buttons and notices
clarafy · Aug 7, 2019 · 29257db · 29257db
2 parents edb1b2f + 247b6f3
commit 29257db
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 1 deletion.
diff --git a/_sass/so-simple/_buttons.scss b/_sass/so-simple/_buttons.scss
@@ -29,7 +29,7 @@
   }
 
   /* button colors */
-  $buttoncolors: (primary, $primary-color),  (inverse, #fff),
+  $buttoncolors: (primary, $primary-color), (accent, $accent-color), (inverse, #fff),
      (light-outline, transparent),  (success, $success-color),
      (warning, $warning-color),  (danger, $danger-color),  (info, $info-color),
      (facebook, $facebook-color),  (twitter, $twitter-color),

diff --git a/_sass/so-simple/_notices.scss b/_sass/so-simple/_notices.scss
@@ -68,6 +68,12 @@
   @include notice(mix(#fff, $primary-color, 70%));
 }
 
+/* Accent notice */
+
+.notice--accent {
+  @include notice(mix(#fff, $accent-color, 70%));
+}
+
 /* Info notice */
 
 .notice--info {

diff --git a/docs/_posts/2013-01-11-markup-html-elements-and-formatting.md b/docs/_posts/2013-01-11-markup-html-elements-and-formatting.md
@@ -115,6 +115,7 @@ Make any link standout more when applying the `.btn` class.
 
 [Default Button](#){: .btn}
 [Primary Button](#){: .btn .btn--primary}
+[Accent Button](#){: .btn .btn--accent}
 [Success Button](#){: .btn .btn--success}
 [Warning Button](#){: .btn .btn--warning}
 [Danger Button](#){: .btn .btn--danger}
@@ -125,6 +126,7 @@ Make any link standout more when applying the `.btn` class.
 ```markdown
 [Default Button Text](#link){: .btn}
 [Primary Button Text](#link){: .btn .btn--primary}
+[Accent Button Text](#link){: .btn .btn--accent}
 [Success Button Text](#link){: .btn .btn--success}
 [Warning Button Text](#link){: .btn .btn--warning}
 [Danger Button Text](#link){: .btn .btn--danger}
@@ -153,6 +155,9 @@ Make any link standout more when applying the `.btn` class.
 **Watch out!** This paragraph of text has been [emphasized](#) with the `{: .notice--primary}` class.
 {: .notice--primary}
 
+**Watch out!** This paragraph of text has been [emphasized](#) with the `{: .notice--accent}` class.
+{: .notice--accent}
+
 **Watch out!** This paragraph of text has been [emphasized](#) with the `{: .notice--info}` class.
 {: .notice--info}
 

diff --git a/example/_posts/2013-01-11-markup-html-elements-and-formatting.md b/example/_posts/2013-01-11-markup-html-elements-and-formatting.md
@@ -115,6 +115,7 @@ Make any link standout more when applying the `.btn` class.
 
 [Default Button](#){: .btn}
 [Primary Button](#){: .btn .btn--primary}
+[Accent Button](#){: .btn .btn--accent}
 [Success Button](#){: .btn .btn--success}
 [Warning Button](#){: .btn .btn--warning}
 [Danger Button](#){: .btn .btn--danger}
@@ -125,6 +126,7 @@ Make any link standout more when applying the `.btn` class.
 ```markdown
 [Default Button Text](#link){: .btn}
 [Primary Button Text](#link){: .btn .btn--primary}
+[Accent Button Text](#link){: .btn .btn--accent}
 [Success Button Text](#link){: .btn .btn--success}
 [Warning Button Text](#link){: .btn .btn--warning}
 [Danger Button Text](#link){: .btn .btn--danger}
@@ -153,6 +155,9 @@ Make any link standout more when applying the `.btn` class.
 **Watch out!** This paragraph of text has been [emphasized](#) with the `{: .notice--primary}` class.
 {: .notice--primary}
 
+**Watch out!** This paragraph of text has been [emphasized](#) with the `{: .notice--accent}` class.
+{: .notice--accent}
+
 **Watch out!** This paragraph of text has been [emphasized](#) with the `{: .notice--info}` class.
 {: .notice--info}