From 76c889d47b686d7d658fe94834d7f185cb15237a Mon Sep 17 00:00:00 2001 From: Kazhnuz Date: Tue, 8 Oct 2019 13:27:07 +0200 Subject: [PATCH] improvement: start using the solarized palette --- css/style.css | 1294 ++++++++++++++++++++++++------------------- css/style.css.map | 1 + scss/_colorize.scss | 169 +++--- scss/_commons.scss | 21 +- scss/_palette.scss | 33 +- scss/style.scss | 6 +- 6 files changed, 834 insertions(+), 690 deletions(-) create mode 100644 css/style.css.map diff --git a/css/style.css b/css/style.css index 6d1e520..992065b 100644 --- a/css/style.css +++ b/css/style.css @@ -1,89 +1,111 @@ /* ------------------ CUSTOM STYLE ------------------- */ +body { + background-color: #fdf6e3; +} + #wrapper { - background: #64b5f6 url("../img/background.png") center bottom repeat-x; } + background: #2aa198 url("../img/background.png") center bottom repeat-x; +} /* ------------------ GLOBAL STYLE ------------------- */ .no-pills { - list-style: none; } + list-style: none; +} .align-center { - text-align: center; } - + text-align: center; +} .align-left { - text-align: left; } - + text-align: left; +} .align-right { - text-align: right; } + text-align: right; +} h1, h2, h3, h4, h5, h6, h7, h8, h9, h10 { - color: white; - text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.4); } + color: #fdf6e3; + text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.4); +} /* ------------------ HEADERS ------------------- */ header h1 { border-style: none !important; - color: #FFF; + color: #fdf6e3; font-weight: 700; font-size: 5.4em; font-style: oblique; - text-shadow: 0px 2px 12px transparent; + text-shadow: 0px 2px 12px rgba(0, 0, 0, 0); padding-bottom: 0px; margin: auto; text-align: center; - line-height: 1.5em; } + line-height: 1.5em; +} .navbar { box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3); border: 1px solid rgba(0, 0, 0, 0.3); border-left: 0; - border-right: 0; } - .navbar ul { - padding-bottom: 0; } - .navbar li { - margin: 0; } + border-right: 0; +} +.navbar ul { + padding-bottom: 0; +} +.navbar li { + margin: 0; +} .dropdown-menu { - box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2); } + box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2); +} /* ------------------ FOOTER ------------------- */ footer { - margin-top: 40px; } + margin-top: 40px; +} /* social media */ ul.social { font-size: 1.5em; padding-bottom: 1em; margin: auto; - text-align: center; } - ul.social li { - margin: 0; - list-style: none; - display: inline; } - ul.social li a { - color: #FFFFFF; - background-color: #000000; - padding: 0.3em; - padding-left: 0.36em; - padding-right: 0.36em; - vertical-align: middle; - border-radius: 100%; } - ul.social li a:hover { - color: #000; - background-color: #FFF; } + text-align: center; +} +ul.social li { + margin: 0; + list-style: none; + display: inline; +} +ul.social li a { + color: #fdf6e3; + background-color: #000000; + padding: 0.3em; + padding-left: 0.36em; + padding-right: 0.36em; + vertical-align: middle; + border-radius: 100%; +} +ul.social li a:hover { + color: #000; + background-color: #fdf6e3; +} /* ------------------ CARDS ------------------- */ .card { border-radius: 3px 3px 3px 3px; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3); border: none; - margin-bottom: 1.2em; } + margin-bottom: 1.2em; + background-color: #fdf6e3; +} .card-shadow { - box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2); } + box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2); +} .card h1, .card h2, .card h3, .card h4, .card h5, .card h6, .card h7, .card h8, .card h9, .card h10 { - color: #333; - text-shadow: 0px 0px 0px transparent; } + color: #002b36; + text-shadow: 0px 0px 0px rgba(0, 0, 0, 0); +} /* header and titles */ .card-header { @@ -92,159 +114,195 @@ ul.social { box-shadow: inset 0px 2px 0px rgba(255, 255, 255, 0.1); text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3); font-weight: 600; - border-radius: 0; } - .card-header:first-child { - border-radius: 3px 3px 3px 3px; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; } - .card-header:last-child { - border-radius: 3px 3px 3px 3px; - border-top-left-radius: 0; - border-top-right-radius: 0; } - .card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6, .card-header h7, .card-header h8, .card-header h9, .card-header h10 { - font-size: 1em; - text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.3); - padding: 0px; - margin: 0px; - color: #FFF; - font-weight: 600; - line-height: 1.5em; } + border-radius: 0; +} +.card-header:first-child { + border-radius: 3px 3px 3px 3px; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} +.card-header:last-child { + border-radius: 3px 3px 3px 3px; + border-top-left-radius: 0; + border-top-right-radius: 0; +} +.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6, .card-header h7, .card-header h8, .card-header h9, .card-header h10 { + font-size: 1em; + text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.3); + padding: 0px; + margin: 0px; + color: #fdf6e3; + font-weight: 600; + line-height: 1.5em; +} /* meta */ .card-meta { padding: 1em; - border-bottom: 1px solid rgba(0, 0, 0, 0.2); } - .card-meta.media { - -ms-flex-align: center !important; - align-items: center !important; } - .card-meta .media-left .media-object { - height: 64px; - width: 64px; - border-radius: 10px; - margin-right: 1em; } - .card-meta author { - display: block; - font-weight: 600; } - .card-meta time { - display: block; - font-style: italic; } + border-bottom: 1px solid rgba(0, 0, 0, 0.2); +} +.card-meta.media { + -ms-flex-align: center !important; + align-items: center !important; +} +.card-meta .media-left .media-object { + height: 64px; + width: 64px; + border-radius: 10px; + margin-right: 1em; +} +.card-meta author { + display: block; + font-weight: 600; +} +.card-meta time { + display: block; + font-style: italic; +} /* lists */ .list-group-item { border: none; - background-color: transparent; } + background-color: transparent; +} a.list-group-item:hover { border-style: none; border-width: 0px; border-radius: 0px; - background-color: rgba(0, 0, 0, 0.1); } + background-color: rgba(0, 0, 0, 0.1); +} /* ------------------ BUTTONS ------------------- */ .btn { border: 1px solid rgba(0, 0, 0, 0.3); border-radius: 3px 3px 3px 3px; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2); - text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.3); } + text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.3); +} .btn:hover { position: relative; box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2); top: 1px; - border: 1px solid rgba(0, 0, 0, 0.3); } + border: 1px solid rgba(0, 0, 0, 0.3); +} .btn:active { position: relative; box-shadow: inset 0px 2px 0px rgba(0, 0, 0, 0.2); top: 2px; - border: 1px solid rgba(0, 0, 0, 0.3); } + border: 1px solid rgba(0, 0, 0, 0.3); +} .btn-group { - box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3); } + box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3); +} .btn-group .btn { box-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0.2); - border-radius: 3px 3px 3px 3px; } - .btn-group .btn:not(:first-child) { - border-top-left-radius: 0; - border-bottom-left-radius: 0; } - .btn-group .btn:not(:last-child) { - border-top-right-radius: 0; - border-bottom-right-radius: 0; } + border-radius: 3px 3px 3px 3px; +} +.btn-group .btn:not(:first-child) { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} +.btn-group .btn:not(:last-child) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} .btn-group .btn:hover { position: relative; top: 1px; - box-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0.2); } + box-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0.2); +} .btn-group .btn:active, .btn:not(:disabled):not(.disabled):active, .btn:not(:disabled):not(.disabled).active, .show > .btn.dropdown-toggle { position: relative; box-shadow: inset 0px 2px 0px rgba(0, 0, 0, 0.2) !important; top: 2px; - border: 1px solid rgba(0, 0, 0, 0.3); } + border: 1px solid rgba(0, 0, 0, 0.3); +} .btn:focus, .btn-primary:focus, .btn-secondary:focus, .btn-danger:focus, .btn-warning:focus, .btn-success:focus, .btn-info:focus, .btn-dark:focus, .btn-light:focus { position: relative; box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 2px rgba(0, 0, 0, 0.3); top: 1px; - outline: none; } + outline: none; +} /* ------------------ ALERTS ------------------- */ .alert { border: 1px solid rgba(0, 0, 0, 0.3); border-radius: 3px 3px 3px 3px; color: rgba(0, 0, 0, 0.7); - box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3); } + box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3); +} .alert a, .alert-link { color: rgba(0, 0, 0, 0.7); - font-weight: bold; } + font-weight: bold; +} /* ------------------ BREADCRUMB ------------------- */ .breadcrumb { border-radius: 3px 3px 3px 3px; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2); border: 0; - background-color: #eeeeec; - margin-bottom: 1.2em; } - .breadcrumb li { - margin: 0; } + background-color: #eee8d5; + margin-bottom: 1.2em; +} +.breadcrumb li { + margin: 0; +} /* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */ .share-buttons { - margin: 15px; } + margin: 15px; +} .reagir { - text-align: right; } + text-align: right; +} /* ------------------ PREVIEWS ------------------- */ .previews-section { display: flex; align-content: flex-start; - flex-wrap: wrap; } + flex-wrap: wrap; +} .preview-container { margin-bottom: 1em; padding: 0.4em; - width: 100%; } + width: 100%; +} @media (min-width: 992px) { .prev-col-2 .preview-container { - width: 50%; } - .prev-col-3 .preview-container { - width: 33%; } - .prev-col-4 .preview-container { - width: 25%; } } + width: 50%; + } + .prev-col-3 .preview-container { + width: 33%; + } + + .prev-col-4 .preview-container { + width: 25%; + } +} .card-preview { border-radius: 3px 3px 3px 3px; width: 100%; margin: auto; - box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2); } + box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2); +} .preview-link:hover { - text-decoration: none !important; } + text-decoration: none !important; +} .preview-item { height: 200px; @@ -259,36 +317,43 @@ a.list-group-item:hover { display: flex; -ms-flex-align: center !important; align-items: center !important; - justify-content: center; } + justify-content: center; +} .preview-content { - max-height: 200px; } + max-height: 200px; +} .preview-content > p { width: 100%; - margin: auto; } + margin: auto; +} .preview-content > p.p-img { text-align: center; margin: auto; padding: auto; display: block; - width: 100%; } + width: 100%; +} .preview-content > p > img { max-width: 100%; height: auto; vertical-align: middle; margin: auto; - text-align: center; } + text-align: center; +} .preview-item h1, .preview-item h2, .preview-item h3, .preview-item h4, .preview-item h5, .preview-item h6, .preview-item h7 { margin-bottom: 0px; max-width: 100%; - display: none; } + display: none; +} .preview-item h1 { - display: none; } + display: none; +} .preview-overlay { height: 100%; @@ -298,11 +363,12 @@ a.list-group-item:hover { left: 0; position: absolute; padding: 0; - transition: opacity .5s; - color: #FFF; + transition: opacity 0.5s; + color: #fdf6e3; background-color: rgba(0, 0, 0, 0.5); text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.7); - backdrop-filter: none; } + backdrop-filter: none; +} .preview-overlay h1 { max-width: 100%; @@ -312,632 +378,694 @@ a.list-group-item:hover { text-align: center; display: block; font-size: 2em; - color: white; } + color: #fdf6e3; +} .preview-overlay h1, .preview-overlay h2, .preview-overlay h3, .preview-overlay h4, .preview-overlay h5, .preview-overlay h6, .preview-overlay h7, .preview-overlay h8, .preview-overlay h9, .preview-overlay h10 { - color: white; - text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.7); } + color: #fdf6e3; + text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.7); +} .preview-item:hover .preview-overlay { - opacity: .9; - transition: opacity .5s; - backdrop-filter: blur(2px); } + opacity: 0.9; + transition: opacity 0.5s; + backdrop-filter: blur(2px); +} .comment-text { - margin-top: 0.8em; } + margin-top: 0.8em; +} .card-preview time { margin-bottom: 0.4em; - display: block; } + display: block; +} /* ------------------ COULEURS ------------------- */ a, a:hover, a:active { - color: #4e63c9; } + color: #268bd2; +} ::selection { - background-color: #4e63c9 !important; - color: #FFF; } + background-color: #268bd2 !important; + color: #fdf6e3; +} ::-moz-selection { - background-color: #4e63c9 !important; - color: #FFF; } + background-color: #268bd2 !important; + color: #fdf6e3; +} /* CARDS */ .card-blue > .card-header { - background-color: #4e63c9; - color: #FFF; } - + background-color: #268bd2; + color: #fdf6e3; +} .card-violet > .card-header { - background-color: #ce4dcd; - color: #FFF; } - + background-color: #d33682; + color: #fdf6e3; +} .card-purple > .card-header { - background-color: #7951c0; - color: #FFF; } - + background-color: #6c71c4; + color: #fdf6e3; +} .card-red > .card-header { - background-color: #e33d22; - color: #FFF; } - + background-color: #dc322f; + color: #fdf6e3; +} .card-orange > .card-header { - background-color: #eb790a; - color: #FFF; } - + background-color: #cb4b16; + color: #fdf6e3; +} .card-green > .card-header { - background-color: #75b82d; - color: #FFF; } - + background-color: #859900; + color: #fdf6e3; +} .card-skyblue > .card-header { - background-color: #42a0f3; - color: #FFF; } - + background-color: #2aa198; + color: #fdf6e3; +} .card-dark > .card-header { - background-color: #2D2D2D; - color: #FFF; } - + background-color: #002b36; + color: #fdf6e3; +} .card-light > .card-header { - background-color: #eeeeec; - color: #111; } - + background-color: #fdf6e3; + color: #002b36; +} .card-turquoise > .card-header { - background-color: #46bd9e; - color: #FFF; } - + background-color: #2aa198; + color: #fdf6e3; +} .card-yellow > .card-header { - background-color: #f6d32d; - color: #FFF; } - + background-color: #b58900; + color: #fdf6e3; +} .card-brown > .card-header { - background-color: #986a44; - color: #FFF; } - + background-color: #b58900; + color: #fdf6e3; +} .card-grey > .card-header { - background-color: #77767b; - color: #FFF; } - + background-color: #586e75; + color: #fdf6e3; +} .card-primary > .card-header { - background-color: #7951c0; - color: #FFF; } - + background-color: #6c71c4; + color: #fdf6e3; +} .card-secondary > .card-header { - background-color: #4e63c9; - color: #FFF; } - + background-color: #268bd2; + color: #fdf6e3; +} .card-warning > .card-header { - background-color: #eb790a; - color: #FFF; } - + background-color: #cb4b16; + color: #fdf6e3; +} .card-danger > .card-header { - background-color: #e33d22; - color: #FFF; } - + background-color: #dc322f; + color: #fdf6e3; +} .card-info > .card-header { - background-color: #42a0f3; - color: #FFF; } - + background-color: #2aa198; + color: #fdf6e3; +} .card-success > .card-header { - background-color: #75b82d; - color: #FFF; } + background-color: #859900; + color: #fdf6e3; +} /* BUTTONS & BADGES */ .btn-blue { - background-color: #4e63c9; - color: #FFF; } - .btn-blue:hover, .btn-blue:active, .btn-blue:focus, .btn-blue:not(.disabled):not(:disabled):hover, .btn-blue:not(.disabled):not(:disabled):active, .btn-blue:not(.disabled):not(:disabled):focus { - background-color: #7585d5; - color: #FFF; } - + background-color: #268bd2; + color: #fdf6e3; +} +.btn-blue:hover, .btn-blue:active, .btn-blue:focus, .btn-blue:not(.disabled):not(:disabled):hover, .btn-blue:not(.disabled):not(:disabled):active, .btn-blue:not(.disabled):not(:disabled):focus { + background-color: #4ca2df; + color: #fdf6e3; +} .btn-violet { - background-color: #ce4dcd; - color: #FFF; } - .btn-violet:hover, .btn-violet:active, .btn-violet:focus, .btn-violet:not(.disabled):not(:disabled):hover, .btn-violet:not(.disabled):not(:disabled):active, .btn-violet:not(.disabled):not(:disabled):focus { - background-color: #d975d8; - color: #FFF; } - + background-color: #d33682; + color: #fdf6e3; +} +.btn-violet:hover, .btn-violet:active, .btn-violet:focus, .btn-violet:not(.disabled):not(:disabled):hover, .btn-violet:not(.disabled):not(:disabled):active, .btn-violet:not(.disabled):not(:disabled):focus { + background-color: #dc609c; + color: #fdf6e3; +} .btn-purple { - background-color: #7951c0; - color: #FFF; } - .btn-purple:hover, .btn-purple:active, .btn-purple:focus, .btn-purple:not(.disabled):not(:disabled):hover, .btn-purple:not(.disabled):not(:disabled):active, .btn-purple:not(.disabled):not(:disabled):focus { - background-color: #9676ce; - color: #FFF; } - + background-color: #6c71c4; + color: #fdf6e3; +} +.btn-purple:hover, .btn-purple:active, .btn-purple:focus, .btn-purple:not(.disabled):not(:disabled):hover, .btn-purple:not(.disabled):not(:disabled):active, .btn-purple:not(.disabled):not(:disabled):focus { + background-color: #9094d3; + color: #fdf6e3; +} .btn-red { - background-color: #e33d22; - color: #FFF; } - .btn-red:hover, .btn-red:active, .btn-red:focus, .btn-red:not(.disabled):not(:disabled):hover, .btn-red:not(.disabled):not(:disabled):active, .btn-red:not(.disabled):not(:disabled):focus { - background-color: #e9654f; - color: #FFF; } - + background-color: #dc322f; + color: #fdf6e3; +} +.btn-red:hover, .btn-red:active, .btn-red:focus, .btn-red:not(.disabled):not(:disabled):hover, .btn-red:not(.disabled):not(:disabled):active, .btn-red:not(.disabled):not(:disabled):focus { + background-color: #e35d5b; + color: #fdf6e3; +} .btn-orange { - background-color: #eb790a; - color: #FFF; } - .btn-orange:hover, .btn-orange:active, .btn-orange:focus, .btn-orange:not(.disabled):not(:disabled):hover, .btn-orange:not(.disabled):not(:disabled):active, .btn-orange:not(.disabled):not(:disabled):focus { - background-color: #f69332; - color: #FFF; } - + background-color: #cb4b16; + color: #fdf6e3; +} +.btn-orange:hover, .btn-orange:active, .btn-orange:focus, .btn-orange:not(.disabled):not(:disabled):hover, .btn-orange:not(.disabled):not(:disabled):active, .btn-orange:not(.disabled):not(:disabled):focus { + background-color: #e8632c; + color: #fdf6e3; +} .btn-green { - background-color: #75b82d; - color: #FFF; } - .btn-green:hover, .btn-green:active, .btn-green:focus, .btn-green:not(.disabled):not(:disabled):hover, .btn-green:not(.disabled):not(:disabled):active, .btn-green:not(.disabled):not(:disabled):focus { - background-color: #8fd246; - color: #FFF; } - + background-color: #859900; + color: #fdf6e3; +} +.btn-green:hover, .btn-green:active, .btn-green:focus, .btn-green:not(.disabled):not(:disabled):hover, .btn-green:not(.disabled):not(:disabled):active, .btn-green:not(.disabled):not(:disabled):focus { + background-color: #b1cc00; + color: #fdf6e3; +} .btn-skyblue { - background-color: #42a0f3; - color: #FFF; } - .btn-skyblue:hover, .btn-skyblue:active, .btn-skyblue:focus, .btn-skyblue:not(.disabled):not(:disabled):hover, .btn-skyblue:not(.disabled):not(:disabled):active, .btn-skyblue:not(.disabled):not(:disabled):focus { - background-color: #72b8f6; - color: #FFF; } - + background-color: #2aa198; + color: #fdf6e3; +} +.btn-skyblue:hover, .btn-skyblue:active, .btn-skyblue:focus, .btn-skyblue:not(.disabled):not(:disabled):hover, .btn-skyblue:not(.disabled):not(:disabled):active, .btn-skyblue:not(.disabled):not(:disabled):focus { + background-color: #35c9be; + color: #fdf6e3; +} .btn-dark { - background-color: #2D2D2D; - color: #FFF; } - .btn-dark:hover, .btn-dark:active, .btn-dark:focus, .btn-dark:not(.disabled):not(:disabled):hover, .btn-dark:not(.disabled):not(:disabled):active, .btn-dark:not(.disabled):not(:disabled):focus { - background-color: #474747; - color: #FFF; } - + background-color: #002b36; + color: #fdf6e3; +} +.btn-dark:hover, .btn-dark:active, .btn-dark:focus, .btn-dark:not(.disabled):not(:disabled):hover, .btn-dark:not(.disabled):not(:disabled):active, .btn-dark:not(.disabled):not(:disabled):focus { + background-color: #005469; + color: #fdf6e3; +} .btn-light { - background-color: #eeeeec; - color: #111; } - .btn-light:hover, .btn-light:active, .btn-light:focus, .btn-light:not(.disabled):not(:disabled):hover, .btn-light:not(.disabled):not(:disabled):active, .btn-light:not(.disabled):not(:disabled):focus { - background-color: white; - color: #111; } - + background-color: #fdf6e3; + color: #002b36; +} +.btn-light:hover, .btn-light:active, .btn-light:focus, .btn-light:not(.disabled):not(:disabled):hover, .btn-light:not(.disabled):not(:disabled):active, .btn-light:not(.disabled):not(:disabled):focus { + background-color: white; + color: #002b36; +} .btn-turquoise { - background-color: #46bd9e; - color: #FFF; } - .btn-turquoise:hover, .btn-turquoise:active, .btn-turquoise:focus, .btn-turquoise:not(.disabled):not(:disabled):hover, .btn-turquoise:not(.disabled):not(:disabled):active, .btn-turquoise:not(.disabled):not(:disabled):focus { - background-color: #6ccab2; - color: #FFF; } - + background-color: #2aa198; + color: #fdf6e3; +} +.btn-turquoise:hover, .btn-turquoise:active, .btn-turquoise:focus, .btn-turquoise:not(.disabled):not(:disabled):hover, .btn-turquoise:not(.disabled):not(:disabled):active, .btn-turquoise:not(.disabled):not(:disabled):focus { + background-color: #35c9be; + color: #fdf6e3; +} .btn-yellow { - background-color: #f6d32d; - color: #FFF; } - .btn-yellow:hover, .btn-yellow:active, .btn-yellow:focus, .btn-yellow:not(.disabled):not(:disabled):hover, .btn-yellow:not(.disabled):not(:disabled):active, .btn-yellow:not(.disabled):not(:disabled):focus { - background-color: #f8dd5e; - color: #FFF; } - + background-color: #b58900; + color: #fdf6e3; +} +.btn-yellow:hover, .btn-yellow:active, .btn-yellow:focus, .btn-yellow:not(.disabled):not(:disabled):hover, .btn-yellow:not(.disabled):not(:disabled):active, .btn-yellow:not(.disabled):not(:disabled):focus { + background-color: #e8b000; + color: #fdf6e3; +} .btn-brown { - background-color: #986a44; - color: #FFF; } - .btn-brown:hover, .btn-brown:active, .btn-brown:focus, .btn-brown:not(.disabled):not(:disabled):hover, .btn-brown:not(.disabled):not(:disabled):active, .btn-brown:not(.disabled):not(:disabled):focus { - background-color: #b5835a; - color: #FFF; } - + background-color: #b58900; + color: #fdf6e3; +} +.btn-brown:hover, .btn-brown:active, .btn-brown:focus, .btn-brown:not(.disabled):not(:disabled):hover, .btn-brown:not(.disabled):not(:disabled):active, .btn-brown:not(.disabled):not(:disabled):focus { + background-color: #e8b000; + color: #fdf6e3; +} .btn-grey { - background-color: #77767b; - color: #FFF; } - .btn-grey:hover, .btn-grey:active, .btn-grey:focus, .btn-grey:not(.disabled):not(:disabled):hover, .btn-grey:not(.disabled):not(:disabled):active, .btn-grey:not(.disabled):not(:disabled):focus { - background-color: #919094; - color: #FFF; } - + background-color: #586e75; + color: #fdf6e3; +} +.btn-grey:hover, .btn-grey:active, .btn-grey:focus, .btn-grey:not(.disabled):not(:disabled):hover, .btn-grey:not(.disabled):not(:disabled):active, .btn-grey:not(.disabled):not(:disabled):focus { + background-color: #6e8992; + color: #fdf6e3; +} .btn-primary { - background-color: #7951c0; - color: #FFF; } - .btn-primary:hover, .btn-primary:active, .btn-primary:focus, .btn-primary:not(.disabled):not(:disabled):hover, .btn-primary:not(.disabled):not(:disabled):active, .btn-primary:not(.disabled):not(:disabled):focus { - background-color: #9676ce; - color: #FFF; } - + background-color: #6c71c4; + color: #fdf6e3; +} +.btn-primary:hover, .btn-primary:active, .btn-primary:focus, .btn-primary:not(.disabled):not(:disabled):hover, .btn-primary:not(.disabled):not(:disabled):active, .btn-primary:not(.disabled):not(:disabled):focus { + background-color: #9094d3; + color: #fdf6e3; +} .btn-secondary { - background-color: #4e63c9; - color: #FFF; } - .btn-secondary:hover, .btn-secondary:active, .btn-secondary:focus, .btn-secondary:not(.disabled):not(:disabled):hover, .btn-secondary:not(.disabled):not(:disabled):active, .btn-secondary:not(.disabled):not(:disabled):focus { - background-color: #7585d5; - color: #FFF; } - + background-color: #268bd2; + color: #fdf6e3; +} +.btn-secondary:hover, .btn-secondary:active, .btn-secondary:focus, .btn-secondary:not(.disabled):not(:disabled):hover, .btn-secondary:not(.disabled):not(:disabled):active, .btn-secondary:not(.disabled):not(:disabled):focus { + background-color: #4ca2df; + color: #fdf6e3; +} .btn-warning { - background-color: #eb790a; - color: #FFF; } - .btn-warning:hover, .btn-warning:active, .btn-warning:focus, .btn-warning:not(.disabled):not(:disabled):hover, .btn-warning:not(.disabled):not(:disabled):active, .btn-warning:not(.disabled):not(:disabled):focus { - background-color: #f69332; - color: #FFF; } - + background-color: #cb4b16; + color: #fdf6e3; +} +.btn-warning:hover, .btn-warning:active, .btn-warning:focus, .btn-warning:not(.disabled):not(:disabled):hover, .btn-warning:not(.disabled):not(:disabled):active, .btn-warning:not(.disabled):not(:disabled):focus { + background-color: #e8632c; + color: #fdf6e3; +} .btn-danger { - background-color: #e33d22; - color: #FFF; } - .btn-danger:hover, .btn-danger:active, .btn-danger:focus, .btn-danger:not(.disabled):not(:disabled):hover, .btn-danger:not(.disabled):not(:disabled):active, .btn-danger:not(.disabled):not(:disabled):focus { - background-color: #e9654f; - color: #FFF; } - + background-color: #dc322f; + color: #fdf6e3; +} +.btn-danger:hover, .btn-danger:active, .btn-danger:focus, .btn-danger:not(.disabled):not(:disabled):hover, .btn-danger:not(.disabled):not(:disabled):active, .btn-danger:not(.disabled):not(:disabled):focus { + background-color: #e35d5b; + color: #fdf6e3; +} .btn-info { - background-color: #42a0f3; - color: #FFF; } - .btn-info:hover, .btn-info:active, .btn-info:focus, .btn-info:not(.disabled):not(:disabled):hover, .btn-info:not(.disabled):not(:disabled):active, .btn-info:not(.disabled):not(:disabled):focus { - background-color: #72b8f6; - color: #FFF; } - + background-color: #2aa198; + color: #fdf6e3; +} +.btn-info:hover, .btn-info:active, .btn-info:focus, .btn-info:not(.disabled):not(:disabled):hover, .btn-info:not(.disabled):not(:disabled):active, .btn-info:not(.disabled):not(:disabled):focus { + background-color: #35c9be; + color: #fdf6e3; +} .btn-success { - background-color: #75b82d; - color: #FFF; } - .btn-success:hover, .btn-success:active, .btn-success:focus, .btn-success:not(.disabled):not(:disabled):hover, .btn-success:not(.disabled):not(:disabled):active, .btn-success:not(.disabled):not(:disabled):focus { - background-color: #8fd246; - color: #FFF; } + background-color: #859900; + color: #fdf6e3; +} +.btn-success:hover, .btn-success:active, .btn-success:focus, .btn-success:not(.disabled):not(:disabled):hover, .btn-success:not(.disabled):not(:disabled):active, .btn-success:not(.disabled):not(:disabled):focus { + background-color: #b1cc00; + color: #fdf6e3; +} /* social */ .btn-facebook { background-color: #3B5998; - color: #FFF; } - .btn-facebook:hover, .btn-facebook:active, .btn-facebook:focus, .btn-facebook:not(.disabled):not(:disabled):hover, .btn-facebook:not(.disabled):not(:disabled):active, .btn-facebook:not(.disabled):not(:disabled):focus { - background-color: #4c70ba; - color: #FFF; } - + color: #fdf6e3; +} +.btn-facebook:hover, .btn-facebook:active, .btn-facebook:focus, .btn-facebook:not(.disabled):not(:disabled):hover, .btn-facebook:not(.disabled):not(:disabled):active, .btn-facebook:not(.disabled):not(:disabled):focus { + background-color: #4c70ba; + color: #fdf6e3; +} .btn-twitter { background-color: #55ACEE; - color: #FFF; } - .btn-twitter:hover, .btn-twitter:active, .btn-twitter:focus, .btn-twitter:not(.disabled):not(:disabled):hover, .btn-twitter:not(.disabled):not(:disabled):active, .btn-twitter:not(.disabled):not(:disabled):focus { - background-color: #83c3f3; - color: #FFF; } - + color: #fdf6e3; +} +.btn-twitter:hover, .btn-twitter:active, .btn-twitter:focus, .btn-twitter:not(.disabled):not(:disabled):hover, .btn-twitter:not(.disabled):not(:disabled):active, .btn-twitter:not(.disabled):not(:disabled):focus { + background-color: #83c3f3; + color: #fdf6e3; +} .btn-googleplus { background-color: #d34836; - color: #FFF; } - .btn-googleplus:hover, .btn-googleplus:active, .btn-googleplus:focus, .btn-googleplus:not(.disabled):not(:disabled):hover, .btn-googleplus:not(.disabled):not(:disabled):active, .btn-googleplus:not(.disabled):not(:disabled):focus { - background-color: #dc6e60; - color: #FFF; } - + color: #fdf6e3; +} +.btn-googleplus:hover, .btn-googleplus:active, .btn-googleplus:focus, .btn-googleplus:not(.disabled):not(:disabled):hover, .btn-googleplus:not(.disabled):not(:disabled):active, .btn-googleplus:not(.disabled):not(:disabled):focus { + background-color: #dc6e60; + color: #fdf6e3; +} .btn-diaspora { background-color: #313739; - color: #FFF; } - .btn-diaspora:hover, .btn-diaspora:active, .btn-diaspora:focus, .btn-diaspora:not(.disabled):not(:disabled):hover, .btn-diaspora:not(.disabled):not(:disabled):active, .btn-diaspora:not(.disabled):not(:disabled):focus { - background-color: #495154; - color: #FFF; } - + color: #fdf6e3; +} +.btn-diaspora:hover, .btn-diaspora:active, .btn-diaspora:focus, .btn-diaspora:not(.disabled):not(:disabled):hover, .btn-diaspora:not(.disabled):not(:disabled):active, .btn-diaspora:not(.disabled):not(:disabled):focus { + background-color: #495154; + color: #fdf6e3; +} .btn-mastodon { background-color: #282c37; - color: #FFF; } - .btn-mastodon:hover, .btn-mastodon:active, .btn-mastodon:focus, .btn-mastodon:not(.disabled):not(:disabled):hover, .btn-mastodon:not(.disabled):not(:disabled):active, .btn-mastodon:not(.disabled):not(:disabled):focus { - background-color: #3d4455; - color: #FFF; } + color: #fdf6e3; +} +.btn-mastodon:hover, .btn-mastodon:active, .btn-mastodon:focus, .btn-mastodon:not(.disabled):not(:disabled):hover, .btn-mastodon:not(.disabled):not(:disabled):active, .btn-mastodon:not(.disabled):not(:disabled):focus { + background-color: #3d4455; + color: #fdf6e3; +} /* BADGES */ .badge-blue { - background-color: #4e63c9; - color: #FFF; } - .badge-blue:hover, .badge-blue:active, .badge-blue:focus, a:hover > .badge-blue, a:active > .badge-blue, a:focus > .badge-blue, .badge-blue:not(.disabled):not(:disabled):hover, .badge-blue:not(.disabled):not(:disabled):active, .badge-blue:not(.disabled):not(:disabled):focus, a:hover > .badge-blue:not(.disabled):not(:disabled), a:active > .badge-blue:not(.disabled):not(:disabled), a:focus > .badge-blue:not(.disabled):not(:disabled) { - background-color: #7585d5; - color: #FFF; } - + background-color: #268bd2; + color: #fdf6e3; +} +.badge-blue:hover, .badge-blue:active, .badge-blue:focus, a:hover > .badge-blue, a:active > .badge-blue, a:focus > .badge-blue, .badge-blue:not(.disabled):not(:disabled):hover, .badge-blue:not(.disabled):not(:disabled):active, .badge-blue:not(.disabled):not(:disabled):focus, a:hover > .badge-blue:not(.disabled):not(:disabled), a:active > .badge-blue:not(.disabled):not(:disabled), a:focus > .badge-blue:not(.disabled):not(:disabled) { + background-color: #4ca2df; + color: #fdf6e3; +} .badge-violet { - background-color: #ce4dcd; - color: #FFF; } - .badge-violet:hover, .badge-violet:active, .badge-violet:focus, a:hover > .badge-violet, a:active > .badge-violet, a:focus > .badge-violet, .badge-violet:not(.disabled):not(:disabled):hover, .badge-violet:not(.disabled):not(:disabled):active, .badge-violet:not(.disabled):not(:disabled):focus, a:hover > .badge-violet:not(.disabled):not(:disabled), a:active > .badge-violet:not(.disabled):not(:disabled), a:focus > .badge-violet:not(.disabled):not(:disabled) { - background-color: #d975d8; - color: #FFF; } - + background-color: #d33682; + color: #fdf6e3; +} +.badge-violet:hover, .badge-violet:active, .badge-violet:focus, a:hover > .badge-violet, a:active > .badge-violet, a:focus > .badge-violet, .badge-violet:not(.disabled):not(:disabled):hover, .badge-violet:not(.disabled):not(:disabled):active, .badge-violet:not(.disabled):not(:disabled):focus, a:hover > .badge-violet:not(.disabled):not(:disabled), a:active > .badge-violet:not(.disabled):not(:disabled), a:focus > .badge-violet:not(.disabled):not(:disabled) { + background-color: #dc609c; + color: #fdf6e3; +} .badge-purple { - background-color: #7951c0; - color: #FFF; } - .badge-purple:hover, .badge-purple:active, .badge-purple:focus, a:hover > .badge-purple, a:active > .badge-purple, a:focus > .badge-purple, .badge-purple:not(.disabled):not(:disabled):hover, .badge-purple:not(.disabled):not(:disabled):active, .badge-purple:not(.disabled):not(:disabled):focus, a:hover > .badge-purple:not(.disabled):not(:disabled), a:active > .badge-purple:not(.disabled):not(:disabled), a:focus > .badge-purple:not(.disabled):not(:disabled) { - background-color: #9676ce; - color: #FFF; } - + background-color: #6c71c4; + color: #fdf6e3; +} +.badge-purple:hover, .badge-purple:active, .badge-purple:focus, a:hover > .badge-purple, a:active > .badge-purple, a:focus > .badge-purple, .badge-purple:not(.disabled):not(:disabled):hover, .badge-purple:not(.disabled):not(:disabled):active, .badge-purple:not(.disabled):not(:disabled):focus, a:hover > .badge-purple:not(.disabled):not(:disabled), a:active > .badge-purple:not(.disabled):not(:disabled), a:focus > .badge-purple:not(.disabled):not(:disabled) { + background-color: #9094d3; + color: #fdf6e3; +} .badge-red { - background-color: #e33d22; - color: #FFF; } - .badge-red:hover, .badge-red:active, .badge-red:focus, a:hover > .badge-red, a:active > .badge-red, a:focus > .badge-red, .badge-red:not(.disabled):not(:disabled):hover, .badge-red:not(.disabled):not(:disabled):active, .badge-red:not(.disabled):not(:disabled):focus, a:hover > .badge-red:not(.disabled):not(:disabled), a:active > .badge-red:not(.disabled):not(:disabled), a:focus > .badge-red:not(.disabled):not(:disabled) { - background-color: #e9654f; - color: #FFF; } - + background-color: #dc322f; + color: #fdf6e3; +} +.badge-red:hover, .badge-red:active, .badge-red:focus, a:hover > .badge-red, a:active > .badge-red, a:focus > .badge-red, .badge-red:not(.disabled):not(:disabled):hover, .badge-red:not(.disabled):not(:disabled):active, .badge-red:not(.disabled):not(:disabled):focus, a:hover > .badge-red:not(.disabled):not(:disabled), a:active > .badge-red:not(.disabled):not(:disabled), a:focus > .badge-red:not(.disabled):not(:disabled) { + background-color: #e35d5b; + color: #fdf6e3; +} .badge-orange { - background-color: #eb790a; - color: #FFF; } - .badge-orange:hover, .badge-orange:active, .badge-orange:focus, a:hover > .badge-orange, a:active > .badge-orange, a:focus > .badge-orange, .badge-orange:not(.disabled):not(:disabled):hover, .badge-orange:not(.disabled):not(:disabled):active, .badge-orange:not(.disabled):not(:disabled):focus, a:hover > .badge-orange:not(.disabled):not(:disabled), a:active > .badge-orange:not(.disabled):not(:disabled), a:focus > .badge-orange:not(.disabled):not(:disabled) { - background-color: #f69332; - color: #FFF; } - + background-color: #cb4b16; + color: #fdf6e3; +} +.badge-orange:hover, .badge-orange:active, .badge-orange:focus, a:hover > .badge-orange, a:active > .badge-orange, a:focus > .badge-orange, .badge-orange:not(.disabled):not(:disabled):hover, .badge-orange:not(.disabled):not(:disabled):active, .badge-orange:not(.disabled):not(:disabled):focus, a:hover > .badge-orange:not(.disabled):not(:disabled), a:active > .badge-orange:not(.disabled):not(:disabled), a:focus > .badge-orange:not(.disabled):not(:disabled) { + background-color: #e8632c; + color: #fdf6e3; +} .badge-green { - background-color: #75b82d; - color: #FFF; } - .badge-green:hover, .badge-green:active, .badge-green:focus, a:hover > .badge-green, a:active > .badge-green, a:focus > .badge-green, .badge-green:not(.disabled):not(:disabled):hover, .badge-green:not(.disabled):not(:disabled):active, .badge-green:not(.disabled):not(:disabled):focus, a:hover > .badge-green:not(.disabled):not(:disabled), a:active > .badge-green:not(.disabled):not(:disabled), a:focus > .badge-green:not(.disabled):not(:disabled) { - background-color: #8fd246; - color: #FFF; } - + background-color: #859900; + color: #fdf6e3; +} +.badge-green:hover, .badge-green:active, .badge-green:focus, a:hover > .badge-green, a:active > .badge-green, a:focus > .badge-green, .badge-green:not(.disabled):not(:disabled):hover, .badge-green:not(.disabled):not(:disabled):active, .badge-green:not(.disabled):not(:disabled):focus, a:hover > .badge-green:not(.disabled):not(:disabled), a:active > .badge-green:not(.disabled):not(:disabled), a:focus > .badge-green:not(.disabled):not(:disabled) { + background-color: #b1cc00; + color: #fdf6e3; +} .badge-skyblue { - background-color: #42a0f3; - color: #FFF; } - .badge-skyblue:hover, .badge-skyblue:active, .badge-skyblue:focus, a:hover > .badge-skyblue, a:active > .badge-skyblue, a:focus > .badge-skyblue, .badge-skyblue:not(.disabled):not(:disabled):hover, .badge-skyblue:not(.disabled):not(:disabled):active, .badge-skyblue:not(.disabled):not(:disabled):focus, a:hover > .badge-skyblue:not(.disabled):not(:disabled), a:active > .badge-skyblue:not(.disabled):not(:disabled), a:focus > .badge-skyblue:not(.disabled):not(:disabled) { - background-color: #72b8f6; - color: #FFF; } - + background-color: #2aa198; + color: #fdf6e3; +} +.badge-skyblue:hover, .badge-skyblue:active, .badge-skyblue:focus, a:hover > .badge-skyblue, a:active > .badge-skyblue, a:focus > .badge-skyblue, .badge-skyblue:not(.disabled):not(:disabled):hover, .badge-skyblue:not(.disabled):not(:disabled):active, .badge-skyblue:not(.disabled):not(:disabled):focus, a:hover > .badge-skyblue:not(.disabled):not(:disabled), a:active > .badge-skyblue:not(.disabled):not(:disabled), a:focus > .badge-skyblue:not(.disabled):not(:disabled) { + background-color: #35c9be; + color: #fdf6e3; +} .badge-dark { - background-color: #2D2D2D; - color: #FFF; } - .badge-dark:hover, .badge-dark:active, .badge-dark:focus, a:hover > .badge-dark, a:active > .badge-dark, a:focus > .badge-dark, .badge-dark:not(.disabled):not(:disabled):hover, .badge-dark:not(.disabled):not(:disabled):active, .badge-dark:not(.disabled):not(:disabled):focus, a:hover > .badge-dark:not(.disabled):not(:disabled), a:active > .badge-dark:not(.disabled):not(:disabled), a:focus > .badge-dark:not(.disabled):not(:disabled) { - background-color: #474747; - color: #FFF; } - + background-color: #002b36; + color: #fdf6e3; +} +.badge-dark:hover, .badge-dark:active, .badge-dark:focus, a:hover > .badge-dark, a:active > .badge-dark, a:focus > .badge-dark, .badge-dark:not(.disabled):not(:disabled):hover, .badge-dark:not(.disabled):not(:disabled):active, .badge-dark:not(.disabled):not(:disabled):focus, a:hover > .badge-dark:not(.disabled):not(:disabled), a:active > .badge-dark:not(.disabled):not(:disabled), a:focus > .badge-dark:not(.disabled):not(:disabled) { + background-color: #005469; + color: #fdf6e3; +} .badge-light { - background-color: #eeeeec; - color: #111; } - .badge-light:hover, .badge-light:active, .badge-light:focus, a:hover > .badge-light, a:active > .badge-light, a:focus > .badge-light, .badge-light:not(.disabled):not(:disabled):hover, .badge-light:not(.disabled):not(:disabled):active, .badge-light:not(.disabled):not(:disabled):focus, a:hover > .badge-light:not(.disabled):not(:disabled), a:active > .badge-light:not(.disabled):not(:disabled), a:focus > .badge-light:not(.disabled):not(:disabled) { - background-color: white; - color: #111; } - + background-color: #fdf6e3; + color: #002b36; +} +.badge-light:hover, .badge-light:active, .badge-light:focus, a:hover > .badge-light, a:active > .badge-light, a:focus > .badge-light, .badge-light:not(.disabled):not(:disabled):hover, .badge-light:not(.disabled):not(:disabled):active, .badge-light:not(.disabled):not(:disabled):focus, a:hover > .badge-light:not(.disabled):not(:disabled), a:active > .badge-light:not(.disabled):not(:disabled), a:focus > .badge-light:not(.disabled):not(:disabled) { + background-color: white; + color: #002b36; +} .badge-turquoise { - background-color: #46bd9e; - color: #FFF; } - .badge-turquoise:hover, .badge-turquoise:active, .badge-turquoise:focus, a:hover > .badge-turquoise, a:active > .badge-turquoise, a:focus > .badge-turquoise, .badge-turquoise:not(.disabled):not(:disabled):hover, .badge-turquoise:not(.disabled):not(:disabled):active, .badge-turquoise:not(.disabled):not(:disabled):focus, a:hover > .badge-turquoise:not(.disabled):not(:disabled), a:active > .badge-turquoise:not(.disabled):not(:disabled), a:focus > .badge-turquoise:not(.disabled):not(:disabled) { - background-color: #6ccab2; - color: #FFF; } - + background-color: #2aa198; + color: #fdf6e3; +} +.badge-turquoise:hover, .badge-turquoise:active, .badge-turquoise:focus, a:hover > .badge-turquoise, a:active > .badge-turquoise, a:focus > .badge-turquoise, .badge-turquoise:not(.disabled):not(:disabled):hover, .badge-turquoise:not(.disabled):not(:disabled):active, .badge-turquoise:not(.disabled):not(:disabled):focus, a:hover > .badge-turquoise:not(.disabled):not(:disabled), a:active > .badge-turquoise:not(.disabled):not(:disabled), a:focus > .badge-turquoise:not(.disabled):not(:disabled) { + background-color: #35c9be; + color: #fdf6e3; +} .badge-yellow { - background-color: #f6d32d; - color: #FFF; } - .badge-yellow:hover, .badge-yellow:active, .badge-yellow:focus, a:hover > .badge-yellow, a:active > .badge-yellow, a:focus > .badge-yellow, .badge-yellow:not(.disabled):not(:disabled):hover, .badge-yellow:not(.disabled):not(:disabled):active, .badge-yellow:not(.disabled):not(:disabled):focus, a:hover > .badge-yellow:not(.disabled):not(:disabled), a:active > .badge-yellow:not(.disabled):not(:disabled), a:focus > .badge-yellow:not(.disabled):not(:disabled) { - background-color: #f8dd5e; - color: #FFF; } - + background-color: #b58900; + color: #fdf6e3; +} +.badge-yellow:hover, .badge-yellow:active, .badge-yellow:focus, a:hover > .badge-yellow, a:active > .badge-yellow, a:focus > .badge-yellow, .badge-yellow:not(.disabled):not(:disabled):hover, .badge-yellow:not(.disabled):not(:disabled):active, .badge-yellow:not(.disabled):not(:disabled):focus, a:hover > .badge-yellow:not(.disabled):not(:disabled), a:active > .badge-yellow:not(.disabled):not(:disabled), a:focus > .badge-yellow:not(.disabled):not(:disabled) { + background-color: #e8b000; + color: #fdf6e3; +} .badge-brown { - background-color: #986a44; - color: #FFF; } - .badge-brown:hover, .badge-brown:active, .badge-brown:focus, a:hover > .badge-brown, a:active > .badge-brown, a:focus > .badge-brown, .badge-brown:not(.disabled):not(:disabled):hover, .badge-brown:not(.disabled):not(:disabled):active, .badge-brown:not(.disabled):not(:disabled):focus, a:hover > .badge-brown:not(.disabled):not(:disabled), a:active > .badge-brown:not(.disabled):not(:disabled), a:focus > .badge-brown:not(.disabled):not(:disabled) { - background-color: #b5835a; - color: #FFF; } - + background-color: #b58900; + color: #fdf6e3; +} +.badge-brown:hover, .badge-brown:active, .badge-brown:focus, a:hover > .badge-brown, a:active > .badge-brown, a:focus > .badge-brown, .badge-brown:not(.disabled):not(:disabled):hover, .badge-brown:not(.disabled):not(:disabled):active, .badge-brown:not(.disabled):not(:disabled):focus, a:hover > .badge-brown:not(.disabled):not(:disabled), a:active > .badge-brown:not(.disabled):not(:disabled), a:focus > .badge-brown:not(.disabled):not(:disabled) { + background-color: #e8b000; + color: #fdf6e3; +} .badge-grey { - background-color: #77767b; - color: #FFF; } - .badge-grey:hover, .badge-grey:active, .badge-grey:focus, a:hover > .badge-grey, a:active > .badge-grey, a:focus > .badge-grey, .badge-grey:not(.disabled):not(:disabled):hover, .badge-grey:not(.disabled):not(:disabled):active, .badge-grey:not(.disabled):not(:disabled):focus, a:hover > .badge-grey:not(.disabled):not(:disabled), a:active > .badge-grey:not(.disabled):not(:disabled), a:focus > .badge-grey:not(.disabled):not(:disabled) { - background-color: #919094; - color: #FFF; } - + background-color: #586e75; + color: #fdf6e3; +} +.badge-grey:hover, .badge-grey:active, .badge-grey:focus, a:hover > .badge-grey, a:active > .badge-grey, a:focus > .badge-grey, .badge-grey:not(.disabled):not(:disabled):hover, .badge-grey:not(.disabled):not(:disabled):active, .badge-grey:not(.disabled):not(:disabled):focus, a:hover > .badge-grey:not(.disabled):not(:disabled), a:active > .badge-grey:not(.disabled):not(:disabled), a:focus > .badge-grey:not(.disabled):not(:disabled) { + background-color: #6e8992; + color: #fdf6e3; +} .badge-primary { - background-color: #7951c0; - color: #FFF; } - .badge-primary:hover, .badge-primary:active, .badge-primary:focus, a:hover > .badge-primary, a:active > .badge-primary, a:focus > .badge-primary, .badge-primary:not(.disabled):not(:disabled):hover, .badge-primary:not(.disabled):not(:disabled):active, .badge-primary:not(.disabled):not(:disabled):focus, a:hover > .badge-primary:not(.disabled):not(:disabled), a:active > .badge-primary:not(.disabled):not(:disabled), a:focus > .badge-primary:not(.disabled):not(:disabled) { - background-color: #9676ce; - color: #FFF; } - + background-color: #6c71c4; + color: #fdf6e3; +} +.badge-primary:hover, .badge-primary:active, .badge-primary:focus, a:hover > .badge-primary, a:active > .badge-primary, a:focus > .badge-primary, .badge-primary:not(.disabled):not(:disabled):hover, .badge-primary:not(.disabled):not(:disabled):active, .badge-primary:not(.disabled):not(:disabled):focus, a:hover > .badge-primary:not(.disabled):not(:disabled), a:active > .badge-primary:not(.disabled):not(:disabled), a:focus > .badge-primary:not(.disabled):not(:disabled) { + background-color: #9094d3; + color: #fdf6e3; +} .badge-secondary { - background-color: #4e63c9; - color: #FFF; } - .badge-secondary:hover, .badge-secondary:active, .badge-secondary:focus, a:hover > .badge-secondary, a:active > .badge-secondary, a:focus > .badge-secondary, .badge-secondary:not(.disabled):not(:disabled):hover, .badge-secondary:not(.disabled):not(:disabled):active, .badge-secondary:not(.disabled):not(:disabled):focus, a:hover > .badge-secondary:not(.disabled):not(:disabled), a:active > .badge-secondary:not(.disabled):not(:disabled), a:focus > .badge-secondary:not(.disabled):not(:disabled) { - background-color: #7585d5; - color: #FFF; } - + background-color: #268bd2; + color: #fdf6e3; +} +.badge-secondary:hover, .badge-secondary:active, .badge-secondary:focus, a:hover > .badge-secondary, a:active > .badge-secondary, a:focus > .badge-secondary, .badge-secondary:not(.disabled):not(:disabled):hover, .badge-secondary:not(.disabled):not(:disabled):active, .badge-secondary:not(.disabled):not(:disabled):focus, a:hover > .badge-secondary:not(.disabled):not(:disabled), a:active > .badge-secondary:not(.disabled):not(:disabled), a:focus > .badge-secondary:not(.disabled):not(:disabled) { + background-color: #4ca2df; + color: #fdf6e3; +} .badge-warning { - background-color: #eb790a; - color: #FFF; } - .badge-warning:hover, .badge-warning:active, .badge-warning:focus, a:hover > .badge-warning, a:active > .badge-warning, a:focus > .badge-warning, .badge-warning:not(.disabled):not(:disabled):hover, .badge-warning:not(.disabled):not(:disabled):active, .badge-warning:not(.disabled):not(:disabled):focus, a:hover > .badge-warning:not(.disabled):not(:disabled), a:active > .badge-warning:not(.disabled):not(:disabled), a:focus > .badge-warning:not(.disabled):not(:disabled) { - background-color: #f69332; - color: #FFF; } - + background-color: #cb4b16; + color: #fdf6e3; +} +.badge-warning:hover, .badge-warning:active, .badge-warning:focus, a:hover > .badge-warning, a:active > .badge-warning, a:focus > .badge-warning, .badge-warning:not(.disabled):not(:disabled):hover, .badge-warning:not(.disabled):not(:disabled):active, .badge-warning:not(.disabled):not(:disabled):focus, a:hover > .badge-warning:not(.disabled):not(:disabled), a:active > .badge-warning:not(.disabled):not(:disabled), a:focus > .badge-warning:not(.disabled):not(:disabled) { + background-color: #e8632c; + color: #fdf6e3; +} .badge-danger { - background-color: #e33d22; - color: #FFF; } - .badge-danger:hover, .badge-danger:active, .badge-danger:focus, a:hover > .badge-danger, a:active > .badge-danger, a:focus > .badge-danger, .badge-danger:not(.disabled):not(:disabled):hover, .badge-danger:not(.disabled):not(:disabled):active, .badge-danger:not(.disabled):not(:disabled):focus, a:hover > .badge-danger:not(.disabled):not(:disabled), a:active > .badge-danger:not(.disabled):not(:disabled), a:focus > .badge-danger:not(.disabled):not(:disabled) { - background-color: #e9654f; - color: #FFF; } - + background-color: #dc322f; + color: #fdf6e3; +} +.badge-danger:hover, .badge-danger:active, .badge-danger:focus, a:hover > .badge-danger, a:active > .badge-danger, a:focus > .badge-danger, .badge-danger:not(.disabled):not(:disabled):hover, .badge-danger:not(.disabled):not(:disabled):active, .badge-danger:not(.disabled):not(:disabled):focus, a:hover > .badge-danger:not(.disabled):not(:disabled), a:active > .badge-danger:not(.disabled):not(:disabled), a:focus > .badge-danger:not(.disabled):not(:disabled) { + background-color: #e35d5b; + color: #fdf6e3; +} .badge-info { - background-color: #42a0f3; - color: #FFF; } - .badge-info:hover, .badge-info:active, .badge-info:focus, a:hover > .badge-info, a:active > .badge-info, a:focus > .badge-info, .badge-info:not(.disabled):not(:disabled):hover, .badge-info:not(.disabled):not(:disabled):active, .badge-info:not(.disabled):not(:disabled):focus, a:hover > .badge-info:not(.disabled):not(:disabled), a:active > .badge-info:not(.disabled):not(:disabled), a:focus > .badge-info:not(.disabled):not(:disabled) { - background-color: #72b8f6; - color: #FFF; } - + background-color: #2aa198; + color: #fdf6e3; +} +.badge-info:hover, .badge-info:active, .badge-info:focus, a:hover > .badge-info, a:active > .badge-info, a:focus > .badge-info, .badge-info:not(.disabled):not(:disabled):hover, .badge-info:not(.disabled):not(:disabled):active, .badge-info:not(.disabled):not(:disabled):focus, a:hover > .badge-info:not(.disabled):not(:disabled), a:active > .badge-info:not(.disabled):not(:disabled), a:focus > .badge-info:not(.disabled):not(:disabled) { + background-color: #35c9be; + color: #fdf6e3; +} .badge-success { - background-color: #75b82d; - color: #FFF; } - .badge-success:hover, .badge-success:active, .badge-success:focus, a:hover > .badge-success, a:active > .badge-success, a:focus > .badge-success, .badge-success:not(.disabled):not(:disabled):hover, .badge-success:not(.disabled):not(:disabled):active, .badge-success:not(.disabled):not(:disabled):focus, a:hover > .badge-success:not(.disabled):not(:disabled), a:active > .badge-success:not(.disabled):not(:disabled), a:focus > .badge-success:not(.disabled):not(:disabled) { - background-color: #8fd246; - color: #FFF; } + background-color: #859900; + color: #fdf6e3; +} +.badge-success:hover, .badge-success:active, .badge-success:focus, a:hover > .badge-success, a:active > .badge-success, a:focus > .badge-success, .badge-success:not(.disabled):not(:disabled):hover, .badge-success:not(.disabled):not(:disabled):active, .badge-success:not(.disabled):not(:disabled):focus, a:hover > .badge-success:not(.disabled):not(:disabled), a:active > .badge-success:not(.disabled):not(:disabled), a:focus > .badge-success:not(.disabled):not(:disabled) { + background-color: #b1cc00; + color: #fdf6e3; +} /* BACKGROUNDS */ .bg-blue { - background-color: #4e63c9 !important; - color: #FFF; } - + background-color: #268bd2 !important; + color: #fdf6e3; +} .bg-violet { - background-color: #ce4dcd !important; - color: #FFF; } - + background-color: #d33682 !important; + color: #fdf6e3; +} .bg-purple { - background-color: #7951c0 !important; - color: #FFF; } - + background-color: #6c71c4 !important; + color: #fdf6e3; +} .bg-red { - background-color: #e33d22 !important; - color: #FFF; } - + background-color: #dc322f !important; + color: #fdf6e3; +} .bg-orange { - background-color: #eb790a !important; - color: #FFF; } - + background-color: #cb4b16 !important; + color: #fdf6e3; +} .bg-green { - background-color: #75b82d !important; - color: #FFF; } - + background-color: #859900 !important; + color: #fdf6e3; +} .bg-skyblue { - background-color: #42a0f3 !important; - color: #FFF; } - + background-color: #2aa198 !important; + color: #fdf6e3; +} .bg-dark { - background-color: #2D2D2D !important; - color: #FFF; } - + background-color: #002b36 !important; + color: #fdf6e3; +} .bg-light { - background-color: #eeeeec !important; - color: #111; } - + background-color: #fdf6e3 !important; + color: #002b36; +} .bg-turquoise { - background-color: #46bd9e !important; - color: #FFF; } - + background-color: #2aa198 !important; + color: #fdf6e3; +} .bg-yellow { - background-color: #f6d32d !important; - color: #FFF; } - + background-color: #b58900 !important; + color: #fdf6e3; +} .bg-brown { - background-color: #986a44 !important; - color: #FFF; } - + background-color: #b58900 !important; + color: #fdf6e3; +} .bg-grey { - background-color: #77767b !important; - color: #FFF; } - + background-color: #586e75 !important; + color: #fdf6e3; +} .bg-primary { - background-color: #7951c0 !important; - color: #FFF; } - + background-color: #6c71c4 !important; + color: #fdf6e3; +} .bg-secondary { - background-color: #4e63c9 !important; - color: #FFF; } - + background-color: #268bd2 !important; + color: #fdf6e3; +} .bg-warning { - background-color: #eb790a !important; - color: #FFF; } - + background-color: #cb4b16 !important; + color: #fdf6e3; +} .bg-danger { - background-color: #e33d22 !important; - color: #FFF; } - + background-color: #dc322f !important; + color: #fdf6e3; +} .bg-info { - background-color: #42a0f3 !important; - color: #FFF; } - + background-color: #2aa198 !important; + color: #fdf6e3; +} .bg-success { - background-color: #75b82d !important; - color: #FFF; } + background-color: #859900 !important; + color: #fdf6e3; +} /* ALERTS */ .alert-blue { - background-color: #d7dcf3; - color: black; } - + background-color: #b8daf2; + color: black; +} .alert-violet { - background-color: #f5d9f4; - color: black; } - + background-color: #f3c8dd; + color: black; +} .alert-purple { - background-color: #ded4ef; - color: black; } - + background-color: #ebecf7; + color: black; +} .alert-red { - background-color: #f7c8c0; - color: black; } - + background-color: #f6c9c8; + color: black; +} .alert-orange { - background-color: #fbd3ac; - color: black; } - + background-color: #f5b89f; + color: black; +} .alert-green { - background-color: #cdebad; - color: black; } - + background-color: #e8ff4d; + color: black; +} .alert-skyblue { - background-color: #eaf4fe; - color: black; } - + background-color: #99e4df; + color: black; +} .alert-dark { - background-color: #868686; - color: black; } - + background-color: #00b9e9; + color: black; +} .alert-light { background-color: white; - color: #23231f; } - + color: #433205; +} .alert-turquoise { - background-color: #caece3; - color: black; } - + background-color: #99e4df; + color: black; +} .alert-yellow { - background-color: #fdf7d8; - color: black; } - + background-color: #ffda69; + color: black; +} .alert-brown { - background-color: #ddc5b2; - color: black; } - + background-color: #ffda69; + color: black; +} .alert-grey { - background-color: #d1d1d3; - color: black; } - + background-color: #b7c4c9; + color: black; +} .alert-primary { - background-color: #ded4ef; - color: black; } - + background-color: #ebecf7; + color: black; +} .alert-secondary { - background-color: #d7dcf3; - color: black; } - + background-color: #b8daf2; + color: black; +} .alert-warning { - background-color: #fbd3ac; - color: black; } - + background-color: #f5b89f; + color: black; +} .alert-danger { - background-color: #f7c8c0; - color: black; } - + background-color: #f6c9c8; + color: black; +} .alert-info { - background-color: #eaf4fe; - color: black; } - + background-color: #99e4df; + color: black; +} .alert-success { - background-color: #cdebad; - color: black; } + background-color: #e8ff4d; + color: black; +} /* TEXT */ .text-blue { - color: #4e63c9; } - + color: #268bd2; +} .text-violet { - color: #ce4dcd; } - + color: #d33682; +} .text-purple { - color: #7951c0; } - + color: #6c71c4; +} .text-red { - color: #e33d22; } - + color: #dc322f; +} .text-orange { - color: #eb790a; } - + color: #cb4b16; +} .text-green { - color: #75b82d; } - + color: #859900; +} .text-skyblue { - color: #42a0f3; } - + color: #2aa198; +} .text-dark { - color: #2D2D2D; } - + color: #002b36; +} .text-light { - color: #eeeeec; } - + color: #fdf6e3; +} .text-turquoise { - color: #46bd9e; } - + color: #2aa198; +} .text-yellow { - color: #f6d32d; } - + color: #b58900; +} .text-brown { - color: #986a44; } - + color: #b58900; +} .text-grey { - color: #77767b; } - + color: #586e75; +} .text-primary { - color: #7951c0; } - + color: #6c71c4; +} .text-secondary { - color: #4e63c9; } - + color: #268bd2; +} .text-warning { - color: #eb790a; } - + color: #cb4b16; +} .text-danger { - color: #e33d22; } - + color: #dc322f; +} .text-info { - color: #42a0f3; } - + color: #2aa198; +} .text-success { - color: #75b82d; } + color: #859900; +} /* Clear-Typography overrides */ mark { - background-color: #fcf2c0; } + background-color: #ffd44f; +} blockquote, pre { - border-color: #7951c0; } + border-color: #6c71c4; +} + +/*# sourceMappingURL=style.css.map */ diff --git a/css/style.css.map b/css/style.css.map new file mode 100644 index 0000000..98a118a --- /dev/null +++ b/css/style.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["../scss/style.scss","../scss/_palette.scss","../scss/_commons.scss","../scss/_colorize.scss"],"names":[],"mappings":"AAEA;AAyBA;EACE,kBCpBY;;;ADuBd;EACE;;;AEhCF;AAQA;EACC;;;AAIC;EAAU;;AACV;EAAQ;;AACR;EAAS;;;AAGX;EACC,ODXa;ECYb;;;AAGD;AAGA;EACC;EACA,ODpBa;ECqBb;EACA;EACA;EACA;EACA;EACC;EACA;EACA;;;AAGF;EACE,YFpCa;EAgBb;EEsBA;EACA;;AACA;EACE;;AA1CF;EACE;;;AA8CJ;EACE;;;AAIF;AAEA;EACE;;;AAGF;AAEA;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AACA;EACE,ODjEQ;ECkER;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA,kBD1EM;;;ACiFd;AAEA;EFnEE;EEqED,YFzFc;EE0Fb;EACA;EACA,kBDxFY;;;AC2Fd;EACE;;;AAGF;EACC,ODjGY;ECkGZ;;;AAGD;AAEA;EF1FE;EE4FA;EACA,YFzGa;EE0Gd;EACC;EACA;;AAEA;EF9FA;EEgGE;EACA;;AAGF;EFpGA;EEsGE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA,OD/HU;ECgIV;EACA;;;AAIJ;AAEA;EACC;EACC;;AAEA;EACE;EACA;;AAGF;EACC;EACA;EACA;EACC;;AAIF;EACC;EACA;;AAGD;EACC;EACA;;;AAIH;AAEA;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAID;AAEA;EFxKE;EAIA;EEuKD;EACA;;;AAGD;EACE;EACD;EACC;EFlLA;;;AEsLF;EACE;EACD,YFrMuB;EEsMtB;EFzLA;;;AE6LF;EACC,YF9Mc;;;AEiNf;EACC,YFhNc;EAkBb;;AEgMD;EACE;EACA;;AAEF;EACE;EACA;;;AAIH;EACE;EACA;EACD,YF/Nc;;;AEkOf;AAAA;EAEE;EACD;EACC;EFxNA;;;AE4NF;EACE;EACD;EACC;EACA;;;AAGF;AAEA;EFrOE;EAIA;EEoOA;EACA,YFzPa;;;AE4Pf;EACE;EACA;;;AAGF;AAEA;EF/OE;EEiPD;EACC;EACA,kBD5Pa;EC6Pb;;AAzQA;EACE;;;AA4QJ;AAEA;EACE;;;AAGF;EACE;;;AAGF;AAEA;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAOF;EAEE;IACE;;;EAGF;IACE;;;EAGF;IACE;;;AAKJ;EFpSE;EEsSA;EACA;EACA;;;AAGF;EACE;;;AAGF;EAEE;EACA;EACA;EACD;EACC;EACA;EACA;EACA;EACD;EAGA;EACC;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OD9Xa;EC+Xb;EACA;EACC;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OD5YY;;;AC+Yd;EACC,ODhZa;ECiZZ;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;ACxaF;AAgDA;EACE,OFjDW;;;AEoDb;EAjBE;EACA,OF5BY;;;AE+Cd;EApBE;EACA,OF5BY;;;AEmDd;AArDE;EAAmB,kBFNR;EEM6C,OFE5C;;AEFZ;EAAmB,kBFLN;EEK2C,OFE5C;;AEFZ;EAAmB,kBFJN;EEI2C,OFE5C;;AEFZ;EAAmB,kBFHT;EEG8C,OFE5C;;AEFZ;EAAmB,kBFFN;EEE2C,OFE5C;;AEFZ;EAAmB,kBFDP;EEC4C,OFE5C;;AEFZ;EAAmB;EAAqC,OFE5C;;AEFZ;EAAmB,kBFCR;EED6C,OFE5C;;AEFZ;EAAmB,kBFEP;EEF4C,OFC7C;;AEDX;EAAmB,kBFGH;EEHwC,OFE5C;;AEFZ;EAAmB,kBFIN;EEJ2C,OFE5C;;AEFZ;EAAmB,kBFKP;EEL4C,OFE5C;;AEFZ;EAAmB,kBFMR;EEN6C,OFE5C;;AEFZ;EAAmB,kBFJN;EEI2C,OFE5C;;AEFZ;EAAmB,kBFNR;EEM6C,OFE5C;;AEFZ;EAAmB,kBFFN;EEE2C,OFE5C;;AEFZ;EAAmB,kBFHT;EEG8C,OFE5C;;AEFZ;EAAmB;EAAqC,OFE5C;;AEFZ;EAAmB,kBFDP;EEC4C,OFE5C;;;AE4Ed;AAGE;EAxEA,kBFfW;EEgBX,OFRY;;AEUV;EARF;EACA,OFHY;;AEgFZ;EAzEA,kBFda;EEeb,OFRY;;AEUV;EARF;EACA,OFHY;;AEiFZ;EA1EA,kBFba;EEcb,OFRY;;AEUV;EARF;EACA,OFHY;;AEkFZ;EA3EA,kBFZU;EEaV,OFRY;;AEUV;EARF;EACA,OFHY;;AEmFZ;EA5EA,kBFXa;EEYb,OFRY;;AEUV;EARF;EACA,OFHY;;AEoFZ;EA7EA,kBFVY;EEWZ,OFRY;;AEUV;EARF;EACA,OFHY;;AEqFZ;EA9EA,kBFTc;EEUd,OFRY;;AEUV;EARF;EACA,OFHY;;AEsFZ;EA/EA,kBFRW;EESX,OFRY;;AEUV;EARF;EACA,OFHY;;AEuFZ;EAhFA,kBFPY;EEQZ,OFTW;;AEWT;EARF;EACA,OFJW;;AEyFX;EAjFA,kBFNgB;EEOhB,OFRY;;AEUV;EARF;EACA,OFHY;;AEyFZ;EAlFA,kBFLa;EEMb,OFRY;;AEUV;EARF;EACA,OFHY;;AE0FZ;EAnFA,kBFJY;EEKZ,OFRY;;AEUV;EARF;EACA,OFHY;;AE2FZ;EApFA,kBFHW;EEIX,OFRY;;AEUV;EARF;EACA,OFHY;;AE6FZ;EAtFA,kBFba;EEcb,OFRY;;AEUV;EARF;EACA,OFHY;;AE8FZ;EAvFA,kBFfW;EEgBX,OFRY;;AEUV;EARF;EACA,OFHY;;AE+FZ;EAxFA,kBFXa;EEYb,OFRY;;AEUV;EARF;EACA,OFHY;;AEgGZ;EAzFA,kBFZU;EEaV,OFRY;;AEUV;EARF;EACA,OFHY;;AEiGZ;EA1FA,kBFTc;EEUd,OFRY;;AEUV;EARF;EACA,OFHY;;AEkGZ;EA3FA,kBFVY;EEWZ,OFRY;;AEUV;EARF;EACA,OFHY;;;AEqGd;AAGE;EAjGA,kBAiGkC;EAhGlC,OFRY;;AEUV;EARF;EACA,OFHY;;AEyGZ;EAlGA,kBAkGiC;EAjGjC,OFRY;;AEUV;EARF;EACA,OFHY;;AE0GZ;EAnGA,kBAmGoC;EAlGpC,OFRY;;AEUV;EARF;EACA,OFHY;;AE2GZ;EApGA,kBAoGkC;EAnGlC,OFRY;;AEUV;EARF;EACA,OFHY;;AE4GZ;EArGA,kBAqGkC;EApGlC,OFRY;;AEUV;EARF;EACA,OFHY;;;AE+Gd;AAGE;EAjGA,kBFzBW;EE0BX,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEmHZ;EAlGA,kBFxBa;EEyBb,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEoHZ;EAnGA,kBFvBa;EEwBb,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEqHZ;EApGA,kBFtBU;EEuBV,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEsHZ;EArGA,kBFrBa;EEsBb,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEuHZ;EAtGA,kBFpBY;EEqBZ,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEwHZ;EAvGA,kBFnBc;EEoBd,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEyHZ;EAxGA,kBFlBW;EEmBX,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AE0HZ;EAzGA,kBFjBY;EEkBZ,OFnBW;;AEqBT;EAlBF;EACA,OFJW;;AE4HX;EA1GA,kBFhBgB;EEiBhB,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AE4HZ;EA3GA,kBFfa;EEgBb,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AE6HZ;EA5GA,kBFdY;EEeZ,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AE8HZ;EA7GA,kBFbW;EEcX,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEgIZ;EA/GA,kBFvBa;EEwBb,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEiIZ;EAhHA,kBFzBW;EE0BX,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEkIZ;EAjHA,kBFrBa;EEsBb,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEmIZ;EAlHA,kBFtBU;EEuBV,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEoIZ;EAnHA,kBFnBc;EEoBd,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;AEqIZ;EApHA,kBFpBY;EEqBZ,OFlBY;;AEoBV;EAlBF;EACA,OFHY;;;AEwId;AAGE;EAhHA;EACA,OF5BY;;AE4IZ;EAjHA;EACA,OF5BY;;AE6IZ;EAlHA;EACA,OF5BY;;AE8IZ;EAnHA;EACA,OF5BY;;AE+IZ;EApHA;EACA,OF5BY;;AEgJZ;EArHA;EACA,OF5BY;;AEiJZ;EAtHA;EACA,OF5BY;;AEkJZ;EAvHA;EACA,OF5BY;;AEmJZ;EAxHA;EACA,OF7BW;;AEqJX;EAzHA;EACA,OF5BY;;AEqJZ;EA1HA;EACA,OF5BY;;AEsJZ;EA3HA;EACA,OF5BY;;AEuJZ;EA5HA;EACA,OF5BY;;AEyJZ;EA9HA;EACA,OF5BY;;AE0JZ;EA/HA;EACA,OF5BY;;AE2JZ;EAhIA;EACA,OF5BY;;AE4JZ;EAjIA;EACA,OF5BY;;AE6JZ;EAlIA;EACA,OF5BY;;AE8JZ;EAnIA;EACA,OF5BY;;;AEiKd;AAGE;EApIA;EACA;;AAoIA;EArIA;EACA;;AAqIA;EAtIA;EACA;;AAsIA;EAvIA;EACA;;AAuIA;EAxIA;EACA;;AAwIA;EAzIA;EACA;;AAyIA;EA1IA;EACA;;AA0IA;EA3IA;EACA;;AA2IA;EA5IA;EACA;;AA4IA;EA7IA;EACA;;AA6IA;EA9IA;EACA;;AA8IA;EA/IA;EACA;;AA+IA;EAhJA;EACA;;AAiJA;EAlJA;EACA;;AAkJA;EAnJA;EACA;;AAmJA;EApJA;EACA;;AAoJA;EArJA;EACA;;AAqJA;EAtJA;EACA;;AAsJA;EAvJA;EACA;;;AAyJF;AAGE;EAxJA,OF7CW;;AEsMX;EAzJA,OF5Ca;;AEsMb;EA1JA,OF3Ca;;AEsMb;EA3JA,OF1CU;;AEsMV;EA5JA,OFzCa;;AEsMb;EA7JA,OFxCY;;AEsMZ;EA9JA,OFvCc;;AEsMd;EA/JA,OFtCW;;AEsMX;EAhKA,OFrCY;;AEsMZ;EAjKA,OFpCgB;;AEsMhB;EAlKA,OFnCa;;AEsMb;EAnKA,OFlCY;;AEsMZ;EApKA,OFjCW;;AEuMX;EAtKA,OF3Ca;;AEkNb;EAvKA,OF7CW;;AEqNX;EAxKA,OFzCa;;AEkNb;EAzKA,OF1CU;;AEoNV;EA1KA,OFvCc;;AEkNd;EA3KA,OFxCY;;;AEsNd;AAEA;EACE;;;AAGF;EACE,cFhOa","file":"style.css"} \ No newline at end of file diff --git a/scss/_colorize.scss b/scss/_colorize.scss index 4624b9c..cd3a741 100644 --- a/scss/_colorize.scss +++ b/scss/_colorize.scss @@ -1,5 +1,8 @@ /* ------------------ COULEURS ------------------- */ +$color-button-light: $color-light; +$color-button-dark: $color-dark; + @mixin card-color($background-color, $text-color) { & > .card-header { background-color: $background-color; color:$text-color; } } @@ -48,120 +51,120 @@ a, a:hover, a:active { } ::selection { - @include background-color($color-selection, #FFF); + @include background-color($color-selection, $color-button-light); } ::-moz-selection { - @include background-color($color-selection, #FFF); + @include background-color($color-selection, $color-button-light); } /* CARDS */ .card { - &-blue { @include card-color($color-blue, #FFF); } - &-violet { @include card-color($color-violet, #FFF); } - &-purple { @include card-color($color-purple, #FFF); } - &-red { @include card-color($color-red, #FFF); } - &-orange { @include card-color($color-orange, #FFF); } - &-green { @include card-color($color-green, #FFF); } - &-skyblue { @include card-color($color-skyblue, #FFF); } - &-dark { @include card-color($color-dark, #FFF); } - &-light { @include card-color($color-light, #111); } - &-turquoise { @include card-color($color-turquoise, #FFF); } - &-yellow { @include card-color($color-yellow, #FFF); } - &-brown { @include card-color($color-brown, #FFF); } - &-grey { @include card-color($color-grey, #FFF); } + &-blue { @include card-color($color-blue, $color-button-light); } + &-violet { @include card-color($color-violet, $color-button-light); } + &-purple { @include card-color($color-purple, $color-button-light); } + &-red { @include card-color($color-red, $color-button-light); } + &-orange { @include card-color($color-orange, $color-button-light); } + &-green { @include card-color($color-green, $color-button-light); } + &-skyblue { @include card-color($color-skyblue, $color-button-light); } + &-dark { @include card-color($color-dark, $color-button-light); } + &-light { @include card-color($color-light, $color-button-dark); } + &-turquoise { @include card-color($color-turquoise, $color-button-light); } + &-yellow { @include card-color($color-yellow, $color-button-light); } + &-brown { @include card-color($color-brown, $color-button-light); } + &-grey { @include card-color($color-grey, $color-button-light); } - &-primary { @include card-color($color-primary, #FFF); } - &-secondary { @include card-color($color-secondary, #FFF); } - &-warning { @include card-color($color-warning, #FFF); } - &-danger { @include card-color($color-danger, #FFF); } - &-info { @include card-color($color-info, #FFF); } - &-success { @include card-color($color-success, #FFF); } + &-primary { @include card-color($color-primary, $color-button-light); } + &-secondary { @include card-color($color-secondary, $color-button-light); } + &-warning { @include card-color($color-warning, $color-button-light); } + &-danger { @include card-color($color-danger, $color-button-light); } + &-info { @include card-color($color-info, $color-button-light); } + &-success { @include card-color($color-success, $color-button-light); } } /* BUTTONS & BADGES */ .btn { - &-blue { @include button-color($color-blue, #FFF); } - &-violet { @include button-color($color-violet, #FFF); } - &-purple { @include button-color($color-purple, #FFF); } - &-red { @include button-color($color-red, #FFF); } - &-orange { @include button-color($color-orange, #FFF); } - &-green { @include button-color($color-green, #FFF); } - &-skyblue { @include button-color($color-skyblue, #FFF); } - &-dark { @include button-color($color-dark, #FFF); } - &-light { @include button-color($color-light, #111); } - &-turquoise { @include button-color($color-turquoise, #FFF); } - &-yellow { @include button-color($color-yellow, #FFF); } - &-brown { @include button-color($color-brown, #FFF); } - &-grey { @include button-color($color-grey, #FFF); } + &-blue { @include button-color($color-blue, $color-button-light); } + &-violet { @include button-color($color-violet, $color-button-light); } + &-purple { @include button-color($color-purple, $color-button-light); } + &-red { @include button-color($color-red, $color-button-light); } + &-orange { @include button-color($color-orange, $color-button-light); } + &-green { @include button-color($color-green, $color-button-light); } + &-skyblue { @include button-color($color-skyblue, $color-button-light); } + &-dark { @include button-color($color-dark, $color-button-light); } + &-light { @include button-color($color-light, $color-button-dark); } + &-turquoise { @include button-color($color-turquoise, $color-button-light); } + &-yellow { @include button-color($color-yellow, $color-button-light); } + &-brown { @include button-color($color-brown, $color-button-light); } + &-grey { @include button-color($color-grey, $color-button-light); } - &-primary { @include button-color($color-primary, #FFF); } - &-secondary { @include button-color($color-secondary, #FFF); } - &-warning { @include button-color($color-warning, #FFF); } - &-danger { @include button-color($color-danger, #FFF); } - &-info { @include button-color($color-info, #FFF); } - &-success { @include button-color($color-success, #FFF); } + &-primary { @include button-color($color-primary, $color-button-light); } + &-secondary { @include button-color($color-secondary, $color-button-light); } + &-warning { @include button-color($color-warning, $color-button-light); } + &-danger { @include button-color($color-danger, $color-button-light); } + &-info { @include button-color($color-info, $color-button-light); } + &-success { @include button-color($color-success, $color-button-light); } } /* social */ .btn { - &-facebook {@include button-color(#3B5998, #FFF);} - &-twitter {@include button-color(#55ACEE, #FFF);} - &-googleplus {@include button-color(#d34836, #FFF);} - &-diaspora {@include button-color(#313739, #FFF);} - &-mastodon {@include button-color(#282c37, #FFF);} + &-facebook {@include button-color(#3B5998, $color-button-light);} + &-twitter {@include button-color(#55ACEE, $color-button-light);} + &-googleplus {@include button-color(#d34836, $color-button-light);} + &-diaspora {@include button-color(#313739, $color-button-light);} + &-mastodon {@include button-color(#282c37, $color-button-light);} } /* BADGES */ .badge { - &-blue { @include badge-color($color-blue, #FFF); } - &-violet { @include badge-color($color-violet, #FFF); } - &-purple { @include badge-color($color-purple, #FFF); } - &-red { @include badge-color($color-red, #FFF); } - &-orange { @include badge-color($color-orange, #FFF); } - &-green { @include badge-color($color-green, #FFF); } - &-skyblue { @include badge-color($color-skyblue, #FFF); } - &-dark { @include badge-color($color-dark, #FFF); } - &-light { @include badge-color($color-light, #111); } - &-turquoise { @include badge-color($color-turquoise, #FFF); } - &-yellow { @include badge-color($color-yellow, #FFF); } - &-brown { @include badge-color($color-brown, #FFF); } - &-grey { @include badge-color($color-grey, #FFF); } + &-blue { @include badge-color($color-blue, $color-button-light); } + &-violet { @include badge-color($color-violet, $color-button-light); } + &-purple { @include badge-color($color-purple, $color-button-light); } + &-red { @include badge-color($color-red, $color-button-light); } + &-orange { @include badge-color($color-orange, $color-button-light); } + &-green { @include badge-color($color-green, $color-button-light); } + &-skyblue { @include badge-color($color-skyblue, $color-button-light); } + &-dark { @include badge-color($color-dark, $color-button-light); } + &-light { @include badge-color($color-light, $color-button-dark); } + &-turquoise { @include badge-color($color-turquoise, $color-button-light); } + &-yellow { @include badge-color($color-yellow, $color-button-light); } + &-brown { @include badge-color($color-brown, $color-button-light); } + &-grey { @include badge-color($color-grey, $color-button-light); } - &-primary { @include badge-color($color-primary, #FFF); } - &-secondary { @include badge-color($color-secondary, #FFF); } - &-warning { @include badge-color($color-warning, #FFF); } - &-danger { @include badge-color($color-danger, #FFF); } - &-info { @include badge-color($color-info, #FFF); } - &-success { @include badge-color($color-success, #FFF); } + &-primary { @include badge-color($color-primary, $color-button-light); } + &-secondary { @include badge-color($color-secondary, $color-button-light); } + &-warning { @include badge-color($color-warning, $color-button-light); } + &-danger { @include badge-color($color-danger, $color-button-light); } + &-info { @include badge-color($color-info, $color-button-light); } + &-success { @include badge-color($color-success, $color-button-light); } } /* BACKGROUNDS */ .bg { - &-blue { @include background-color($color-blue, #FFF); } - &-violet { @include background-color($color-violet, #FFF); } - &-purple { @include background-color($color-purple, #FFF); } - &-red { @include background-color($color-red, #FFF); } - &-orange { @include background-color($color-orange, #FFF); } - &-green { @include background-color($color-green, #FFF); } - &-skyblue { @include background-color($color-skyblue, #FFF); } - &-dark { @include background-color($color-dark, #FFF); } - &-light { @include background-color($color-light, #111); } - &-turquoise { @include background-color($color-turquoise, #FFF); } - &-yellow { @include background-color($color-yellow, #FFF); } - &-brown { @include background-color($color-brown, #FFF); } - &-grey { @include background-color($color-grey, #FFF); } + &-blue { @include background-color($color-blue, $color-button-light); } + &-violet { @include background-color($color-violet, $color-button-light); } + &-purple { @include background-color($color-purple, $color-button-light); } + &-red { @include background-color($color-red, $color-button-light); } + &-orange { @include background-color($color-orange, $color-button-light); } + &-green { @include background-color($color-green, $color-button-light); } + &-skyblue { @include background-color($color-skyblue, $color-button-light); } + &-dark { @include background-color($color-dark, $color-button-light); } + &-light { @include background-color($color-light, $color-button-dark); } + &-turquoise { @include background-color($color-turquoise, $color-button-light); } + &-yellow { @include background-color($color-yellow, $color-button-light); } + &-brown { @include background-color($color-brown, $color-button-light); } + &-grey { @include background-color($color-grey, $color-button-light); } - &-primary { @include background-color($color-primary, #FFF); } - &-secondary { @include background-color($color-secondary, #FFF); } - &-warning { @include background-color($color-warning, #FFF); } - &-danger { @include background-color($color-danger, #FFF); } - &-info { @include background-color($color-info, #FFF); } - &-success { @include background-color($color-success, #FFF); } + &-primary { @include background-color($color-primary, $color-button-light); } + &-secondary { @include background-color($color-secondary, $color-button-light); } + &-warning { @include background-color($color-warning, $color-button-light); } + &-danger { @include background-color($color-danger, $color-button-light); } + &-info { @include background-color($color-info, $color-button-light); } + &-success { @include background-color($color-success, $color-button-light); } } /* ALERTS */ diff --git a/scss/_commons.scss b/scss/_commons.scss index 5cb08be..df41cef 100644 --- a/scss/_commons.scss +++ b/scss/_commons.scss @@ -17,7 +17,7 @@ } h1, h2, h3, h4, h5, h6, h7, h8, h9, h10 { - color:white; + color: $color-light; text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.4); } @@ -26,7 +26,7 @@ h1, h2, h3, h4, h5, h6, h7, h8, h9, h10 { header h1 { border-style:none !important; - color:#FFF; + color: $color-light; font-weight:700; font-size:5.4em; font-style:oblique; @@ -71,7 +71,7 @@ ul.social { list-style: none; display: inline; a { - color:#FFFFFF; + color: $color-light; background-color:#000000; padding:0.3em; padding-left:0.36em; @@ -80,7 +80,7 @@ ul.social { border-radius:100%; &:hover { color:#000; - background-color:#FFF + background-color: $color-light; } } } @@ -94,6 +94,7 @@ ul.social { box-shadow: $large-shadow; border: none; margin-bottom:1.2em; + background-color: $color-light; } .card-shadow { @@ -101,7 +102,7 @@ ul.social { } .card h1,.card h2,.card h3,.card h4,.card h5,.card h6,.card h7,.card h8,.card h9,.card h10 { - color:#333; + color:$color-dark; text-shadow: 0px 0px 0px rgba(0, 0, 0, 0); } @@ -132,7 +133,7 @@ ul.social { text-shadow: 0px -1px 0px rgba(0,0,0,0.3); padding:0px; margin:0px; - color:#FFF; + color:$color-light;; font-weight:600; line-height:1.5em; } @@ -264,7 +265,7 @@ a.list-group-item:hover { @include border-radius(); box-shadow: $large-shadow, $inset-shadow; border: 0; - background-color:#eeeeec; + background-color: $color-light2; margin-bottom:1.2em; @include li-no-margin(); } @@ -387,7 +388,7 @@ a.list-group-item:hover { position: absolute; padding: 0; transition: opacity .5s; - color: #FFF; + color: $color-light; background-color: rgba(0,0,0,0.5); text-shadow: 1px 1px 0px rgba(0,0,0,0.7); backdrop-filter: none; @@ -401,11 +402,11 @@ a.list-group-item:hover { text-align:center; display:block; font-size:2em; - color: white; + color: $color-light; } .preview-overlay h1,.preview-overlay h2,.preview-overlay h3,.preview-overlay h4,.preview-overlay h5,.preview-overlay h6,.preview-overlay h7,.preview-overlay h8,.preview-overlay h9,.preview-overlay h10 { - color:white; + color: $color-light; text-shadow: 1px 1px 0px rgba(0,0,0,0.7); } diff --git a/scss/_palette.scss b/scss/_palette.scss index c5d6468..fad5cec 100644 --- a/scss/_palette.scss +++ b/scss/_palette.scss @@ -1,16 +1,23 @@ -$color-blue: #4e63c9; -$color-violet: #ce4dcd; -$color-purple: #7951c0; -$color-red: #e33d22; -$color-orange: #eb790a; -$color-green: #75b82d; -$color-skyblue: #42a0f3; -$color-dark: #2D2D2D; -$color-light: #eeeeec; -$color-turquoise: #46bd9e; -$color-yellow: #f6d32d; -$color-brown: #986a44; -$color-grey: #77767b; +$color-blue: #268bd2; +$color-violet: #d33682; +$color-purple: #6c71c4; +$color-red: #dc322f; +$color-orange: #cb4b16; +$color-green: #859900; +$color-skyblue: #2aa198; +$color-dark: #002b36; +$color-light: #fdf6e3; +$color-turquoise: #2aa198; +$color-yellow: #b58900; +$color-brown: #b58900; +$color-grey: #586e75; + +$color-dark2: #073642; +$color-light2: #eee8d5; + +$color-gray2: #657b83; +$color-gray3: #839496; +$color-gray4: #93a1a1; $color-warning: $color-orange; $color-danger: $color-red; diff --git a/scss/style.scss b/scss/style.scss index 896b2a5..d6bb41b 100644 --- a/scss/style.scss +++ b/scss/style.scss @@ -25,8 +25,12 @@ $color-mark: $color-yellow; border-radius: $border-radius $border-radius $border-radius $border-radius; } +body { + background-color: $color-light; +} + #wrapper { - background: #64b5f6 url('../img/background.png') center bottom repeat-x; + background: $color-turquoise url('../img/background.png') center bottom repeat-x; } @import 'commons';