Рабочий проект

This commit is contained in:
2026-03-03 19:30:14 +10:00
parent 2692edefd3
commit 082d6e5082
3 changed files with 32 additions and 27 deletions

View File

@@ -1,5 +1,9 @@
@import "tailwindcss"; @import "tailwindcss";
/* Включение dark mode через класс в Tailwind v4 */
/* stylelint-disable-next-line at-rule-no-unknown */
@custom-variant dark (&:where(.dark, .dark *));
/* Базовые стили для светлой темы */ /* Базовые стили для светлой темы */
body { body {
background-color: #f3f4f6; background-color: #f3f4f6;

View File

@@ -1,6 +1,6 @@
<template> <template>
<div <div
class="sticky top-0 w-full sm:w-1/5 sm:h-screen bg-white z-10 pt-5 md:p-5 dark:bg-gray-800" class="sticky top-0 w-full sm:w-1/5 sm:h-screen bg-white z-10 pt-5 md:p-5 dark:bg-gray-800 flex sm:justify-between flex-col"
> >
<div class=""> <div class="">
<!-- Фиксированный левый блок --> <!-- Фиксированный левый блок -->
@@ -49,32 +49,33 @@
Избранное Избранное
</button> </button>
</div> </div>
<!-- Переключатель темы -->
<ThemeToggle /> <div v-if="currentPage === 'status'" class="flex sm:flex-col">
<button
@click="ValueRezylt"
class="bg-gray-300 w-full min-w-30 hover:text-white hover:bg-gray-600 px-4 py-2 rounded cursor-pointer"
>
Результат
</button>
<button
@click="ValueSeting"
class="bg-gray-300 sm:mt-3 w-full min-w-30 hover:text-white hover:bg-gray-600 px-4 py-2 rounded cursor-pointer"
>
Настройка
</button>
<button
@click="Valuestatus"
class="bg-gray-600 sm:mt-3 w-full text-white min-w-30 px-4 py-2 rounded cursor-pointer"
>
Избранное
</button>
</div>
</div> </div>
<!-- Переключатель темы -->
<div class="hidden sm:block"><ThemeToggle /></div>
<div v-if="currentPage === 'status'" class="flex sm:flex-col">
<button
@click="ValueRezylt"
class="bg-gray-300 w-full min-w-30 hover:text-white hover:bg-gray-600 px-4 py-2 rounded cursor-pointer"
>
Результат
</button>
<button
@click="ValueSeting"
class="bg-gray-300 sm:mt-3 w-full min-w-30 hover:text-white hover:bg-gray-600 px-4 py-2 rounded cursor-pointer"
>
Настройка
</button>
<button
@click="Valuestatus"
class="bg-gray-600 sm:mt-3 w-full text-white min-w-30 px-4 py-2 rounded cursor-pointer"
>
Избранное
</button>
</div>
</div> </div>
</template> </template>

View File

@@ -42,7 +42,7 @@ watch(isDark, applyTheme);
<!-- Переключатель (toggle switch) --> <!-- Переключатель (toggle switch) -->
<button <button
@click="toggleTheme" @click="toggleTheme"
class="relative inline-flex h-8 w-14 items-center rounded-full transition-colors duration-300 focus:outline-none focus:ring-2 focus:ring-blue-500" class="relative inline-flex h-8 w-14 items-center rounded-full transition-colors duration-300 cursor-pointer"
:class="isDark ? 'bg-gray-700' : 'bg-gray-300'" :class="isDark ? 'bg-gray-700' : 'bg-gray-300'"
:aria-label="isDark ? 'Переключить на светлую тему' : 'Переключить на темную тему'" :aria-label="isDark ? 'Переключить на светлую тему' : 'Переключить на темную тему'"
> >