From: Jeremy Thomas Date: Sat, 7 Oct 2017 19:52:39 +0000 (+0100) Subject: Add link color X-Git-Tag: 0.6.0~46 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=e037deec73e7f9a924631cc7274d5956eb3a4f78;p=thirdparty%2Fbulma.git Add link color --- diff --git a/docs/_includes/features.html b/docs/_includes/features.html index e3f8bd956..92c601b66 100644 --- a/docs/_includes/features.html +++ b/docs/_includes/features.html @@ -87,11 +87,12 @@
Light
Dark
Black
-
Link
+
Text
Primary
+
Link
Info
Success
Warning
@@ -118,6 +119,7 @@ Light White Primary +Link Info Success Warning @@ -320,7 +322,7 @@ Remember me
-
diff --git a/docs/_includes/navbar.html b/docs/_includes/navbar.html index 020a1807b..d6b82c1f2 100644 --- a/docs/_includes/navbar.html +++ b/docs/_includes/navbar.html @@ -61,7 +61,7 @@

- {{ site.version }} + {{ site.version }}

{{#unless site.deprecated}} @@ -81,7 +81,7 @@

- {{ post.date | date_to_string }} + {{ post.date | date_to_string }}

{{ post.title }}

diff --git a/docs/_layouts/documentation.html b/docs/_layouts/documentation.html index f05a16fb6..93b4b87e9 100644 --- a/docs/_layouts/documentation.html +++ b/docs/_layouts/documentation.html @@ -7,7 +7,7 @@ route: documentation {% include navbar.html id="Documentation" %}
-
+
diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css index 5977e660f..1e5105144 100644 --- a/docs/css/bulma-docs.css +++ b/docs/css/bulma-docs.css @@ -701,14 +701,22 @@ a.has-text-primary:hover, a.has-text-primary:focus { color: #009e86 !important; } -.has-text-info { +.has-text-link { color: #3273dc !important; } -a.has-text-info:hover, a.has-text-info:focus { +a.has-text-link:hover, a.has-text-link:focus { color: #205bbc !important; } +.has-text-info { + color: #209cee !important; +} + +a.has-text-info:hover, a.has-text-info:focus { + color: #0f81cc !important; +} + .has-text-success { color: #23d160 !important; } @@ -1263,24 +1271,24 @@ a.box:active { color: #363636; } -.button.is-link { +.button.is-text { background-color: transparent; border-color: transparent; color: #4a4a4a; text-decoration: underline; } -.button.is-link:hover, .button.is-link.is-hovered, .button.is-link:focus, .button.is-link.is-focused { +.button.is-text:hover, .button.is-text.is-hovered, .button.is-text:focus, .button.is-text.is-focused { background-color: whitesmoke; color: #363636; } -.button.is-link:active, .button.is-link.is-active { +.button.is-text:active, .button.is-text.is-active { background-color: #e8e8e8; color: #363636; } -.button.is-link[disabled] { +.button.is-text[disabled] { background-color: transparent; border-color: transparent; box-shadow: none; @@ -1756,82 +1764,176 @@ a.box:active { color: #fff; } -.button.is-info { +.button.is-link { background-color: #3273dc; border-color: transparent; color: #fff; } -.button.is-info:hover, .button.is-info.is-hovered { +.button.is-link:hover, .button.is-link.is-hovered { background-color: #276cda; border-color: transparent; color: #fff; } -.button.is-info:focus, .button.is-info.is-focused { +.button.is-link:focus, .button.is-link.is-focused { border-color: transparent; color: #fff; } -.button.is-info:focus:not(:active), .button.is-info.is-focused:not(:active) { +.button.is-link:focus:not(:active), .button.is-link.is-focused:not(:active) { box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25); } -.button.is-info:active, .button.is-info.is-active { +.button.is-link:active, .button.is-link.is-active { background-color: #2366d1; border-color: transparent; color: #fff; } -.button.is-info[disabled] { +.button.is-link[disabled] { background-color: #3273dc; border-color: transparent; box-shadow: none; } -.button.is-info.is-inverted { +.button.is-link.is-inverted { background-color: #fff; color: #3273dc; } -.button.is-info.is-inverted:hover { +.button.is-link.is-inverted:hover { background-color: #f2f2f2; } -.button.is-info.is-inverted[disabled] { +.button.is-link.is-inverted[disabled] { background-color: #fff; border-color: transparent; box-shadow: none; color: #3273dc; } -.button.is-info.is-loading:after { +.button.is-link.is-loading:after { border-color: transparent transparent #fff #fff !important; } -.button.is-info.is-outlined { +.button.is-link.is-outlined { background-color: transparent; border-color: #3273dc; color: #3273dc; } -.button.is-info.is-outlined:hover, .button.is-info.is-outlined:focus { +.button.is-link.is-outlined:hover, .button.is-link.is-outlined:focus { background-color: #3273dc; border-color: #3273dc; color: #fff; } -.button.is-info.is-outlined.is-loading:after { +.button.is-link.is-outlined.is-loading:after { border-color: transparent transparent #3273dc #3273dc !important; } -.button.is-info.is-outlined[disabled] { +.button.is-link.is-outlined[disabled] { background-color: transparent; border-color: #3273dc; box-shadow: none; color: #3273dc; } +.button.is-link.is-inverted.is-outlined { + background-color: transparent; + border-color: #fff; + color: #fff; +} + +.button.is-link.is-inverted.is-outlined:hover, .button.is-link.is-inverted.is-outlined:focus { + background-color: #fff; + color: #3273dc; +} + +.button.is-link.is-inverted.is-outlined[disabled] { + background-color: transparent; + border-color: #fff; + box-shadow: none; + color: #fff; +} + +.button.is-info { + background-color: #209cee; + border-color: transparent; + color: #fff; +} + +.button.is-info:hover, .button.is-info.is-hovered { + background-color: #1496ed; + border-color: transparent; + color: #fff; +} + +.button.is-info:focus, .button.is-info.is-focused { + border-color: transparent; + color: #fff; +} + +.button.is-info:focus:not(:active), .button.is-info.is-focused:not(:active) { + box-shadow: 0 0 0 0.125em rgba(32, 156, 238, 0.25); +} + +.button.is-info:active, .button.is-info.is-active { + background-color: #118fe4; + border-color: transparent; + color: #fff; +} + +.button.is-info[disabled] { + background-color: #209cee; + border-color: transparent; + box-shadow: none; +} + +.button.is-info.is-inverted { + background-color: #fff; + color: #209cee; +} + +.button.is-info.is-inverted:hover { + background-color: #f2f2f2; +} + +.button.is-info.is-inverted[disabled] { + background-color: #fff; + border-color: transparent; + box-shadow: none; + color: #209cee; +} + +.button.is-info.is-loading:after { + border-color: transparent transparent #fff #fff !important; +} + +.button.is-info.is-outlined { + background-color: transparent; + border-color: #209cee; + color: #209cee; +} + +.button.is-info.is-outlined:hover, .button.is-info.is-outlined:focus { + background-color: #209cee; + border-color: #209cee; + color: #fff; +} + +.button.is-info.is-outlined.is-loading:after { + border-color: transparent transparent #209cee #209cee !important; +} + +.button.is-info.is-outlined[disabled] { + background-color: transparent; + border-color: #209cee; + box-shadow: none; + color: #209cee; +} + .button.is-info.is-inverted.is-outlined { background-color: transparent; border-color: #fff; @@ -1840,7 +1942,7 @@ a.box:active { .button.is-info.is-inverted.is-outlined:hover, .button.is-info.is-inverted.is-outlined:focus { background-color: #fff; - color: #3273dc; + color: #209cee; } .button.is-info.is-inverted.is-outlined[disabled] { @@ -2598,9 +2700,22 @@ a.box:active { box-shadow: 0 0 0 0.125em rgba(0, 209, 178, 0.25); } +.input.is-link, +.textarea.is-link { + border-color: #3273dc; +} + +.input.is-link:focus, .input.is-link.is-focused, .input.is-link:active, .input.is-link.is-active, +.textarea.is-link:focus, +.textarea.is-link.is-focused, +.textarea.is-link:active, +.textarea.is-link.is-active { + box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25); +} + .input.is-info, .textarea.is-info { - border-color: #3273dc; + border-color: #209cee; } .input.is-info:focus, .input.is-info.is-focused, .input.is-info:active, .input.is-info.is-active, @@ -2608,7 +2723,7 @@ a.box:active { .textarea.is-info.is-focused, .textarea.is-info:active, .textarea.is-info.is-active { - box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25); + box-shadow: 0 0 0 0.125em rgba(32, 156, 238, 0.25); } .input.is-success, @@ -2912,14 +3027,22 @@ a.box:active { box-shadow: 0 0 0 0.125em rgba(0, 209, 178, 0.25); } -.select.is-info select { +.select.is-link select { border-color: #3273dc; } -.select.is-info select:focus, .select.is-info select.is-focused, .select.is-info select:active, .select.is-info select.is-active { +.select.is-link select:focus, .select.is-link select.is-focused, .select.is-link select:active, .select.is-link select.is-active { box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25); } +.select.is-info select { + border-color: #209cee; +} + +.select.is-info select:focus, .select.is-info select.is-focused, .select.is-info select:active, .select.is-info select.is-active { + box-shadow: 0 0 0 0.125em rgba(32, 156, 238, 0.25); +} + .select.is-success select { border-color: #23d160; } @@ -3131,30 +3254,54 @@ a.box:active { color: #fff; } -.file.is-info .file-cta { +.file.is-link .file-cta { background-color: #3273dc; border-color: transparent; color: #fff; } -.file.is-info:hover .file-cta, .file.is-info.is-hovered .file-cta { +.file.is-link:hover .file-cta, .file.is-link.is-hovered .file-cta { background-color: #276cda; border-color: transparent; color: #fff; } -.file.is-info:focus .file-cta, .file.is-info.is-focused .file-cta { +.file.is-link:focus .file-cta, .file.is-link.is-focused .file-cta { border-color: transparent; box-shadow: 0 0 0.5em rgba(50, 115, 220, 0.25); color: #fff; } -.file.is-info:active .file-cta, .file.is-info.is-active .file-cta { +.file.is-link:active .file-cta, .file.is-link.is-active .file-cta { background-color: #2366d1; border-color: transparent; color: #fff; } +.file.is-info .file-cta { + background-color: #209cee; + border-color: transparent; + color: #fff; +} + +.file.is-info:hover .file-cta, .file.is-info.is-hovered .file-cta { + background-color: #1496ed; + border-color: transparent; + color: #fff; +} + +.file.is-info:focus .file-cta, .file.is-info.is-focused .file-cta { + border-color: transparent; + box-shadow: 0 0 0.5em rgba(32, 156, 238, 0.25); + color: #fff; +} + +.file.is-info:active .file-cta, .file.is-info.is-active .file-cta { + background-color: #118fe4; + border-color: transparent; + color: #fff; +} + .file.is-success .file-cta { background-color: #23d160; border-color: transparent; @@ -3482,10 +3629,14 @@ a.box:active { color: #00d1b2; } -.help.is-info { +.help.is-link { color: #3273dc; } +.help.is-info { + color: #209cee; +} + .help.is-success { color: #23d160; } @@ -3982,11 +4133,16 @@ a.box:active { color: #fff; } -.notification.is-info { +.notification.is-link { background-color: #3273dc; color: #fff; } +.notification.is-info { + background-color: #209cee; + color: #fff; +} + .notification.is-success { background-color: #23d160; color: #fff; @@ -4070,14 +4226,22 @@ a.box:active { background-color: #00d1b2; } -.progress.is-info::-webkit-progress-value { +.progress.is-link::-webkit-progress-value { background-color: #3273dc; } -.progress.is-info::-moz-progress-bar { +.progress.is-link::-moz-progress-bar { background-color: #3273dc; } +.progress.is-info::-webkit-progress-value { + background-color: #209cee; +} + +.progress.is-info::-moz-progress-bar { + background-color: #209cee; +} + .progress.is-success::-webkit-progress-value { background-color: #23d160; } @@ -4163,13 +4327,20 @@ a.box:active { color: #fff; } -.table td.is-info, -.table th.is-info { +.table td.is-link, +.table th.is-link { background-color: #3273dc; border-color: #3273dc; color: #fff; } +.table td.is-info, +.table th.is-info { + background-color: #209cee; + border-color: #209cee; + color: #fff; +} + .table td.is-success, .table th.is-success { background-color: #23d160; @@ -4348,11 +4519,16 @@ a.box:active { color: #fff; } -.tag:not(body).is-info { +.tag:not(body).is-link { background-color: #3273dc; color: #fff; } +.tag:not(body).is-info { + background-color: #209cee; + color: #fff; +} + .tag:not(body).is-success { background-color: #23d160; color: #fff; @@ -5255,20 +5431,34 @@ a.dropdown-item.is-active { color: #021310; } -.message.is-info { +.message.is-link { background-color: #f6f9fe; } -.message.is-info .message-header { +.message.is-link .message-header { background-color: #3273dc; color: #fff; } -.message.is-info .message-body { +.message.is-link .message-body { border-color: #3273dc; color: #22509a; } +.message.is-info { + background-color: #f6fbfe; +} + +.message.is-info .message-header { + background-color: #209cee; + color: #fff; +} + +.message.is-info .message-body { + border-color: #209cee; + color: #12537e; +} + .message.is-success { background-color: #f6fef9; } @@ -6022,11 +6212,64 @@ a.nav-item:not(.button).is-tab.is-active { } } -.navbar.is-info { +.navbar.is-link { background-color: #3273dc; color: #fff; } +.navbar.is-link .navbar-brand > .navbar-item, +.navbar.is-link .navbar-brand .navbar-link { + color: #fff; +} + +.navbar.is-link .navbar-brand > a.navbar-item:hover, .navbar.is-link .navbar-brand > a.navbar-item.is-active, +.navbar.is-link .navbar-brand .navbar-link:hover, +.navbar.is-link .navbar-brand .navbar-link.is-active { + background-color: #2366d1; + color: #fff; +} + +.navbar.is-link .navbar-brand .navbar-link::after { + border-color: #fff; +} + +@media screen and (min-width: 1024px) { + .navbar.is-link .navbar-start > .navbar-item, + .navbar.is-link .navbar-start .navbar-link, + .navbar.is-link .navbar-end > .navbar-item, + .navbar.is-link .navbar-end .navbar-link { + color: #fff; + } + .navbar.is-link .navbar-start > a.navbar-item:hover, .navbar.is-link .navbar-start > a.navbar-item.is-active, + .navbar.is-link .navbar-start .navbar-link:hover, + .navbar.is-link .navbar-start .navbar-link.is-active, + .navbar.is-link .navbar-end > a.navbar-item:hover, + .navbar.is-link .navbar-end > a.navbar-item.is-active, + .navbar.is-link .navbar-end .navbar-link:hover, + .navbar.is-link .navbar-end .navbar-link.is-active { + background-color: #2366d1; + color: #fff; + } + .navbar.is-link .navbar-start .navbar-link::after, + .navbar.is-link .navbar-end .navbar-link::after { + border-color: #fff; + } + .navbar.is-link .navbar-item.has-dropdown:hover .navbar-link, + .navbar.is-link .navbar-item.has-dropdown.is-active .navbar-link { + background-color: #2366d1; + color: #fff; + } + .navbar.is-link .navbar-dropdown a.navbar-item.is-active { + background-color: #3273dc; + color: #fff; + } +} + +.navbar.is-info { + background-color: #209cee; + color: #fff; +} + .navbar.is-info .navbar-brand > .navbar-item, .navbar.is-info .navbar-brand .navbar-link { color: #fff; @@ -6035,7 +6278,7 @@ a.nav-item:not(.button).is-tab.is-active { .navbar.is-info .navbar-brand > a.navbar-item:hover, .navbar.is-info .navbar-brand > a.navbar-item.is-active, .navbar.is-info .navbar-brand .navbar-link:hover, .navbar.is-info .navbar-brand .navbar-link.is-active { - background-color: #2366d1; + background-color: #118fe4; color: #fff; } @@ -6057,7 +6300,7 @@ a.nav-item:not(.button).is-tab.is-active { .navbar.is-info .navbar-end > a.navbar-item.is-active, .navbar.is-info .navbar-end .navbar-link:hover, .navbar.is-info .navbar-end .navbar-link.is-active { - background-color: #2366d1; + background-color: #118fe4; color: #fff; } .navbar.is-info .navbar-start .navbar-link::after, @@ -6066,11 +6309,11 @@ a.nav-item:not(.button).is-tab.is-active { } .navbar.is-info .navbar-item.has-dropdown:hover .navbar-link, .navbar.is-info .navbar-item.has-dropdown.is-active .navbar-link { - background-color: #2366d1; + background-color: #118fe4; color: #fff; } .navbar.is-info .navbar-dropdown a.navbar-item.is-active { - background-color: #3273dc; + background-color: #209cee; color: #fff; } } @@ -8622,11 +8865,126 @@ label.panel-block:hover { } } +<<<<<<< HEAD .hero.is-info { +======= +@media screen and (max-width: 768px) { + .hero.is-primary .nav-toggle span { + background-color: #fff; + } + .hero.is-primary .nav-toggle:hover { + background-color: rgba(10, 10, 10, 0.1); + } + .hero.is-primary .nav-toggle.is-active span { + background-color: #fff; + } + .hero.is-primary .nav-menu .nav-item { + border-top-color: rgba(255, 255, 255, 0.2); + } +} + +.hero.is-link { +>>>>>>> Add link color background-color: #3273dc; color: #fff; } +.hero.is-link a:not(.button), +.hero.is-link strong { + color: inherit; +} + +.hero.is-link .title { + color: #fff; +} + +.hero.is-link .subtitle { + color: rgba(255, 255, 255, 0.9); +} + +.hero.is-link .subtitle a:not(.button), +.hero.is-link .subtitle strong { + color: #fff; +} + +.hero.is-link .nav { + box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-link .nav-menu { + background-color: #3273dc; + } +} + +.hero.is-link a.nav-item, +.hero.is-link .nav-item a:not(.button) { + color: rgba(255, 255, 255, 0.7); +} + +.hero.is-link a.nav-item:hover, .hero.is-link a.nav-item.is-active, +.hero.is-link .nav-item a:not(.button):hover, +.hero.is-link .nav-item a:not(.button).is-active { + color: #fff; +} + +.hero.is-link .tabs a { + color: #fff; + opacity: 0.9; +} + +.hero.is-link .tabs a:hover { + opacity: 1; +} + +.hero.is-link .tabs li.is-active a { + opacity: 1; +} + +.hero.is-link .tabs.is-boxed a, .hero.is-link .tabs.is-toggle a { + color: #fff; +} + +.hero.is-link .tabs.is-boxed a:hover, .hero.is-link .tabs.is-toggle a:hover { + background-color: rgba(10, 10, 10, 0.1); +} + +.hero.is-link .tabs.is-boxed li.is-active a, .hero.is-link .tabs.is-boxed li.is-active a:hover, .hero.is-link .tabs.is-toggle li.is-active a, .hero.is-link .tabs.is-toggle li.is-active a:hover { + background-color: #fff; + border-color: #fff; + color: #3273dc; +} + +.hero.is-link.is-bold { + background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-link.is-bold .nav-menu { + background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%); + } +} + +@media screen and (max-width: 768px) { + .hero.is-link .nav-toggle span { + background-color: #fff; + } + .hero.is-link .nav-toggle:hover { + background-color: rgba(10, 10, 10, 0.1); + } + .hero.is-link .nav-toggle.is-active span { + background-color: #fff; + } + .hero.is-link .nav-menu .nav-item { + border-top-color: rgba(255, 255, 255, 0.2); + } +} + +.hero.is-info { + background-color: #209cee; + color: #fff; +} + .hero.is-info a:not(.button), .hero.is-info strong { color: inherit; @@ -8655,8 +9013,12 @@ label.panel-block:hover { @media screen and (max-width: 768px) { .hero.is-info .nav-menu { +<<<<<<< HEAD >>>>>>> Use link instead of primary background-color: #3273dc; +======= + background-color: #209cee; +>>>>>>> Add link color } } @@ -8696,16 +9058,21 @@ label.panel-block:hover { .hero.is-info .tabs.is-boxed li.is-active a, .hero.is-info .tabs.is-boxed li.is-active a:hover, .hero.is-info .tabs.is-toggle li.is-active a, .hero.is-info .tabs.is-toggle li.is-active a:hover { background-color: #fff; border-color: #fff; - color: #3273dc; + color: #209cee; } .hero.is-info.is-bold { - background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%); + background-image: linear-gradient(141deg, #04a6d7 0%, #209cee 71%, #3287f5 100%); } @media screen and (max-width: 768px) { +<<<<<<< HEAD .hero.is-info.is-bold .navbar-menu { background-image: linear-gradient(141deg, #1577c6 0%, #3273dc 71%, #4366e5 100%); +======= + .hero.is-info.is-bold .nav-menu { + background-image: linear-gradient(141deg, #04a6d7 0%, #209cee 71%, #3287f5 100%); +>>>>>>> Add link color } } @@ -9876,10 +10243,14 @@ html.route-index #carbon { background-color: #00d1b2; } -.bd-article-image.is-info { +.bd-article-image.is-link { background-color: #3273dc; } +.bd-article-image.is-info { + background-color: #209cee; +} + .bd-article-image.is-success { background-color: #23d160; } @@ -10039,11 +10410,16 @@ html.route-index #carbon { color: #fff; } -.bd-notification.is-info { +.bd-notification.is-link { background-color: #3273dc; color: #fff; } +.bd-notification.is-info { + background-color: #209cee; + color: #fff; +} + .bd-notification.is-success { background-color: #23d160; color: #fff; @@ -10451,11 +10827,16 @@ html.route-index #carbon { color: #fff; } -.bd-callout.is-info { +.bd-callout.is-link { background-color: #3273dc; color: #fff; } +.bd-callout.is-info { + background-color: #209cee; + color: #fff; +} + .bd-callout.is-success { background-color: #23d160; color: #fff; diff --git a/docs/extensions.html b/docs/extensions.html index d5a3ff4c2..d5bead57f 100644 --- a/docs/extensions.html +++ b/docs/extensions.html @@ -89,7 +89,7 @@ extensions: {% include navbar.html id="Extensions" %}
-
+
diff --git a/docs/index.html b/docs/index.html index a4bea9d3e..08562ee9a 100644 --- a/docs/index.html +++ b/docs/index.html @@ -514,7 +514,7 @@ route: index

Get started

- + diff --git a/sass/elements/button.sass b/sass/elements/button.sass index 3d84982b5..e3862955a 100644 --- a/sass/elements/button.sass +++ b/sass/elements/button.sass @@ -13,9 +13,9 @@ $button-focus-box-shadow-color: rgba($link, 0.25) !default $button-active-color: $link-active !default $button-active-border-color: $link-active-border !default -$button-link-color: $text !default -$button-link-hover-background-color: $background !default -$button-link-hover-color: $text-strong !default +$button-text-color: $text !default +$button-text-hover-background-color: $background !default +$button-text-hover-color: $text-strong !default $button-disabled-background-color: $white !default $button-disabled-border-color: $grey-lighter !default @@ -81,21 +81,21 @@ $button-static-border-color: $grey-lighter !default border-color: $button-active-border-color color: $button-active-color // Colors - &.is-link + &.is-text background-color: transparent border-color: transparent - color: $button-link-color + color: $button-text-color text-decoration: underline &:hover, &.is-hovered, &:focus, &.is-focused - background-color: $button-link-hover-background-color - color: $button-link-hover-color + background-color: $button-text-hover-background-color + color: $button-text-hover-color &:active, &.is-active - background-color: darken($button-link-hover-background-color, 5%) - color: $button-link-hover-color + background-color: darken($button-text-hover-background-color, 5%) + color: $button-text-hover-color &[disabled] background-color: transparent border-color: transparent diff --git a/sass/utilities/derived-variables.sass b/sass/utilities/derived-variables.sass index 3d486b4f8..b881a2adc 100644 --- a/sass/utilities/derived-variables.sass +++ b/sass/utilities/derived-variables.sass @@ -1,6 +1,6 @@ $primary: $turquoise !default -$info: $blue !default +$info: $cyan !default $success: $green !default $warning: $yellow !default $danger: $red !default @@ -14,12 +14,13 @@ $orange-invert: findColorInvert($orange) !default $yellow-invert: findColorInvert($yellow) !default $green-invert: findColorInvert($green) !default $turquoise-invert: findColorInvert($turquoise) !default +$cyan-invert: findColorInvert($cyan) !default $blue-invert: findColorInvert($blue) !default $purple-invert: findColorInvert($purple) !default $red-invert: findColorInvert($red) !default $primary-invert: $turquoise-invert !default -$info-invert: $blue-invert !default +$info-invert: $cyan-invert !default $success-invert: $green-invert !default $warning-invert: $yellow-invert !default $danger-invert: $red-invert !default @@ -75,7 +76,7 @@ $size-large: $size-4 !default // Lists and maps -$colors: ("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert)) !default +$colors: ("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "link": ($link, $link-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert)) !default $shades: ("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis) !default $sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default diff --git a/sass/utilities/initial-variables.sass b/sass/utilities/initial-variables.sass index e862e4ccd..e2e3bb652 100644 --- a/sass/utilities/initial-variables.sass +++ b/sass/utilities/initial-variables.sass @@ -18,6 +18,7 @@ $orange: hsl(14, 100%, 53%) !default $yellow: hsl(48, 100%, 67%) !default $green: hsl(141, 71%, 48%) !default $turquoise: hsl(171, 100%, 41%) !default +$cyan: hsl(204, 86%, 53%) !default $blue: hsl(217, 71%, 53%) !default $purple: hsl(271, 100%, 71%) !default $red: hsl(348, 100%, 61%) !default