achmizs/deus-gaming
1
0
Fork 1
Code Issues Pull Requests 1 Releases Wiki Activity

Compare commits

base: achmizs:e653e54c66974804d6d370de02fac34d4032bb97
Branches Tags
achmizs:master
achmizs:full-screen-logo-homepage
..
compare: achmizs:42633d9f8527591373c5bc1f11c5f8e21cc458f2
Branches Tags
achmizs:master
achmizs:full-screen-logo-homepage

2 Commits
e653e54c66 ... 42633d9f85

Author SHA1 Message Date
Said Achmiz
42633d9f85 Mobile layout for nav UI 2020-02-11 23:34:52 -05:00
Said Achmiz
8a129fd1f0 Minor layout refactoring 2020-02-11 20:15:34 -05:00
2 changed files with 41 additions and 7 deletions
Show Stats Expand all files Collapse all files

29
assets/css/main.css
View File

@ -87,6 +87,7 @@
/* Layout. */
--deus-body-padding: 6rem 1rem;
--deus-post-padding: 1.25rem;
--deus-mobile-post-heading-inset: 1.75rem;
}
}
@media only screen and (max-width: 520px) {
@ -220,6 +221,28 @@ main nav a:active {
transform: scale(0.9);
}
/*=-------------------=*/
/*= Nav items (text). =*/
/*=-------------------=*/
@media only screen and (max-width: 520px) {
main nav a.text {
font-size: 0.625em;
padding-top: 0.375em;
}
main nav a.text::before {
content: attr(data-deus-icon);
display: block;
font-family: Font Awesome;
margin: auto;
text-align: center;
font-size: 1.75em;
}
main nav a + a {
margin-left: 1.5em;
}
}
/*=-------=*/
/*= Logo. =*/
/*=-------=*/
@ -362,7 +385,7 @@ article + article {
}
@media only screen and (max-width: 960px) {
article + article {
margin-top: calc(1.75rem + var(--deus-post-spacing));
margin-top: calc(var(--deus-mobile-post-heading-inset) + var(--deus-post-spacing));
}
}
@ -435,14 +458,14 @@ article h1::after {
article h1 {
float: none;
margin:
calc(-1 * (var(--deus-post-padding) + 1.75rem))
calc(-1 * (var(--deus-post-padding) + var(--deus-mobile-post-heading-inset)))
calc(var(--deus-post-heading-spacing) + 4px)
2rem
calc(var(--deus-post-heading-spacing) + 4px);
text-align: center;
}
article h1::after {
top: calc(1.75rem - 1px);
top: calc(var(--deus-mobile-post-heading-inset) - 1px);
right: calc(-1 * (var(--deus-post-heading-spacing) + 2px));
box-shadow:
0 1px 0 0 var(--deus-body-background-color),

19
includes/main-nav.html
View File

@ -1,10 +1,21 @@
<nav id='main-nav'>
<a href='/deus/' class='logo'><img src='/deus/assets/images/deus-logo-only.png'></a>
<a href='/deus/pages/about'>About</a>
<a href='/deus/posts'>News</a>
<a
class='nav-item logo'
href='/deus/'
><img src='/deus/assets/images/deus-logo-only.png'></a>
<a
class='nav-item text icon-solid'
data-deus-icon='&#xf05a;'
href='/deus/pages/about'
>About</a>
<a
class='nav-item text icon-regular'
data-deus-icon='&#xf143;'
href='/deus/posts'
>News</a>
<div class='social-buttons'>
<a class='social-button share' href='#'>&#xf1e0;</a>
<a class='social-button facebook' href='#'>&#xf39e;</a>
<a class='social-button twitter' href='#'>&#xf099;</a>
</div>
</nav>
</nav>