fix: Use CSS for uppercase text (#22011)

This commit is contained in:
Stewart Rand 2025-09-16 00:28:42 -03:00 committed by GitHub
parent 5fb0afb0d0
commit 0f79e0c38e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
40 changed files with 118 additions and 123 deletions

View file

@ -59,7 +59,7 @@
</script>
<div id="camera-selection">
<p class="immich-form-label">{$t('camera').toUpperCase()}</p>
<p class="uppercase immich-form-label">{$t('camera')}</p>
<div class="grid grid-auto-fit-40 gap-5 mt-1">
<div class="w-full">

View file

@ -18,7 +18,7 @@
<div id="date-range-selection" class="grid grid-auto-fit-40 gap-5">
<label class="immich-form-label" for="start-date">
<span>{$t('start_date').toUpperCase()}</span>
<span class="uppercase">{$t('start_date')}</span>
<DateInput
class="immich-form-input w-full mt-1 hover:cursor-pointer"
type="date"
@ -30,7 +30,7 @@
</label>
<label class="immich-form-label" for="end-date">
<span>{$t('end_date').toUpperCase()}</span>
<span class="uppercase">{$t('end_date')}</span>
<DateInput
class="immich-form-input w-full mt-1 hover:cursor-pointer"
type="date"

View file

@ -20,7 +20,7 @@
<div id="display-options-selection">
<fieldset>
<legend class="immich-form-label">{$t('display_options').toUpperCase()}</legend>
<legend class="uppercase immich-form-label">{$t('display_options')}</legend>
<div class="flex flex-wrap gap-x-5 gap-y-2 mt-1">
<div class="flex items-center gap-2">
<Checkbox id="not-in-album-checkbox" size="tiny" bind:checked={filters.isNotInAlbum} />

View file

@ -98,7 +98,7 @@
class="absolute w-full rounded-b-3xl border-2 border-t-0 border-gray-200 bg-white pb-5 shadow-2xl transition-all dark:border-gray-700 dark:bg-immich-dark-gray dark:text-gray-300 z-1"
>
<div class="flex items-center justify-between px-5 pt-5 text-xs">
<p class="py-2" aria-hidden={true}>{$t('recent_searches').toUpperCase()}</p>
<p class="uppercase py-2" aria-hidden={true}>{$t('recent_searches')}</p>
{#if showClearAll}
<button
id={getId(0)}

View file

@ -78,7 +78,7 @@
</script>
<div id="location-selection">
<p class="immich-form-label">{$t('place').toUpperCase()}</p>
<p class="uppercase immich-form-label">{$t('place')}</p>
<div class="grid grid-auto-fit-40 gap-5 mt-1">
<div class="w-full">

View file

@ -12,7 +12,7 @@
<div id="media-type-selection">
<fieldset>
<legend class="immich-form-label">{$t('media_type').toUpperCase()}</legend>
<legend class="uppercase immich-form-label">{$t('media_type')}</legend>
<div class="flex flex-wrap gap-x-5 gap-y-2 mt-1">
<RadioButton name="media-type" id="type-all" bind:group={filteredMedia} label={$t('all')} value={MediaType.All} />
<RadioButton

View file

@ -64,7 +64,7 @@
<div id="people-selection" class="max-h-60 -mb-4 overflow-y-auto immich-scrollbar">
<div class="flex items-center w-full justify-between gap-6">
<p class="immich-form-label py-3">{$t('people').toUpperCase()}</p>
<p class="uppercase immich-form-label py-3">{$t('people')}</p>
<SearchBar bind:name placeholder={$t('filter_people')} showLoadingSpinner={false} />
</div>

View file

@ -20,12 +20,14 @@
<div class="grid grid-auto-fit-40 gap-5">
<label class="immich-form-label" for="start-date">
<Combobox
label={$t('rating').toUpperCase()}
placeholder={$t('search_rating')}
{options}
selectedOption={rating === undefined ? undefined : options[rating]}
onSelect={(r) => (rating = r === undefined ? undefined : Number.parseInt(r.value))}
/>
<div class="[&_label]:uppercase">
<Combobox
label={$t('rating')}
placeholder={$t('search_rating')}
{options}
selectedOption={rating === undefined ? undefined : options[rating]}
onSelect={(r) => (rating = r === undefined ? undefined : Number.parseInt(r.value))}
/>
</div>
</label>
</div>

View file

@ -45,15 +45,17 @@
<div id="location-selection">
<form autocomplete="off" id="create-tag-form">
<div class="my-4 flex flex-col gap-2">
<Combobox
disabled={selectedTags === null}
onSelect={handleSelect}
label={$t('tags').toUpperCase()}
defaultFirstOption
options={allTags.map((tag) => ({ id: tag.id, label: tag.value, value: tag.id }))}
bind:selectedOption
placeholder={$t('search_tags')}
/>
<div class="[&_label]:uppercase">
<Combobox
disabled={selectedTags === null}
onSelect={handleSelect}
label={$t('tags')}
defaultFirstOption
options={allTags.map((tag) => ({ id: tag.id, label: tag.value, value: tag.id }))}
bind:selectedOption
placeholder={$t('search_tags')}
/>
</div>
</div>
<div class="flex items-center gap-2">
<Checkbox

View file

@ -76,7 +76,7 @@
<div class="mb-4 w-full">
<div class="flex place-items-center gap-1">
<label class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm min-h-6" for={label}
<label class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm min-h-6 uppercase" for={label}
>{label}</label
>
{#if required}

View file

@ -87,7 +87,7 @@
bind:isSelected={isSharingSelected}
></SideBarLink>
<p class="text-xs p-6 dark:text-immich-dark-fg">{$t('library').toUpperCase()}</p>
<p class="text-xs p-6 dark:text-immich-dark-fg uppercase">{$t('library')}</p>
<SideBarLink
title={$t('favorites')}

View file

@ -93,14 +93,14 @@
{/if}
{#if showFallback}
<span
class="flex h-full w-full select-none items-center justify-center font-medium"
class="uppercase flex h-full w-full select-none items-center justify-center font-medium"
class:text-xs={size === 'sm'}
class:text-lg={size === 'lg'}
class:text-xl={size === 'xl'}
class:text-2xl={size === 'xxl'}
class:text-3xl={size === 'xxxl'}
>
{(user.name[0] || '').toUpperCase()}
{user.name[0] || ''}
</span>
{/if}
</figure>