nezumi/Sink
1
0
Fork 0
mirror of https://github.com/Nezumi-2711/Sink.git synced 2026-09-22 13:48:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: switch theme

Browse Source
This commit is contained in:
QuentinHsu
2024-05-31 23:53:39 +08:00
parent 9761434c3e
commit e8767a5ca2
21 changed files with 453 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/layouts/Header.vue
+8 -4
View File
@@ -1,12 +1,13 @@
<script setup>
import { Ellipsis, X } from 'lucide-vue-next'
import { GitHubIcon } from 'vue3-simple-icons'
import SwitchTheme from '../SwitchTheme.vue'
const showMenu = ref(false)
</script>
<template>
<section class="pb-6 bg-white">
<section class="pb-6">
<nav class="container relative z-50 h-24 select-none">
<div
class="container relative flex flex-wrap items-center justify-between h-24 px-0 mx-auto overflow-hidden font-medium border-b border-gray-200 md:overflow-visible lg:justify-center"
@@ -17,7 +18,7 @@ const showMenu = ref(false)
class="flex items-center py-4 space-x-2 text-xl font-extrabold text-gray-900 md:py-0"
>
<span
class="flex items-center justify-center w-8 h-8 text-white bg-gray-900 rounded-full"
class="flex items-center justify-center w-8 h-8 bg-gray-900 rounded-full"
>
<img
src="/sink.png"
@@ -64,18 +65,21 @@ const showMenu = ref(false)
<a
href="https://github.com/ccbikai/sink"
target="_blank"
class="inline-flex items-center w-full px-6 py-3 text-sm font-medium leading-4 text-white bg-gray-900 md:w-auto md:rounded-full hover:bg-gray-800 focus:outline-none md:focus:ring-2 focus:ring-0 focus:ring-offset-2 focus:ring-gray-800"
class="inline-flex items-center w-full px-6 py-3 text-sm font-medium leading-4 text-white bg-gray-900 md:px-3 md:mr-2 lg:mr-3 md:w-auto md:rounded-full hover:bg-gray-800 focus:outline-none md:focus:ring-2 focus:ring-0 focus:ring-offset-2 focus:ring-gray-800"
>
<GitHubIcon
class="w-5 h-5 mr-1"
/>
GitHub</a>
<span class="px-3 py-2">
<SwitchTheme />
</span>
</div>
</div>
</div>
<div
class="absolute right-0 flex flex-col items-center justify-center w-10 h-10 bg-white rounded-full cursor-pointer md:hidden hover:bg-gray-100"
class="absolute right-0 flex flex-col items-center justify-center w-10 h-10rounded-full cursor-pointer md:hidden hover:bg-gray-100"
@click="showMenu = !showMenu"
>
<Ellipsis