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

switch floats to flexboxes, header fixes

Browse Source
This commit is contained in:
Jake Jarvis
2019-10-18 11:14:07 -04:00
parent 79c8572fc4
commit 0398587d3c
6 changed files with 44 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -76,10 +76,10 @@ body#home {
}
footer {
height: 1.7em;
display: flex;
justify-content: space-between;
div {
float: left;
vertical-align: middle;
height: 100%;
@ -87,7 +87,7 @@ body#home {
width: 40%;
text-align: left;
font-size: 0.9em;
line-height: 1.8;
line-height: 2;
span {
margin-right: 4px;
@ -98,7 +98,7 @@ body#home {
width: 20%;
text-align: center;
font-size: 1.25em;
line-height: 1.5;
line-height: 1.4; // magic numbers don't judge
a {
display: inline-block;
@ -114,7 +114,7 @@ body#home {
width: 40%;
text-align: right;
font-size: 0.55em;
line-height: 3.2;
line-height: 3.35; // magic numbers don't judge
color: $color-light;
a {

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

@ -13,7 +13,7 @@ body#notes {
nav {
width: 100%;
padding: 6px 12px;
padding: 8px 0;
box-sizing: border-box;
display: flex;
align-items: center;
@ -23,6 +23,7 @@ body#notes {
display: flex;
align-items: center;
color: $color-medium;
padding: 15px;
img, svg {
height: 45px;
@ -30,7 +31,7 @@ body#notes {
}
span#name {
margin: 0 20px;
margin-left: 20px;
font-size: 1.4em;
font-weight: 500;
}
@ -63,6 +64,7 @@ body#notes {
font-size: 1.5em;
line-height: 1;
padding: 0;
margin-right: 15px;
li {
width: 60px;
@ -83,19 +85,18 @@ body#notes {
footer {
border-top: 1px solid $color-super-light;
height: 1.7em;
line-height: 1.7;
padding-top: 1.5em;
margin-top: 2em;
color: $color-light;
display: flex;
justify-content: space-between;
a {
color: inherit;
}
div {
float: left;
vertical-align: middle;
&#copyright,
&#poweredby {
@ -273,6 +274,8 @@ body#notes {
}
&#archive section.year {
font-size: 1.1em;
ul {
list-style-type: none;
padding-left: 0;
@ -280,6 +283,14 @@ body#notes {
}
li {
display: flex;
div.date {
color: $color-light;
width: 5.25em;
flex-shrink: 0;
}
&::after {
content: '';
display: block;
@ -299,20 +310,6 @@ body#notes {
font-size: 1.8em;
}
div {
font-size: 1.1em;
&.date {
float: left;
width: 5.25em;
color: $color-light;
}
&.title {
float: left;
width: calc(100% - 5.25em);
}
}
}
}
}

2
assets/sass/pages/responsive/_global.scss
View File

@ -5,7 +5,7 @@
body {
// Safari iOS menu bar reappers below 44px:
// https://www.eventbrite.com/engineering/mobile-safari-why/
padding-bottom: 50px !important;
padding-bottom: 45px !important;
// Allows content to fill the viewport and go beyond the bottom
height: 100%;
// Allows you to scroll below the viewport; default value is visible

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

@ -16,8 +16,6 @@ body#home {
}
footer div {
line-height: 1.7;
&#panda {
display: none;
}
@ -34,7 +32,7 @@ body#home {
&#info {
font-size: 0.7em;
line-height: 2;
line-height: 2.1; // magic numbers don't judge
span#copyright::after {
content: "\A";

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

@ -2,16 +2,19 @@
// Responsive Blog
body#notes {
padding: 10px 20px 30px 20px;
padding: 0 20px;
width: 100%;
max-width: 100%;
header {
nav {
padding: 5px 0;
a#logo {
padding: 10px;
img, svg {
height: 55px;
height: 60px;
width: auto;
}
@ -20,8 +23,18 @@ body#notes {
}
}
ul li {
width: 50px;
ul {
font-size: 1.75em;
margin-right: 10px;
li {
width: 55px;
// hide home emoji on mobile -- logo probably suffices?
// &:first-child {
// display: none;
// }
}
}
}
}
@ -45,7 +58,7 @@ body#notes {
}
}
main#archive section.year div {
main#archive section.year {
font-size: 1em;
}