fix: correct theme toggle icon
This commit is contained in:
parent
f9072c3cfc
commit
ee391e128f
@ -1,6 +1,7 @@
|
||||
import { defineConfig } from 'astro/config';
|
||||
import { i18n, filterSitemapByDefaultLocale } from "astro-i18n-aut/integration";
|
||||
import sitemap from "@astrojs/sitemap";
|
||||
import Icons from 'unplugin-icons/vite'
|
||||
import mdx from '@astrojs/mdx';
|
||||
import glsl from 'vite-plugin-glsl';
|
||||
|
||||
@ -24,6 +25,9 @@ export default defineConfig({
|
||||
vite: {
|
||||
plugins: [
|
||||
glsl(),
|
||||
Icons({
|
||||
compiler: 'svelte',
|
||||
}),
|
||||
],
|
||||
},
|
||||
integrations: [
|
||||
|
@ -37,6 +37,7 @@
|
||||
"prettier-plugin-astro": "^0.13.0",
|
||||
"sharp": "^0.33.3",
|
||||
"unocss": "^0.58.8",
|
||||
"unplugin-icons": "^0.18.5",
|
||||
"vite-plugin-glsl": "^1.3.0"
|
||||
}
|
||||
}
|
59
pnpm-lock.yaml
generated
59
pnpm-lock.yaml
generated
@ -82,6 +82,9 @@ devDependencies:
|
||||
unocss:
|
||||
specifier: ^0.58.8
|
||||
version: 0.58.8(postcss@8.4.35)(vite@5.1.6)
|
||||
unplugin-icons:
|
||||
specifier: ^0.18.5
|
||||
version: 0.18.5
|
||||
vite-plugin-glsl:
|
||||
specifier: ^1.3.0
|
||||
version: 1.3.0(vite@5.1.6)
|
||||
@ -115,6 +118,12 @@ packages:
|
||||
find-up: 5.0.0
|
||||
dev: true
|
||||
|
||||
/@antfu/install-pkg@0.3.2:
|
||||
resolution: {integrity: sha512-FFYqME8+UHlPnRlX/vn+8cTD4Wo/nG/lzRxpABs3XANBmdJdNImVz3QvjNAE/W3PSCNbG387FOz8o5WelnWOlg==}
|
||||
dependencies:
|
||||
execa: 8.0.1
|
||||
dev: true
|
||||
|
||||
/@antfu/utils@0.7.7:
|
||||
resolution: {integrity: sha512-gFPqTG7otEJ8uP6wrhDv6mqwGWYZKNvAcCq6u9hOj0c+IKCEsY4L1oC9trPq2SaWIzAfHvqfBDxF591JkMf+kg==}
|
||||
dev: true
|
||||
@ -5818,6 +5827,47 @@ packages:
|
||||
- supports-color
|
||||
dev: true
|
||||
|
||||
/unplugin-icons@0.18.5:
|
||||
resolution: {integrity: sha512-KVNAohXbZ7tVcG1C3p6QaC7wU9Qrj7etv4XvsMMJAxr5LccQZ+Iuv5LOIv/7GtqXaGN1BuFCqRO1ErsHEgEXdQ==}
|
||||
peerDependencies:
|
||||
'@svgr/core': '>=7.0.0'
|
||||
'@svgx/core': ^1.0.1
|
||||
'@vue/compiler-sfc': ^3.0.2 || ^2.7.0
|
||||
vue-template-compiler: ^2.6.12
|
||||
vue-template-es2015-compiler: ^1.9.0
|
||||
peerDependenciesMeta:
|
||||
'@svgr/core':
|
||||
optional: true
|
||||
'@svgx/core':
|
||||
optional: true
|
||||
'@vue/compiler-sfc':
|
||||
optional: true
|
||||
vue-template-compiler:
|
||||
optional: true
|
||||
vue-template-es2015-compiler:
|
||||
optional: true
|
||||
dependencies:
|
||||
'@antfu/install-pkg': 0.3.2
|
||||
'@antfu/utils': 0.7.7
|
||||
'@iconify/utils': 2.1.22
|
||||
debug: 4.3.4
|
||||
kolorist: 1.8.0
|
||||
local-pkg: 0.5.0
|
||||
unplugin: 1.10.1
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
dev: true
|
||||
|
||||
/unplugin@1.10.1:
|
||||
resolution: {integrity: sha512-d6Mhq8RJeGA8UfKCu54Um4lFA0eSaRa3XxdAJg8tIdxbu1ubW0hBCZUL7yI2uGyYCRndvbK8FLHzqy2XKfeMsg==}
|
||||
engines: {node: '>=14.0.0'}
|
||||
dependencies:
|
||||
acorn: 8.11.3
|
||||
chokidar: 3.6.0
|
||||
webpack-sources: 3.2.3
|
||||
webpack-virtual-modules: 0.6.1
|
||||
dev: true
|
||||
|
||||
/update-browserslist-db@1.0.13(browserslist@4.23.0):
|
||||
resolution: {integrity: sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==}
|
||||
hasBin: true
|
||||
@ -6070,6 +6120,15 @@ packages:
|
||||
/web-namespaces@2.0.1:
|
||||
resolution: {integrity: sha512-bKr1DkiNa2krS7qxNtdrtHAmzuYGFQLiQ13TsorsdT6ULTkPLKuu5+GsFpDlg6JFjUTwX2DyhMPG2be8uPrqsQ==}
|
||||
|
||||
/webpack-sources@3.2.3:
|
||||
resolution: {integrity: sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==}
|
||||
engines: {node: '>=10.13.0'}
|
||||
dev: true
|
||||
|
||||
/webpack-virtual-modules@0.6.1:
|
||||
resolution: {integrity: sha512-poXpCylU7ExuvZK8z+On3kX+S8o/2dQ/SVYueKA0D4WEMXROXgY8Ez50/bQEUmvoSMMrWcrJqCHuhAbsiwg7Dg==}
|
||||
dev: true
|
||||
|
||||
/which-pm-runs@1.1.0:
|
||||
resolution: {integrity: sha512-n1brCuqClxfFfq/Rb0ICg9giSZqCS+pLtccdag6C2HyufBrh3fBOiy9nb6ggRMvWOVH5GrdJskj5iGTZNxd7SA==}
|
||||
engines: {node: '>=4'}
|
||||
|
@ -1,6 +1,8 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from "svelte";
|
||||
import { writable } from "svelte/store";
|
||||
import IconSun from "~icons/tabler/Sun";
|
||||
import IconMoon from "~icons/tabler/Moon";
|
||||
|
||||
let theme = writable("");
|
||||
|
||||
@ -20,45 +22,27 @@
|
||||
</script>
|
||||
|
||||
<button class="block w-6 h-6" on:click={toggleTheme} title="toggle dark mode">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="hidden icon icon-tabler icons-tabler-outline icon-tabler-sun"
|
||||
><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path
|
||||
d="M12 12m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"
|
||||
/><path
|
||||
d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.q7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7"
|
||||
/></svg
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.25"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="icon icon-tabler icons-tabler-outline icon-tabler-moon"
|
||||
><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path
|
||||
d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454z"
|
||||
/></svg
|
||||
>
|
||||
<IconMoon class="w-6 h-6 icon-tabler-moon" />
|
||||
<IconSun class="w-6 h-6 icon-tabler-sun" />
|
||||
</button>
|
||||
|
||||
<style>
|
||||
:global(.dark .icon-tabler-moon) {
|
||||
display: none;
|
||||
button :global(path) {
|
||||
stroke-width: 1.5px !important;
|
||||
}
|
||||
:global(.dark .icon-tabler-sun) {
|
||||
|
||||
button > :global(.icon-tabler-moon) {
|
||||
display: block;
|
||||
}
|
||||
|
||||
button > :global(.icon-tabler-sun) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:global(.dark .icon-tabler-moon) {
|
||||
display: none !important;
|
||||
}
|
||||
:global(.dark .icon-tabler-sun) {
|
||||
display: block !important;
|
||||
}
|
||||
</style>
|
||||
|
1
src/env.d.ts
vendored
1
src/env.d.ts
vendored
@ -1,2 +1,3 @@
|
||||
/// <reference path="../.astro/types.d.ts" />
|
||||
/// <reference types="astro/client" />
|
||||
/// <reference types="unplugin-icons/types" />
|
||||
|
@ -6,7 +6,8 @@
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"types": [
|
||||
"vite-plugin-glsl/ext"
|
||||
"vite-plugin-glsl/ext",
|
||||
"unplugin-icons/types"
|
||||
],
|
||||
"paths": {
|
||||
"@components/*": [
|
||||
|
Loading…
Reference in New Issue
Block a user