1
0
mirror of https://github.com/danbee/danbarber.me.hugo.git synced 2025-03-04 08:59:18 +00:00

Bunch of CSS tweaks

This commit is contained in:
Daniel Barber 2019-10-13 16:49:19 -04:00
parent 2c155a34b3
commit c0df255656
Signed by: danbarber
GPG Key ID: 931D8112E0103DD8
9 changed files with 33 additions and 14 deletions

View File

@ -1,5 +1,12 @@
.post {
border-top: 1px dashed $border-color;
padding: 1.5em $pad-min;
img {
max-width: 100%;
}
& > * {
@include container
}
}

View File

@ -1,3 +1,3 @@
.site-header {
@include container;
padding: 0 $pad-min;
}

View File

@ -0,0 +1,3 @@
a {
color: $link-color;
}

View File

@ -4,6 +4,4 @@ html {
font-weight: 300;
font-size: calc(0.85vmin + 13px);
line-height: 1.4;
padding-left: $pad-min;
padding-right: $pad-min;
}

View File

@ -22,6 +22,7 @@
@import "elements/figure";
@import "elements/headings";
@import "elements/pre";
@import "elements/a";
// 5. Objects class-based selectors which define undecorated design patterns,
// for example media object known from OOCSS

View File

@ -5,7 +5,7 @@
</head>
<body>
{{ partial "header.html" . }}
<main class="container">
<main>
{{ block "main" . }}
{{ end }}
</main>

View File

@ -1,3 +1,5 @@
<header class="site-header" role="banner">
<h1>{{.Site.Title}}</h1>
<div class="container">
<h1>{{.Site.Title}}</h1>
</div>
</header>

View File

@ -3,9 +3,11 @@
{{ range .Pages }}
<article class="post">
<h3><a href="{{.Permalink}}">{{.Title}}</a></h3>
{{ if .Truncated }}
{{.Summary}}
<a href="{{.Permalink}}">Read more →</a>
<p class="post__read-more"><a href="{{.Permalink}}">Read on →</a></p>
{{ else }}
{{.Content}}
{{ end }}

View File

@ -315,9 +315,7 @@ html {
font-style: normal;
font-weight: 300;
font-size: calc(0.85vmin + 13px);
line-height: 1.4;
padding-left: 6.5%;
padding-right: 6.5%; }
line-height: 1.4; }
figure {
margin: 1em 0; }
@ -335,15 +333,23 @@ pre {
border-radius: 0.5rem;
padding: 1em; }
a {
color: #1863a1; }
.container {
margin-left: auto;
margin-right: auto;
max-width: 40rem; }
.site-header {
margin-left: auto;
margin-right: auto;
max-width: 40rem; }
padding: 0 6.5%; }
.post img {
max-width: 100%; }
.post {
border-top: 1px dashed #ccc;
padding: 1.5em 6.5%; }
.post img {
max-width: 100%; }
.post > * {
margin-left: auto;
margin-right: auto;
max-width: 40rem; }