0ct0pu5/themes-wordpress
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Alves: Fix header padding on mobile screens

Browse source
This commit is contained in:
Allan Cole 2019-08-27 10:52:23 -04:00
parent 263d5b3d63
commit 50f3611b0b
3 changed files with 49 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
alves/sass/_extra-child-theme.scss
View file

@ -149,15 +149,16 @@ blockquote p {
* Wide Header & Footer
*/
#masthead {
position: relative;
@extend %responsive-alignwide;
}
#masthead {
padding-left: 0;
padding-right: 0;
padding-left: 16px;
padding-right: 16px;
padding-bottom: $spacing_vertical;
position: relative;
@extend %responsive-alignwide-nested;
@include media(desktop) {
padding-left: 0;
padding-right: 0;
}
}
/**

36
alves/style-rtl.css
View file

@ -3203,7 +3203,7 @@ img#wpstats {
}
}
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: 100%;
max-width: 100%;
margin-right: auto;
@ -3211,41 +3211,41 @@ img#wpstats {
}
@media only screen and (min-width: 560px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 560px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
@media only screen and (min-width: 640px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 640px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
@media only screen and (min-width: 782px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 782px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
@media only screen and (min-width: 1024px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 782px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
@media only screen and (min-width: 1280px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 782px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(100% + 256px);
max-width: 100%;
margin-right: auto;
@ -3253,35 +3253,35 @@ img#wpstats {
}
@media only screen and (min-width: 560px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 560px - 32px) + 256px);
max-width: 100%;
}
}
@media only screen and (min-width: 640px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 640px - 32px) + 256px);
max-width: 100%;
}
}
@media only screen and (min-width: 782px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 782px - 32px) + 256px);
max-width: 100%;
}
}
@media only screen and (min-width: 1024px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 782px - 32px) + 256px);
max-width: 100%;
}
}
@media only screen and (min-width: 1280px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 782px - 32px) + 256px);
max-width: 100%;
}
@ -3520,13 +3520,17 @@ blockquote p {
* Wide Header & Footer
*/
#masthead {
padding-right: 16px;
padding-left: 16px;
padding-bottom: 32px;
position: relative;
}
#masthead {
padding-right: 0;
padding-left: 0;
padding-bottom: 32px;
@media only screen and (min-width: 1024px) {
#masthead {
padding-right: 0;
padding-left: 0;
}
}
/**

36
alves/style.css
View file

@ -3208,7 +3208,7 @@ img#wpstats {
}
}
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: 100%;
max-width: 100%;
margin-left: auto;
@ -3216,41 +3216,41 @@ img#wpstats {
}
@media only screen and (min-width: 560px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 560px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
@media only screen and (min-width: 640px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 640px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
@media only screen and (min-width: 782px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 782px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
@media only screen and (min-width: 1024px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 782px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
@media only screen and (min-width: 1280px) {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead {
.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
width: calc(calc( 782px - 32px) + 256px);
max-width: calc(100% - 32px);
}
}
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(100% + 256px);
max-width: 100%;
margin-left: auto;
@ -3258,35 +3258,35 @@ img#wpstats {
}
@media only screen and (min-width: 560px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 560px - 32px) + 256px);
max-width: 100%;
}
}
@media only screen and (min-width: 640px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 640px - 32px) + 256px);
max-width: 100%;
}
}
@media only screen and (min-width: 782px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 782px - 32px) + 256px);
max-width: 100%;
}
}
@media only screen and (min-width: 1024px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 782px - 32px) + 256px);
max-width: 100%;
}
}
@media only screen and (min-width: 1280px) {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
.entry-content > .alignwide [class*="inner-container"] > .alignwide, .entry-content > .alignfull [class*="inner-container"] > .alignwide, #masthead, .site-footer #footer-widgets, .site-footer #footer-info-wrapper {
width: calc(calc( 782px - 32px) + 256px);
max-width: 100%;
}
@ -3537,13 +3537,17 @@ blockquote p {
* Wide Header & Footer
*/
#masthead {
padding-left: 16px;
padding-right: 16px;
padding-bottom: 32px;
position: relative;
}
#masthead {
padding-left: 0;
padding-right: 0;
padding-bottom: 32px;
@media only screen and (min-width: 1024px) {
#masthead {
padding-left: 0;
padding-right: 0;
}
}
/**