fix: 样式微调

IdeaLeap · Feb 2, 2023 · 78aaa01 · 78aaa01
1 parent faaf421
commit 78aaa01
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 6 deletions.
diff --git a/frontend/components/Navs/Item.vue b/frontend/components/Navs/Item.vue
@@ -19,6 +19,7 @@ defineProps({
 
 <style scoped>
 .nav-item {
+  line-height: 1;
   @apply h-full flex items-center text-[15px] border-b-2 border-transparent;
   @apply relative opacity-85 whitespace-nowrap;
   @apply text-black dark:text-[#e8ecfa];
@@ -29,9 +30,9 @@ defineProps({
     @apply opacity-100;
 }
 .nav-item::after {
-  @apply absolute left-2/3 top-0.5 md:(top-2);
+  @apply absolute left-2/3 top-[0.3rem] md:(top-[0.8rem]);
   @apply bg-red-500 text-white;
-  @apply rounded-full px-1.5 py-0.4 whitespace-nowrap;
+  @apply rounded-full px-1.5 py-0.5 whitespace-nowrap;
   @apply transform-gpu scale-60 origin-top-left;
   content: attr(data-badge);
 }

diff --git a/frontend/components/Navs/index.vue b/frontend/components/Navs/index.vue
@@ -46,7 +46,7 @@ const [isMobileNavShown, toggleMobileNavShown] = useToggle()
 }
 
 .logo{
-  @apply flex items-center mr-4 ml-6 h-[2.2rem] w-auto inline-block;
+  @apply flex items-center mr-4 ml-6 w-auto inline-block;
 
 }
 .nav-list{

diff --git a/frontend/components/Uno/DarkToggle.vue b/frontend/components/Uno/DarkToggle.vue
@@ -7,8 +7,7 @@ function toggleDark() {
 </script>
 
 <template>
-  <button class="!outline-none flex" @click="toggleDark">
-    <span>切换主题</span>
-    <div class="dark:i-carbon-moon i-carbon-sun" />
+  <button class="!outline-none flex lt-md:mr-5" @click="toggleDark">
+    <div class="dark:i-carbon-moon i-carbon-sun text-6 text-black dark:text-[#e8ecfa] opacity-85 hover:opacity-100" />
   </button>
 </template>