peterkrzyzek/ghost_leaders_theme
1
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages Wiki Activity

canvas layout styling

Browse source
This commit is contained in:
David Darnes 2019-11-06 13:16:07 +07:00
commit 166c34c95c
5 changed files with 46 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

2
assets/css/components/global.css
View file

@ -37,6 +37,8 @@ ol,
li,
dl,
dd,
pre,
video,
figure,
figcaption,
blockquote {

43
assets/css/screen.css
View file

@ -27,7 +27,7 @@ production stylesheet in assets/built/screen.css using: gulp dev
/* Global */
.gh-container {
width: 100%;
max-width: 1100px;
max-width: 1200px;
margin: 0 auto;
}
@ -35,19 +35,21 @@ production stylesheet in assets/built/screen.css using: gulp dev
.gh-head {
padding: 20px 4vw;
color: #fff;
font-size: 1.5rem;
line-height: 1.3em;
background: var(--color-base);
}
.gh-head a {
color: #fff;
line-height: 1.2em;
text-decoration: none;
}
.gh-head .gh-container {
display: grid;
grid-gap: 30px;
grid-gap: 40px;
grid-template-columns: 1fr auto 1fr;
grid-auto-flow: row dense;
}
.gh-head-menu {
@ -56,17 +58,30 @@ production stylesheet in assets/built/screen.css using: gulp dev
}
.gh-head-menu .nav {
display: flex;
display: inline-flex;
flex-wrap: wrap;
align-items: center;
list-style: none;
}
.gh-head-menu .nav li {
margin: 0 10px 0 0;
margin: 0 1.5vw 0 0;
padding: 0;
}
.gh-head-menu .nav a {
display: inline-block;
padding: 5px 0;
}
.gh-head-menu .nav-current a {
box-shadow: 0 -1px 0 0 #fff inset;
}
.gh-head-brand {
grid-column-start: 2;
display: flex;
align-items: center;
max-width: 200px;
text-align: center;
word-break: break-all;
@ -74,6 +89,10 @@ production stylesheet in assets/built/screen.css using: gulp dev
.gh-head-logo {
display: block;
padding: 10px;
font-weight: 600;
font-size: 2.2rem;
line-height: 1.2em;
}
.gh-head-logo img {
@ -85,6 +104,20 @@ production stylesheet in assets/built/screen.css using: gulp dev
justify-content: flex-end;
align-items: center;
list-style: none;
text-align: right;
}
.gh-head-actions-list {
display: inline-flex;
flex-wrap: wrap;
justify-content: flex-end;
align-items: center;
}
.gh-head-actions-list a {
display: inline-block;
margin: 0 0 0 1.5vw;
padding: 5px 0;
}
/* Footer */