warp-tech/warpgate
1
1
Fork 0
mirror of https://github.com/warp-tech/warpgate.git synced 2025-09-06 06:34:32 +08:00
Code Issues Projects Releases Packages Wiki Activity

button accessibility

Browse source
This commit is contained in:
Eugene 2025-07-05 20:39:32 +02:00
parent 4d6af47a1f
commit 010fa87ac5
No known key found for this signature in database
GPG key ID: 5896FCBBDD1CF4F4
5 changed files with 56 additions and 74 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
warpgate-web/src/admin/CredentialEditor.svelte
View file

@ -269,10 +269,9 @@
{/if}
{#if credential.kind === CredentialKind.PublicKey || credential.kind === CredentialKind.Sso}
<!-- svelte-ignore a11y_invalid_attribute -->
<a
class="ms-2"
href=""
<Button
class="ms-2 px-0"
color="link"
onclick={e => {
if (credential.kind === CredentialKind.Sso) {
editingSsoCredentialInstance = credential
@ -285,18 +284,17 @@
e.preventDefault()
}}>
Change
</a>
</Button>
{/if}
<!-- svelte-ignore a11y_invalid_attribute -->
<a
class="ms-2"
href=""
<Button
class="ms-2 px-0"
color="link"
onclick={e => {
deleteCredential(credential)
e.preventDefault()
}}>
Delete
</a>
</Button>
</div>
{/each}
</div>

44
warpgate-web/src/admin/config/SSHKeys.svelte
View file

@ -1,26 +1,27 @@
<script lang="ts">
import { api, type SSHKey, type SSHKnownHost } from 'admin/lib/api'
import Alert from 'common/sveltestrap-s5-ports/Alert.svelte'
import CopyButton from 'common/CopyButton.svelte'
import { stringifyError } from 'common/errors'
import { api, type SSHKey, type SSHKnownHost } from 'admin/lib/api'
import Alert from 'common/sveltestrap-s5-ports/Alert.svelte'
import CopyButton from 'common/CopyButton.svelte'
import { stringifyError } from 'common/errors'
import { Button } from '@sveltestrap/sveltestrap'
let error: string|undefined = $state()
let knownHosts: SSHKnownHost[]|undefined = $state()
let ownKeys: SSHKey[]|undefined = $state()
let error: string|undefined = $state()
let knownHosts: SSHKnownHost[]|undefined = $state()
let ownKeys: SSHKey[]|undefined = $state()
async function load () {
ownKeys = await api.getSshOwnKeys()
knownHosts = await api.getSshKnownHosts()
}
async function load () {
ownKeys = await api.getSshOwnKeys()
knownHosts = await api.getSshKnownHosts()
}
load().catch(async e => {
error = await stringifyError(e)
})
load().catch(async e => {
error = await stringifyError(e)
})
async function deleteHost (host: SSHKnownHost) {
await api.deleteSshKnownHost(host)
load()
}
async function deleteHost (host: SSHKnownHost) {
await api.deleteSshKnownHost(host)
load()
}
</script>
@ -40,7 +41,7 @@ async function deleteHost (host: SSHKnownHost) {
<div class="list-group-item d-flex">
<pre>{key.kind} {key.publicKeyBase64}</pre>
<div class="ms-auto">
<CopyButton class="ms-3" link text={key.kind + ' ' + key.publicKeyBase64} />
<CopyButton class="ms-3 px-0" text={key.kind + ' ' + key.publicKeyBase64} />
</div>
</div>
{/each}
@ -62,11 +63,10 @@ async function deleteHost (host: SSHKnownHost) {
{host.host}:{host.port}
</strong>
<!-- svelte-ignore a11y_invalid_attribute -->
<a class="ms-auto" href="" onclick={e => {
<Button class="ms-auto" color="link px-0" onclick={e => {
e.preventDefault()
deleteHost(host)
}}>Delete</a>
}}>Delete</Button>
</div>
<pre>{host.keyType} {host.keyBase64}</pre>
</div>

8
warpgate-web/src/admin/config/Tickets.svelte
View file

@ -7,6 +7,7 @@
import { stringifyError } from 'common/errors'
import Alert from 'common/sveltestrap-s5-ports/Alert.svelte'
import EmptyState from 'common/EmptyState.svelte'
import { Button } from '@sveltestrap/sveltestrap'
let error: string|undefined = $state()
let tickets: Ticket[]|undefined = $state()
@ -48,7 +49,6 @@
{#if tickets.length}
<div class="list-group list-group-flush">
{#each tickets as ticket (ticket.id)}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="list-group-item">
<div>
<strong>
@ -80,12 +80,10 @@
<small class="text-muted me-4 ms-auto">
<RelativeDate date={ticket.created} />
</small>
<!-- svelte-ignore a11y_click_events_have_key_events -->
<!-- svelte-ignore a11y_missing_attribute -->
<a onclick={e => {
<Button color="link" onclick={e => {
deleteTicket(ticket)
e.preventDefault()
}}>Delete</a>
}}>Delete</Button>
</div>
{/each}
</div>

17
warpgate-web/src/gateway/ApiTokenManager.svelte
View file

@ -8,6 +8,7 @@
import CopyButton from 'common/CopyButton.svelte'
import Badge from 'common/sveltestrap-s5-ports/Badge.svelte'
import EmptyState from 'common/EmptyState.svelte'
import { Button } from '@sveltestrap/sveltestrap'
let tokens: ExistingApiToken[] = $state([])
let creatingToken = $state(false)
@ -29,13 +30,10 @@
<div class="page-summary-bar mt-4">
<h1>API tokens</h1>
<!-- svelte-ignore a11y_click_events_have_key_events -->
<!-- svelte-ignore a11y_no_static_element_interactions -->
<!-- svelte-ignore a11y_missing_attribute -->
<a class="btn btn-primary ms-auto" onclick={e => {
<Button color="primary" class="ms-auto" onclick={e => {
creatingToken = true
e.preventDefault()
}}>Create token</a>
}}>Create token</Button>
</div>
{#if lastCreatedSecret}
@ -58,9 +56,7 @@
<div class="list-group list-group-flush mb-3">
{#each tokens as token (token.id)}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<!-- svelte-ignore a11y_missing_attribute -->
<div class="list-group-item d-flex align-items-center">
<div class="list-group-item d-flex align-items-center pr-0">
<Fa fw icon={faKey} />
<span class="label ms-3">{token.label}</span>
{#if token.expiry.getTime() < now}
@ -69,8 +65,7 @@
<Badge color="success" class="ms-2">{token.expiry.toLocaleDateString()}</Badge>
{/if}
<span class="ms-auto"></span>
<!-- svelte-ignore a11y_click_events_have_key_events -->
<a
<Button
color="link"
class="ms-2"
onclick={e => {
@ -79,7 +74,7 @@
}}
>
Delete
</a>
</Button>
</div>
{/each}
</div>

43
warpgate-web/src/gateway/CredentialManager.svelte
View file

@ -9,6 +9,7 @@
import CreateOtpModal from 'admin/CreateOtpModal.svelte'
import CredentialUsedStateBadge from 'common/CredentialUsedStateBadge.svelte'
import Loadable from 'common/Loadable.svelte'
import { Button } from '@sveltestrap/sveltestrap'
let creds: CredentialsState | undefined = $state()
@ -78,11 +79,9 @@
{/if}
<span class="ms-auto"></span>
<!-- svelte-ignore a11y_click_events_have_key_events -->
<!-- svelte-ignore a11y_no_static_element_interactions -->
<!-- svelte-ignore a11y_missing_attribute -->
<a
<Button
class="ms-2"
color="link"
onclick={e => {
changingPassword = true
e.preventDefault()
@ -96,7 +95,7 @@
{#if creds.password === PasswordState.MultipleSet}
Reset password
{/if}
</a>
</Button>
</div>
</div>
@ -109,13 +108,10 @@
<div class="d-flex align-items-center mt-4 mb-2">
<h4 class="m-0">One-time passwords</h4>
<span class="ms-auto"></span>
<!-- svelte-ignore a11y_click_events_have_key_events -->
<!-- svelte-ignore a11y_missing_attribute -->
<!-- svelte-ignore a11y_no_static_element_interactions -->
<a color="link" onclick={e => {
<Button color="link" onclick={e => {
creatingOtpCredential = true
e.preventDefault()
}}>Add device</a>
}}>Add device</Button>
</div>
<div class="list-group list-group-flush mb-3">
@ -124,18 +120,16 @@
<Fa fw icon={faMobilePhone} />
<span class="label ms-3">OTP device</span>
<span class="ms-auto"></span>
<!-- svelte-ignore a11y_no_static_element_interactions -->
<!-- svelte-ignore a11y_missing_attribute -->
<!-- svelte-ignore a11y_click_events_have_key_events -->
<a
<Button
class="ms-2"
color="link"
onclick={e => {
deleteOtp(credential)
e.preventDefault()
}}
>
Delete
</a>
</Button>
</div>
{/each}
</div>
@ -149,13 +143,10 @@
<div class="d-flex align-items-center mt-4 mb-2">
<h4 class="m-0">Public keys</h4>
<span class="ms-auto"></span>
<!-- svelte-ignore a11y_click_events_have_key_events -->
<!-- svelte-ignore a11y_missing_attribute -->
<!-- svelte-ignore a11y_no_static_element_interactions -->
<a color="link" onclick={e => {
<Button color="link" onclick={e => {
creatingPublicKeyCredential = true
e.preventDefault()
}}>Add key</a>
}}>Add key</Button>
</div>
<div class="list-group list-group-flush mb-3">
@ -168,18 +159,16 @@
</div>
<span class="ms-auto"></span>
<CredentialUsedStateBadge credential={credential} />
<!-- svelte-ignore a11y_click_events_have_key_events -->
<!-- svelte-ignore a11y_missing_attribute -->
<!-- svelte-ignore a11y_no_static_element_interactions -->
<a
class="ms-2"
<Button
class="ms-2"
color="link"
onclick={e => {
deletePublicKey(credential)
e.preventDefault()
}}
>
Delete
</a>
</Button>
</div>
{/each}
</div>
@ -236,5 +225,7 @@
.credential {
display: flex;
align-items: center;
padding-left: 0;
padding-right: 0;
}
</style>