Skip to content

Commit f8adb49

Browse files
antfubotantfubot
committed
fix(plugin-terminals): satisfy lint and formatting
1 parent 22abcf3 commit f8adb49

5 files changed

Lines changed: 64 additions & 29 deletions

File tree

‎plugins/terminals/src/client/App.svelte‎

Lines changed: 20 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,11 @@
3434
onMount(() => {
3535
const mq = window.matchMedia('(prefers-color-scheme: dark)')
3636
isDark = mq.matches
37-
const onMq = (e: MediaQueryListEvent) => isDark = e.matches
37+
document.documentElement.classList.toggle('dark', isDark)
38+
const onMq = (e: MediaQueryListEvent) => {
39+
isDark = e.matches
40+
document.documentElement.classList.toggle('dark', isDark)
41+
}
3842
mq.addEventListener('change', onMq)
3943
4044
const onHashChange = () => {
@@ -138,13 +142,13 @@
138142
}
139143
</script>
140144

141-
<div class="absolute inset-0 flex flex-col font-sans {isDark ? 'bg-[#0d1117] text-[#c9d1d9]' : 'bg-[#f6f8fa] text-[#1f2328]'}">
142-
<div class="flex items-stretch gap-1 p-1.5 border-b {isDark ? 'border-[#1c2128] bg-[#0d1117]' : 'border-[#d0d7de] bg-[#ffffff]'}">
145+
<div class="absolute inset-0 flex flex-col font-sans bg-base color-base">
146+
<div class="flex items-stretch gap-1 p-1.5 border-b border-base bg-base">
143147
<div class="flex gap-1 overflow-x-auto flex-1 items-center">
144148
{#each sessions as s (s.id)}
145149
{#if renamingId === s.id}
146150
<input
147-
class="font-inherit text-xs w-[10ch] min-w-[64px] px-1 py-0.5 border rounded outline-none {isDark ? 'border-[#58a6ff] bg-[#0d1117] text-[#c9d1d9]' : 'border-[#0969da] bg-[#ffffff] text-[#1f2328]'}"
151+
class="font-mono text-xs w-[10ch] min-w-[64px] px-1 py-0.5 border rounded outline-none border-active bg-base color-base"
148152
value={displayName(s)}
149153
spellcheck={false}
150154
onkeydown={(e) => {
@@ -157,24 +161,20 @@
157161
/>
158162
{:else}
159163
<button
160-
class="inline-flex items-center gap-1.5 whitespace-nowrap px-2.5 py-1 rounded-md border text-xs cursor-pointer transition-colors
161-
{activeId === s.id
162-
? (isDark ? 'bg-[#21262d] text-white border-[#30363d]' : 'bg-[#ffffff] text-[#1f2328] border-[#d0d7de]')
163-
: (isDark ? 'bg-[#161b22] text-[#8b949e] border-transparent hover:text-[#c9d1d9]' : 'bg-[#ffffff] text-[#59636e] border-transparent hover:text-[#1f2328]')}"
164+
class="tab-btn {activeId === s.id ? 'tab-btn-active' : ''}"
164165
title="Double-click to rename"
165166
onclick={() => activeId = s.id}
166167
ondblclick={(e) => { e.preventDefault(); e.stopPropagation(); renamingId = s.id }}
167168
>
168169
<span class="w-1.5 h-1.5 rounded-full shrink-0
169-
{s.status === 'running' ? 'bg-[#3fb950]' : s.status === 'exited' ? 'bg-[#6e7681]' : 'bg-[#f85149]'}">
170+
{s.status === 'running' ? 'bg-green-500' : s.status === 'exited' ? 'bg-gray-500' : 'bg-red-500'}">
170171
</span>
171172
<span>{displayName(s)}</span>
172173
</button>
173174
{/if}
174175
{/each}
175176
<button
176-
class="min-w-[28px] justify-center font-semibold text-sm flex-none inline-flex items-center whitespace-nowrap px-2 py-1 rounded-md border border-transparent cursor-pointer transition-colors
177-
{isDark ? 'bg-[#161b22] text-[#8b949e] hover:text-[#c9d1d9]' : 'bg-[#ffffff] text-[#59636e] hover:text-[#1f2328]'}"
177+
class="tab-btn px-2 min-w-[28px] justify-center"
178178
title="New terminal"
179179
onclick={() => spawn({ mode: 'interactive' })}
180180
>
@@ -184,8 +184,7 @@
184184

185185
<div class="flex gap-1.5 items-center">
186186
<select
187-
class="px-2 py-1 rounded-md border text-xs outline-none
188-
{isDark ? 'border-[#30363d] bg-[#21262d] text-[#c9d1d9]' : 'border-[#d0d7de] bg-[#ffffff] text-[#1f2328]'}"
187+
class="px-2 py-1 rounded-md border text-xs outline-none border-base bg-secondary color-base"
189188
disabled={presets.length === 0}
190189
onchange={handleSelectPreset}
191190
>
@@ -197,15 +196,14 @@
197196
</div>
198197
</div>
199198

200-
<div class="flex items-center gap-2 px-2.5 py-1 border-b text-xs min-h-[20px] {isDark ? 'border-[#1c2128] text-[#8b949e]' : 'border-[#d0d7de] text-[#59636e]'}">
199+
<div class="flex items-center gap-2 px-2.5 py-1 border-b text-xs min-h-[20px] border-base text-gray-500 dark:text-gray-400">
201200
{#if activeId}
202201
{@const activeSession = sessions.find(s => s.id === activeId)}
203202
{#if activeSession}
204-
<span class="px-1.5 py-0.5 rounded-full text-[10px] uppercase tracking-wide border
205-
{activeSession.mode === 'interactive' ? (isDark ? 'text-[#58a6ff] border-[#1f6feb55]' : 'text-[#0969da] border-[#0969da55]') : (isDark ? 'text-[#d29922] border-[#9e6a0355]' : 'text-[#bb8009] border-[#9e6a0355]')}">
203+
<span class="px-1.5 py-0.5 rounded-full text-[10px] uppercase tracking-wide border {activeSession.mode === 'interactive' ? 'color-active border-active bg-active' : 'text-amber-600 dark:text-amber-500 border-amber-500/25 bg-amber-500/10'}">
206204
{activeSession.mode}
207205
</span>
208-
<span class="font-mono {isDark ? 'text-[#c9d1d9]' : 'text-[#1f2328]'}">
206+
<span class="font-mono color-base">
209207
{activeSession.command}{activeSession.args.length ? ` ${activeSession.args.join(' ')}` : ''}
210208
</span>
211209
<span>
@@ -214,19 +212,19 @@
214212
: `${activeSession.status}${activeSession.exitCode != null ? ` (${activeSession.exitCode})` : ''}`}
215213
</span>
216214
<div class="flex-1"></div>
217-
<button class="px-2.5 py-1 rounded-md border text-xs cursor-pointer {isDark ? 'border-[#30363d] bg-[#21262d] text-[#c9d1d9] hover:bg-[#30363d]' : 'border-[#d0d7de] bg-[#ffffff] text-[#1f2328] hover:bg-[#eaeef2]'}" onclick={() => rpc.call('devframes-plugin-terminals:restart', { id: activeSession.id }).catch(() => {})}>
218-
<div class="i-ph:arrows-clockwise mr-1 inline-block align-text-bottom"></div> Restart
215+
<button class="btn-action" onclick={() => rpc.call('devframes-plugin-terminals:restart', { id: activeSession.id }).catch(() => {})}>
216+
<div class="i-ph:arrows-clockwise"></div> Restart
219217
</button>
220-
<button class="px-2.5 py-1 rounded-md border text-xs cursor-pointer {isDark ? 'border-[#30363d] bg-[#21262d] text-[#c9d1d9] hover:bg-[#30363d]' : 'border-[#d0d7de] bg-[#ffffff] text-[#1f2328] hover:bg-[#eaeef2]'}" onclick={() => rpc.call('devframes-plugin-terminals:remove', { id: activeSession.id }).catch(() => {})}>
221-
<div class="i-ph:trash mr-1 inline-block align-text-bottom"></div> Kill
218+
<button class="btn-action" onclick={() => rpc.call('devframes-plugin-terminals:remove', { id: activeSession.id }).catch(() => {})}>
219+
<div class="i-ph:trash"></div> Kill
222220
</button>
223221
{/if}
224222
{/if}
225223
</div>
226224

227225
<div class="relative flex-1 overflow-hidden {isDark ? 'bg-black' : 'bg-white'}">
228226
{#if sessions.length === 0}
229-
<div class="absolute inset-0 flex items-center justify-center text-[13px] pointer-events-none {isDark ? 'text-[#6e7681]' : 'text-[#59636e]'}">
227+
<div class="absolute inset-0 flex items-center justify-center text-[13px] pointer-events-none text-gray-400 dark:text-gray-500">
230228
No terminal sessions — click + to start one.
231229
</div>
232230
{/if}

‎plugins/terminals/src/env.d.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
declare module '*.svelte' {
22
import type { Component } from 'svelte'
3+
34
const component: Component<any>
45
export default component
56
}

‎plugins/terminals/src/spa/vite.config.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export default defineConfig({
1010
resolve: { alias },
1111
plugins: [
1212
svelte(),
13-
UnoCSS()
13+
UnoCSS(),
1414
],
1515
build: {
1616
outDir: fileURLToPath(new URL('../../dist/spa', import.meta.url)),

‎plugins/terminals/uno.config.ts‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,42 @@
11
import { defineConfig, presetIcons, presetUno } from 'unocss'
22

33
export default defineConfig({
4+
shortcuts: [
5+
{
6+
'color-base': 'text-gray-800 dark:text-gray-300',
7+
'bg-base': 'bg-white dark:bg-[#111]',
8+
'bg-secondary': 'bg-gray-100 dark:bg-[#222]',
9+
'border-base': 'border-gray-200 dark:border-[#333]',
10+
11+
'color-active': 'text-primary-600 dark:text-primary-400',
12+
'border-active': 'border-primary-600/25 dark:border-primary-400/25',
13+
'bg-active': 'bg-primary-500/10 dark:bg-primary-400/10',
14+
15+
'btn-action': 'border border-base rounded flex gap-1 items-center px-2.5 py-1 text-xs transition-colors hover:bg-active disabled:pointer-events-none disabled:opacity-50 cursor-pointer',
16+
'btn-action-active': 'color-active border-active bg-active',
17+
18+
'tab-btn': 'inline-flex items-center gap-1.5 whitespace-nowrap px-2.5 py-1 rounded-md border border-transparent text-xs cursor-pointer transition-colors bg-secondary text-gray-500 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-200',
19+
'tab-btn-active': 'bg-base text-gray-800 dark:text-gray-200 border-base',
20+
},
21+
],
22+
theme: {
23+
colors: {
24+
primary: {
25+
50: '#E9F4E7',
26+
100: '#D2E8CF',
27+
200: '#A9D3A2',
28+
300: '#7CBC71',
29+
400: '#49833E',
30+
DEFAULT: '#49833E',
31+
500: '#3F7236',
32+
600: '#396831',
33+
700: '#2C5026',
34+
800: '#1D3419',
35+
900: '#0F1C0D',
36+
950: '#080E07',
37+
},
38+
},
39+
},
440
presets: [
541
presetUno(),
642
presetIcons({

‎pnpm-workspace.yaml‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,11 @@ catalogs:
6464
vitepress: ^2.0.0-alpha.17
6565
vitepress-plugin-mermaid: ^2.0.17
6666
frontend:
67+
'@iconify-json/ph': ^1.2.0
68+
'@sveltejs/vite-plugin-svelte': ^5.0.0
69+
'@unocss/preset-icons': ^66.0.0
70+
'@unocss/preset-uno': ^66.0.0
71+
'@unocss/vite': ^66.0.0
6772
'@xterm/addon-fit': ^0.11.0
6873
'@xterm/xterm': ^6.0.0
6974
next: ^16.2.6
@@ -72,12 +77,7 @@ catalogs:
7277
react-dom: ^19.2.6
7378
svelte: ^5.0.0
7479
unocss: ^66.0.0
75-
'@sveltejs/vite-plugin-svelte': ^5.0.0
76-
'@unocss/vite': ^66.0.0
77-
'@unocss/preset-icons': ^66.0.0
78-
'@unocss/preset-uno': ^66.0.0
79-
'@iconify-json/ph': ^1.2.0
80-
'vite-plugin-css-injected-by-js': ^3.5.0
80+
vite-plugin-css-injected-by-js: ^3.5.0
8181
inlined:
8282
'@antfu/utils': ^9.3.0
8383
ua-parser-modern: ^0.1.1

0 commit comments

Comments
 (0)