Improve environments compat description and fix accessibility issues project-wide

This commit is contained in:
Prospector
2024-08-20 23:32:36 -07:00
parent 2d416d491c
commit 9deddbbe7c
32 changed files with 336 additions and 281 deletions

View File

@@ -5,14 +5,19 @@
<div class="search-row">
<div class="iconified-input">
<label for="search-input" hidden>{{ formatMessage(messages.searchInputLabel) }}</label>
<SearchIcon />
<SearchIcon aria-hidden="true" />
<input id="search-input" v-model="filterQuery" type="text" />
<Button v-if="filterQuery" class="r-btn" @click="() => (filterQuery = '')">
<XIcon />
<Button
v-if="filterQuery"
class="r-btn"
aria-label="Clear search"
@click="() => (filterQuery = '')"
>
<XIcon aria-hidden="true" />
</Button>
</div>
<Button color="primary" @click="(event) => $refs.modal_creation.show(event)">
<PlusIcon /> {{ formatMessage(messages.createNewButton) }}
<PlusIcon aria-hidden="true" /> {{ formatMessage(messages.createNewButton) }}
</Button>
</div>
<div class="collections-grid">
@@ -29,7 +34,7 @@
</span>
<div class="stat-bar">
<div class="stats">
<BoxIcon />
<BoxIcon aria-hidden="true" />
{{
formatMessage(messages.projectsCountLabel, {
count: formatCompactNumber(user ? user.follows.length : 0),
@@ -37,7 +42,8 @@
}}
</div>
<div class="stats">
<LockIcon /> <span> {{ formatMessage(commonMessages.privateLabel) }} </span>
<LockIcon aria-hidden="true" />
<span> {{ formatMessage(commonMessages.privateLabel) }} </span>
</div>
</div>
</div>
@@ -56,7 +62,7 @@
</span>
<div class="stat-bar">
<div class="stats">
<BoxIcon />
<BoxIcon aria-hidden="true" />
{{
formatMessage(messages.projectsCountLabel, {
count: formatCompactNumber(collection.projects?.length || 0),
@@ -65,19 +71,19 @@
</div>
<div class="stats">
<template v-if="collection.status === 'listed'">
<WorldIcon />
<WorldIcon aria-hidden="true" />
<span> {{ formatMessage(commonMessages.publicLabel) }} </span>
</template>
<template v-else-if="collection.status === 'unlisted'">
<LinkIcon />
<LinkIcon aria-hidden="true" />
<span> {{ formatMessage(commonMessages.unlistedLabel) }} </span>
</template>
<template v-else-if="collection.status === 'private'">
<LockIcon />
<LockIcon aria-hidden="true" />
<span> {{ formatMessage(commonMessages.privateLabel) }} </span>
</template>
<template v-else-if="collection.status === 'rejected'">
<XIcon />
<XIcon aria-hidden="true" />
<span> {{ formatMessage(commonMessages.rejectedLabel) }} </span>
</template>
</div>

View File

@@ -6,7 +6,7 @@
<h2 class="header__title text-2xl">Organizations</h2>
<div class="input-group">
<button class="iconified-button brand-button" @click="openCreateOrgModal">
<PlusIcon />
<PlusIcon aria-hidden="true" />
Create organization
</button>
</div>
@@ -30,7 +30,7 @@
</div>
<span class="stat-bar">
<div class="stats">
<UsersIcon />
<UsersIcon aria-hidden="true" />
<span>
{{ onlyAcceptedMembers(org.members).length }} member<template
v-if="onlyAcceptedMembers(org.members).length !== 1"