共有 8 个文件被更改，包括 44 次插入 和 6 次删除
+ 10
- 4
assets/css/custom.css
查看文件
| @@ -1,4 +1,9 @@ | |||
| body { | |||
| dark-mode-toggle { | |||
| --dark-mode-toggle-dark-icon: url("/wp-content/moon.png"); | |||
| --dark-mode-toggle-dark-icon: url("/wp-content/moon.png"); | |||
| } | |||
| body.light { | |||
| background: #fffcf5; | |||
| } | |||
| @@ -26,21 +31,22 @@ a[rel*="external"]::after { | |||
| nav a { | |||
| padding: 2px; | |||
| } | |||
| nav a.active { | |||
| .light nav a.active { | |||
| background-color: inherit; | |||
| color: #000; | |||
| } | |||
| a { | |||
| .light a { | |||
| color: #422eff; | |||
| border-bottom: 1px solid #00ff9c; | |||
| } | |||
| a:hover { | |||
| .light a:hover { | |||
| color: #000; | |||
| background-color: #00ff9c; | |||
| } | |||
| .muted, .help-block { | |||
| opacity: 0.70; | |||
| } | |||
| .light | |||
| .hack .muted, | |||
| .hack .help-block { | |||
| color: #0e0e0e; | |||
+ 1
- 1
config.toml
查看文件
| @@ -27,7 +27,7 @@ footnoteReturnLinkContents = "↩" # Provides a nicer footnote return link | |||
| has_cookies = true # Optional, set true to disable cookie disclaimer | |||
| disable_csp = false # Optional, set true to disable content security policy | |||
| images = [ | |||
| "https://source.unsplash.com/collection/983219/2000x1322" | |||
| "https://rohanverma.net/wp-content/uploads/me.jpg" | |||
| ] # Suggested, controls default Open Graph images | |||
| [params.layout.menu.main] | |||
二进制
content/wp-content/moon.png
查看文件
| 之前 | 之后 |
|---|---|
|
|
| 宽度: 120 | 高度: 120 | 大小: 10KB |
二进制
content/wp-content/sun.png
查看文件
| 之前 | 之后 |
|---|---|
|
|
| 宽度: 120 | 高度: 120 | 大小: 7.5KB |
+ 2
- 0
layouts/_default/baseof.html
查看文件
| @@ -57,6 +57,7 @@ | |||
| {{ $hackcss_mode := .Site.Params.hackcss.mode | default "hack" }} | |||
| {{ $hackcss_palette := .Site.Params.hackcss.palette | default "dark" }} | |||
| <body class="{{ if ne $hackcss_disabled true }}{{ $hackcss_mode }} {{ $hackcss_palette }} main container{{ end }}"> | |||
| {{ partial "body/darkmode.html" . }} | |||
| <header>{{ block "header" . }}{{ end }}</header> | |||
| <main>{{ block "main" . }}{{ end }}</main> | |||
| <footer> | |||
| @@ -70,5 +71,6 @@ | |||
| {{ partial "modules/toxic-swamp/toolbar.html" dict }} | |||
| {{ end }} | |||
| {{ end }} | |||
| {{ partial "body/scripts.html" . }} | |||
| </body> | |||
| </html> | |||
+ 6
- 0
layouts/partials/body/darkmode.html
查看文件
| @@ -0,0 +1,6 @@ | |||
| <dark-mode-toggle | |||
| id="dark-mode-toggle-1" | |||
| appearance="toggle" | |||
| permanent=true | |||
| style="position:absolute;top:5px;right:50%" | |||
| ></dark-mode-toggle> | |||
+ 22
- 0
layouts/partials/body/scripts.html
查看文件
| @@ -0,0 +1,22 @@ | |||
| <script type="module"> | |||
| import * as DarkModeToggle from 'https://unpkg.com/dark-mode-toggle'; | |||
| const toggle = document.querySelector('dark-mode-toggle'); | |||
| const body = document.body; | |||
| // Set or remove the `dark` class the first time. | |||
| body.classList.remove('dark'); | |||
| body.classList.remove('light'); | |||
| if (toggle.mode === 'dark') { | |||
| body.classList.add('dark') | |||
| } else { | |||
| body.classList.add('light') | |||
| } | |||
| // Listen for toggle changes (which includes `prefers-color-scheme` changes) | |||
| // and toggle the `dark` class accordingly. | |||
| toggle.addEventListener('colorschemechange', () => { | |||
| body.classList.toggle('dark', toggle.mode === 'dark'); | |||
| body.classList.toggle('light', toggle.mode !== 'dark'); | |||
| }); | |||
| </script> | |||
+ 3
- 1
layouts/partials/head/custom.html
查看文件
| @@ -1,3 +1,5 @@ | |||
| <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700|Roboto+Slab:400,700" rel="stylesheet"> | |||
| <link rel="authorization_endpoint" href="https://indieauth.com/auth"> | |||
| <link rel="webmention" href="https://webmention.io/rhnvrm/webmention" /> | |||
| <link rel="webmention" href="https://webmention.io/rohanverma.net/webmention" /> | |||
| <link rel="pingback" href="https://webmention.io/rohanverma.net/xmlrpc" /> | |||
| <script type="module" src="https://unpkg.com/dark-mode-toggle"></script> | |||
正在加载...