Style updates

-adjust font sizes
-fix ordered lists

Signed-off-by: Amy Manion <amy.manion@principlestudios.com>
This commit is contained in:
Amy Manion 2020-11-11 22:03:27 -05:00
parent 8859172025
commit ef11f97a75
4 changed files with 91 additions and 13 deletions

File diff suppressed because one or more lines are too long

View File

@ -42,12 +42,18 @@ body {
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
font-weight: 300; font-weight: 300;
} }
h2 { h1 {
font-size: 36px; font-size: 36px;
} }
h2 {
font-size: 28px;
}
h3 { h3 {
font-size: 22px; font-size: 22px;
} }
h4 {
font-size: 18px;
}
li { li {
list-style-type: none; list-style-type: none;
display: inline; display: inline;
@ -60,7 +66,7 @@ li {
p { p {
line-height: 1.5em; line-height: 1.5em;
font-weight: 300; font-weight: 300;
font-size: 16px; font-size: 14px;
color: $grey; color: $grey;
} }
a { a {
@ -101,7 +107,7 @@ button {
} }
} }
.strong { .strong {
font-weight: 600; font-family: $metropolis-medium;
} }
.bg-grey { .bg-grey {
background-color: $lightgrey; background-color: $lightgrey;

View File

@ -10,6 +10,7 @@
padding: 0px 0px 10px 0px; padding: 0px 0px 10px 0px;
p { p {
margin-bottom: 20px; margin-bottom: 20px;
font-size: 18px;
color: $white; color: $white;
} }
} }
@ -62,6 +63,7 @@
padding: 35px 20px; padding: 35px 20px;
p { p {
margin: 0px; margin: 0px;
font-size: 16px;
&.strong { &.strong {
color: $black; color: $black;
} }
@ -127,7 +129,8 @@
color: $black; color: $black;
} }
p.strong { p.strong {
color: $black; color: #1B3951;
font-size: 16px;
} }
} }
@ -136,6 +139,9 @@
h2, h3, p { h2, h3, p {
color: $white; color: $white;
} }
p {
font-size: 16px;
}
a { a {
color: $white; color: $white;
font-weight: 300; font-weight: 300;
@ -155,11 +161,10 @@
margin: 0px; margin: 0px;
&.name { &.name {
font-size: 16px; font-size: 16px;
font-weight: 600; font-family: $metropolis-medium;
} }
&.position { &.position {
font-size: 14px; font-size: 14px;
font-weight: 300;
} }
} }
} }
@ -208,6 +213,9 @@
&.landing { &.landing {
background-color: #fff; background-color: #fff;
margin-top: -90px; margin-top: -90px;
h3 a {
font-size: 16px;
}
.pagination { .pagination {
margin: 30px auto 50px auto; margin: 30px auto 50px auto;
ul { ul {
@ -249,6 +257,60 @@
color: $black; color: $black;
font-weight: 600; font-weight: 600;
} }
a {
font-size: 14px;
}
ul {
list-style-type: disc;
padding-left: 20px;
li {
list-style-type: unset;
display: list-item;
margin-bottom: 10px;
font-size: 14px;
color: $grey;
line-height: 1.6em;
list-style-image: url(/img/arrow.svg);
}
}
ol {
li {
list-style-type: decimal;
display: list-item;
margin-bottom: 10px;
font-size: 14px;
color: $grey;
}
}
code {
background-color: $white;
color: $grey;
border: 2px solid #EFEFEF;
padding: 2px 8px;
.c1 {
color: $blue;
font-style: italic;
}
.se {
color: #ff0000;
}
}
pre {
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
code {
display: block;
border: 15px solid #EFEFEF;
padding: 15px;
margin-bottom: 30px;
}
}
img {
max-width: 100%;
}
} }
} }
@ -257,6 +319,7 @@
color: $black; color: $black;
p { p {
color: $black; color: $black;
font-size: 16px;
} }
.left-side { .left-side {
width: 50%; width: 50%;
@ -356,6 +419,9 @@
.docs-content { .docs-content {
width: 75%; width: 75%;
float: right; float: right;
a {
font-size: 14px;
}
ul { ul {
list-style-type: disc; list-style-type: disc;
padding-left: 20px; padding-left: 20px;
@ -367,10 +433,16 @@
color: $grey; color: $grey;
line-height: 1.6em; line-height: 1.6em;
list-style-image: url(/img/arrow.svg); list-style-image: url(/img/arrow.svg);
a {
font-size: 14px;
} }
} }
ol {
li {
list-style-type: decimal;
display: list-item;
margin-bottom: 10px;
font-size: 14px;
color: $grey;
}
} }
code { code {
background-color: $white; background-color: $white;

View File

@ -3,19 +3,19 @@
<article> <article>
<div class="hero subpage"> <div class="hero subpage">
<div class="wrapper"> <div class="wrapper">
<h2>Pinniped Blog</h2> <h1>Pinniped Blog</h1>
</div> </div>
</div> </div>
<div class="wrapper blog"> <div class="wrapper blog">
<div class="blog-post"> <div class="blog-post">
<h3>{{ .Title }}</h3> <h2>{{ .Title }}</h2>
<p class="author"> <p class="author">
<a href="/tags/{{ .Params.author | urlize }}">{{ .Params.author }}</a> <a href="/tags/{{ .Params.author | urlize }}">{{ .Params.author }}</a>
</p> </p>
<p class="date">{{ dateFormat "Jan 2, 2006" .Date }}</p> <p class="date">{{ dateFormat "Jan 2, 2006" .Date }}</p>
{{ .Content }} {{ .Content }}
</div> </div>
<h3>Related Content</h3> <h2>Related Content</h2>
<div class="grid three"> <div class="grid three">
{{ $related := (where (.Site.RegularPages.Related .) "Type" "posts") | first 3 }} {{ $related := (where (.Site.RegularPages.Related .) "Type" "posts") | first 3 }}
{{ with $related }} {{ with $related }}