quarante-douze
/
qdouze-wordpress-theme
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

scss: style pagination

This commit is contained in:
Kazhnuz 2018-10-24 15:32:28 +02:00
parent 2ceb6873be
commit 5ffabe721a
3 changed files with 56 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
scss/_blog.scss
View File

@ -189,3 +189,12 @@
font-style: italic;
}
}
.navigation {
.pagination {
padding-top: 2em;
display:flex;
flex-direction: row;
justify-content: flex-end;
}
}

16
scss/_buttons.scss
View File

@ -96,6 +96,22 @@
outline: none;
}
.page-numbers {
@extend .btn;
@extend .btn-grey;
padding: 0.5em 1em 0.5em 1em;
margin-top: 0.1em;
color: #FFF;
&.dots {
border: none;
background-color: transparent!important;
box-shadow: none;
color: #444;
text-shadow: none;
}
}
/* 5.1 - Réseaux sociaux */
.share-buttons {

44
style.css
View File

@ -826,7 +826,7 @@ a.list-group-item:hover {
* This part of the (s)css handle the style of buttons-like and badges.
*
*/
.btn {
.btn, .page-numbers {
border: 1px solid rgba(0, 0, 0, 0.3);
border-radius: 0px 0px 0px 0px;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
@ -834,14 +834,14 @@ a.list-group-item:hover {
background-color: #eeeeec;
color: #111;
font-weight: 600; }
.btn:hover, .btn:active, .btn:focus, .btn:not(.disabled):not(:disabled):hover, .btn:not(.disabled):not(:disabled):active, .btn:not(.disabled):not(:disabled):focus {
.btn:hover, .page-numbers:hover, .btn:active, .page-numbers:active, .btn:focus, .page-numbers:focus, .btn:not(.disabled):not(:disabled):hover, .page-numbers:not(.disabled):not(:disabled):hover, .btn:not(.disabled):not(:disabled):active, .page-numbers:not(.disabled):not(:disabled):active, .btn:not(.disabled):not(:disabled):focus, .page-numbers:not(.disabled):not(:disabled):focus {
background-color: white;
color: #111; }
.btn:hover {
.btn:hover, .page-numbers:hover {
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
border: 1px solid rgba(0, 0, 0, 0.3);
text-decoration: none; }
.btn:active {
.btn:active, .page-numbers:active {
box-shadow: inset 0px 2px 0px rgba(0, 0, 0, 0.2);
border: 1px solid rgba(0, 0, 0, 0.3);
text-decoration: none; }
@ -930,10 +930,10 @@ a.list-group-item:hover {
background-color: #bd906b;
color: #FFF; }
.btn-grey {
.btn-grey, .page-numbers {
background-color: #77767b;
color: #FFF; }
.btn-grey:hover, .btn-grey:active, .btn-grey:focus, .btn-grey:not(.disabled):not(:disabled):hover, .btn-grey:not(.disabled):not(:disabled):active, .btn-grey:not(.disabled):not(:disabled):focus {
.btn-grey:hover, .page-numbers:hover, .btn-grey:active, .page-numbers:active, .btn-grey:focus, .page-numbers:focus, .btn-grey:not(.disabled):not(:disabled):hover, .page-numbers:not(.disabled):not(:disabled):hover, .btn-grey:not(.disabled):not(:disabled):active, .page-numbers:not(.disabled):not(:disabled):active, .btn-grey:not(.disabled):not(:disabled):focus, .page-numbers:not(.disabled):not(:disabled):focus {
background-color: #9e9da1;
color: #FFF; }
@ -982,28 +982,40 @@ a.list-group-item:hover {
.btn-group {
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0); }
.btn-group .btn {
.btn-group .btn, .btn-group .page-numbers {
box-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0.2);
border-radius: 0px 0px 0px 0px; }
.btn-group .btn:not(:first-child) {
.btn-group .btn:not(:first-child), .btn-group .page-numbers:not(:first-child) {
border-top-left-radius: 0;
border-bottom-left-radius: 0; }
.btn-group .btn:not(:last-child) {
.btn-group .btn:not(:last-child), .btn-group .page-numbers:not(:last-child) {
border-top-right-radius: 0;
border-bottom-right-radius: 0; }
.btn-group .btn:hover {
.btn-group .btn:hover, .btn-group .page-numbers:hover {
box-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0.2); }
.btn-group .btn:active, .btn:not(:disabled):not(.disabled):active, .btn:not(:disabled):not(.disabled).active,
.show > .btn.dropdown-toggle {
.btn-group .btn:active, .btn-group .page-numbers:active, .btn:not(:disabled):not(.disabled):active, .page-numbers:not(:disabled):not(.disabled):active, .btn:not(:disabled):not(.disabled).active, .page-numbers:not(:disabled):not(.disabled).active,
.show > .btn.dropdown-toggle,
.show > .dropdown-toggle.page-numbers {
box-shadow: inset 0px 2px 0px rgba(0, 0, 0, 0.2) !important;
border: 1px solid rgba(0, 0, 0, 0.3); }
.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 {
.btn:focus, .page-numbers: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 {
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0), inset 0px -2px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 2px rgba(0, 0, 0, 0.3);
outline: none; }
.page-numbers {
padding: 0.5em 1em 0.5em 1em;
margin-top: 0.1em;
color: #FFF; }
.page-numbers.dots {
border: none;
background-color: transparent !important;
box-shadow: none;
color: #444;
text-shadow: none; }
/* 5.1 - Réseaux sociaux */
.share-buttons {
margin: 15px; }
@ -1332,3 +1344,9 @@ a.list-group-item:hover {
justify-content: space-between; }
.list-article-content {
font-style: italic; }
.navigation .pagination {
padding-top: 2em;
display: flex;
flex-direction: row;
justify-content: flex-end; }