Hugging Face's logo

Spaces:
johnreaver
/
anycoder-087d6747
Running

App Files Community
johnreaver commited on
Commit
8e41ad4
·
verified ·
1 Parent(s): 01ba4e3

Upload styles/globals.css with huggingface_hub

Browse files
Files changed (1) hide show
  1. styles/globals.css +62 -21
styles/globals.css CHANGED
@@ -2,43 +2,84 @@
2
  @tailwind components;
3
  @tailwind utilities;
4
 
 
 
5
  @layer base {
6
  body {
7
- @apply bg-gray-950 text-gray-100 antialiased;
 
 
 
 
 
 
8
  }
9
  }
10
 
11
  @layer components {
12
- .glass-card {
13
- @apply bg-gray-900/60 backdrop-blur-xl border border-gray-800/50 rounded-2xl;
 
 
 
 
 
 
 
 
 
 
 
 
14
  }
15
- .agent-card {
16
- @apply glass-card p-4 transition-all duration-300 hover:border-indigo-500/50 hover:shadow-lg hover:shadow-indigo-500/10;
 
 
 
 
 
 
 
 
17
  }
18
- .glow-border {
19
- @apply border border-indigo-500/30 shadow-lg shadow-indigo-500/10;
 
 
 
 
 
 
 
 
 
20
  }
21
- .status-dot {
22
- @apply w-2.5 h-2.5 rounded-full;
 
23
  }
24
- .workflow-line {
25
- @apply absolute w-0.5 bg-gradient-to-b from-indigo-500 to-purple-500;
 
 
 
 
 
 
 
26
  }
27
  }
28
 
 
29
  ::-webkit-scrollbar {
30
- width: 6px;
31
- height: 6px;
32
  }
33
-
34
  ::-webkit-scrollbar-track {
35
- @apply bg-gray-900;
 
36
  }
37
-
38
  ::-webkit-scrollbar-thumb {
39
- @apply bg-gray-700 rounded-full;
40
- }
41
-
42
- ::-webkit-scrollbar-thumb:hover {
43
- @apply bg-gray-600;
44
  }
 
2
  @tailwind components;
3
  @tailwind utilities;
4
 
5
+ @import url('https://fonts.googleapis.com/css2?family=Bangers&family=Comic+Neue:wght@400;700&display=swap');
6
+
7
  @layer base {
8
  body {
9
+ @apply bg-comic-white text-comic-black font-['Comic_Neue'] overflow-x-hidden;
10
+ background-image:
11
+ radial-gradient(#000 1px, transparent 1px),
12
+ radial-gradient(#000 1px, transparent 1px);
13
+ background-size: 20px 20px;
14
+ background-position: 0 0, 10px 10px;
15
+ background-color: #f0f0f0;
16
  }
17
  }
18
 
19
  @layer components {
20
+ .comic-card {
21
+ @apply bg-white border-4 border-black shadow-comic rounded-none p-4 relative;
22
+ }
23
+
24
+ .comic-btn {
25
+ @apply bg-comic-yellow border-4 border-black shadow-comic-sm active:shadow-none active:translate-x-[3px] active:translate-y-[3px] transition-all font-bold uppercase tracking-wider px-6 py-2 rounded-none;
26
+ }
27
+
28
+ .comic-input {
29
+ @apply bg-white border-4 border-black shadow-comic-sm focus:outline-none focus:ring-2 focus:ring-comic-blue px-4 py-2 rounded-none font-bold;
30
+ }
31
+
32
+ .speech-bubble {
33
+ @apply relative bg-comic-blue border-4 border-black p-4 rounded-2xl shadow-comic-sm;
34
  }
35
+ .speech-bubble:after {
36
+ content: '';
37
+ position: absolute;
38
+ bottom: -12px;
39
+ left: 20px;
40
+ border-width: 12px 12px 0;
41
+ border-style: solid;
42
+ border-color: black transparent;
43
+ display: block;
44
+ width: 0;
45
  }
46
+ .speech-bubble:before {
47
+ content: '';
48
+ position: absolute;
49
+ bottom: -8px;
50
+ left: 24px;
51
+ border-width: 8px 8px 0;
52
+ border-style: solid;
53
+ border-color: #00BFFF transparent;
54
+ display: block;
55
+ width: 0;
56
+ z-index: 1;
57
  }
58
+
59
+ .chess-square {
60
+ @apply w-full h-full flex items-center justify-center text-4xl sm:text-6xl cursor-pointer select-none transition-transform duration-200 relative;
61
  }
62
+
63
+ .piece-3d {
64
+ @apply drop-shadow-[0_5px_5px_rgba(0,0,0,0.5)] filter;
65
+ text-shadow:
66
+ 2px 2px 0px #000,
67
+ -1px -1px 0 #000,
68
+ 1px -1px 0 #000,
69
+ -1px 1px 0 #000,
70
+ 1px 1px 0 #000;
71
  }
72
  }
73
 
74
+ /* Custom Scrollbar */
75
  ::-webkit-scrollbar {
76
+ width: 12px;
 
77
  }
 
78
  ::-webkit-scrollbar-track {
79
+ background: #f0f0f0;
80
+ border-left: 4px solid black;
81
  }
 
82
  ::-webkit-scrollbar-thumb {
83
+ background: #FFD700;
84
+ border: 4px solid black;
 
 
 
85
  }