Hugging Face's logo

Spaces:
Trigger82
/
Trigger
Sleeping

App Files Community
Trigger82 commited on
Commit
ae10069
·
verified ·
1 Parent(s): 60f5fc7

Update public/style.css

Browse files
Files changed (1) hide show
  1. public/style.css +138 -24
public/style.css CHANGED
@@ -1,41 +1,155 @@
1
- /* Ensure terminal is always visible */
2
- #bot-section,
3
- #terminal,
4
- #output,
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
5
  #command-input {
6
- display: block !important;
7
- opacity: 1 !important;
8
- visibility: visible !important;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9
  }
10
 
11
- /* Connection status indicator */
 
 
 
 
12
  #connection-status {
13
  position: fixed;
14
  bottom: 10px;
15
  right: 10px;
16
- padding: 5px 10px;
17
  background: #333;
18
  color: white;
19
  border-radius: 5px;
 
20
  z-index: 1000;
21
  }
22
 
23
- .terminal {
24
- background: rgba(0,0,0,0.7);
25
- border: 2px solid #8e44ad;
26
  border-radius: 5px;
27
- padding: 15px;
28
- margin-top: 20px;
29
  }
30
 
31
- #output {
32
- background: #111;
33
- color: #0f0;
34
- font-family: monospace;
35
- padding: 10px;
36
- margin-bottom: 10px;
37
- white-space: pre-wrap;
38
- min-height: 200px;
39
- max-height: 50vh;
40
- overflow-y: auto;
 
 
 
 
 
 
 
 
41
  }
 
1
+ /* Base Styles */
2
+ :root {
3
+ --primary: #8e44ad;
4
+ --secondary: #9b59b6;
5
+ --dark: #2c3e50;
6
+ --light: #ecf0f1;
7
+ --success: #2ecc71;
8
+ --danger: #e74c3c;
9
+ --warning: #f39c12;
10
+ --info: #3498db;
11
+ }
12
+
13
+ body {
14
+ margin: 0;
15
+ padding: 0;
16
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
17
+ overflow-x: hidden;
18
+ color: var(--light);
19
+ }
20
+
21
+ /* Video Background */
22
+ #video-background {
23
+ position: fixed;
24
+ top: 0;
25
+ left: 0;
26
+ width: 100vw;
27
+ height: 100vh;
28
+ z-index: -1;
29
+ overflow: hidden;
30
+ }
31
+
32
+ #funk-video {
33
+ position: absolute;
34
+ top: 50%;
35
+ left: 50%;
36
+ min-width: 100%;
37
+ min-height: 100%;
38
+ width: auto;
39
+ height: auto;
40
+ transform: translate(-50%, -50%);
41
+ opacity: 0.15;
42
+ filter: blur(4px);
43
+ }
44
+
45
+ #video-overlay {
46
+ position: absolute;
47
+ top: 0;
48
+ left: 0;
49
+ width: 100%;
50
+ height: 100%;
51
+ background: radial-gradient(circle, rgba(22, 33, 62, 0.85) 0%, rgba(10, 15, 30, 0.95) 100%);
52
+ }
53
+
54
+ /* Main Panel */
55
+ .panel {
56
+ max-width: 1200px;
57
+ margin: 2rem auto;
58
+ padding: 2rem;
59
+ background: rgba(25, 35, 65, 0.8);
60
+ backdrop-filter: blur(10px);
61
+ border-radius: 15px;
62
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
63
+ border: 1px solid rgba(255, 255, 255, 0.1);
64
+ }
65
+
66
+ /* Terminal Styles */
67
+ .terminal {
68
+ background: rgba(0, 0, 0, 0.7);
69
+ border-radius: 8px;
70
+ padding: 1.5rem;
71
+ margin-top: 1.5rem;
72
+ border: 2px solid var(--primary);
73
+ }
74
+
75
+ #output {
76
+ height: 50vh;
77
+ overflow-y: auto;
78
+ background: #111;
79
+ color: #0f0;
80
+ font-family: 'Courier New', monospace;
81
+ padding: 1rem;
82
+ margin-bottom: 1rem;
83
+ white-space: pre-wrap;
84
+ border-radius: 5px;
85
+ }
86
+
87
+ .input-group {
88
+ display: flex;
89
+ gap: 0.5rem;
90
+ }
91
+
92
  #command-input {
93
+ flex: 1;
94
+ padding: 0.75rem;
95
+ background: rgba(255, 255, 255, 0.1);
96
+ border: 1px solid var(--primary);
97
+ border-radius: 5px;
98
+ color: white;
99
+ font-family: 'Courier New', monospace;
100
+ }
101
+
102
+ #send-command {
103
+ background: var(--primary);
104
+ color: white;
105
+ border: none;
106
+ border-radius: 5px;
107
+ padding: 0 1.5rem;
108
+ cursor: pointer;
109
+ transition: all 0.3s;
110
  }
111
 
112
+ #send-command:hover {
113
+ background: var(--secondary);
114
+ }
115
+
116
+ /* Connection Status */
117
  #connection-status {
118
  position: fixed;
119
  bottom: 10px;
120
  right: 10px;
121
+ padding: 0.5rem 1rem;
122
  background: #333;
123
  color: white;
124
  border-radius: 5px;
125
+ font-size: 0.9rem;
126
  z-index: 1000;
127
  }
128
 
129
+ /* Message Classes */
130
+ .message {
131
+ padding: 0.75rem;
132
  border-radius: 5px;
133
+ margin-top: 1rem;
134
+ text-align: center;
135
  }
136
 
137
+ .success {
138
+ background: rgba(46, 204, 113, 0.2);
139
+ color: #2ecc71;
140
+ }
141
+
142
+ .error {
143
+ background: rgba(231, 76, 60, 0.2);
144
+ color: #e74c3c;
145
+ }
146
+
147
+ .warning {
148
+ background: rgba(243, 156, 18, 0.2);
149
+ color: #f39c12;
150
+ }
151
+
152
+ .info {
153
+ background: rgba(52, 152, 219, 0.2);
154
+ color: #3498db;
155
  }