From afc5ae009e39070d9d6b77afd8dc06c168b9feb7 Mon Sep 17 00:00:00 2001 From: koenemann Date: Fri, 10 Nov 2017 14:14:35 +0100 Subject: [PATCH] Checking colormap functionality with different $primary color --- css/theme.css | 128 +++++++++++++++---------------- sass/theme/_theme_variables.scss | 2 +- 2 files changed, 65 insertions(+), 65 deletions(-) diff --git a/css/theme.css b/css/theme.css index 7a5a900..07aecdc 100644 --- a/css/theme.css +++ b/css/theme.css @@ -151,12 +151,12 @@ sup { top: -.5em; } a { - color: #270074; + color: #0A42E8; text-decoration: none; background-color: transparent; -webkit-text-decoration-skip: objects; } a:hover { - color: #0d0028; + color: #072d9f; text-decoration: underline; } a:not([href]):not([tabindex]) { @@ -1086,13 +1086,13 @@ pre { .table-primary, .table-primary > th, .table-primary > td { - background-color: #c3b8d8; } + background-color: #bacaf9; } .table-hover .table-primary:hover { - background-color: #b5a8cf; } + background-color: #a3b8f7; } .table-hover .table-primary:hover > td, .table-hover .table-primary:hover > th { - background-color: #b5a8cf; } + background-color: #a3b8f7; } .table-secondary, .table-secondary > th, @@ -1324,9 +1324,9 @@ pre { .wpcf7 textarea:focus, .wpcf7 .wpcf7-validation-errors:focus { color: #495057; background-color: #fff; - border-color: #5200f4; + border-color: #7899f9; outline: 0; - box-shadow: 0 0 0 0.2rem rgba(39, 0, 116, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(10, 66, 232, 0.25); } .form-control::placeholder, .wpcf7 input[type=text]::placeholder, .wpcf7 input[type=search]::placeholder, .wpcf7 input[type=url]::placeholder, @@ -2285,7 +2285,7 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for text-decoration: none; } .btn:focus, .wpcf7 input[type=submit]:focus, .btn.focus, .wpcf7 input.focus[type=submit] { outline: 0; - box-shadow: 0 0 0 0.2rem rgba(39, 0, 116, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(10, 66, 232, 0.25); } .btn.disabled, .wpcf7 input.disabled[type=submit], .btn:disabled, .wpcf7 input[type=submit]:disabled { opacity: 0.65; } .btn:not([disabled]):not(.disabled):active, .wpcf7 input[type=submit]:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active, .wpcf7 input[type=submit]:not([disabled]):not(.disabled).active { @@ -2297,23 +2297,23 @@ fieldset[disabled] a.btn { .btn-primary { color: #fff; - background-color: #270074; - border-color: #270074; } + background-color: #0A42E8; + border-color: #0A42E8; } .btn-primary:hover { color: #fff; - background-color: #1a004e; - border-color: #160041; } + background-color: #0838c3; + border-color: #0834b7; } .btn-primary:focus, .btn-primary.focus { - box-shadow: 0 0 0 0.2rem rgba(39, 0, 116, 0.5); } + box-shadow: 0 0 0 0.2rem rgba(10, 66, 232, 0.5); } .btn-primary.disabled, .btn-primary:disabled { - background-color: #270074; - border-color: #270074; } + background-color: #0A42E8; + border-color: #0A42E8; } .btn-primary:not([disabled]):not(.disabled):active, .btn-primary:not([disabled]):not(.disabled).active, .show > .btn-primary.dropdown-toggle { color: #fff; - background-color: #160041; - border-color: #120034; - box-shadow: 0 0 0 0.2rem rgba(39, 0, 116, 0.5); } + background-color: #0834b7; + border-color: #0731ab; + box-shadow: 0 0 0 0.2rem rgba(10, 66, 232, 0.5); } .btn-secondary { color: #fff; @@ -2456,26 +2456,26 @@ fieldset[disabled] a.btn { box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } .btn-outline-primary, .wpcf7 input[type=submit] { - color: #270074; + color: #0A42E8; background-color: transparent; background-image: none; - border-color: #270074; } + border-color: #0A42E8; } .btn-outline-primary:hover, .wpcf7 input[type=submit]:hover { color: #fff; - background-color: #270074; - border-color: #270074; } + background-color: #0A42E8; + border-color: #0A42E8; } .btn-outline-primary:focus, .wpcf7 input[type=submit]:focus, .btn-outline-primary.focus, .wpcf7 input.focus[type=submit] { - box-shadow: 0 0 0 0.2rem rgba(39, 0, 116, 0.5); } + box-shadow: 0 0 0 0.2rem rgba(10, 66, 232, 0.5); } .btn-outline-primary.disabled, .wpcf7 input.disabled[type=submit], .btn-outline-primary:disabled, .wpcf7 input[type=submit]:disabled { - color: #270074; + color: #0A42E8; background-color: transparent; } .btn-outline-primary:not([disabled]):not(.disabled):active, .wpcf7 input[type=submit]:not([disabled]):not(.disabled):active, .btn-outline-primary:not([disabled]):not(.disabled).active, .wpcf7 input[type=submit]:not([disabled]):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle, .wpcf7 .show > input.dropdown-toggle[type=submit] { color: #fff; - background-color: #270074; - border-color: #270074; - box-shadow: 0 0 0 0.2rem rgba(39, 0, 116, 0.5); } + background-color: #0A42E8; + border-color: #0A42E8; + box-shadow: 0 0 0 0.2rem rgba(10, 66, 232, 0.5); } .btn-outline-secondary { color: #868e96; @@ -2626,10 +2626,10 @@ fieldset[disabled] a.btn { .btn-link { font-weight: 400; - color: #270074; + color: #0A42E8; background-color: transparent; } .btn-link:hover { - color: #0d0028; + color: #072d9f; text-decoration: underline; background-color: transparent; border-color: transparent; } @@ -2820,7 +2820,7 @@ tbody.collapse.show { .dropdown-item.active, .dropdown-item:active { color: #fff; text-decoration: none; - background-color: #270074; } + background-color: #0A42E8; } .dropdown-item.disabled, .dropdown-item:disabled { color: #868e96; background-color: transparent; } @@ -3530,12 +3530,12 @@ tbody.collapse.show { opacity: 0; } .custom-control-input:checked ~ .custom-control-indicator { color: #fff; - background-color: #270074; } + background-color: #0A42E8; } .custom-control-input:focus ~ .custom-control-indicator { - box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(39, 0, 116, 0.25); } + box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(10, 66, 232, 0.25); } .custom-control-input:active ~ .custom-control-indicator { color: #fff; - background-color: #7028ff; } + background-color: #a9befb; } .custom-control-input:disabled ~ .custom-control-indicator { background-color: #e9ecef; } .custom-control-input:disabled ~ .custom-control-description { @@ -3562,7 +3562,7 @@ tbody.collapse.show { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"); } .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-indicator { - background-color: #270074; + background-color: #0A42E8; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='%23fff' d='M0 2h4'/%3E%3C/svg%3E"); } .custom-radio .custom-control-indicator { @@ -3593,7 +3593,7 @@ tbody.collapse.show { border-radius: 0.25rem; appearance: none; } .custom-select:focus { - border-color: #5200f4; + border-color: #7899f9; outline: 0; } .custom-select:focus::-ms-value { color: #495057; @@ -3627,7 +3627,7 @@ tbody.collapse.show { margin: 0; opacity: 0; } .custom-file-input:focus ~ .custom-file-control { - box-shadow: 0 0 0 0.075rem #fff, 0 0 0 0.2rem #270074; } + box-shadow: 0 0 0 0.075rem #fff, 0 0 0 0.2rem #0A42E8; } .custom-file-control { position: absolute; @@ -3707,7 +3707,7 @@ tbody.collapse.show { .nav-pills .nav-link.active, .nav-pills .show > .nav-link { color: #fff; - background-color: #270074; } + background-color: #0A42E8; } .nav-fill .nav-item { flex: 1 1 auto; @@ -4217,11 +4217,11 @@ tbody.collapse.show { padding: 0.5rem 0.75rem; margin-left: -1px; line-height: 1.25; - color: #270074; + color: #0A42E8; background-color: #fff; border: 1px solid #dee2e6; } .page-link:focus, .page-link:hover { - color: #0d0028; + color: #072d9f; text-decoration: none; background-color: #e9ecef; border-color: #dee2e6; } @@ -4238,8 +4238,8 @@ tbody.collapse.show { .page-item.active .page-link { z-index: 1; color: #fff; - background-color: #270074; - border-color: #270074; } + background-color: #0A42E8; + border-color: #0A42E8; } .page-item.disabled .page-link { color: #868e96; @@ -4297,11 +4297,11 @@ tbody.collapse.show { .badge-primary { color: #fff; - background-color: #270074; } + background-color: #0A42E8; } .badge-primary[href]:focus, .badge-primary[href]:hover { color: #fff; text-decoration: none; - background-color: #160041; } + background-color: #0834b7; } .badge-secondary { color: #fff; @@ -4396,13 +4396,13 @@ tbody.collapse.show { color: inherit; } .alert-primary { - color: #14003c; - background-color: #d4cce3; - border-color: #c3b8d8; } + color: #052279; + background-color: #ced9fa; + border-color: #bacaf9; } .alert-primary hr { - border-top-color: #b5a8cf; } + border-top-color: #a3b8f7; } .alert-primary .alert-link { - color: #030009; } + color: #031448; } .alert-secondary { color: #464a4e; @@ -4487,7 +4487,7 @@ tbody.collapse.show { justify-content: center; color: #fff; text-align: center; - background-color: #270074; + background-color: #0A42E8; transition: width 0.6s ease; } .progress-bar-striped { @@ -4544,8 +4544,8 @@ tbody.collapse.show { .list-group-item.active { z-index: 1; color: #fff; - background-color: #270074; - border-color: #270074; } + background-color: #0A42E8; + border-color: #0A42E8; } .list-group-flush .list-group-item { border-right: 0; @@ -4559,22 +4559,22 @@ tbody.collapse.show { border-bottom: 0; } .list-group-item-primary { - color: #14003c; - background-color: #c3b8d8; } + color: #052279; + background-color: #bacaf9; } a.list-group-item-primary, button.list-group-item-primary { - color: #14003c; } + color: #052279; } a.list-group-item-primary:focus, a.list-group-item-primary:hover, button.list-group-item-primary:focus, button.list-group-item-primary:hover { - color: #14003c; - background-color: #b5a8cf; } + color: #052279; + background-color: #a3b8f7; } a.list-group-item-primary.active, button.list-group-item-primary.active { color: #fff; - background-color: #14003c; - border-color: #14003c; } + background-color: #052279; + border-color: #052279; } .list-group-item-secondary { color: #464a4e; @@ -5201,10 +5201,10 @@ button.close { vertical-align: text-top !important; } .bg-primary { - background-color: #270074 !important; } + background-color: #0A42E8 !important; } a.bg-primary:focus, a.bg-primary:hover { - background-color: #160041 !important; } + background-color: #0834b7 !important; } .bg-secondary { background-color: #868e96 !important; } @@ -5273,7 +5273,7 @@ a.bg-dark:focus, a.bg-dark:hover { border-left: 0 !important; } .border-primary { - border-color: #270074 !important; } + border-color: #0A42E8 !important; } .border-secondary { border-color: #868e96 !important; } @@ -7005,10 +7005,10 @@ a.bg-dark:focus, a.bg-dark:hover { color: #fff !important; } .text-primary { - color: #270074 !important; } + color: #0A42E8 !important; } a.text-primary:focus, a.text-primary:hover { - color: #160041 !important; } + color: #0834b7 !important; } .text-secondary { color: #868e96 !important; } @@ -7146,7 +7146,7 @@ a.skip-link { .navbar-dark .navbar-nav .dropdown-menu .nav-link.active, .navbar-dark .navbar-nav .dropdown-menu .nav-link:active { color: #fff !important; text-decoration: none; - background-color: #270074; } + background-color: #0A42E8; } .navbar-dark .navbar-nav .dropdown-menu .nav-link.disabled, .navbar-dark .navbar-nav .dropdown-menu .nav-link:disabled { color: #868e96 !important; background-color: transparent; } diff --git a/sass/theme/_theme_variables.scss b/sass/theme/_theme_variables.scss index cd0048e..e8409c1 100644 --- a/sass/theme/_theme_variables.scss +++ b/sass/theme/_theme_variables.scss @@ -3,4 +3,4 @@ // Just copy a variable from /sass/bootstrap/_variables.scss, paste it here and edit the value. -$primary: #270074; \ No newline at end of file +$primary: #0A42E8; // Thats a sample how you could change a BootStrap variable. \ No newline at end of file