rayelliott
/
hugo-coder-fork
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

style the list pages 

center the lists
This commit is contained in:
Ray Elliott 2020-02-18 20:34:13 +00:00
parent 9803754024
commit 56ec9a6391
1 changed files with 24 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
assets/scss/_content.scss
View File

@ -85,22 +85,39 @@
.list { .list {
ul { ul {
position: relative;
width: 100%;
margin: 3.2rem 0 3.2rem 0; margin: 3.2rem 0 3.2rem 0;
list-style: none; list-style: none;
padding: 0; padding: 0;
@media only screen and (max-width: 768px) {
text-align: center;
}
li { li {
font-size: 1.8rem; font-size: 1.8rem;
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
margin: 1.6rem 0 1.6rem 0; margin: 1.6rem 0 1.6rem 0;
} }
@media only screen and (min-width: 768px) {
display: flex;
margin-bottom: 0.8rem;
}
.date { .date {
display: inline-block; display: inline-block;
width: 20rem; width: 50%;
text-align: right; text-align: right;
margin-right: 3rem; padding-right: 1.5rem;
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
width: 100%;
text-align: center;
font-size: 0.9em;
display: block; display: block;
text-align: left; padding-right: 0;
}
@media only screen and (min-width: 768px) {
display: flex;
align-items: start;
justify-content: flex-end;
} }
} }
.title { .title {
@ -108,6 +125,10 @@
color: $fg-color; color: $fg-color;
font-family: $heading-font-family; font-family: $heading-font-family;
font-weight: $heading-font-weight--bold; font-weight: $heading-font-weight--bold;
@media only screen and (min-width: 768px) {
padding-left: 1.5rem;
max-width: 20ch;
}
&:hover, &:hover,
&:focus { &:focus {
color: $link-color; color: $link-color;