Skip to content

Commit 76e67c8

Browse files
committed
style(editor): restore the original ide theme
1 parent ef91691 commit 76e67c8

29 files changed

Lines changed: 5199 additions & 603 deletions

.env.example

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
APP_NAME=Laravel
1+
APP_NAME=BlueMenu
22
APP_ENV=local
33
APP_KEY=
44
APP_DEBUG=true

resources/css/app.css

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,8 @@
44
@source '../../storage/framework/views/*.php';
55
@source '../js/**/*.tsx';
66

7-
@theme {
8-
--font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
9-
'Segoe UI Symbol', 'Noto Color Emoji';
10-
}
7+
@import './editor.css';
8+
@import './editor-extras.css';
9+
10+
1111

12-
@layer base {
13-
body {
14-
@apply min-h-screen bg-slate-950 text-slate-100 antialiased;
15-
}
16-
}

resources/css/editor-extras.css

Lines changed: 173 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,173 @@
1+
/* Pieces the React editor adds, in the language of editor.css */
2+
3+
.menu-section {
4+
border-bottom: 1px solid var(--border-color);
5+
}
6+
7+
.demo-banner {
8+
display: flex;
9+
align-items: center;
10+
justify-content: center;
11+
gap: 12px;
12+
padding: 8px 20px;
13+
background: linear-gradient(90deg, #0a4b73 0%, #063049 100%);
14+
color: #dff1ff;
15+
font-size: 13px;
16+
border-bottom: 1px solid var(--border-color);
17+
}
18+
19+
.demo-banner-title {
20+
font-weight: 800;
21+
text-transform: uppercase;
22+
letter-spacing: 1px;
23+
font-size: 11px;
24+
background: rgba(255, 255, 255, 0.12);
25+
padding: 2px 8px;
26+
border-radius: 4px;
27+
}
28+
29+
.terminal-panel {
30+
height: 240px;
31+
display: flex;
32+
flex-direction: column;
33+
background: var(--bg-primary);
34+
border-top: 1px solid var(--border-color);
35+
}
36+
37+
.terminal-output {
38+
flex: 1;
39+
overflow-y: auto;
40+
padding: 8px 12px;
41+
font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
42+
font-size: 12px;
43+
line-height: 1.6;
44+
color: var(--text-primary);
45+
}
46+
47+
.terminal-output p {
48+
white-space: pre-wrap;
49+
}
50+
51+
.terminal-form {
52+
display: flex;
53+
gap: 8px;
54+
padding: 8px 12px;
55+
border-top: 1px solid var(--border-color);
56+
}
57+
58+
.terminal-form input {
59+
flex: 1;
60+
}
61+
62+
/* Inputs the original sheet only styled inside modals. */
63+
.editor-field select,
64+
.editor-field textarea,
65+
.editor-field input,
66+
.inline-input {
67+
width: 100%;
68+
padding: 8px 12px;
69+
background: var(--bg-primary);
70+
border: 1px solid var(--border-color);
71+
border-radius: 4px;
72+
color: var(--text-primary);
73+
font-size: 13px;
74+
font-family: inherit;
75+
}
76+
77+
.editor-field select:focus,
78+
.editor-field textarea:focus,
79+
.editor-field input:focus,
80+
.inline-input:focus {
81+
outline: none;
82+
border-color: var(--accent-color);
83+
}
84+
85+
.editor-field .field-hint {
86+
display: block;
87+
margin-top: 4px;
88+
font-size: 11px;
89+
color: var(--text-secondary);
90+
}
91+
92+
.editor-row {
93+
display: flex;
94+
gap: 6px;
95+
align-items: center;
96+
margin-bottom: 6px;
97+
}
98+
99+
.editor-row .inline-input {
100+
min-width: 0;
101+
}
102+
103+
.section-heading {
104+
display: flex;
105+
align-items: center;
106+
justify-content: space-between;
107+
margin-bottom: 8px;
108+
font-size: 11px;
109+
font-weight: 600;
110+
text-transform: uppercase;
111+
letter-spacing: 0.5px;
112+
color: var(--text-secondary);
113+
}
114+
115+
.empty-note {
116+
font-size: 12px;
117+
color: var(--text-secondary);
118+
}
119+
120+
.entry-card {
121+
border: 1px solid var(--border-color);
122+
border-radius: 4px;
123+
background: var(--bg-tertiary);
124+
padding: 10px;
125+
margin-bottom: 8px;
126+
}
127+
128+
.entry-card-header {
129+
display: flex;
130+
align-items: center;
131+
gap: 8px;
132+
margin-bottom: 8px;
133+
font-size: 12px;
134+
color: var(--text-secondary);
135+
}
136+
137+
.swatch-row {
138+
display: flex;
139+
flex-wrap: wrap;
140+
gap: 4px;
141+
margin-bottom: 6px;
142+
}
143+
144+
.swatch {
145+
width: 18px;
146+
height: 18px;
147+
border-radius: 3px;
148+
border: 1px solid var(--border-color);
149+
cursor: pointer;
150+
}
151+
152+
.format-toolbar {
153+
display: flex;
154+
flex-wrap: wrap;
155+
gap: 4px;
156+
margin-bottom: 6px;
157+
}
158+
159+
.preview-line {
160+
display: block;
161+
font-family: 'Mojang', 'Consolas', monospace;
162+
font-size: 13px;
163+
margin-top: 4px;
164+
white-space: pre-wrap;
165+
}
166+
167+
.badge-sync {
168+
color: #54c8ff;
169+
}
170+
171+
.badge-warn {
172+
color: var(--warning-color);
173+
}

0 commit comments

Comments
 (0)