kazhnuz
/
bluesky-bootstrap-theme
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fix: make sure that automatic navbar color also apply to buttons

This commit is contained in:
Kazhnuz 2019-11-18 13:05:49 +01:00
parent d662adc844
commit 68d053cfdf
3 changed files with 143 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
scss/components/_navbar.scss
View File

@ -30,6 +30,15 @@
h1, h2, h3, h4, h5, h6 {
color: getTextColorFromBackground($background-color, $light-color, $dark-color);
}
.navbar-toggler {
color: transparentize(getTextColorFromBackground($background-color, $light-color, $dark-color), 0.75);
border-color: transparentize(getTextColorFromBackground($background-color, $light-color, $dark-color), 0.75);
.navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='" + transparentize(getTextColorFromBackground($background-color, $light-color, $dark-color), 0.75) + "' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
}
}
.navhead, .navbar {

133
style.css
View File

@ -1604,6 +1604,13 @@ a.list-group-item:hover {
.navhead-blue h1, .navhead-blue h2, .navhead-blue h3, .navhead-blue h4, .navhead-blue h5, .navhead-blue h6, .navbar-blue h1, .navbar-blue h2, .navbar-blue h3, .navbar-blue h4, .navbar-blue h5, .navbar-blue h6 {
color: #FFF;
}
.navhead-blue .navbar-toggler, .navbar-blue .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-blue .navbar-toggler .navbar-toggler-icon, .navbar-blue .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-violet, .navbar-violet {
background-color: #ce4dcd;
}
@ -1619,6 +1626,13 @@ a.list-group-item:hover {
.navhead-violet h1, .navhead-violet h2, .navhead-violet h3, .navhead-violet h4, .navhead-violet h5, .navhead-violet h6, .navbar-violet h1, .navbar-violet h2, .navbar-violet h3, .navbar-violet h4, .navbar-violet h5, .navbar-violet h6 {
color: #FFF;
}
.navhead-violet .navbar-toggler, .navbar-violet .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-violet .navbar-toggler .navbar-toggler-icon, .navbar-violet .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-purple, .navbar-purple {
background-color: #7951c0;
}
@ -1634,6 +1648,13 @@ a.list-group-item:hover {
.navhead-purple h1, .navhead-purple h2, .navhead-purple h3, .navhead-purple h4, .navhead-purple h5, .navhead-purple h6, .navbar-purple h1, .navbar-purple h2, .navbar-purple h3, .navbar-purple h4, .navbar-purple h5, .navbar-purple h6 {
color: #FFF;
}
.navhead-purple .navbar-toggler, .navbar-purple .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-purple .navbar-toggler .navbar-toggler-icon, .navbar-purple .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-red, .navbar-red {
background-color: #e33d22;
}
@ -1649,6 +1670,13 @@ a.list-group-item:hover {
.navhead-red h1, .navhead-red h2, .navhead-red h3, .navhead-red h4, .navhead-red h5, .navhead-red h6, .navbar-red h1, .navbar-red h2, .navbar-red h3, .navbar-red h4, .navbar-red h5, .navbar-red h6 {
color: #FFF;
}
.navhead-red .navbar-toggler, .navbar-red .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-red .navbar-toggler .navbar-toggler-icon, .navbar-red .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-orange, .navbar-orange {
background-color: #eb790a;
}
@ -1664,6 +1692,13 @@ a.list-group-item:hover {
.navhead-orange h1, .navhead-orange h2, .navhead-orange h3, .navhead-orange h4, .navhead-orange h5, .navhead-orange h6, .navbar-orange h1, .navbar-orange h2, .navbar-orange h3, .navbar-orange h4, .navbar-orange h5, .navbar-orange h6 {
color: #FFF;
}
.navhead-orange .navbar-toggler, .navbar-orange .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-orange .navbar-toggler .navbar-toggler-icon, .navbar-orange .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-green, .navbar-green {
background-color: #75b82d;
}
@ -1679,6 +1714,13 @@ a.list-group-item:hover {
.navhead-green h1, .navhead-green h2, .navhead-green h3, .navhead-green h4, .navhead-green h5, .navhead-green h6, .navbar-green h1, .navbar-green h2, .navbar-green h3, .navbar-green h4, .navbar-green h5, .navbar-green h6 {
color: #FFF;
}
.navhead-green .navbar-toggler, .navbar-green .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-green .navbar-toggler .navbar-toggler-icon, .navbar-green .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-skyblue, .navbar-skyblue {
background-color: #42a0f3;
}
@ -1694,6 +1736,13 @@ a.list-group-item:hover {
.navhead-skyblue h1, .navhead-skyblue h2, .navhead-skyblue h3, .navhead-skyblue h4, .navhead-skyblue h5, .navhead-skyblue h6, .navbar-skyblue h1, .navbar-skyblue h2, .navbar-skyblue h3, .navbar-skyblue h4, .navbar-skyblue h5, .navbar-skyblue h6 {
color: #FFF;
}
.navhead-skyblue .navbar-toggler, .navbar-skyblue .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-skyblue .navbar-toggler .navbar-toggler-icon, .navbar-skyblue .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-dark, .navbar-dark {
background-color: #2D2D2D;
}
@ -1709,6 +1758,13 @@ a.list-group-item:hover {
.navhead-dark h1, .navhead-dark h2, .navhead-dark h3, .navhead-dark h4, .navhead-dark h5, .navhead-dark h6, .navbar-dark h1, .navbar-dark h2, .navbar-dark h3, .navbar-dark h4, .navbar-dark h5, .navbar-dark h6 {
color: #FFF;
}
.navhead-dark .navbar-toggler, .navbar-dark .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-dark .navbar-toggler .navbar-toggler-icon, .navbar-dark .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-light, .navbar-light {
background-color: #eeeeec;
}
@ -1724,6 +1780,13 @@ a.list-group-item:hover {
.navhead-light h1, .navhead-light h2, .navhead-light h3, .navhead-light h4, .navhead-light h5, .navhead-light h6, .navbar-light h1, .navbar-light h2, .navbar-light h3, .navbar-light h4, .navbar-light h5, .navbar-light h6 {
color: #000;
}
.navhead-light .navbar-toggler, .navbar-light .navbar-toggler {
color: rgba(0, 0, 0, 0.25);
border-color: rgba(0, 0, 0, 0.25);
}
.navhead-light .navbar-toggler .navbar-toggler-icon, .navbar-light .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-turquoise, .navbar-turquoise {
background-color: #46bd9e;
}
@ -1739,6 +1802,13 @@ a.list-group-item:hover {
.navhead-turquoise h1, .navhead-turquoise h2, .navhead-turquoise h3, .navhead-turquoise h4, .navhead-turquoise h5, .navhead-turquoise h6, .navbar-turquoise h1, .navbar-turquoise h2, .navbar-turquoise h3, .navbar-turquoise h4, .navbar-turquoise h5, .navbar-turquoise h6 {
color: #FFF;
}
.navhead-turquoise .navbar-toggler, .navbar-turquoise .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-turquoise .navbar-toggler .navbar-toggler-icon, .navbar-turquoise .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-yellow, .navbar-yellow {
background-color: #f6d32d;
}
@ -1754,6 +1824,13 @@ a.list-group-item:hover {
.navhead-yellow h1, .navhead-yellow h2, .navhead-yellow h3, .navhead-yellow h4, .navhead-yellow h5, .navhead-yellow h6, .navbar-yellow h1, .navbar-yellow h2, .navbar-yellow h3, .navbar-yellow h4, .navbar-yellow h5, .navbar-yellow h6 {
color: #FFF;
}
.navhead-yellow .navbar-toggler, .navbar-yellow .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-yellow .navbar-toggler .navbar-toggler-icon, .navbar-yellow .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-brown, .navbar-brown {
background-color: #986a44;
}
@ -1769,6 +1846,13 @@ a.list-group-item:hover {
.navhead-brown h1, .navhead-brown h2, .navhead-brown h3, .navhead-brown h4, .navhead-brown h5, .navhead-brown h6, .navbar-brown h1, .navbar-brown h2, .navbar-brown h3, .navbar-brown h4, .navbar-brown h5, .navbar-brown h6 {
color: #FFF;
}
.navhead-brown .navbar-toggler, .navbar-brown .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-brown .navbar-toggler .navbar-toggler-icon, .navbar-brown .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-grey, .navbar-grey {
background-color: #77767b;
}
@ -1784,6 +1868,13 @@ a.list-group-item:hover {
.navhead-grey h1, .navhead-grey h2, .navhead-grey h3, .navhead-grey h4, .navhead-grey h5, .navhead-grey h6, .navbar-grey h1, .navbar-grey h2, .navbar-grey h3, .navbar-grey h4, .navbar-grey h5, .navbar-grey h6 {
color: #FFF;
}
.navhead-grey .navbar-toggler, .navbar-grey .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-grey .navbar-toggler .navbar-toggler-icon, .navbar-grey .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-primary, .navbar-primary {
background-color: #7951c0;
}
@ -1799,6 +1890,13 @@ a.list-group-item:hover {
.navhead-primary h1, .navhead-primary h2, .navhead-primary h3, .navhead-primary h4, .navhead-primary h5, .navhead-primary h6, .navbar-primary h1, .navbar-primary h2, .navbar-primary h3, .navbar-primary h4, .navbar-primary h5, .navbar-primary h6 {
color: #FFF;
}
.navhead-primary .navbar-toggler, .navbar-primary .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-primary .navbar-toggler .navbar-toggler-icon, .navbar-primary .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-secondary, .navbar-secondary {
background-color: #4e63c9;
}
@ -1814,6 +1912,13 @@ a.list-group-item:hover {
.navhead-secondary h1, .navhead-secondary h2, .navhead-secondary h3, .navhead-secondary h4, .navhead-secondary h5, .navhead-secondary h6, .navbar-secondary h1, .navbar-secondary h2, .navbar-secondary h3, .navbar-secondary h4, .navbar-secondary h5, .navbar-secondary h6 {
color: #FFF;
}
.navhead-secondary .navbar-toggler, .navbar-secondary .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-secondary .navbar-toggler .navbar-toggler-icon, .navbar-secondary .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-warning, .navbar-warning {
background-color: #eb790a;
}
@ -1829,6 +1934,13 @@ a.list-group-item:hover {
.navhead-warning h1, .navhead-warning h2, .navhead-warning h3, .navhead-warning h4, .navhead-warning h5, .navhead-warning h6, .navbar-warning h1, .navbar-warning h2, .navbar-warning h3, .navbar-warning h4, .navbar-warning h5, .navbar-warning h6 {
color: #FFF;
}
.navhead-warning .navbar-toggler, .navbar-warning .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-warning .navbar-toggler .navbar-toggler-icon, .navbar-warning .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-danger, .navbar-danger {
background-color: #e33d22;
}
@ -1844,6 +1956,13 @@ a.list-group-item:hover {
.navhead-danger h1, .navhead-danger h2, .navhead-danger h3, .navhead-danger h4, .navhead-danger h5, .navhead-danger h6, .navbar-danger h1, .navbar-danger h2, .navbar-danger h3, .navbar-danger h4, .navbar-danger h5, .navbar-danger h6 {
color: #FFF;
}
.navhead-danger .navbar-toggler, .navbar-danger .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-danger .navbar-toggler .navbar-toggler-icon, .navbar-danger .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-info, .navbar-info {
background-color: #42a0f3;
}
@ -1859,6 +1978,13 @@ a.list-group-item:hover {
.navhead-info h1, .navhead-info h2, .navhead-info h3, .navhead-info h4, .navhead-info h5, .navhead-info h6, .navbar-info h1, .navbar-info h2, .navbar-info h3, .navbar-info h4, .navbar-info h5, .navbar-info h6 {
color: #FFF;
}
.navhead-info .navbar-toggler, .navbar-info .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-info .navbar-toggler .navbar-toggler-icon, .navbar-info .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead-success, .navbar-success {
background-color: #75b82d;
}
@ -1874,6 +2000,13 @@ a.list-group-item:hover {
.navhead-success h1, .navhead-success h2, .navhead-success h3, .navhead-success h4, .navhead-success h5, .navhead-success h6, .navbar-success h1, .navbar-success h2, .navbar-success h3, .navbar-success h4, .navbar-success h5, .navbar-success h6 {
color: #FFF;
}
.navhead-success .navbar-toggler, .navbar-success .navbar-toggler {
color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25);
}
.navhead-success .navbar-toggler .navbar-toggler-icon, .navbar-success .navbar-toggler .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.25)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navhead .navbar, .navbar-transparent {
border: none;

2
style.css.map
View File

File diff suppressed because one or more lines are too long