rayelliott
/
understrap
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Testing color set

This commit is contained in:
koenemann 2017-08-17 15:07:14 +02:00
parent 457ba73805
commit a527b963d1
5 changed files with 80 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

128
css/theme.css
View File

@ -69,7 +69,7 @@ article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, s
body { body {
margin: 0; margin: 0;
font-family: Arial, sans-serif; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1rem; font-size: 1rem;
font-weight: normal; font-weight: normal;
line-height: 1.5; line-height: 1.5;
@ -151,12 +151,12 @@ sup {
top: -.5em; } top: -.5em; }
a { a {
color: #7852B2; color: #007bff;
text-decoration: none; text-decoration: none;
background-color: transparent; background-color: transparent;
-webkit-text-decoration-skip: objects; } -webkit-text-decoration-skip: objects; }
a:hover { a:hover {
color: #54397f; color: #0056b3;
text-decoration: underline; } text-decoration: underline; }
a:not([href]):not([tabindex]) { a:not([href]):not([tabindex]) {
@ -946,13 +946,13 @@ pre {
.table-primary, .table-primary,
.table-primary > th, .table-primary > th,
.table-primary > td { .table-primary > td {
background-color: #d9cfe9; } background-color: #b8daff; }
.table-hover .table-primary:hover { .table-hover .table-primary:hover {
background-color: #cbbee1; } background-color: #9fcdff; }
.table-hover .table-primary:hover > td, .table-hover .table-primary:hover > td,
.table-hover .table-primary:hover > th { .table-hover .table-primary:hover > th {
background-color: #cbbee1; } background-color: #9fcdff; }
.table-secondary, .table-secondary,
.table-secondary > th, .table-secondary > th,
@ -1143,7 +1143,7 @@ pre {
.wpcf7 textarea:focus, .wpcf7 .wpcf7-validation-errors:focus { .wpcf7 textarea:focus, .wpcf7 .wpcf7-validation-errors:focus {
color: #495057; color: #495057;
background-color: #fff; background-color: #fff;
border-color: #bdaad9; border-color: #80bdff;
outline: none; } outline: none; }
.form-control::placeholder, .wpcf7 input[type=text]::placeholder, .form-control::placeholder, .wpcf7 input[type=text]::placeholder,
.wpcf7 input[type=search]::placeholder, .wpcf7 input[type=search]::placeholder,
@ -2073,7 +2073,7 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
text-decoration: none; } text-decoration: none; }
.btn:focus, .wpcf7 input[type=submit]:focus, .btn.focus, .wpcf7 input.focus[type=submit] { .btn:focus, .wpcf7 input[type=submit]:focus, .btn.focus, .wpcf7 input.focus[type=submit] {
outline: 0; outline: 0;
box-shadow: 0 0 0 3px rgba(120, 82, 178, 0.25); } box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25); }
.btn.disabled, .wpcf7 input.disabled[type=submit], .btn:disabled, .wpcf7 input[type=submit]:disabled { .btn.disabled, .wpcf7 input.disabled[type=submit], .btn:disabled, .wpcf7 input[type=submit]:disabled {
opacity: .65; } opacity: .65; }
.btn:active, .wpcf7 input[type=submit]:active, .btn.active, .wpcf7 input.active[type=submit] { .btn:active, .wpcf7 input[type=submit]:active, .btn.active, .wpcf7 input.active[type=submit] {
@ -2085,22 +2085,22 @@ fieldset[disabled] a.btn {
.btn-primary { .btn-primary {
color: #fff; color: #fff;
background-color: #7852B2; background-color: #007bff;
border-color: #7852B2; } border-color: #007bff; }
.btn-primary:hover { .btn-primary:hover {
color: #fff; color: #fff;
background-color: #664499; background-color: #0069d9;
border-color: #604091; } border-color: #0062cc; }
.btn-primary:focus, .btn-primary.focus { .btn-primary:focus, .btn-primary.focus {
box-shadow: 0 0 0 3px rgba(120, 82, 178, 0.5); } box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.5); }
.btn-primary.disabled, .btn-primary:disabled { .btn-primary.disabled, .btn-primary:disabled {
background-color: #7852B2; background-color: #007bff;
border-color: #7852B2; } border-color: #007bff; }
.btn-primary:active, .btn-primary.active, .btn-primary:active, .btn-primary.active,
.show > .btn-primary.dropdown-toggle { .show > .btn-primary.dropdown-toggle {
background-color: #664499; background-color: #0069d9;
background-image: none; background-image: none;
border-color: #604091; } border-color: #0062cc; }
.btn-secondary { .btn-secondary {
color: #fff; color: #fff;
@ -2236,25 +2236,25 @@ fieldset[disabled] a.btn {
border-color: #1d2124; } border-color: #1d2124; }
.btn-outline-primary, .wpcf7 input[type=submit] { .btn-outline-primary, .wpcf7 input[type=submit] {
color: #7852B2; color: #007bff;
background-color: transparent; background-color: transparent;
background-image: none; background-image: none;
border-color: #7852B2; } border-color: #007bff; }
.btn-outline-primary:hover, .wpcf7 input[type=submit]:hover { .btn-outline-primary:hover, .wpcf7 input[type=submit]:hover {
color: #fff; color: #fff;
background-color: #7852B2; background-color: #007bff;
border-color: #7852B2; } border-color: #007bff; }
.btn-outline-primary:focus, .wpcf7 input[type=submit]:focus, .btn-outline-primary.focus, .wpcf7 input.focus[type=submit] { .btn-outline-primary:focus, .wpcf7 input[type=submit]:focus, .btn-outline-primary.focus, .wpcf7 input.focus[type=submit] {
box-shadow: 0 0 0 3px rgba(120, 82, 178, 0.5); } box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.5); }
.btn-outline-primary.disabled, .wpcf7 input.disabled[type=submit], .btn-outline-primary:disabled, .wpcf7 input[type=submit]:disabled { .btn-outline-primary.disabled, .wpcf7 input.disabled[type=submit], .btn-outline-primary:disabled, .wpcf7 input[type=submit]:disabled {
color: #7852B2; color: #007bff;
background-color: transparent; } background-color: transparent; }
.btn-outline-primary:active, .wpcf7 input[type=submit]:active, .btn-outline-primary.active, .wpcf7 input.active[type=submit], .btn-outline-primary:active, .wpcf7 input[type=submit]:active, .btn-outline-primary.active, .wpcf7 input.active[type=submit],
.show > .btn-outline-primary.dropdown-toggle, .wpcf7 .show > .btn-outline-primary.dropdown-toggle, .wpcf7
.show > input.dropdown-toggle[type=submit] { .show > input.dropdown-toggle[type=submit] {
color: #fff; color: #fff;
background-color: #7852B2; background-color: #007bff;
border-color: #7852B2; } border-color: #007bff; }
.btn-outline-secondary { .btn-outline-secondary {
color: #868e96; color: #868e96;
@ -2398,7 +2398,7 @@ fieldset[disabled] a.btn {
.btn-link { .btn-link {
font-weight: normal; font-weight: normal;
color: #7852B2; color: #007bff;
border-radius: 0; } border-radius: 0; }
.btn-link, .btn-link:active, .btn-link.active, .btn-link:disabled { .btn-link, .btn-link:active, .btn-link.active, .btn-link:disabled {
background-color: transparent; } background-color: transparent; }
@ -2408,7 +2408,7 @@ fieldset[disabled] a.btn {
.btn-link:hover { .btn-link:hover {
border-color: transparent; } border-color: transparent; }
.btn-link:focus, .btn-link:hover { .btn-link:focus, .btn-link:hover {
color: #54397f; color: #0056b3;
text-decoration: underline; text-decoration: underline;
background-color: transparent; } background-color: transparent; }
.btn-link:disabled { .btn-link:disabled {
@ -2532,7 +2532,7 @@ tbody.collapse.show {
.dropdown-item.active, .dropdown-item:active { .dropdown-item.active, .dropdown-item:active {
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
background-color: #7852B2; } background-color: #007bff; }
.dropdown-item.disabled, .dropdown-item:disabled { .dropdown-item.disabled, .dropdown-item:disabled {
color: #868e96; color: #868e96;
background-color: transparent; } background-color: transparent; }
@ -3228,12 +3228,12 @@ tbody.collapse.show {
opacity: 0; } opacity: 0; }
.custom-control-input:checked ~ .custom-control-indicator { .custom-control-input:checked ~ .custom-control-indicator {
color: #fff; color: #fff;
background-color: #7852B2; } background-color: #007bff; }
.custom-control-input:focus ~ .custom-control-indicator { .custom-control-input:focus ~ .custom-control-indicator {
box-shadow: 0 0 0 1px #fff, 0 0 0 3px #7852B2; } box-shadow: 0 0 0 1px #fff, 0 0 0 3px #007bff; }
.custom-control-input:active ~ .custom-control-indicator { .custom-control-input:active ~ .custom-control-indicator {
color: #fff; color: #fff;
background-color: #d8cee9; } background-color: #b3d7ff; }
.custom-control-input:disabled ~ .custom-control-indicator { .custom-control-input:disabled ~ .custom-control-indicator {
background-color: #e9ecef; } background-color: #e9ecef; }
.custom-control-input:disabled ~ .custom-control-description { .custom-control-input:disabled ~ .custom-control-description {
@ -3260,7 +3260,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"); } 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 { .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-indicator {
background-color: #7852B2; background-color: #007bff;
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"); } 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 { .custom-radio .custom-control-indicator {
@ -3292,7 +3292,7 @@ tbody.collapse.show {
border-radius: 0.25rem; border-radius: 0.25rem;
appearance: none; } appearance: none; }
.custom-select:focus { .custom-select:focus {
border-color: #bdaad9; border-color: #80bdff;
outline: none; } outline: none; }
.custom-select:focus::-ms-value { .custom-select:focus::-ms-value {
color: #495057; color: #495057;
@ -3323,7 +3323,7 @@ tbody.collapse.show {
margin: 0; margin: 0;
opacity: 0; } opacity: 0; }
.custom-file-input:focus ~ .custom-file-control { .custom-file-input:focus ~ .custom-file-control {
box-shadow: 0 0 0 0.075rem #fff, 0 0 0 0.2rem #7852B2; } box-shadow: 0 0 0 0.075rem #fff, 0 0 0 0.2rem #007bff; }
.custom-file-control { .custom-file-control {
position: absolute; position: absolute;
@ -3403,7 +3403,7 @@ tbody.collapse.show {
.nav-pills .nav-link.active, .nav-pills .nav-link.active,
.show > .nav-pills .nav-link { .show > .nav-pills .nav-link {
color: #fff; color: #fff;
background-color: #7852B2; } background-color: #007bff; }
.nav-fill .nav-item { .nav-fill .nav-item {
flex: 1 1 auto; flex: 1 1 auto;
@ -3867,8 +3867,8 @@ tbody.collapse.show {
.page-item.active .page-link { .page-item.active .page-link {
z-index: 2; z-index: 2;
color: #fff; color: #fff;
background-color: #7852B2; background-color: #007bff;
border-color: #7852B2; } border-color: #007bff; }
.page-item.disabled .page-link { .page-item.disabled .page-link {
color: #868e96; color: #868e96;
@ -3882,11 +3882,11 @@ tbody.collapse.show {
padding: 0.5rem 0.75rem; padding: 0.5rem 0.75rem;
margin-left: -1px; margin-left: -1px;
line-height: 1.25; line-height: 1.25;
color: #7852B2; color: #007bff;
background-color: #fff; background-color: #fff;
border: 1px solid #ddd; } border: 1px solid #ddd; }
.page-link:focus, .page-link:hover { .page-link:focus, .page-link:hover {
color: #54397f; color: #0056b3;
text-decoration: none; text-decoration: none;
background-color: #e9ecef; background-color: #e9ecef;
border-color: #ddd; } border-color: #ddd; }
@ -3942,11 +3942,11 @@ tbody.collapse.show {
.badge-primary { .badge-primary {
color: #fff; color: #fff;
background-color: #7852B2; } background-color: #007bff; }
.badge-primary[href]:focus, .badge-primary[href]:hover { .badge-primary[href]:focus, .badge-primary[href]:hover {
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
background-color: #604091; } background-color: #0062cc; }
.badge-secondary { .badge-secondary {
color: #fff; color: #fff;
@ -4038,13 +4038,13 @@ tbody.collapse.show {
color: inherit; } color: inherit; }
.alert-primary { .alert-primary {
color: #3e2b5d; color: #004085;
background-color: #e4dcf0; background-color: #cce5ff;
border-color: #d9cfe9; } border-color: #b8daff; }
.alert-primary hr { .alert-primary hr {
border-top-color: #cbbee1; } border-top-color: #9fcdff; }
.alert-primary .alert-link { .alert-primary .alert-link {
color: #271b3a; } color: #002752; }
.alert-secondary { .alert-secondary {
color: #464a4e; color: #464a4e;
@ -4128,7 +4128,7 @@ tbody.collapse.show {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: #fff; color: #fff;
background-color: #7852B2; } background-color: #007bff; }
.progress-bar-striped { .progress-bar-striped {
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
@ -4184,8 +4184,8 @@ tbody.collapse.show {
.list-group-item.active { .list-group-item.active {
z-index: 2; z-index: 2;
color: #fff; color: #fff;
background-color: #7852B2; background-color: #007bff;
border-color: #7852B2; } border-color: #007bff; }
.list-group-flush .list-group-item { .list-group-flush .list-group-item {
border-right: 0; border-right: 0;
@ -4199,22 +4199,22 @@ tbody.collapse.show {
border-bottom: 0; } border-bottom: 0; }
.list-group-item-primary { .list-group-item-primary {
color: #3e2b5d; color: #004085;
background-color: #d9cfe9; } background-color: #b8daff; }
a.list-group-item-primary, a.list-group-item-primary,
button.list-group-item-primary { button.list-group-item-primary {
color: #3e2b5d; } color: #004085; }
a.list-group-item-primary:focus, a.list-group-item-primary:hover, a.list-group-item-primary:focus, a.list-group-item-primary:hover,
button.list-group-item-primary:focus, button.list-group-item-primary:focus,
button.list-group-item-primary:hover { button.list-group-item-primary:hover {
color: #3e2b5d; color: #004085;
background-color: #cbbee1; } background-color: #9fcdff; }
a.list-group-item-primary.active, a.list-group-item-primary.active,
button.list-group-item-primary.active { button.list-group-item-primary.active {
color: #fff; color: #fff;
background-color: #3e2b5d; background-color: #004085;
border-color: #3e2b5d; } border-color: #004085; }
.list-group-item-secondary { .list-group-item-secondary {
color: #464a4e; color: #464a4e;
@ -4464,7 +4464,7 @@ button.close {
z-index: 1070; z-index: 1070;
display: block; display: block;
margin: 0; margin: 0;
font-family: Arial, sans-serif; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-style: normal; font-style: normal;
font-weight: normal; font-weight: normal;
line-height: 1.5; line-height: 1.5;
@ -4546,7 +4546,7 @@ button.close {
display: block; display: block;
max-width: 276px; max-width: 276px;
padding: 1px; padding: 1px;
font-family: Arial, sans-serif; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-style: normal; font-style: normal;
font-weight: normal; font-weight: normal;
line-height: 1.5; line-height: 1.5;
@ -4827,10 +4827,10 @@ button.close {
vertical-align: text-top !important; } vertical-align: text-top !important; }
.bg-primary { .bg-primary {
background-color: #7852B2 !important; } background-color: #007bff !important; }
a.bg-primary:focus, a.bg-primary:hover { a.bg-primary:focus, a.bg-primary:hover {
background-color: #604091 !important; } background-color: #0062cc !important; }
.bg-secondary { .bg-secondary {
background-color: #868e96 !important; } background-color: #868e96 !important; }
@ -4899,7 +4899,7 @@ a.bg-dark:focus, a.bg-dark:hover {
border-left: 0 !important; } border-left: 0 !important; }
.border-primary { .border-primary {
border-color: #7852B2 !important; } border-color: #007bff !important; }
.border-secondary { .border-secondary {
border-color: #868e96 !important; } border-color: #868e96 !important; }
@ -6620,10 +6620,10 @@ a.bg-dark:focus, a.bg-dark:hover {
color: #fff !important; } color: #fff !important; }
.text-primary { .text-primary {
color: #7852B2 !important; } color: #007bff !important; }
a.text-primary:focus, a.text-primary:hover { a.text-primary:focus, a.text-primary:hover {
color: #604091 !important; } color: #0062cc !important; }
.text-secondary { .text-secondary {
color: #868e96 !important; } color: #868e96 !important; }
@ -6761,7 +6761,7 @@ a.skip-link {
.navbar-dark .navbar-nav .dropdown-menu .nav-link.active, .navbar-dark .navbar-nav .dropdown-menu .nav-link:active { .navbar-dark .navbar-nav .dropdown-menu .nav-link.active, .navbar-dark .navbar-nav .dropdown-menu .nav-link:active {
color: #fff !important; color: #fff !important;
text-decoration: none; text-decoration: none;
background-color: #7852B2; } background-color: #007bff; }
.navbar-dark .navbar-nav .dropdown-menu .nav-link.disabled, .navbar-dark .navbar-nav .dropdown-menu .nav-link:disabled { .navbar-dark .navbar-nav .dropdown-menu .nav-link.disabled, .navbar-dark .navbar-nav .dropdown-menu .nav-link:disabled {
color: #868e96 !important; color: #868e96 !important;
background-color: transparent; } background-color: transparent; }

2
css/theme.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
css/theme.min.css.map
View File

File diff suppressed because one or more lines are too long

3
sass/theme.scss
View File

@ -1,5 +1,6 @@
@import "theme/theme_variables"; // <--------- Add your variables into this file. Also add variables to overwrite Bootstrap or UnderStrap variables here
@import "assets/bootstrap4";// <--------- Loads Bootstrap3 or Bootstrap4. Change from /bootstrap3 to /bootstrap4 Watch out! just for testing in the moment! @import "assets/bootstrap4";// <--------- Loads Bootstrap3 or Bootstrap4. Change from /bootstrap3 to /bootstrap4 Watch out! just for testing in the moment!
@import "theme/theme_variables"; // <--------- Add your variables into this file. Also add variables to overwrite Bootstrap or UnderStrap variables here
@import "understrap/understrap";// <-------- Loads the UnderStrap defaults. Just a few classes to incorporate BS in WP @import "understrap/understrap";// <-------- Loads the UnderStrap defaults. Just a few classes to incorporate BS in WP
//Optional files - If you dont use the corresponding scripts/fonts comment em out //Optional files - If you dont use the corresponding scripts/fonts comment em out

13
sass/theme/_theme_variables.scss
View File

@ -6,4 +6,15 @@
// Just add your color code here, compile the theme.scss file to change this color everywhere // Just add your color code here, compile the theme.scss file to change this color everywhere
$font-family-sans-serif:Arial, sans-serif; $font-family-sans-serif:Arial, sans-serif;
$blue: #7852B2; //#ff6d5a $understrap-primary: #7852B2; //#ff6d5a
$theme-colors: (
primary: $yellow,
secondary: $gray-600,
success: $green,
info: $cyan,
warning: $yellow,
danger: $red,
light: $gray-100,
dark: $gray-800
);