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

changed mobile layout

Browse source
This commit is contained in:
Maggie 2021-08-26 16:42:45 +02:00
parent fe58c90821
commit d7147a0bf3
2 changed files with 31 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
skatepark/assets/theme.css
View file

@ -574,29 +574,37 @@ header.wp-block-template-part .site-brand {
margin-top: calc( 0.5 * var(--wp--custom--margin--vertical));
display: grid;
grid-column-gap: var(--wp--custom--margin--horizontal);
grid-template-areas: "logo title" "logo tagline";
grid-template-columns: auto 1fr;
}
@media (max-width: 599px) {
header.wp-block-template-part .site-brand {
grid-template-areas: "logo" "title" "tagline";
}
}
header.wp-block-template-part .site-brand .wp-block-site-logo {
grid-column-start: 1;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 3;
grid-area: logo;
margin: 0;
max-width: 120px;
align-self: center;
justify-self: flex-end;
}
@media (max-width: 599px) {
header.wp-block-template-part .site-brand .wp-block-site-logo {
margin-bottom: calc( 0.5 * var(--wp--custom--margin--vertical));
}
}
header.wp-block-template-part .site-brand .wp-block-site-title {
grid-row-start: 1;
grid-row-end: 2;
grid-area: title;
margin: 0 0 0.5em;
}
header.wp-block-template-part .site-brand .wp-block-site-tagline {
grid-row-start: 2;
grid-row-end: 3;
grid-area: tagline;
margin: 0;
}

23
skatepark/sass/templates/_header.scss
View file

@ -27,25 +27,32 @@ header.wp-block-template-part {
margin-top: calc( 0.5 * var(--wp--custom--margin--vertical) );
display: grid;
grid-column-gap: var(--wp--custom--margin--horizontal);
grid-template-areas:
"logo title"
"logo tagline";
grid-template-columns: auto 1fr;
@include break-small-only(){
grid-template-areas:
"logo"
"title"
"tagline";
}
.wp-block-site-logo {
grid-column-start: 1;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 3;
grid-area: logo;
margin: 0;
max-width: 120px;
align-self: center;
justify-self: flex-end;
@include break-small-only(){
margin-bottom: calc( 0.5 * var(--wp--custom--margin--vertical) );
}
}
.wp-block-site-title {
grid-row-start: 1;
grid-row-end: 2;
grid-area: title;
margin: 0 0 0.5em;
}
.wp-block-site-tagline {
grid-row-start: 2;
grid-row-end: 3;
grid-area: tagline;
margin: 0;
}
}