Improve wordmark colours, improve spacing in blog
This commit is contained in:
parent
75e8be7ea4
commit
1c14a0e3ea
1 changed files with 33 additions and 6 deletions
|
@ -4,8 +4,8 @@ body {
|
||||||
background: #fff5f0;
|
background: #fff5f0;
|
||||||
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 2vmin;
|
padding: 0;
|
||||||
padding-bottom: 0;
|
padding-top: 2vmin;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
@ -35,9 +35,11 @@ body {
|
||||||
}
|
}
|
||||||
header {
|
header {
|
||||||
grid-area: header;
|
grid-area: header;
|
||||||
|
padding: 0 2vmin;
|
||||||
}
|
}
|
||||||
main {
|
main {
|
||||||
grid-area: main;
|
grid-area: main;
|
||||||
|
padding: 0 2vmin;
|
||||||
}
|
}
|
||||||
.blog main {
|
.blog main {
|
||||||
justify-self: center;
|
justify-self: center;
|
||||||
|
@ -49,6 +51,7 @@ main {
|
||||||
footer {
|
footer {
|
||||||
grid-area: footer;
|
grid-area: footer;
|
||||||
align-self: end;
|
align-self: end;
|
||||||
|
margin-top: 2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width:900px) or ((min-aspect-ratio:1/1) and (min-width:300px)) {
|
@media (min-width:900px) or ((min-aspect-ratio:1/1) and (min-width:300px)) {
|
||||||
|
@ -60,6 +63,15 @@ footer {
|
||||||
"social main"
|
"social main"
|
||||||
"footer footer";
|
"footer footer";
|
||||||
gap: 1em 3em;
|
gap: 1em 3em;
|
||||||
|
|
||||||
|
padding: 2vmin 2vmin 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
main {
|
||||||
|
padding: 0 2vmin;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -71,6 +83,13 @@ footer {
|
||||||
font-size: 150%;
|
font-size: 150%;
|
||||||
margin-left: 4em;
|
margin-left: 4em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
main {
|
||||||
|
padding: 0 1em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width:1500px) {
|
@media (min-width:1500px) {
|
||||||
|
@ -124,17 +143,17 @@ footer {
|
||||||
|
|
||||||
a:hover .wordmark span:first-child,
|
a:hover .wordmark span:first-child,
|
||||||
a.wordmark:hover span:first-child {
|
a.wordmark:hover span:first-child {
|
||||||
color: #a67b96;
|
color: #6f164e;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover .wordmark span:last-child,
|
a:hover .wordmark span:last-child,
|
||||||
a.wordmark:hover span:last-child {
|
a.wordmark:hover span:last-child {
|
||||||
color: #c28b88;
|
color: #8c4643;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover .wordmark span:last-child:before,
|
a:hover .wordmark span:last-child:before,
|
||||||
a.wordmark:hover span:last-child:before {
|
a.wordmark:hover span:last-child:before {
|
||||||
border-bottom-color: #e0c3d9;
|
border-bottom-color: #62435a;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -223,13 +242,21 @@ body.blog {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
main > h1:first-child {
|
||||||
|
margin-top: 0.3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.codehilite {
|
.codehilite {
|
||||||
background-color: #111;
|
background-color: #111;
|
||||||
color: #eee;
|
color: #eee;
|
||||||
padding: 0.5em;
|
padding: 0.5em 1em;
|
||||||
|
margin: 0 -1em;
|
||||||
}
|
}
|
||||||
.codehilite pre {
|
.codehilite pre {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
font-size: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue