Compare commits
No commits in common. "cbcc11f8d96d0688df7e296cf9ef3b92c95689bc" and "b57e76e2bc7000049ca6767f658e0f77cf2f0a49" have entirely different histories.
cbcc11f8d9
...
b57e76e2bc
23 changed files with 797 additions and 637 deletions
|
|
@ -1,4 +1,4 @@
|
|||
Copyright for portions of Wantsum are held by Alexandre Vicenzias, 2020 part of the Soho theme. All other copyright Wantsum are held by Ben Charlton, 2024
|
||||
Copyright 2020 Alexandre Vicenzi
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
||||
|
||||
|
|
|
|||
|
|
@ -1,20 +1,6 @@
|
|||
---
|
||||
title: "{{ replace .Name "-" " " | title }}"
|
||||
date: {{ .Date }}
|
||||
draft: true
|
||||
#featured_image: "sample.jpg"
|
||||
#crop_options: center
|
||||
tags: []
|
||||
categories: []
|
||||
|
||||
---
|
||||
This is a content
|
||||
|
||||
<!--more-->
|
||||
# more content
|
||||
|
||||
## youtube
|
||||
{{< youtube k3suoT_gi78 >}}
|
||||
|
||||
###
|
||||
{{< imgproc thing >}}caption for thing{{< /imgproc >}}
|
||||
+++
|
||||
description = ""
|
||||
tags = ["Development", "golang"]
|
||||
categories = ["Development", "GoLang"]
|
||||
draft = false
|
||||
+++
|
||||
|
|
|
|||
11
docker-compose.yml
Normal file
11
docker-compose.yml
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
version: '3'
|
||||
services:
|
||||
app:
|
||||
build: .
|
||||
working_dir: /blog
|
||||
command: hugo server --logLevel info --bind "0.0.0.0" --port 1313 --watch -t soho
|
||||
ports:
|
||||
- "1313:1313"
|
||||
volumes:
|
||||
- ./exampleSite:/blog
|
||||
- .:/blog/themes/soho
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
baseurl = "https://example.com/"
|
||||
languageCode = "en"
|
||||
title = "Wantsum Theme"
|
||||
theme = "git.spod.cx/bcc/wantsum"
|
||||
title = "Soho Theme"
|
||||
theme = "github.com/alexandrevicenzi/soho"
|
||||
DefaultContentLanguage = "en"
|
||||
enableInlineShortcodes = true
|
||||
summarylength = 10
|
||||
|
|
@ -10,9 +10,9 @@ paginate = 5
|
|||
ignoreErrors = ["error-remote-getjson"]
|
||||
|
||||
[params]
|
||||
title = "Wantsum Theme"
|
||||
title = "Soho Theme"
|
||||
description = "Example Blog"
|
||||
# gravatar = "wantsum@example.com"
|
||||
# gravatar = "soho@example.com"
|
||||
images = ["images/profile.png"]
|
||||
profilePicture = "images/profile.png"
|
||||
copyright = "Author Name"
|
||||
|
|
@ -32,7 +32,7 @@ mainSections = ["post"]
|
|||
[[params.socialIcons]]
|
||||
icon = "fa-github"
|
||||
title = "GitHub"
|
||||
url = "https://github.com/bcc"
|
||||
url = "https://github.com/alexandrevicenzi/soho"
|
||||
|
||||
[[params.socialIcons]]
|
||||
icon = "fa-twitter"
|
||||
|
|
|
|||
28
exampleSite/content/post/soho.md
Normal file
28
exampleSite/content/post/soho.md
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
+++
|
||||
title = "Soho Theme"
|
||||
date = "2020-05-01"
|
||||
description = "About Soho Theme."
|
||||
tags = [
|
||||
"theme",
|
||||
]
|
||||
+++
|
||||
|
||||
[Soho](https://github.com/alexandrevicenzi/soho) is a minimalist two-column [hugo](https://gohugo.io) theme based on [Hyde](https://github.com/spf13/hyde) and inspired by the success of [Flex](https://github.com/alexandrevicenzi/Flex).
|
||||
|
||||
## Features
|
||||
|
||||
- Mobile First
|
||||
- Responsive
|
||||
- Semantic
|
||||
- SEO Best Practices
|
||||
- Open Graph
|
||||
- Rich Snippets (JSON-LD)
|
||||
- Twitter Card
|
||||
- Pagination
|
||||
- Customizable
|
||||
- Support all [Hugo Internals](https://gohugo.io/templates/internal/)
|
||||
|
||||
## Integrations
|
||||
|
||||
- [Disqus](https://disqus.com/)
|
||||
- [Google Analytics](https://www.google.com/analytics/web/)
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
+++
|
||||
title = "Wantsum Theme"
|
||||
date = "2024-07-05"
|
||||
description = "About Wantsum Theme."
|
||||
tags = [
|
||||
"theme",
|
||||
]
|
||||
+++
|
||||
|
||||
[Wantsum](https://git.spod.cx/bcc/wantsum) is a minimalist two-column [hugo](https://gohugo.io) theme based on [Soho](https://github.com/alexandrevicenzi/soho)
|
||||
|
||||
## Features
|
||||
|
||||
- Similar to Soho, but:
|
||||
- External integrations removed
|
||||
- No external dependencies
|
||||
- Page sizes dramatically smaller - ~1.5MB to ~50kB
|
||||
- Dark Mode
|
||||
-
|
||||
3
go.mod
Normal file
3
go.mod
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
module github.com/alexandrevicenzi/soho
|
||||
|
||||
go 1.12
|
||||
|
|
@ -26,12 +26,7 @@
|
|||
|
||||
<link type="text/css"
|
||||
rel="stylesheet"
|
||||
href="{{ `css/hyde-light.css` | relURL }}">
|
||||
|
||||
<link type="text/css"
|
||||
rel="stylesheet"
|
||||
href="{{ `css/hyde-dark.css` | relURL }}"
|
||||
media="(prefers-color-scheme: dark)">
|
||||
href="{{ `css/hyde.css` | relURL }}">
|
||||
|
||||
{{ partial "theme-color.html" . }}
|
||||
|
||||
|
|
@ -40,10 +35,18 @@
|
|||
{{- end}}
|
||||
|
||||
<link rel="stylesheet"
|
||||
href="/fonts.css">
|
||||
href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap">
|
||||
|
||||
<link rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css"
|
||||
integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk="
|
||||
crossorigin="anonymous" />
|
||||
|
||||
<link rel="shortcut icon" href="/favicon.ico">
|
||||
<link rel="apple-touch-icon-precomposed"
|
||||
sizes="144x144"
|
||||
href="/apple-touch-icon-144-precomposed.png">
|
||||
|
||||
<link rel="shortcut icon" href="/favicon.png">
|
||||
|
||||
<!-- RSS -->
|
||||
{{ range .AlternativeOutputFormats -}}
|
||||
|
|
@ -53,18 +56,26 @@
|
|||
<body>
|
||||
{{ partial "sidebar.html" . }}
|
||||
|
||||
<main class="content container" data-pagefind-body>
|
||||
<main class="content container">
|
||||
{{ block "main" . -}}{{- end }}
|
||||
</main>
|
||||
|
||||
{{ partial "footer.html" . }}
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/js/all.min.js"
|
||||
integrity="sha256-MAgcygDRahs+F/Nk5Vz387whB4kSK9NXlDN3w58LLq0="
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
|
||||
<script src="{{ `js/jquery.min.js` | relURL }}"></script>
|
||||
<script src="{{ `js/soho.js` | relURL }}"></script>
|
||||
|
||||
{{ range $.Site.Params.customJs -}}
|
||||
<script src="{{ . | relURL }}"></script>
|
||||
{{- end}}
|
||||
|
||||
<script src="{{ `js/colour-toggle.js` | relURL }}"></script>
|
||||
|
||||
{{ if not hugo.IsServer }}
|
||||
{{ template "_internal/google_analytics.html" . }}
|
||||
{{ end }}
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,6 @@
|
|||
{{ define "main" -}}
|
||||
<ul class="posts">
|
||||
<h1>{{ .Title }}</h1>
|
||||
<div class="homepage-content">
|
||||
<!-- Note that the content for index.html, as a sort of list page, will pull from content/_index.md -->
|
||||
{{ .Content }}
|
||||
</div>
|
||||
|
||||
{{ range .Data.Pages -}}
|
||||
<li>
|
||||
<div class="flex">
|
||||
|
|
|
|||
|
|
@ -3,6 +3,11 @@
|
|||
<h1 class="title">{{ .Title }}</h1>
|
||||
{{ with .Params.tagline }}<span class="tagline">{{ . }}</span>{{ end }}
|
||||
|
||||
{{ if ne .Type "page" -}}
|
||||
<div class="post-date">
|
||||
<time datetime="{{ .Date.Format "2006-01-02T15:04:05Z0700" }}">{{ .Date.Format "Jan 2, 2006" }}</time> <span class="readtime">· {{ .ReadingTime }} min read</span>
|
||||
</div>
|
||||
{{- end }}
|
||||
|
||||
<div>
|
||||
{{ .Content }}
|
||||
|
|
|
|||
|
|
@ -1,21 +1,16 @@
|
|||
{{ define "main" -}}
|
||||
<div class="homepage-content">
|
||||
<!-- Note that the content for index.html, as a sort of list page, will pull from content/_index.md -->
|
||||
{{ .Content }}
|
||||
</div>
|
||||
<h2>Latest Updates</h2>
|
||||
<div class="posts">
|
||||
{{- $pages := where .Site.RegularPages "Type" "in" .Site.Params.MainSections -}}
|
||||
{{- $paginator := .Paginate $pages -}}
|
||||
|
||||
{{ range $paginator.Pages }}
|
||||
<article class="post">
|
||||
<h3>
|
||||
<h1 class="post-title">
|
||||
<a href="{{ .Permalink }}">{{ .Title }}</a>
|
||||
</h3>
|
||||
</h1>
|
||||
|
||||
<div class="post-date">
|
||||
<time datetime="{{ .Date.Format "2006-01-02T15:04:05Z0700" }}">{{ .Date.Format "Jan 2, 2006" }}</time>
|
||||
<time datetime="{{ .Date.Format "2006-01-02T15:04:05Z0700" }}">{{ .Date.Format "Jan 2, 2006" }}</time> · {{ .ReadingTime }} min read
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
|
@ -30,6 +25,4 @@
|
|||
</div>
|
||||
|
||||
{{ template "_internal/pagination.html" . }}
|
||||
|
||||
{{- end }}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,15 +1,14 @@
|
|||
<footer>
|
||||
<div>
|
||||
<p>
|
||||
© {{ $.Site.Params.Copyright }} {{ now.Format "2006"}} {{ with .GitInfo }}- {{ .AbbreviatedHash }} {{ end }}
|
||||
|
||||
© {{ $.Site.Params.Copyright }} {{ now.Format "2006"}}
|
||||
|
||||
{{ with $.Site.Params.License -}}
|
||||
· <a href="{{ $.Site.Params.licenseURL }}" target="_blank">{{ . | safeHTML }}</a>
|
||||
{{- end }}
|
||||
|
||||
{{ with $.Site.Params.BuiltWith -}}
|
||||
· Build with <a href="https://gohugo.io/" target="_blank">Hugo</a> & <a href="https://git.spod.cx/bcc/wantsum/" target="_blank">Wantsum</a> theme
|
||||
· Build with <a href="https://gohugo.io/" target="_blank">Hugo</a> & <a href="https://themes.gohugo.io/soho/" target="_blank">Soho</a> theme
|
||||
{{- end }}
|
||||
</p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
{{ template "_internal/schema.html" . }}
|
||||
|
||||
{{ template "_internal/twitter_cards.html" . }}
|
||||
|
||||
{{ template "_internal/opengraph.html" . }}
|
||||
|
||||
{{ partial "json-ld.html" . }}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,31 @@
|
|||
<div class="share-buttons">
|
||||
<a class="twitter-share-button"
|
||||
href="#"
|
||||
title="Share on Twitter"
|
||||
data-url="{{ .Permalink }}"
|
||||
data-text="{{ .Title }}"><i class="fab fa-twitter"></i></a>
|
||||
|
||||
<a class="linkedin-share-button"
|
||||
href="#"
|
||||
title="Share on LinkedIn"
|
||||
data-url="{{ .Permalink }}"
|
||||
data-text="{{ .Title }}"><i class="fab fa-linkedin-in"></i></a>
|
||||
|
||||
<a class="facebook-share-button"
|
||||
href="#"
|
||||
title="Share on Facebook"
|
||||
data-url="{{ .Permalink }}"
|
||||
data-text="{{ .Title }}"><i class="fab fa-facebook"></i></a>
|
||||
|
||||
<a class="telegram-share-button"
|
||||
href="#"
|
||||
title="Share on Telegram"
|
||||
data-url="{{ .Permalink }}"
|
||||
data-text="{{ .Title }}"><i class="fab fa-telegram"></i></a>
|
||||
|
||||
<a class="pinterest-share-button"
|
||||
href="#"
|
||||
title="Share on Pinterest"
|
||||
data-url="{{ .Permalink }}"
|
||||
data-text="{{ .Title }}"><i class="fab fa-pinterest"></i></a>
|
||||
</div>
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
<aside class="sidebar" data-pagefind-ignore="all">
|
||||
<aside class="sidebar">
|
||||
<div class="container">
|
||||
<div class="sidebar-about">
|
||||
{{ with .Site.Params.gravatar }}
|
||||
|
|
@ -40,16 +40,9 @@
|
|||
<section class="social-icons">
|
||||
{{ range $item := .Site.Params.socialIcons }}
|
||||
<a href="{{ $item.url }}" rel="me" title="{{ $item.title }}" target="_blank">
|
||||
<img src='/fa/svgs/{{ $item.icon }}.svg' style='width:32px; height:32px; display:inline; filter:invert(100%)'>
|
||||
<i class="fab {{ $item.icon }}" aria-hidden="true"></i>
|
||||
</a>
|
||||
{{ end }}
|
||||
</section>
|
||||
|
||||
<section></section>
|
||||
<a class="colour-toggle" href="javascript:toggleColorScheme();">
|
||||
<span id="toggle-light">light mode</span>
|
||||
<span id="toggle-dark">dark mode</span>
|
||||
</a>
|
||||
</section>
|
||||
</div>
|
||||
</aside>
|
||||
|
|
|
|||
|
|
@ -1,21 +0,0 @@
|
|||
{{ $images := .Page.Resources.ByType "image" }}
|
||||
{{ $original := $images.GetMatch (printf "%s*" (.Get 0)) }}
|
||||
{{ $command := .Get 1 | default "Resize" }}
|
||||
{{ $options := .Get 2 | default "smart" }}
|
||||
{{ $caption := .Get 3 | default "" }}
|
||||
{{ $options := print "1000x " $options}}
|
||||
{{ if eq $command "Fit"}}
|
||||
{{ .Scratch.Set "image" ($original.Fit $options) }}
|
||||
{{ else if eq $command "Resize"}}
|
||||
{{ .Scratch.Set "image" ($original.Resize $options) }}
|
||||
{{ else if eq $command "Fill"}}
|
||||
{{ .Scratch.Set "image" ($original.Fill $options) }}
|
||||
{{ else }}
|
||||
{{ $original.ResourceType }}
|
||||
{{ errorf "Invalid image processing command: Must be one of Fit, Fill or Resize."}}
|
||||
{{ end }}
|
||||
{{ $image := .Scratch.Get "image" }}
|
||||
<figure>
|
||||
<img src="{{ $image.RelPermalink }}">
|
||||
<figcaption>{{ with .Inner }}{{ . }}{{ else }}{{ $caption }}{{ end }}</figcaption>
|
||||
</figure>
|
||||
|
|
@ -1,12 +1,81 @@
|
|||
@media (prefers-color-scheme: dark) {
|
||||
.sidebar {
|
||||
/*
|
||||
* __ __
|
||||
* /\ \ /\ \
|
||||
* \ \ \___ __ __ \_\ \ __
|
||||
* \ \ _ `\/\ \/\ \ /'_` \ /'__`\
|
||||
* \ \ \ \ \ \ \_\ \/\ \_\ \/\ __/
|
||||
* \ \_\ \_\/`____ \ \___,_\ \____\
|
||||
* \/_/\/_/`/___/> \/__,_ /\/____/
|
||||
* /\___/
|
||||
* \/__/
|
||||
*
|
||||
* Designed, built, and released under MIT license by @mdo. Learn more at
|
||||
* https://github.com/poole/hyde.
|
||||
*/
|
||||
|
||||
|
||||
/*
|
||||
* Contents
|
||||
*
|
||||
* Global resets
|
||||
* Sidebar
|
||||
* Container
|
||||
* Reverse layout
|
||||
* Themes
|
||||
*/
|
||||
|
||||
|
||||
/*
|
||||
* Global resets
|
||||
*
|
||||
* Update the foundational and global aspects of the page.
|
||||
*/
|
||||
|
||||
html {
|
||||
font-family: 'Open Sans', 'Roboto', Helvetica, Arial, sans-serif;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 58em) {
|
||||
html {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Sidebar
|
||||
*
|
||||
* Flexible banner for housing site name, intro, and "footer" content. Starts
|
||||
* out above content in mobile and later moves to the side with wider viewports.
|
||||
*/
|
||||
|
||||
.sidebar {
|
||||
text-align: center;
|
||||
padding: 2rem 1rem;
|
||||
color: rgba(255,255,255,.5);
|
||||
background-color: #202020;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.sidebar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 18rem;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-left: 19rem !important;
|
||||
margin-right: 1rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
h1,h2,h3,h4,h5,h6 {
|
||||
color: #aaa;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
/* Sidebar links */
|
||||
|
|
@ -17,20 +86,82 @@ h1,h2,h3,h4,h5,h6 {
|
|||
/* About section */
|
||||
.sidebar-about h1 {
|
||||
color: #222;
|
||||
margin-top: 0;
|
||||
font-size: 2.25rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* Sidebar nav */
|
||||
.sidebar-nav {
|
||||
padding-left: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.sidebar-nav-item {
|
||||
display: block;
|
||||
}
|
||||
a.sidebar-nav-item:hover,
|
||||
a.sidebar-nav-item:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.sidebar-nav-item.active {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Container
|
||||
*
|
||||
* Align the contents of the site above the proper threshold with some margin-fu
|
||||
* with a 25%-wide `.sidebar`.
|
||||
*/
|
||||
|
||||
.content {
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
min-height: 50%;
|
||||
}
|
||||
|
||||
|
||||
html,
|
||||
body {
|
||||
background-color: #000;
|
||||
color: #aaa;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background-color: #000000;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size: .7rem;
|
||||
text-align: center;
|
||||
height: 40px;
|
||||
padding: 1rem 0;
|
||||
margin: 0 1rem;
|
||||
border-top: 1px solid #e0e0e0;
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 48em) {
|
||||
.content {
|
||||
max-width: 40rem;
|
||||
margin-left: 20rem;
|
||||
margin-right: 2rem;
|
||||
margin-bottom: -40px;
|
||||
min-height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.img-circle {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.img-headshot {
|
||||
border: 6px solid #222;
|
||||
height: 180px;
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
|
|
@ -49,23 +180,103 @@ footer a,
|
|||
color: #336699;
|
||||
}
|
||||
|
||||
.read-more-link {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.read-more-link a {
|
||||
padding: 8px 16px;
|
||||
border: 1px solid;
|
||||
border-color: #336699;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.read-more-link a:hover {
|
||||
text-decoration: none;
|
||||
color: #222;
|
||||
background-color: #336699;
|
||||
}
|
||||
|
||||
.pull-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
ul.posts {
|
||||
list-style: none;
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.social-icons,
|
||||
.sidebar nav {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
ul.posts li,
|
||||
.sidebar nav li {
|
||||
font-size: 1.2rem;
|
||||
padding: 0.25rem 0;
|
||||
}
|
||||
|
||||
.social-icons a {
|
||||
font-size: 1.5rem;
|
||||
padding: 0.2rem;
|
||||
}
|
||||
|
||||
@media (min-width: 58rem) {
|
||||
.social-icons a {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
ul.posts li,
|
||||
.sidebar nav li {
|
||||
font-size: inherit;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.social-icons a,
|
||||
.social-icons a:hover,
|
||||
.social-icons a:focus {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
margin: 1em 0 2rem 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.pagination ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.pagination li {
|
||||
display: block;
|
||||
float: left;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.pagination li a {
|
||||
display: block;
|
||||
margin-bottom: 0.25em;
|
||||
padding: 0.5em 1em;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: #336699;
|
||||
border: 1px solid #336699;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.pagination li a:hover {
|
||||
color: #222;
|
||||
background-color: #336699;
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.pagination li.active a {
|
||||
|
|
@ -75,41 +286,94 @@ footer a,
|
|||
|
||||
.pagination li.disabled a {
|
||||
color: rgba(67, 118, 122, 0.5);
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.pagination li:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.pagination li:first-child a {
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
|
||||
.pagination li:last-child a {
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.share-buttons {
|
||||
text-align: center;
|
||||
font-size: 2rem;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.share-buttons a {
|
||||
padding: 0 0.6rem;
|
||||
}
|
||||
|
||||
.share-buttons a:hover {
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
ul.tags {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
ul.tags li {
|
||||
display: inline-block;
|
||||
margin: 0.25rem 0;
|
||||
}
|
||||
|
||||
a.tag-link {
|
||||
background-color: #f2f2f2;
|
||||
padding: 5px 10px;
|
||||
border-radius: 3px;
|
||||
font-size: 0.75rem;
|
||||
text-decoration: none;
|
||||
color: #757575 !important;
|
||||
}
|
||||
|
||||
|
||||
/* Code */
|
||||
code,
|
||||
pre,
|
||||
.highlight {
|
||||
font-family: Menlo, Monaco, "Courier New", monospace;
|
||||
}
|
||||
code {
|
||||
color: #e83e8c;
|
||||
white-space: pre;
|
||||
}
|
||||
pre {
|
||||
background-color: #222;
|
||||
}
|
||||
pre code {
|
||||
color: inherit;
|
||||
background-color: transparent;
|
||||
}
|
||||
.highlight {
|
||||
border-color: #ddd #ddd #ccc;
|
||||
}
|
||||
.chroma .lntd {
|
||||
background-color: #222;
|
||||
a.tag-link:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.social-icons {
|
||||
filter:invert(100%);
|
||||
figure {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
figure > img {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
}
|
||||
figcaption {
|
||||
text-align: center;
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
.tagline {
|
||||
display: block;
|
||||
font-size: 1.2rem;
|
||||
margin-bottom: .5rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.truncate {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.nowrap {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,380 +0,0 @@
|
|||
/*
|
||||
* __ __
|
||||
* /\ \ /\ \
|
||||
* \ \ \___ __ __ \_\ \ __
|
||||
* \ \ _ `\/\ \/\ \ /'_` \ /'__`\
|
||||
* \ \ \ \ \ \ \_\ \/\ \_\ \/\ __/
|
||||
* \ \_\ \_\/`____ \ \___,_\ \____\
|
||||
* \/_/\/_/`/___/> \/__,_ /\/____/
|
||||
* /\___/
|
||||
* \/__/
|
||||
*
|
||||
* Designed, built, and released under MIT license by @mdo. Learn more at
|
||||
* https://github.com/poole/hyde.
|
||||
*/
|
||||
|
||||
|
||||
/*
|
||||
* Contents
|
||||
*
|
||||
* Global resets
|
||||
* Sidebar
|
||||
* Container
|
||||
* Reverse layout
|
||||
* Themes
|
||||
*/
|
||||
|
||||
|
||||
/*
|
||||
* Global resets
|
||||
*
|
||||
* Update the foundational and global aspects of the page.
|
||||
*/
|
||||
|
||||
html {
|
||||
font-family: 'Open Sans', 'Roboto', Helvetica, Arial, sans-serif;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 58em) {
|
||||
html {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Sidebar
|
||||
*
|
||||
* Flexible banner for housing site name, intro, and "footer" content. Starts
|
||||
* out above content in mobile and later moves to the side with wider viewports.
|
||||
*/
|
||||
|
||||
.sidebar {
|
||||
text-align: center;
|
||||
padding: 2rem 1rem;
|
||||
color: rgba(255,255,255,.5);
|
||||
background-color: #202020;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.sidebar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 18rem;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-left: 19rem !important;
|
||||
margin-right: 1rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Sidebar links */
|
||||
.sidebar a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* About section */
|
||||
.sidebar-about h1 {
|
||||
color: #fff;
|
||||
margin-top: 0;
|
||||
font-size: 2.25rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* Sidebar nav */
|
||||
.sidebar-nav {
|
||||
padding-left: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.sidebar-nav-item {
|
||||
display: block;
|
||||
}
|
||||
a.sidebar-nav-item:hover,
|
||||
a.sidebar-nav-item:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.sidebar-nav-item.active {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Container
|
||||
*
|
||||
* Align the contents of the site above the proper threshold with some margin-fu
|
||||
* with a 25%-wide `.sidebar`.
|
||||
*/
|
||||
|
||||
.content {
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
min-height: 50%;
|
||||
}
|
||||
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size: .7rem;
|
||||
text-align: center;
|
||||
height: 40px;
|
||||
padding: 1rem 0;
|
||||
margin: 0 1rem;
|
||||
border-top: 1px solid #e0e0e0;
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 48em) {
|
||||
.content {
|
||||
max-width: 40rem;
|
||||
margin-left: 20rem;
|
||||
margin-right: 2rem;
|
||||
margin-bottom: -40px;
|
||||
min-height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.img-circle {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.img-headshot {
|
||||
border: 6px solid #fff;
|
||||
height: 180px;
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
background-color: #336699;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sidebar a,
|
||||
.sidebar-about h1 {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
footer a,
|
||||
.content a,
|
||||
.related-posts li a:hover {
|
||||
color: #336699;
|
||||
}
|
||||
|
||||
.read-more-link {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.read-more-link a {
|
||||
padding: 8px 16px;
|
||||
border: 1px solid;
|
||||
border-color: #336699;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.read-more-link a:hover {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
background-color: #336699;
|
||||
}
|
||||
|
||||
.pull-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
ul.posts {
|
||||
list-style: none;
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.social-icons,
|
||||
.sidebar nav {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
ul.posts li,
|
||||
.sidebar nav li {
|
||||
font-size: 1.2rem;
|
||||
padding: 0.25rem 0;
|
||||
}
|
||||
|
||||
.social-icons a {
|
||||
font-size: 1.5rem;
|
||||
padding: 0.2rem;
|
||||
}
|
||||
|
||||
@media (min-width: 58rem) {
|
||||
.social-icons a {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
ul.posts li,
|
||||
.sidebar nav li {
|
||||
font-size: inherit;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.social-icons a,
|
||||
.social-icons a:hover,
|
||||
.social-icons a:focus {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
margin: 1em 0 2rem 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.pagination ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.pagination li {
|
||||
display: block;
|
||||
float: left;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.pagination li a {
|
||||
display: block;
|
||||
margin-bottom: 0.25em;
|
||||
padding: 0.5em 1em;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: #336699;
|
||||
border: 1px solid #336699;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.pagination li a:hover {
|
||||
color: #fff;
|
||||
background-color: #336699;
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.pagination li.active a {
|
||||
color: #fff;
|
||||
background-color: #336699;
|
||||
}
|
||||
|
||||
.pagination li.disabled a {
|
||||
color: rgba(67, 118, 122, 0.5);
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.pagination li:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.pagination li:first-child a {
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
|
||||
.pagination li:last-child a {
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.share-buttons {
|
||||
text-align: center;
|
||||
font-size: 2rem;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.share-buttons a {
|
||||
padding: 0 0.6rem;
|
||||
}
|
||||
|
||||
.share-buttons a:hover {
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
ul.tags {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
ul.tags li {
|
||||
display: inline-block;
|
||||
margin: 0.25rem 0;
|
||||
}
|
||||
|
||||
a.tag-link {
|
||||
background-color: #f2f2f2;
|
||||
padding: 5px 10px;
|
||||
border-radius: 3px;
|
||||
font-size: 0.75rem;
|
||||
text-decoration: none;
|
||||
color: #757575 !important;
|
||||
}
|
||||
|
||||
a.tag-link:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
figure {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
figure > img {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
text-align: center;
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
.tagline {
|
||||
display: block;
|
||||
font-size: 1.2rem;
|
||||
margin-bottom: .5rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.truncate {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.nowrap {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: #efefef;
|
||||
border-left: 3px solid #ccc;
|
||||
padding: 5px;
|
||||
|
||||
}
|
||||
|
|
@ -1 +1,373 @@
|
|||
@import "hyde-dark.css";
|
||||
/*
|
||||
* __ __
|
||||
* /\ \ /\ \
|
||||
* \ \ \___ __ __ \_\ \ __
|
||||
* \ \ _ `\/\ \/\ \ /'_` \ /'__`\
|
||||
* \ \ \ \ \ \ \_\ \/\ \_\ \/\ __/
|
||||
* \ \_\ \_\/`____ \ \___,_\ \____\
|
||||
* \/_/\/_/`/___/> \/__,_ /\/____/
|
||||
* /\___/
|
||||
* \/__/
|
||||
*
|
||||
* Designed, built, and released under MIT license by @mdo. Learn more at
|
||||
* https://github.com/poole/hyde.
|
||||
*/
|
||||
|
||||
|
||||
/*
|
||||
* Contents
|
||||
*
|
||||
* Global resets
|
||||
* Sidebar
|
||||
* Container
|
||||
* Reverse layout
|
||||
* Themes
|
||||
*/
|
||||
|
||||
|
||||
/*
|
||||
* Global resets
|
||||
*
|
||||
* Update the foundational and global aspects of the page.
|
||||
*/
|
||||
|
||||
html {
|
||||
font-family: 'Open Sans', 'Roboto', Helvetica, Arial, sans-serif;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 58em) {
|
||||
html {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Sidebar
|
||||
*
|
||||
* Flexible banner for housing site name, intro, and "footer" content. Starts
|
||||
* out above content in mobile and later moves to the side with wider viewports.
|
||||
*/
|
||||
|
||||
.sidebar {
|
||||
text-align: center;
|
||||
padding: 2rem 1rem;
|
||||
color: rgba(255,255,255,.5);
|
||||
background-color: #202020;
|
||||
}
|
||||
@media (min-width: 48em) {
|
||||
.sidebar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 18rem;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-left: 19rem !important;
|
||||
margin-right: 1rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Sidebar links */
|
||||
.sidebar a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* About section */
|
||||
.sidebar-about h1 {
|
||||
color: #fff;
|
||||
margin-top: 0;
|
||||
font-size: 2.25rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* Sidebar nav */
|
||||
.sidebar-nav {
|
||||
padding-left: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.sidebar-nav-item {
|
||||
display: block;
|
||||
}
|
||||
a.sidebar-nav-item:hover,
|
||||
a.sidebar-nav-item:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.sidebar-nav-item.active {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Container
|
||||
*
|
||||
* Align the contents of the site above the proper threshold with some margin-fu
|
||||
* with a 25%-wide `.sidebar`.
|
||||
*/
|
||||
|
||||
.content {
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
min-height: 50%;
|
||||
}
|
||||
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
footer {
|
||||
font-size: .7rem;
|
||||
text-align: center;
|
||||
height: 40px;
|
||||
padding: 1rem 0;
|
||||
margin: 0 1rem;
|
||||
border-top: 1px solid #e0e0e0;
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 48em) {
|
||||
.content {
|
||||
max-width: 40rem;
|
||||
margin-left: 20rem;
|
||||
margin-right: 2rem;
|
||||
margin-bottom: -40px;
|
||||
min-height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.img-circle {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.img-headshot {
|
||||
border: 6px solid #fff;
|
||||
height: 180px;
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
background-color: #336699;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sidebar a,
|
||||
.sidebar-about h1 {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
footer a,
|
||||
.content a,
|
||||
.related-posts li a:hover {
|
||||
color: #336699;
|
||||
}
|
||||
|
||||
.read-more-link {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.read-more-link a {
|
||||
padding: 8px 16px;
|
||||
border: 1px solid;
|
||||
border-color: #336699;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.read-more-link a:hover {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
background-color: #336699;
|
||||
}
|
||||
|
||||
.pull-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
ul.posts {
|
||||
list-style: none;
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.social-icons,
|
||||
.sidebar nav {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
ul.posts li,
|
||||
.sidebar nav li {
|
||||
font-size: 1.2rem;
|
||||
padding: 0.25rem 0;
|
||||
}
|
||||
|
||||
.social-icons a {
|
||||
font-size: 1.5rem;
|
||||
padding: 0.2rem;
|
||||
}
|
||||
|
||||
@media (min-width: 58rem) {
|
||||
.social-icons a {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
ul.posts li,
|
||||
.sidebar nav li {
|
||||
font-size: inherit;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.social-icons a,
|
||||
.social-icons a:hover,
|
||||
.social-icons a:focus {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
margin: 1em 0 2rem 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.pagination ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.pagination li {
|
||||
display: block;
|
||||
float: left;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.pagination li a {
|
||||
display: block;
|
||||
margin-bottom: 0.25em;
|
||||
padding: 0.5em 1em;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: #336699;
|
||||
border: 1px solid #336699;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.pagination li a:hover {
|
||||
color: #fff;
|
||||
background-color: #336699;
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.pagination li.active a {
|
||||
color: #fff;
|
||||
background-color: #336699;
|
||||
}
|
||||
|
||||
.pagination li.disabled a {
|
||||
color: rgba(67, 118, 122, 0.5);
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.pagination li:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.pagination li:first-child a {
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
|
||||
.pagination li:last-child a {
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.share-buttons {
|
||||
text-align: center;
|
||||
font-size: 2rem;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.share-buttons a {
|
||||
padding: 0 0.6rem;
|
||||
}
|
||||
|
||||
.share-buttons a:hover {
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
ul.tags {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
ul.tags li {
|
||||
display: inline-block;
|
||||
margin: 0.25rem 0;
|
||||
}
|
||||
|
||||
a.tag-link {
|
||||
background-color: #f2f2f2;
|
||||
padding: 5px 10px;
|
||||
border-radius: 3px;
|
||||
font-size: 0.75rem;
|
||||
text-decoration: none;
|
||||
color: #757575 !important;
|
||||
}
|
||||
|
||||
a.tag-link:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
figure {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
figure > img {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
text-align: center;
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
.tagline {
|
||||
display: block;
|
||||
font-size: 1.2rem;
|
||||
margin-bottom: .5rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.truncate {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.nowrap {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +0,0 @@
|
|||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--pagefind-ui-primary: #aaa;
|
||||
--pagefind-ui-text: #aaa;
|
||||
--pagefind-ui-background: #393939;
|
||||
--pagefind-ui-border: #393939;
|
||||
--pagefind-ui-tag: #393939;
|
||||
}
|
||||
.pagefind-ui mark {
|
||||
background-color: #336699;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
@font-face {
|
||||
font-family: "Open Sans";
|
||||
src: url(/fonts/webfonts/open-sans-latin-400-normal.woff2);
|
||||
}
|
||||
|
|
@ -1,98 +0,0 @@
|
|||
// With thanks to Mendhak on
|
||||
// https://stackoverflow.com/questions/56300132/how-to-override-css-prefers-color-scheme-setting
|
||||
// Return the system level color scheme, but if something's in local storage, return that
|
||||
// Unless the system scheme matches the the stored scheme, in which case... remove from local storage
|
||||
function getPreferredColorScheme(){
|
||||
let systemScheme = 'light';
|
||||
if(window.matchMedia('(prefers-color-scheme: dark)').matches){
|
||||
systemScheme = 'dark';
|
||||
}
|
||||
let chosenScheme = systemScheme;
|
||||
|
||||
if(localStorage.getItem("scheme")){
|
||||
chosenScheme = localStorage.getItem("scheme");
|
||||
}
|
||||
|
||||
if(systemScheme === chosenScheme){
|
||||
localStorage.removeItem("scheme");
|
||||
}
|
||||
|
||||
return chosenScheme;
|
||||
}
|
||||
|
||||
// Write chosen color scheme to local storage
|
||||
// Unless the system scheme matches the the stored scheme, in which case... remove from local storage
|
||||
function savePreferredColorScheme(scheme){
|
||||
let systemScheme = 'light';
|
||||
|
||||
if(window.matchMedia('(prefers-color-scheme: dark)').matches){
|
||||
systemScheme = 'dark';
|
||||
}
|
||||
|
||||
if(systemScheme === scheme){
|
||||
localStorage.removeItem("scheme");
|
||||
}
|
||||
else {
|
||||
localStorage.setItem("scheme", scheme);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Get the current scheme, and apply the opposite
|
||||
function toggleColorScheme(){
|
||||
let newScheme = "light";
|
||||
let scheme = getPreferredColorScheme();
|
||||
if (scheme === "light"){
|
||||
newScheme = "dark";
|
||||
}
|
||||
|
||||
applyPreferredColorScheme(newScheme);
|
||||
savePreferredColorScheme(newScheme);
|
||||
|
||||
|
||||
}
|
||||
|
||||
// Apply the chosen color scheme by traversing stylesheet rules, and applying a medium.
|
||||
function applyPreferredColorScheme(scheme) {
|
||||
for (var s = 0; s < document.styleSheets.length; s++) {
|
||||
|
||||
for (var i = 0; i < document.styleSheets[s].cssRules.length; i++) {
|
||||
rule = document.styleSheets[s].cssRules[i];
|
||||
|
||||
|
||||
if (rule && rule.media && rule.media.mediaText.includes("prefers-color-scheme")) {
|
||||
|
||||
switch (scheme) {
|
||||
case "light":
|
||||
rule.media.appendMedium("original-prefers-color-scheme");
|
||||
if (rule.media.mediaText.includes("light")) rule.media.deleteMedium("(prefers-color-scheme: light)");
|
||||
if (rule.media.mediaText.includes("dark")) rule.media.deleteMedium("(prefers-color-scheme: dark)");
|
||||
break;
|
||||
case "dark":
|
||||
rule.media.appendMedium("(prefers-color-scheme: light)");
|
||||
rule.media.appendMedium("(prefers-color-scheme: dark)");
|
||||
if (rule.media.mediaText.includes("original")) rule.media.deleteMedium("original-prefers-color-scheme");
|
||||
break;
|
||||
default:
|
||||
rule.media.appendMedium("(prefers-color-scheme: dark)");
|
||||
if (rule.media.mediaText.includes("light")) rule.media.deleteMedium("(prefers-color-scheme: light)");
|
||||
if (rule.media.mediaText.includes("original")) rule.media.deleteMedium("original-prefers-color-scheme");
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
// Change the toggle button to be the opposite of the current scheme
|
||||
if (scheme === "dark") {
|
||||
document.getElementById("toggle-light").style.display = 'inline';
|
||||
document.getElementById("toggle-dark").style.display = 'none';
|
||||
} else {
|
||||
document.getElementById("toggle-dark").style.display = 'inline';
|
||||
document.getElementById("toggle-light").style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
applyPreferredColorScheme(getPreferredColorScheme());
|
||||
15
theme.toml
15
theme.toml
|
|
@ -1,15 +1,16 @@
|
|||
name = "Wantsum"
|
||||
name = "Soho"
|
||||
license = "MIT"
|
||||
licenselink = "https://github.com/alexandrevicenzi/soho/blob/master/LICENSE.md"
|
||||
description = "A minimalist and mobile first theme for Hugo"
|
||||
tags = ["blog", "responsive", "light", "dark", "minimal"]
|
||||
features = ["blog", "seo", "responsive", "mobile"]
|
||||
tags = ["blog", "responsive", "light", "minimal"]
|
||||
features = ["blog", "seo", "responsive", "mobile", "disqus", "analytics"]
|
||||
min_version = "0.54.0"
|
||||
|
||||
[author]
|
||||
name = "bcc"
|
||||
homepage = "https://spod.cx"
|
||||
|
||||
[original]
|
||||
name = "alexandrevicenzi"
|
||||
homepage = "https://alxd.dev"
|
||||
|
||||
[original]
|
||||
author = "spf13"
|
||||
homepage = "http://spf13.com"
|
||||
repo = "https://github.com/spf13/hyde"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue