libretic/grav-theme-libretic
6
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Responsive media queries update

Browse source
This commit is contained in:
Karol Orzeł 2015-01-21 15:15:06 +01:00
parent e546a92ce9
commit 52c7b50652
4 changed files with 69 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
css-compiled/template.css
View file

@ -980,8 +980,23 @@ ul.pagination {
color: #fff; } color: #fff; }
.modular .footer hr { .modular .footer hr {
border-color: rgba(154, 152, 152, 0.5); } border-color: rgba(154, 152, 152, 0.5); }
@media only all and (max-width: 47.938em) {
.modular .footer .social-icons {
float: none;
clear: both;
width: 100%;
padding-top: 2rem; } }
@media only all and (min-width: 48em) and (max-width: 59.938em) {
.modular .footer .social-icons {
float: none;
clear: both;
width: 100%;
padding-top: 2rem; } }
.modular .footer .footer-items { .modular .footer .footer-items {
margin-top: 2rem; } margin-top: 2rem; }
@media only all and (max-width: 47.938em) {
.modular .footer .footer-items {
margin-top: 0; } }
@supports not (flex-wrap: wrap) { @supports not (flex-wrap: wrap) {
.modular .footer .footer-items { .modular .footer .footer-items {
overflow: hidden; } } overflow: hidden; } }
@ -1011,6 +1026,10 @@ ul.pagination {
clear: both; } clear: both; }
.modular .footer .footer-module strong, .modular .footer .footer-module label, .modular .footer .footer-module th { .modular .footer .footer-module strong, .modular .footer .footer-module label, .modular .footer .footer-module th {
color: #fff; } color: #fff; }
@media only all and (max-width: 47.938em) {
.modular .footer .footer-module {
width: 100% !important;
float: none; } }
.modular .footer .logo { .modular .footer .logo {
border-bottom: 0 none; border-bottom: 0 none;
color: #fff; } color: #fff; }
@ -1042,6 +1061,12 @@ ul.pagination {
float: left; float: left;
text-align: left; text-align: left;
text-transform: uppercase; } text-transform: uppercase; }
@media only all and (max-width: 47.938em) {
.modular .footer .footer-copyright {
width: 100%;
float: none;
text-align: left;
margin-bottom: 1rem; } }
.modular .footer .footer-menu { .modular .footer .footer-menu {
float: right; float: right;
display: inline-block; display: inline-block;
@ -1049,6 +1074,11 @@ ul.pagination {
text-align: right; text-align: right;
text-transform: uppercase; text-transform: uppercase;
font-family: "novecento_sans_widedemibold", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; } font-family: "novecento_sans_widedemibold", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; }
@media only all and (max-width: 47.938em) {
.modular .footer .footer-menu {
width: 100%;
float: none;
text-align: left; } }
.modular .footer .footer-menu ul { .modular .footer .footer-menu ul {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -1095,9 +1125,9 @@ ul.pagination {
bottom: 0; bottom: 0;
z-index: 0; } z-index: 0; }
.callout .notebook { .callout .notebook {
float: left; display: inline-block;
text-align: left; text-align: left;
width: 33.33%; min-width: 33%;
position: relative; position: relative;
z-index: 10; } z-index: 10; }
@media only all and (min-width: 60em) and (max-width: 74.938em) { @media only all and (min-width: 60em) and (max-width: 74.938em) {

2
css-compiled/template.css.map
View file

File diff suppressed because one or more lines are too long

34
scss/template/modular/_footer.scss
View file

@ -19,8 +19,27 @@
hr { hr {
border-color: transparentize($core-text, 0.5); border-color: transparentize($core-text, 0.5);
} }
@include breakpoint(mobile-only) {
.social-icons {
float: none;
clear: both;
width: 100%;
padding-top: 2rem;
}
}
@include breakpoint(tablet-range) {
.social-icons {
float: none;
clear: both;
width: 100%;
padding-top: 2rem;
}
}
.footer-items { .footer-items {
margin-top: 2rem; margin-top: 2rem;
@include breakpoint(mobile-only) {
margin-top: 0;
}
@supports not (flex-wrap: wrap) { @supports not (flex-wrap: wrap) {
overflow: hidden; overflow: hidden;
} }
@ -49,6 +68,10 @@
strong { strong {
color: $white; color: $white;
} }
@include breakpoint(mobile-only) {
width: 100% !important;
float: none;
}
} }
.logo { .logo {
border-bottom: 0 none; border-bottom: 0 none;
@ -80,6 +103,12 @@
float: left; float: left;
text-align: left; text-align: left;
text-transform: uppercase; text-transform: uppercase;
@include breakpoint(mobile-only) {
width: 100%;
float: none;
text-align: left;
margin-bottom: 1rem;
}
} }
.footer-menu { .footer-menu {
float: right; float: right;
@ -88,6 +117,11 @@
text-align: right; text-align: right;
text-transform: uppercase; text-transform: uppercase;
font-family: $font-family-header; font-family: $font-family-header;
@include breakpoint(mobile-only) {
width: 100%;
float: none;
text-align: left;
}
ul { ul {
margin: 0; margin: 0;
padding: 0; padding: 0;

4
scss/template/modular/_text.scss
View file

@ -29,9 +29,9 @@ $image-margin: 2rem;
// macbook // macbook
.notebook{ .notebook{
float: left; display: inline-block;
text-align: left; text-align: left;
width: 33.33%; min-width: 33%;
position: relative; position: relative;
z-index: 10; z-index: 10;