style.css: reorganize stylesheet

This commit is contained in:
Kazhnuz 2018-06-08 00:26:32 +02:00
parent f919b37072
commit 02546118c2
2 changed files with 88 additions and 86 deletions

2
NEWS
View File

@ -10,6 +10,8 @@
- Some style fixes - Some style fixes
- Reorganized stylesheet
### BlueSky 2.0 ### BlueSky 2.0
- Remade the style entirely - Remade the style entirely

View File

@ -1,3 +1,5 @@
/* ------------------ GLOBAL STYLE ------------------- */
@font-face { @font-face {
font-family: 'Comic Neue Angular'; font-family: 'Comic Neue Angular';
src: url('../fonts/ComicNeue-Angular-Bold.eot'); src: url('../fonts/ComicNeue-Angular-Bold.eot');
@ -20,13 +22,32 @@
} }
body { body {
font-size:14px; font-size:14px;
} }
#wrapper { #wrapper {
background: #64b5f6 url('../img/background.png') center bottom repeat-x; background: #64b5f6 url('../img/background.png') center bottom repeat-x;
} }
.no-pills {
list-style:none;
}
.align-center {
text-align:center;
}
.align-left {
text-align:left;
}
.align-right {
text-align:right;
}
/* ------------------ HEADERS ------------------- */
header h1 { header h1 {
border-style:none !important; border-style:none !important;
color:#FFF; color:#FFF;
@ -38,43 +59,65 @@ header h1 {
padding-bottom:0px; padding-bottom:0px;
} }
footer { .navbar {
margin-top:40px; border-radius:0px;
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3);
} }
.navbar .container .navbar-brand { .navbar .container .navbar-brand {
margin-left: 0px; margin-left: 0px;
} }
.navbar-brand img { .navbar-brand img {
display:inline; display:inline;
} }
@media screen and (max-width:1199px) {
.reseaux-sociaux {
margin-top:44px
}
#logo { /* ------------------ FOOTER ------------------- */
max-width:100%;
height:auto;
}
footer {
margin-top:40px;
} }
@media screen and (max-width:991px) { .copyright {
.reseaux-sociaux { text-align:center;
margin-top:20px; padding-bottom:10px;
margin-bottom:20px;
}
#logo {
max-width:548px;
height:auto;
}
} }
/* ------------------ PANELS ------------------- */
.panel {
margin-bottom: 20px;
background-color: #FFF;
border-radius: 3px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.3);
border-color: rgba(0,0,0,0.15);
border-style: solid;
border-width: 0px;
}
.panel-heading {
border-top-left-radius:3px;
border-top-right-radius:3px;
border-width:0px;
}
.panel-noheader {
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
.panel-title {
color:#FFF;
text-align:center;
text-shadow: 0px -1px 0px rgba(0,0,0,0.3);
}
/* meta */
.article-meta .media-left .media-object { .article-meta .media-left .media-object {
height: 64px; height: 64px;
width: 64px; width: 64px;
@ -100,42 +143,7 @@ display:inline;
font-style:italic; font-style:italic;
} }
.partager { /* comments */
margin:15px;
}
.panel {
margin-bottom: 20px;
background-color: #FFF;
border-radius: 3px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.3);
border-color: rgba(0,0,0,0.15);
border-style: solid;
border-width: 0px;
}
.panel-noheader {
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
.btn {
border-style:none;
border-width:0px;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
text-shadow: 0px -1px 0px rgba(0,0,0,0.3);
}
.reagir {
text-align:right;
}
.copyright {
text-align:center;
padding-bottom:10px;
}
.titre-commentaires { .titre-commentaires {
color:white; color:white;
@ -143,12 +151,9 @@ text-align:right;
font-size:2.2em; font-size:2.2em;
text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.4); text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.4);
padding-bottom:15px; padding-bottom:15px;
} }
.no-pills { /* lists */
list-style:none;
}
.list-group-item { .list-group-item {
border-style:none; border-style:none;
@ -164,16 +169,22 @@ a.list-group-item:hover {
background-color:rgba(0,0,0,0.1); background-color:rgba(0,0,0,0.1);
} }
.panel-heading {
border-top-left-radius:3px;
border-top-right-radius:3px;
border-width:0px;
}
/* ------------------ BUTTONS ------------------- */
.btn {
border-style:none;
border-width:0px;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
text-shadow: 0px -1px 0px rgba(0,0,0,0.3);
}
.btn:active { .btn:active {
box-shadow: inset 0px 2px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 0px 2px 0px rgba(0, 0, 0, 0.2);
} }
/* ------------------ COULEURS ------------------- */
.panel-primary > .panel-heading, .btn-primary { .panel-primary > .panel-heading, .btn-primary {
background-color:#3f51b5; background-color:#3f51b5;
} }
@ -244,29 +255,18 @@ a.list-group-item:hover {
color:#FFF; color:#FFF;
} }
.navbar { /* ------------------ BREADCRUMB ------------------- */
border-radius:0px;
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3);
}
.breadcrumb { .breadcrumb {
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3); box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3);
} }
.panel-title { /* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */
color:#FFF;
text-align:center; .partager {
text-shadow: 0px -1px 0px rgba(0,0,0,0.3); margin:15px;
} }
.align-center { .reagir {
text-align:center; text-align:right;
}
.align-left {
text-align:left;
}
.align-right {
text-align:right;
} }