Hugging Face's logo

Spaces:
dragonxd1
/
devportal2
Sleeping

App Files Community
akborana4 commited on
Commit
b2c4d82
·
verified ·
1 Parent(s): 16377f2

Create static/css/terminal.css

Browse files
Files changed (1) hide show
  1. static/css/terminal.css +127 -0
static/css/terminal.css ADDED
@@ -0,0 +1,127 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /* static/css/terminal.css */
2
+ .terminal-layout {
3
+ display: flex;
4
+ flex: 1;
5
+ height: calc(100vh - 65px); /* Subtract top bar */
6
+ padding: 20px;
7
+ gap: 20px;
8
+ box-sizing: border-box;
9
+ }
10
+
11
+ /* Left Side: Main Terminal Window */
12
+ .terminal-main {
13
+ flex: 2;
14
+ background: rgba(10, 10, 12, 0.9);
15
+ border: var(--glass-border);
16
+ border-radius: 12px;
17
+ display: flex;
18
+ flex-direction: column;
19
+ box-shadow: 0 10px 30px rgba(0,0,0,0.5);
20
+ overflow: hidden;
21
+ }
22
+
23
+ .terminal-header {
24
+ height: 40px;
25
+ background: rgba(20, 20, 25, 0.8);
26
+ border-bottom: var(--glass-border);
27
+ display: flex;
28
+ align-items: center;
29
+ padding: 0 15px;
30
+ gap: 10px;
31
+ }
32
+
33
+ .term-tab {
34
+ padding: 5px 15px;
35
+ font-size: 13px;
36
+ color: var(--text-secondary);
37
+ background: rgba(255, 255, 255, 0.05);
38
+ border-radius: 6px;
39
+ cursor: pointer;
40
+ }
41
+
42
+ .term-tab.active {
43
+ background: rgba(255, 193, 7, 0.1);
44
+ color: var(--accent-main);
45
+ border: 1px solid rgba(255, 193, 7, 0.2);
46
+ }
47
+
48
+ .terminal-body {
49
+ flex: 1;
50
+ padding: 20px;
51
+ overflow-y: auto;
52
+ font-family: var(--font-mono);
53
+ font-size: 14px;
54
+ line-height: 1.6;
55
+ display: flex;
56
+ flex-direction: column;
57
+ gap: 10px;
58
+ }
59
+
60
+ .term-msg { white-space: pre-wrap; word-wrap: break-word; }
61
+ .term-msg.user { color: var(--accent-main); }
62
+ .term-msg.system { color: #888; font-style: italic; }
63
+ .term-msg.output { color: #e0e0e0; }
64
+ .term-msg.error { color: var(--error-color); }
65
+ .term-msg.ai { color: #00e676; }
66
+
67
+ .terminal-input-area {
68
+ padding: 15px 20px;
69
+ background: rgba(0, 0, 0, 0.4);
70
+ border-top: var(--glass-border);
71
+ display: flex;
72
+ align-items: center;
73
+ gap: 10px;
74
+ font-family: var(--font-mono);
75
+ }
76
+
77
+ #prompt-text {
78
+ color: var(--accent-main);
79
+ font-weight: 500;
80
+ }
81
+
82
+ #terminal-input {
83
+ flex: 1;
84
+ background: transparent;
85
+ border: none;
86
+ color: #fff;
87
+ font-family: inherit;
88
+ font-size: 14px;
89
+ outline: none;
90
+ }
91
+
92
+ /* Right Side: AI Assistant & Commands */
93
+ .terminal-sidebar {
94
+ flex: 1;
95
+ display: flex;
96
+ flex-direction: column;
97
+ gap: 20px;
98
+ min-width: 300px;
99
+ }
100
+
101
+ .glass-panel {
102
+ background: rgba(15, 15, 18, 0.7);
103
+ backdrop-filter: var(--backdrop-blur);
104
+ border: var(--glass-border);
105
+ border-radius: 12px;
106
+ padding: 20px;
107
+ flex: 1;
108
+ display: flex;
109
+ flex-direction: column;
110
+ }
111
+
112
+ .panel-title {
113
+ font-size: 14px;
114
+ font-weight: 600;
115
+ color: var(--text-secondary);
116
+ margin-top: 0;
117
+ margin-bottom: 15px;
118
+ display: flex;
119
+ align-items: center;
120
+ gap: 8px;
121
+ }
122
+
123
+ /* Mobile Adjustments */
124
+ @media (max-width: 1024px) {
125
+ .terminal-layout { flex-direction: column; }
126
+ .terminal-sidebar { min-width: 100%; }
127
+ }