jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-03 14:46:37 -04:00
Code Issues Activity

a real header/navbar on non-home pages, finally

Browse Source
This commit is contained in:
Jake Jarvis
2019-10-17 10:20:53 -04:00
parent 3db94d1cbe
commit 488d5c7661
6 changed files with 98 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
assets/sass/abstracts/_variables.scss
View File

@ -3,6 +3,7 @@
// Global Colors
$color-background: #ffffff;
$color-text: #222222;
$color-medium: #444444;
$color-light: #666666;
$color-medium-light: #757575;
$color-super-light: #dddddd;

4
assets/sass/pages/_home.scss
View File

@ -88,6 +88,10 @@ body#home {
text-align: left;
font-size: 0.9em;
line-height: 1.8;
span {
margin-right: 4px;
}
}
&#panda {

70
assets/sass/pages/_notes.scss
View File

@ -5,43 +5,78 @@ body#notes {
line-height: 1.5;
font-weight: 400;
max-width: 1010px;
padding: 35px 50px;
padding: 10px 50px 35px 50px;
header {
margin-bottom: 1.75em;
border-bottom: 1px solid $color-super-light;
margin-bottom: 25px;
a {
&#more {
font-size: 1.25em;
}
nav {
width: 100%;
padding: 10px;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
&#logo {
img,
svg {
height: 150px;
width: 100px;
margin: 1.5em auto;
display: block;
a#logo {
display: flex;
align-items: center;
color: $color-medium;
img, svg {
height: 45px;
width: auto;
}
span#name {
margin: 0 20px;
font-size: 1.4em;
font-weight: 500;
}
&:hover {
color: $color-links;
$logo-original1: #6fbc4e;
$logo-original2: #ffb900;
$logo-original3: #009cdf;
svg {
g#area1 {
g#color1 {
fill: $logo-original2;
}
g#area2 {
g#color2 {
fill: $logo-original3;
}
g#area3 {
g#color3 {
fill: $logo-original1;
}
}
}
}
ul {
list-style: none;
display: flex;
align-items: center;
font-size: 1.5em;
line-height: 1;
li {
width: 60px;
text-align: right;
a {
display: inline-block;
transition: transform 0.15s ease-in-out;
&:hover {
transform: scale(1.4);
}
}
}
}
}
}
@ -104,8 +139,7 @@ body#notes {
text-align: center;
h1 {
margin-top: 0;
margin-bottom: 0.3em;
margin: 0.3em 0;
font-size: 2em;
line-height: 1.4;

20
assets/sass/pages/responsive/_notes.scss
View File

@ -2,17 +2,25 @@
// Responsive Blog
body#notes {
padding: 20px;
padding: 10px 20px 30px 20px;
width: 100%;
max-width: 100%;
header {
margin-bottom: 1.3em;
a#logo {
img,
svg {
height: 75px;
nav {
a#logo {
img, svg {
height: 55px;
width: auto;
}
span#name {
display: none;
}
}
ul li {
width: 50px;
}
}