salvacybersec/CodeNomad
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: align new-session styling and improve dark theme startup

Browse Source
This commit is contained in:
Shantur Rathore
2025-10-29 00:44:51 +00:00
parent 317d076117
commit 30992fbf48
6 changed files with 205 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
src/components/instance-welcome-view.tsx
View File

@@ -231,11 +231,8 @@ const InstanceWelcomeView: Component<InstanceWelcomeViewProps> = (props) => {
<p class="panel-subtitle">Create a fresh conversation with your chosen agent</p>
</div>
<div class="panel-body">
<Show
when={agentList().length > 0}
fallback={<div class="text-sm text-muted">Loading agents...</div>}
>
<div class="space-y-3">
<div class="space-y-3">
<Show when={agentList().length > 0}>
<div>
<label class="block text-xs font-medium text-secondary mb-1.5">Agent</label>
<select
@@ -253,40 +250,36 @@ const InstanceWelcomeView: Component<InstanceWelcomeViewProps> = (props) => {
</For>
</select>
</div>
</Show>
<button
type="button"
class="selector-button selector-button-primary w-full flex items-center justify-between gap-2 font-medium"
onClick={handleNewSession}
disabled={isCreating() || agentList().length === 0}
>
<Show
when={!isCreating()}
fallback={
<div class="flex items-center gap-2 w-full justify-center text-sm">
<svg class="animate-spin h-4 w-4" fill="none" viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
<path
class="opacity-75"
fill="currentColor"
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
/>
</svg>
Creating...
</div>
}
>
<div class="flex items-center gap-2 flex-1 justify-center text-sm">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
</svg>
<span>Create Session</span>
</div>
<kbd class="kbd flex-shrink-0">Cmd+Enter</kbd>
</Show>
</button>
</div>
</Show>
<button
type="button"
class="button-primary w-full flex items-center justify-center text-sm disabled:cursor-not-allowed"
onClick={handleNewSession}
disabled={isCreating() || agentList().length === 0}
>
<div class="flex items-center gap-2">
{isCreating() ? (
<svg class="animate-spin h-4 w-4" fill="none" viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
<path
class="opacity-75"
fill="currentColor"
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
/>
</svg>
) : (
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
</svg>
)}
<span>{agentList().length === 0 ? "Loading agents..." : "Create Session"}</span>
</div>
<kbd class="kbd ml-2">
Cmd+Enter
</kbd>
</button>
</div>
</div>
</div>
</div>

31
src/components/session-picker.tsx
View File

@@ -129,11 +129,38 @@ const SessionPicker: Component<SessionPickerProps> = (props) => {
</Show>
<button
class="selector-button selector-button-primary w-full"
class="button-primary w-full flex items-center justify-center text-sm disabled:cursor-not-allowed"
onClick={handleNewSession}
disabled={isCreating() || agentList().length === 0}
>
{isCreating() ? "Creating..." : "Start"}
<div class="flex items-center gap-2">
<Show
when={!isCreating()}
fallback={
<svg class="animate-spin h-4 w-4" fill="none" viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" />
<path
class="opacity-75"
fill="currentColor"
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
/>
</svg>
}
>
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
</svg>
</Show>
<Show
when={!isCreating()}
fallback={<span>Creating...</span>}
>
<span>{agentList().length === 0 ? "Loading agents..." : "Create Session"}</span>
</Show>
</div>
<kbd class="kbd ml-2">
Cmd+Enter
</kbd>
</button>
</div>
</div>