diff options
| -rw-r--r-- | README.md | 4 | ||||
| -rw-r--r-- | data/beautifulhugo/social.toml | 7 | ||||
| -rw-r--r-- | exampleSite/config.toml | 1 | ||||
| -rw-r--r-- | i18n/it.yaml | 8 | ||||
| -rw-r--r-- | layouts/partials/footer.html | 2 | ||||
| -rw-r--r-- | layouts/partials/head.html | 4 | ||||
| -rw-r--r-- | layouts/partials/seo/twitter.html | 2 | ||||
| -rw-r--r-- | static/css/codeblock.css | 2 | ||||
| -rw-r--r-- | static/css/main.css | 148 |
9 files changed, 157 insertions, 21 deletions
@@ -110,6 +110,8 @@ If you *don't* have the section `[Params.staticman]` in `config.toml`, you *won' To add Google Analytics, simply sign up to [Google Analytics](https://www.google.com/analytics/) to obtain your Google Tracking ID, and add this tracking ID to the `googleAnalytics` parameter in `config.toml`. +Note that the Google Analytics tracking code will only be inserted into the page when the site isn't served on Hugo's built-in server, to prevent tracking from local testing environments. + ### Commit SHA on the footer If the source of your site is in a Git repo, the SHA corresponding to the commit the site is built from can be shown on the footer. To do so, two site parameters `commit` has to be defined in the config file `config.toml`: @@ -172,7 +174,7 @@ This adds a two column side-by-side environment (will turn into 1 col for narrow This is column 1. {{< column >}} This is column 2. -{{< endcolumn >}} +{{< endcolumns >}} ``` ## About diff --git a/data/beautifulhugo/social.toml b/data/beautifulhugo/social.toml index 0ebf774..b6beb0d 100644 --- a/data/beautifulhugo/social.toml +++ b/data/beautifulhugo/social.toml @@ -153,9 +153,16 @@ id = "mastodon" url = "https://%s" title = "Mastodon" icon = "fab fa-mastodon" +rel = "me" [[social_icons]] id = "weibo" url = "https://weibo.com/%s" title = "Weibo" icon = "fab fa-weibo" + +[[social_icons]] +id = "discord" +url = "https://discord.gg/%s" +title = "Discord" +icon = "fab fa-discord"
\ No newline at end of file diff --git a/exampleSite/config.toml b/exampleSite/config.toml index 97699ba..801b865 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -73,6 +73,7 @@ pygmentsCodefencesGuessSyntax = true kaggle = "username" weibo = "username" slack = "username" + discord = "invite code (https://discord.gg/XXXXXXX)" [[menu.main]] name = "Blog" diff --git a/i18n/it.yaml b/i18n/it.yaml index c863da6..09f7313 100644 --- a/i18n/it.yaml +++ b/i18n/it.yaml @@ -4,7 +4,7 @@ - id: shortdateFormat translation: "2 Jan 2006 15:04:05" - id: postedOnDate - translation: "Redatto il {{ . }}" + translation: "Pubblicato il {{ . }}" - id: lastModified translation: "(Ultima modifica il {{ . }})" - id: translationsLabel @@ -37,9 +37,9 @@ # Navigation - id: toggleNavigation - translation: "Attiva/disattiva la navigazione" + translation: "Menu" - id: languageSwitcherLabel - translation: "Linguaggio" + translation: "Lingua" - id: gcseLabelShort translation: "Cerca" - id: gcseLabelLong @@ -71,4 +71,4 @@ # Related posts - id: seeAlso - translation: "Guarda anche" + translation: "Vedi anche" diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 8b48793..31ecaf9 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -9,7 +9,7 @@ {{ range .Site.Data.beautifulhugo.social.social_icons }} {{- if isset $.Site.Author .id }} <li> - <a href="{{ printf .url (index $.Site.Author .id) }}" title="{{ .title }}"> + <a {{ if .rel }}rel="{{ .rel }}"{{- end -}} href="{{ printf .url (index $.Site.Author .id) }}" title="{{ .title }}"> <span class="fa-stack fa-lg"> <i class="fas fa-circle fa-stack-2x"></i> <i class="{{ .icon }} fa-stack-1x fa-inverse"></i> diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 83ace10..de9a5a3 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -88,4 +88,6 @@ {{- end -}} {{- partial "head_custom.html" . }} -{{ template "_internal/google_analytics_async.html" . }} +{{- if not .Site.IsServer -}} + {{ template "_internal/google_analytics_async.html" . }} +{{- end -}}
\ No newline at end of file diff --git a/layouts/partials/seo/twitter.html b/layouts/partials/seo/twitter.html index 0eb1e9b..5f13317 100644 --- a/layouts/partials/seo/twitter.html +++ b/layouts/partials/seo/twitter.html @@ -7,7 +7,7 @@ {{- with .Params.share_img | default .Params.image | default .Site.Params.logo }} <meta name="twitter:image" content="{{ . | absURL }}" /> {{- end }} - <meta name="twitter:card" content="summary" /> + <meta name="twitter:card" content="summary_large_image" /> {{- with .Site.Author.twitter }} <meta name="twitter:site" content="@{{ . }}" /> <meta name="twitter:creator" content="@{{ . }}" /> diff --git a/static/css/codeblock.css b/static/css/codeblock.css index cf80033..4481eed 100644 --- a/static/css/codeblock.css +++ b/static/css/codeblock.css @@ -30,4 +30,4 @@ pre code.hljs { .highlight td:last-child pre code, .highlight pre code { white-space: pre; -}
\ No newline at end of file +} diff --git a/static/css/main.css b/static/css/main.css index 779581f..7f30a3f 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -10,6 +10,12 @@ body { flex-flow: column; height: 100vh; } +@media (prefers-color-scheme: dark) { + body { + background: black; + color: white; + } +} .container[role=main] { margin-bottom:50px; flex: 1 0 auto; @@ -33,6 +39,12 @@ p a { /* text-decoration: underline */ color: #008AFF; } +@media (prefers-color-scheme: dark) { + p a { + color: #50afff; + } +} + h1,h2,h3,h4,h5,h6 { font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: 800; @@ -40,6 +52,11 @@ h1,h2,h3,h4,h5,h6 { a { color: #008AFF; } +@media (prefers-color-scheme: dark) { + a { + color: #50afff; + } +} a:hover, a:focus { color: #0085a1; @@ -51,6 +68,11 @@ blockquote { blockquote p:first-child { margin-top: 0; } +@media (prefers-color-scheme: dark) { + blockquote { + border-left: 5px solid #444; + } +} hr.small { max-width: 100px; margin: 15px auto; @@ -95,30 +117,27 @@ div.panel-body a.list-group-item.view-all { font-weight: 600; } -::-moz-selection { +::-moz-selection, ::selection { color: white; text-shadow: none; background: #0085a1; } -::selection { - color: white; - text-shadow: none; - background: #0085a1; -} -img::selection { - color: white; - background: transparent; -} -img::-moz-selection { +img::selection, img::-moz-selection { color: white; background: transparent; } + img { display: block; margin: auto; max-width: 100%; } +@media (prefers-color-scheme: dark) { +figure:not(.dark) img, img.white { + background-color: white; +} +} .img-title { width: 100%; @@ -141,6 +160,12 @@ img { border-bottom: 1px solid #EAEAEA; font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; } +@media (prefers-color-scheme: dark) { + .navbar-custom { + background: #505050; + border-bottom: 1px solid #AAA; + } +} .navbar-custom .nav li a { text-transform: uppercase; @@ -154,6 +179,13 @@ img { color: #404040; } +@media (prefers-color-scheme: dark) { + .navbar-custom .navbar-brand, + .navbar-custom .nav li a { + color: #b0b0b0; + } +} + .navbar-custom .navbar-brand:hover, .navbar-custom .navbar-brand:focus , .navbar-custom .nav li a:hover, @@ -161,6 +193,15 @@ img { color: #0085a1; } +.navbar-custom .navbar-brand:hover, +.navbar-custom .navbar-brand:focus , +.navbar-custom .nav li a:hover, +.navbar-custom .nav li a:focus { + @media (prefers-color-scheme: dark) { + color: #b0e0ff; + } +} + .navbar-custom .navbar-brand-logo { padding-top: 0; -webkit-transition: padding .5s ease-in-out; @@ -294,6 +335,17 @@ img { border-width: 0 1px 1px; } } +@media (prefers-color-scheme: dark) { + .navbar-custom .nav .navlinks-container:hover { + background: #666; + } + .navbar-custom .nav .navlinks-container .navlinks-children a { + border: 1px solid #AAA; + } + .navbar-custom .nav .navlinks-container .navlinks-children a { + background: #444; + } +} /* --- Footer --- */ @@ -307,6 +359,7 @@ footer { footer a { color: #404040; + } footer .list-inline { @@ -335,13 +388,22 @@ footer .theme-by { } } +@media (prefers-color-scheme: dark) { + footer { + background: #444; + border-top: 1px #AAA solid; + } + footer a { + color: #AAA; + } +} + /* --- Post preview --- */ .post-preview { padding: 20px 0; border-bottom: 1px solid #eee; } - @media only screen and (min-width: 768px) { .post-preview { padding: 35px 0; @@ -356,6 +418,11 @@ footer .theme-by { text-decoration: none; color: #404040; } +@media (prefers-color-scheme: dark) { + .post-preview a { + color: #AAA; + } +} .post-preview a:focus, .post-preview a:hover { @@ -657,6 +724,13 @@ footer .theme-by { border: 1px solid #0085a1; } +@media (prefers-color-scheme: dark) { +.pager li a { + background: #444; + color: white; +} +} + .pager { margin: 10px 0 0; } @@ -686,9 +760,19 @@ table tr { margin: 0; padding: 0; } +@media (prefers-color-scheme: dark) { +} table tr:nth-child(2n) { background-color: #f8f8f8; } +@media (prefers-color-scheme: dark) { +table tr { + background-color: #181818; +} +table tr:nth-child(2n) { + background-color: #303030 +} +} table tr th { font-weight: bold; border: 1px solid #cccccc; @@ -815,3 +899,43 @@ h4.see-also { ul.share li:hover .fab { transform: scale(1.4) } + +/* Dark mode */ +@media (prefers-color-scheme: dark) { + code { + background-color: #222; + color: #fbb; + } + pre code { + color: #ccc; + } + .well { + background-color: #444; + } + .panel { + background-color: #222; + } + .list-group-item { + background-color: #333; + } + + pre.chroma { + color: white; + background-color: #444; + } + pre.chroma .k { + color: #44AACC; + } + pre.chroma .kt { + color: #33CCCC; + } + pre.chroma .o { + color: #AAA; + } + pre.chroma .nb { + color: #00fee9; + } + pre.chroma .ow { + color: #CC0; + } +} |