Aethel Bot OSS repository!
aethel.xyz
scanash.com
bot
fun
ai
discord
discord-bot
aethel
1@tailwind base;
2@tailwind components;
3@tailwind utilities;
4
5:root {
6 --background: #ffffff;
7 --foreground: #171717;
8 --gradient-light: linear-gradient(135deg, #ffffff 0%, #ffcad4 100%);
9 --gradient-dark: linear-gradient(135deg, #0f0f23 0%, #1a1a2e 50%, #16213e 100%);
10}
11
12.dark {
13 --background: #0f0f23;
14 --foreground: #e5e7eb;
15}
16
17body {
18 color: var(--foreground);
19 background: var(--gradient-light);
20 min-height: 100vh;
21 font-family: 'Inter', Arial, sans-serif;
22 transition: background 0.3s ease, color 0.3s ease;
23}
24
25body.dark {
26 background: var(--gradient-dark);
27}
28
29@media (prefers-reduced-motion: reduce) {
30 * {
31 animation-duration: 0.01ms !important;
32 animation-iteration-count: 1 !important;
33 transition-duration: 0.01ms !important;
34 scroll-behavior: auto !important;
35 }
36 .blur-3xl, .backdrop-blur {
37 backdrop-filter: none !important;
38 filter: none !important;
39 }
40}
41
42.btn {
43 @apply inline-flex items-center justify-center font-semibold rounded-full px-6 py-3 transition-all focus:outline-none focus:ring-2 focus:ring-offset-2 shadow-lg hover:shadow-xl;
44}
45
46.btn-discord {
47 @apply bg-[#5865F2] hover:bg-[#4752c4] text-white hover:-translate-y-0.5 focus:ring-[#5865F2];
48}
49
50.btn-glass {
51 @apply bg-white/80 dark:bg-gray-800/80 backdrop-blur hover:bg-white dark:hover:bg-gray-700 text-gray-900 dark:text-gray-100 hover:-translate-y-0.5 focus:ring-gray-200 dark:focus:ring-gray-600;
52}
53
54.btn-accent {
55 @apply bg-pink-500 hover:bg-pink-600 text-white hover:-translate-y-0.5 focus:ring-pink-500;
56}
57
58.feature-card {
59 @apply relative rounded-2xl p-6 bg-white/80 dark:bg-gray-800/60 backdrop-blur ring-1 ring-gray-900/10 dark:ring-white/10 shadow-sm hover:shadow-xl transition-all hover:-translate-y-1 hover:ring-pink-300/30;
60}
61
62.badge {
63 @apply px-3 py-1 rounded-full bg-white/70 dark:bg-white/5 text-gray-700 dark:text-gray-300 ring-1 ring-gray-900/5 dark:ring-white/10 text-xs;
64}
65
66.input {
67 @apply flex h-10 w-full rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 px-3 py-2 text-sm placeholder:text-gray-500 dark:placeholder:text-gray-400 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50;
68}
69
70.command-card {
71 @apply bg-white/80 dark:bg-gray-800/80 backdrop-blur-sm rounded-lg p-6 shadow-lg;
72}
73
74.stats-card {
75 @apply bg-white/90 dark:bg-gray-800/90 backdrop-blur-sm rounded-lg p-6 shadow-lg border border-white/20 dark:border-gray-700/20;
76}
77
78.status-pulse {
79 animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
80}
81
82@keyframes pulse {
83 0%, 100% {
84 opacity: 1;
85 }
86 50% {
87 opacity: .5;
88 }
89}
90
91.pixel-art {
92 image-rendering: pixelated;
93 image-rendering: crisp-edges;
94}