use correct terminal icon

This commit is contained in:
Nikita Galaiko 2023-04-05 13:47:43 +02:00
parent a97ab9749b
commit 03e0ae4429
5 changed files with 35 additions and 29 deletions

View File

@ -179,9 +179,9 @@
on:mouseover={() => (selection = [groupIdx, commandIdx])}
on:focus={() => (selection = [groupIdx, commandIdx])}
on:click={() => trigger(command.action)}
class="flex w-full gap-2"
class="flex w-full items-center gap-2"
>
<svelte:component this={command.icon} />
<svelte:component this={command.icon} class="h-5 w-5 text-zinc-100" />
<span class="quick-command flex-1 text-left">{command.title}</span>
{#if command.hotkey}
<span class="quick-command-key">{command.hotkey}</span>

View File

@ -1,8 +1,8 @@
import QuickCommit from './QuickCommit.svelte';
import type { Project } from '$lib/projects';
import { GitCommitIcon, RewindIcon } from '../icons';
import { GitCommitIcon, IconTerminal, RewindIcon } from '../icons';
import { matchFiles } from '$lib/git';
import type { SvelteComponentTyped } from 'svelte';
import type { SvelteComponent, SvelteComponentTyped } from 'svelte';
import { format, startOfISOWeek, startOfMonth, subDays, subMonths, subWeeks } from 'date-fns';
type ActionLink = {
@ -32,13 +32,11 @@ export namespace Action {
export const isGroup = (action: Action): action is Group => 'commands' in action;
}
type Icon = Newable<GitCommitIcon> | Newable<RewindIcon>;
export type Command = {
title: string;
hotkey?: string;
action: Action;
icon?: Icon;
icon?: Newable<SvelteComponent>;
};
export type Group = {
@ -63,14 +61,6 @@ const goToProjectGroup = ({ projects, input }: { projects: Project[]; input: str
const actionsGroup = ({ project, input }: { project: Project; input: string }): Group => ({
title: 'Actions',
commands: [
{
title: 'Terminal',
hotkey: 'Shift+t',
action: {
href: `/projects/${project?.id}/terminal/`
},
icon: GitCommitIcon
},
{
title: 'Quick commit',
hotkey: 'c',
@ -89,6 +79,14 @@ const actionsGroup = ({ project, input }: { project: Project; input: string }):
},
icon: GitCommitIcon
},
{
title: 'Terminal',
hotkey: 'Shift+t',
action: {
href: `/projects/${project?.id}/terminal/`
},
icon: IconTerminal
},
{
title: 'Replay History',
hotkey: 'r',

View File

@ -0,0 +1,19 @@
<script lang="ts">
let className = '';
export { className as class };
</script>
<svg
class={className}
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M6.75 7.5l3 2.25-3 2.25m4.5 0h3m-9 8.25h13.5A2.25 2.25 0 0021 18V6a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 6v12a2.25 2.25 0 002.25 2.25z"
/>
</svg>

View File

@ -21,3 +21,4 @@ export { default as IconChevronRight } from './IconChevronRight.svelte';
export { default as IconGitBranch } from './IconGitBranch.svelte';
export { default as IconHome } from './IconHome.svelte';
export { default as IconLoading } from './IconLoading.svelte';
export { default as IconTerminal } from './IconTerminal.svelte';

View File

@ -4,6 +4,7 @@
import { Button, Tooltip } from '$lib/components';
import { page } from '$app/stores';
import { goto } from '$app/navigation';
import { IconTerminal } from '$lib/components/icons';
export let data: LayoutData;
const { project } = data;
@ -70,20 +71,7 @@
&#8984;K
</div>
<a href="/projects/{$project?.id}/terminal">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="h-6 w-6"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M6.75 7.5l3 2.25-3 2.25m4.5 0h3m-9 8.25h13.5A2.25 2.25 0 0021 18V6a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 6v12a2.25 2.25 0 002.25 2.25z"
/>
</svg>
<IconTerminal class="h-6 w-6" />
</a>
</div>