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

feature: add a custom container to replace wrapper-backed paddings

Browse source
This commit is contained in:
Kazhnuz 2019-11-18 12:53:26 +01:00
parent ee4a6cccaa
commit d662adc844
3 changed files with 39 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
scss/_global.scss
View file

@ -15,6 +15,20 @@ $wrapper-padding: $baselinerem * 3;
// Mixins
@mixin container {
max-width: $max-size;
margin: auto;
padding-left:$wrapper-padding/2;
padding-right:$wrapper-padding/2;
@include rwd(1300px) {
padding-left:$wrapper-padding;
padding-right:$wrapper-padding;
}
}
@mixin row() {
max-width: $max-size;
margin: auto;
@ -40,21 +54,17 @@ body {
flex-direction: column;
}
// the type of container we use for our theme system
.container-semifluid {
@include container();
}
/* 02.1 - Wrapper et page totale */
#wrapper {
flex: 1 0 auto;
background: $background-color url('img/background.png') center bottom repeat-x;
padding-left:$wrapper-padding/2;
padding-right:$wrapper-padding/2;
@include rwd(1300px) {
padding-left:$wrapper-padding;
padding-right:$wrapper-padding;
}
}
#global-area {
@ -84,27 +94,6 @@ header h1 {
margin-bottom: 1.5rem;
}
.navbar {
box-shadow: $large-shadow;
@include borders();
border-left: 0;
border-right: 0;
ul {
padding-bottom:0;
}
@include li-no-margin();
&.navbar-transparent {
border: none;
box-shadow: none;
background-color:transparent;
}
}
.dropdown-menu {
box-shadow: $narrow-shadow, $inset-shadow;
}
/* 02.2 - Main Area */
#page-main {

55
style.css
View file

@ -112,7 +112,7 @@
}
.bg-yellow {
background-color: #f6d32d !important;
color: #000;
color: #FFF;
}
.bg-brown {
background-color: #986a44 !important;
@ -474,20 +474,25 @@ body {
flex-direction: column;
}
/* 02.1 - Wrapper et page totale */
#wrapper {
flex: 1 0 auto;
background: #42a0f3 url("img/background.png") center bottom repeat-x;
.container-semifluid {
max-width: 1600px;
margin: auto;
padding-left: 2.25rem;
padding-right: 2.25rem;
}
@media (min-width: 1300pxpx) {
#wrapper {
.container-semifluid {
padding-left: 4.5rem;
padding-right: 4.5rem;
}
}
/* 02.1 - Wrapper et page totale */
#wrapper {
flex: 1 0 auto;
background: #42a0f3 url("img/background.png") center bottom repeat-x;
}
#global-area {
max-width: 1600px;
margin: auto;
@ -524,28 +529,6 @@ header h1 {
margin-bottom: 1.5rem;
}
.navbar {
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
border: 1px solid rgba(0, 0, 0, 0.3);
border-left: 0;
border-right: 0;
}
.navbar ul {
padding-bottom: 0;
}
.navbar li {
margin: 0;
}
.navbar.navbar-transparent {
border: none;
box-shadow: none;
background-color: transparent;
}
.dropdown-menu {
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
}
/* 02.2 - Main Area */
#page-main {
max-width: 100%;
@ -688,11 +671,11 @@ ul.social li a:hover {
}
.card-yellow > .card-header, .card-yellow > .card-footer {
background-color: #f6d32d !important;
color: #000;
color: #FFF;
}
.card-yellow.card-colored > .card-body {
background-color: #f6d32d !important;
color: #000;
color: #FFF;
}
.card-brown > .card-header, .card-brown > .card-footer {
background-color: #986a44 !important;
@ -1176,7 +1159,7 @@ a.list-group-item:hover {
}
.btn-yellow {
background-color: #f6d32d !important;
color: #000;
color: #FFF;
}
.btn-yellow:hover, .btn-yellow:active, .btn-yellow:focus, a:hover > .btn-yellow, a:active > .btn-yellow, a:focus > .btn-yellow, .btn-yellow:not(.disabled):not(:disabled):hover, .btn-yellow:not(.disabled):not(:disabled):active, .btn-yellow:not(.disabled):not(:disabled):focus, a:hover > .btn-yellow:not(.disabled):not(:disabled), a:active > .btn-yellow:not(.disabled):not(:disabled), a:focus > .btn-yellow:not(.disabled):not(:disabled) {
background-color: #f8dd5e !important;
@ -1349,7 +1332,7 @@ a.list-group-item:hover {
}
.badge-yellow {
background-color: #f6d32d !important;
color: #000;
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 !important;
@ -1760,16 +1743,16 @@ a.list-group-item:hover {
background-color: #f6d32d;
}
.navhead-yellow a, .navbar-yellow a {
color: rgba(0, 0, 0, 0.5);
color: rgba(255, 255, 255, 0.5);
}
.navhead-yellow a:hover, .navhead-yellow a:active, .navbar-yellow a:hover, .navbar-yellow a:active {
color: #000;
color: #FFF;
}
.navhead-yellow a.disabled, .navhead-yellow a.navlink.disabled, .navbar-yellow a.disabled, .navbar-yellow a.navlink.disabled {
color: rgba(0, 0, 0, 0.25);
color: rgba(255, 255, 255, 0.25);
}
.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: #000;
color: #FFF;
}
.navhead-brown, .navbar-brown {
background-color: #986a44;

2
style.css.map
View file

File diff suppressed because one or more lines are too long