From: Keith Stolte <kstolte@yellowdogsoftware.com>
Date: Thu, 2 Nov 2017 09:51:52 +0000 (-0400)
Subject: Addition of Sass Color Map to Customize Page (#1394)
X-Git-Tag: 0.6.1~26
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=c7c1a99afa6ea497eda6a088b0ecb0d117676342;p=thirdparty%2Fbulma.git

Addition of Sass Color Map to Customize Page (#1394)

* Addition of Sass Color Map to Customize Page

Added verbiage to Customization page to demonstrate how to add new colors to the color map.
Using this methodology allows for the dev to use `<i class="fa fa-github has-text-github"></i>` or use `is-github` in a class for a background.

* Change map-merge of $color to only merge once, Sass Complience

- Changed map-merge of $color to import from another map rather than adding each line individually.
- Made it Sass Compliant
Updating based on  #1394 comments from @jgthms
---

diff --git a/docs/documentation/overview/customize.html b/docs/documentation/overview/customize.html
index bd955d685..351a2a32d 100644
--- a/docs/documentation/overview/customize.html
+++ b/docs/documentation/overview/customize.html
@@ -27,7 +27,22 @@ $danger: $orange
 // Use the new serif family
 $family-primary: $family-serif
 
-// 4. Import the rest of Bulma
+// 4. Setup your Custom Colors
+$linkedin: #0077B5
+$linkedin-invert: findColorInvert($linkedin)
+$twitter: #1DA1F2
+$twitter-invert: findColorInvert($twitter)
+$github: #222222
+$github-invert: findColorInvert($github)
+// Add new color variables to the color map.
+$addColors: (
+  "twitter":($twitter, $twitter-invert), 
+  "linkedin": ($linkedin, $linkedin-invert),
+  "github": ($github, $github-invert)
+)
+$colors: map-merge($colors, $addColors)
+
+// 5. Import the rest of Bulma
 @import "../bulma"
 {% endcapture %}