Add redesign CSS

This commit is contained in:
Danila Fedorin 2020-05-04 03:23:55 -07:00
parent b270fa78da
commit ee4738b245
10 changed files with 49 additions and 26 deletions

View File

@ -40,7 +40,7 @@ $sidenote-highlight-border-width: .2rem;
} }
.sidenote-label { .sidenote-label {
border-bottom: .2rem solid $primary-color; border-bottom: .2rem dashed $primary-color;
} }
.sidenote-checkbox { .sidenote-checkbox {

View File

@ -14,10 +14,10 @@ h1, h2, h3, h4, h5, h6 {
margin-top: .5rem; margin-top: .5rem;
font-family: $font-heading; font-family: $font-heading;
font-weight: normal; font-weight: normal;
text-align: left; text-align: center;
a { a {
color: black; border-bottom: none;
&:hover { &:hover {
color: $primary-color; color: $primary-color;
@ -37,6 +37,10 @@ pre code {
background-color: $code-color; background-color: $code-color;
} }
div.highlight table pre {
margin: 0;
}
.container { .container {
position: relative; position: relative;
margin: auto; margin: auto;
@ -69,28 +73,33 @@ pre code {
} }
nav { nav {
background-color: $primary-color;
width: 100%; width: 100%;
margin: 1rem 0rem 1rem 0rem; margin: 0rem 0rem 1rem 0rem;
}
nav a { .container {
padding: .75em; display: flex;
text-decoration: none; justify-content: center;
color: white; flex-wrap: wrap;
display: inline-block;
transition: color .25s, background-color .25s;
&:hover {
color: $primary-color;
background-color: white;
} }
a {
padding: 0.25rem 0.75rem 0.25rem .75rem;
text-decoration: none;
color: black;
display: inline-block;
border-bottom: none;
transition: color .25s;
white-space: nowrap;
&:hover {
color: $primary-color;
}
}
} }
.post-subscript { .post-subscript {
color: #8f8f8f; color: #8f8f8f;
text-align: center;
} }
.post-content { .post-content {
@ -122,8 +131,9 @@ h6 {
} }
a { a {
color: $primary-color-dark; color: black;
text-decoration: none; text-decoration: none;
border-bottom: .2rem solid $primary-color;
} }
img { img {
@ -150,6 +160,18 @@ td {
padding: 0.5rem; padding: 0.5rem;
} }
hr.header-divider {
background-color: $primary-color;
height: 0.3rem;
border: none;
border-radius: 0.15rem;
}
ul.page-list a {
border-bottom: none;
display: inline-block;
}
.katex-html { .katex-html {
white-space: nowrap; white-space: nowrap;
} }

View File

@ -8,7 +8,7 @@ $code-color-dark: darken($code-color, 10%);
$border-color: #bfbfbf; $border-color: #bfbfbf;
$font-heading: "Lora", serif; $font-heading: "Lora", serif;
$font-body: "Raleway", serif; $font-body: "Noto Sans JP", serif;
$font-code: "Inconsolata", monospace; $font-code: "Inconsolata", monospace;
$standard-border: $standard-border-width solid $border-color; $standard-border: $standard-border-width solid $border-color;

View File

@ -3,6 +3,7 @@
{{- partial "head.html" . -}} {{- partial "head.html" . -}}
<body> <body>
{{- partial "header.html" . -}} {{- partial "header.html" . -}}
<div class="container"><hr class="header-divider"></div>
<main class="container"> <main class="container">
{{- block "main" . }}{{- end }} {{- block "main" . }}{{- end }}
</main> </main>

View File

@ -1,7 +1,7 @@
{{ define "main" }} {{ define "main" }}
<h2>{{ .Title }}</h2> <h2>{{ .Title }}</h2>
<ul> <ul class="page-list">
{{ range .Pages.ByDate.Reverse }} {{ range .Pages.ByDate.Reverse }}
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li> <li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }} {{ end }}

View File

@ -1,12 +1,12 @@
{{ define "main" }} {{ define "main" }}
<h2>{{ .Title }}</h2> <h2>{{ .Title }}</h2>
<div class="post-subscript"> <div class="post-subscript">
<p>Posted on {{ .Date.Format "January 2, 2006" }}.</p> <p>
<p>Tags:
{{ range .Params.tags }} {{ range .Params.tags }}
<a class="button" href="{{ $.Site.BaseURL }}/tags/{{ . | urlize }}">{{ . }}</a> <a class="button" href="{{ $.Site.BaseURL }}/tags/{{ . | urlize }}">{{ . }}</a>
{{ end }} {{ end }}
</p> </p>
<p>Posted on {{ .Date.Format "January 2, 2006" }}.</p>
</div> </div>
<div class="post-content"> <div class="post-content">

View File

@ -2,7 +2,7 @@
{{ .Content }} {{ .Content }}
Recent posts: Recent posts:
<ul> <ul class="page-list">
{{ range first 10 (where (where .Site.Pages.ByDate.Reverse "Section" "blog") ".Kind" "!=" "section") }} {{ range first 10 (where (where .Site.Pages.ByDate.Reverse "Section" "blog") ".Kind" "!=" "section") }}
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li> <li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }} {{ end }}

View File

@ -3,7 +3,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#1dc868" /> <meta name="theme-color" content="#1dc868" />
<link href="https://fonts.googleapis.com/css?family=Inconsolata|Lora|Raleway" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inconsolata&family=Noto+Sans+JP&family=Lora&display=swap" rel="stylesheet">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
{{ $style := resources.Get "scss/style.scss" | resources.ToCSS | resources.Minify }} {{ $style := resources.Get "scss/style.scss" | resources.ToCSS | resources.Minify }}
{{ $sidenotes := resources.Get "scss/sidenotes.scss" | resources.ToCSS | resources.Minify }} {{ $sidenotes := resources.Get "scss/sidenotes.scss" | resources.ToCSS | resources.Minify }}

View File

@ -1,7 +1,7 @@
{{ define "main" }} {{ define "main" }}
<h2>Tagged "{{ .Title }}"</h2> <h2>Tagged "{{ .Title }}"</h2>
<ul> <ul class="page-list">
{{ range .Pages.ByDate.Reverse }} {{ range .Pages.ByDate.Reverse }}
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li> <li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }} {{ end }}

View File

@ -2,7 +2,7 @@
<h2>{{ .Title }}</h2> <h2>{{ .Title }}</h2>
Below is a list of all the tags ever used on this site. Below is a list of all the tags ever used on this site.
<ul> <ul class="page-list">
{{ range sort .Pages "Title" }} {{ range sort .Pages "Title" }}
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li> <li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }} {{ end }}