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

style: use shadow variables for box-shadow

Browse source
This commit is contained in:
Kazhnuz 2018-10-14 16:50:55 +02:00
parent a3fcd4d98d
commit 04e5ea01f2
2 changed files with 23 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
css/style.css
View file

@ -31,13 +31,13 @@ header h1 {
text-align: center; }
.navbar {
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3);
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3);
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: rgba(0, 0, 0, 0.3); }
.dropdown-menu {
box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2), 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 {
@ -69,12 +69,12 @@ a.social-link:hover {
/* ------------------ CARDS ------------------- */
.card {
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3);
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3);
border-width: 0px;
margin-bottom: 1.2em; }
.card-shadow {
box-shadow: 0px 2px 12px 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); }
/* header and titles */
.card-header {
@ -194,7 +194,7 @@ a.list-group-item:hover {
border-width: 1px;
border-color: rgba(0, 0, 0, 0.3);
color: rgba(0, 0, 0, 0.7);
box-shadow: 0px 2px 6px 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);
@ -202,7 +202,7 @@ a.list-group-item:hover {
/* ------------------ BREADCRUMB ------------------- */
.breadcrumb {
box-shadow: 0px 2px 12px 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);
border-color: rgba(0, 0, 0, 0.3);
border-width: 1px;
background-color: #eeeeec;
@ -237,7 +237,7 @@ a.list-group-item:hover {
.card-preview {
width: 100%;
margin: auto;
box-shadow: 0px 2px 12px 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; }

32
scss/style.scss
View file

@ -41,14 +41,14 @@ header h1 {
}
.navbar {
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3);
box-shadow: $large-shadow;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: rgba(0,0,0,0.3)
}
.dropdown-menu {
box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
box-shadow: $narrow-shadow, $inset-shadow;
}
@ -91,13 +91,13 @@ a.social-link:hover {
/* ------------------ CARDS ------------------- */
.card {
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3);
box-shadow: $large-shadow;
border-width:0px;
margin-bottom:1.2em;
}
.card-shadow {
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
box-shadow: $large-shadow, $inset-shadow;
}
/* header and titles */
@ -111,7 +111,7 @@ a.social-link:hover {
border-width:1px;
border-color:rgba(0,0,0,0.3);
font-size:1.1em;
box-shadow: inset 0px 2px 0px rgba(255, 255, 255, 0.1);
box-shadow: $inset-relief;
text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
font-weight:600;
}
@ -182,13 +182,13 @@ a.list-group-item:hover {
border-style:solid;
border-width:1px;
border-color:rgba(0, 0, 0, 0.3);
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
box-shadow: $large-shadow, $inset-shadow;
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);
box-shadow: $narrow-shadow, $inset-shadow;
top:1px;
border-style:solid;
border-width:1px;
@ -197,7 +197,7 @@ a.list-group-item:hover {
.btn:active {
position:relative;
box-shadow: inset 0px 2px 0px rgba(0, 0, 0, 0.2);
box-shadow: $inset-shadow-inverted;
top:2px;
border-style:solid;
border-width:1px;
@ -205,23 +205,23 @@ a.list-group-item:hover {
}
.btn-group {
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3);
box-shadow: $large-shadow;
}
.btn-group .btn {
box-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0.2);
box-shadow: $inset-shadow;
}
.btn-group .btn:hover {
position:relative;
top:1px;
box-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0.2);
box-shadow: $inset-shadow;
}
.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;
box-shadow: $inset-shadow-inverted!important;
top:2px;
border-style:solid;
border-width:1px;
@ -230,7 +230,7 @@ a.list-group-item:hover {
.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);
box-shadow: $narrow-shadow, $inset-shadow, 0px 0px 0px 2px rgba(0, 0, 0, 0.3);
top:1px;
outline: none;
}
@ -242,7 +242,7 @@ a.list-group-item:hover {
border-width:1px;
border-color:rgba(0, 0, 0, 0.3);
color:rgba(0, 0, 0, 0.7);
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3)
box-shadow: $large-shadow;
}
.alert a, .alert-link {
@ -253,7 +253,7 @@ a.list-group-item:hover {
/* ------------------ BREADCRUMB ------------------- */
.breadcrumb {
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
box-shadow: $large-shadow, $inset-shadow;
border-color:rgba(0,0,0,0.3);
border-width:1px;
background-color:#eeeeec;
@ -308,7 +308,7 @@ a.list-group-item:hover {
width:100%;
margin:auto;
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
box-shadow: $large-shadow, $inset-shadow;
}
.preview-link:hover {