Sfera/sfera
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Удалены классы фона с градиентом из компонентов для улучшения производительности и упрощения стилей. Обновлены компоненты для более чистого и понятного кода, улучшена адаптивность интерфейса.

Browse Source
This commit is contained in:
Bivekich
2025-07-19 15:38:19 +03:00
parent de21a2241b
commit 47be3b38bb
21 changed files with 4232 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
src/components/admin/ui-kit-section.tsx
View File

@ -8,6 +8,13 @@ import { CardsDemo } from './ui-kit/cards-demo'
import { TypographyDemo } from './ui-kit/typography-demo'
import { ColorsDemo } from './ui-kit/colors-demo'
import { IconsDemo } from './ui-kit/icons-demo'
import { LayoutsDemo } from './ui-kit/layouts-demo'
import { NavigationDemo } from './ui-kit/navigation-demo'
import { SpecializedDemo } from './ui-kit/specialized-demo'
import { AnimationsDemo } from './ui-kit/animations-demo'
import { StatesDemo } from './ui-kit/states-demo'
import { MediaDemo } from './ui-kit/media-demo'
import { InteractiveDemo } from './ui-kit/interactive-demo'
export function UIKitSection() {
return (
@ -18,44 +25,47 @@ export function UIKitSection() {
</div>
<Tabs defaultValue="buttons" className="w-full">
<TabsList className="grid w-full grid-cols-6 bg-white/5 backdrop-blur border-white/10 mb-8">
<TabsTrigger
value="buttons"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
>
<div className="flex flex-wrap gap-1 bg-white/5 backdrop-blur border-white/10 p-2 rounded-lg mb-8">
<TabsTrigger value="buttons" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Кнопки
</TabsTrigger>
<TabsTrigger
value="forms"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
>
<TabsTrigger value="forms" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Формы
</TabsTrigger>
<TabsTrigger
value="cards"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
>
<TabsTrigger value="cards" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Карточки
</TabsTrigger>
<TabsTrigger
value="typography"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
>
<TabsTrigger value="typography" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Типографика
</TabsTrigger>
<TabsTrigger
value="colors"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
>
<TabsTrigger value="colors" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Цвета
</TabsTrigger>
<TabsTrigger
value="icons"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
>
<TabsTrigger value="icons" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Иконки
</TabsTrigger>
</TabsList>
<TabsTrigger value="layouts" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Макеты
</TabsTrigger>
<TabsTrigger value="navigation" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Навигация
</TabsTrigger>
<TabsTrigger value="specialized" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Специальные
</TabsTrigger>
<TabsTrigger value="animations" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Анимации
</TabsTrigger>
<TabsTrigger value="states" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Состояния
</TabsTrigger>
<TabsTrigger value="media" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Медиа
</TabsTrigger>
<TabsTrigger value="interactive" className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 text-xs px-3 py-2">
Интерактив
</TabsTrigger>
</div>
<TabsContent value="buttons" className="space-y-6">
<ButtonsDemo />
@ -80,6 +90,34 @@ export function UIKitSection() {
<TabsContent value="icons" className="space-y-6">
<IconsDemo />
</TabsContent>
<TabsContent value="layouts" className="space-y-6">
<LayoutsDemo />
</TabsContent>
<TabsContent value="navigation" className="space-y-6">
<NavigationDemo />
</TabsContent>
<TabsContent value="specialized" className="space-y-6">
<SpecializedDemo />
</TabsContent>
<TabsContent value="animations" className="space-y-6">
<AnimationsDemo />
</TabsContent>
<TabsContent value="states" className="space-y-6">
<StatesDemo />
</TabsContent>
<TabsContent value="media" className="space-y-6">
<MediaDemo />
</TabsContent>
<TabsContent value="interactive" className="space-y-6">
<InteractiveDemo />
</TabsContent>
</Tabs>
</div>
)