Skip to content

Commit 6f562c7

Browse files
stewxstewx
committed
fix: Use CSS for uppercase text
1 parent dad81af commit 6f562c7

40 files changed

+118
-123
lines changed

‎web/src/lib/components/admin-page/jobs/job-tile.svelte‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@
6767
<div class="flex items-center gap-4 text-xl font-semibold text-immich-primary dark:text-immich-dark-primary">
6868
<span class="flex items-center gap-2">
6969
<Icon path={icon} size="1.25em" class="hidden shrink-0 sm:block" />
70-
{title.toUpperCase()}
70+
<span class="uppercase">{title}</span>
7171
</span>
7272
<div class="flex gap-2">
7373
{#if jobCounts.failed > 0}
@@ -137,28 +137,28 @@
137137
onClick={() => onCommand({ command: JobCommand.Start, force: false })}
138138
>
139139
<Icon path={mdiAlertCircle} size="36" />
140-
{$t('disabled').toUpperCase()}
140+
<span class="uppercase">{$t('disabled')}</span>
141141
</JobTileButton>
142142
{/if}
143143

144144
{#if !disabled && !isIdle}
145145
{#if waitingCount > 0}
146146
<JobTileButton color="gray" onClick={() => onCommand({ command: JobCommand.Empty, force: false })}>
147147
<Icon path={mdiClose} size="24" />
148-
{$t('clear').toUpperCase()}
148+
<span class="uppercase">{$t('clear')}</span>
149149
</JobTileButton>
150150
{/if}
151151
{#if queueStatus.isPaused}
152152
{@const size = waitingCount > 0 ? '24' : '48'}
153153
<JobTileButton color="light-gray" onClick={() => onCommand({ command: JobCommand.Resume, force: false })}>
154154
<!-- size property is not reactive, so have to use width and height -->
155155
<Icon path={mdiFastForward} {size} />
156-
{$t('resume').toUpperCase()}
156+
<span class="uppercase">{$t('resume')}</span>
157157
</JobTileButton>
158158
{:else}
159159
<JobTileButton color="light-gray" onClick={() => onCommand({ command: JobCommand.Pause, force: false })}>
160160
<Icon path={mdiPause} size="24" />
161-
{$t('pause').toUpperCase()}
161+
<span class="uppercase">{$t('pause')}</span>
162162
</JobTileButton>
163163
{/if}
164164
{/if}
@@ -167,25 +167,25 @@
167167
{#if allText}
168168
<JobTileButton color="dark-gray" onClick={() => onCommand({ command: JobCommand.Start, force: true })}>
169169
<Icon path={mdiAllInclusive} size="24" />
170-
{allText}
170+
<span class="uppercase">{allText}</span>
171171
</JobTileButton>
172172
{/if}
173173
{#if refreshText}
174174
<JobTileButton color="gray" onClick={() => onCommand({ command: JobCommand.Start, force: undefined })}>
175175
<Icon path={mdiImageRefreshOutline} size="24" />
176-
{refreshText}
176+
<span class="uppercase">{refreshText}</span>
177177
</JobTileButton>
178178
{/if}
179179
<JobTileButton color="light-gray" onClick={() => onCommand({ command: JobCommand.Start, force: false })}>
180180
<Icon path={mdiSelectionSearch} size="24" />
181-
{missingText}
181+
<span class="uppercase">{missingText}</span>
182182
</JobTileButton>
183183
{/if}
184184

185185
{#if !disabled && !multipleButtons && isIdle}
186186
<JobTileButton color="light-gray" onClick={() => onCommand({ command: JobCommand.Start, force: false })}>
187187
<Icon path={mdiPlay} size="48" />
188-
{missingText}
188+
<span class="uppercase">{missingText}</span>
189189
</JobTileButton>
190190
{/if}
191191
</div>

‎web/src/lib/components/admin-page/jobs/jobs-panel.svelte‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -177,9 +177,9 @@
177177
{disabled}
178178
{subtitle}
179179
{description}
180-
allText={allText?.toUpperCase()}
181-
refreshText={refreshText?.toUpperCase()}
182-
missingText={missingText.toUpperCase()}
180+
{allText}
181+
{refreshText}
182+
{missingText}
183183
{jobCounts}
184184
{queueStatus}
185185
onCommand={(command) => (handleCommandOverride || handleCommand)(jobName, command)}

‎web/src/lib/components/admin-page/server-stats/server-stats-panel.svelte‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -36,19 +36,19 @@
3636

3737
<div class="flex flex-col gap-5">
3838
<div>
39-
<p class="text-sm dark:text-immich-dark-fg">{$t('total_usage').toUpperCase()}</p>
39+
<p class="text-sm dark:text-immich-dark-fg uppercase">{$t('total_usage')}</p>
4040

4141
<div class="mt-5 hidden justify-between lg:flex gap-4">
42-
<StatsCard icon={mdiCameraIris} title={$t('photos').toUpperCase()} value={stats.photos} />
43-
<StatsCard icon={mdiPlayCircle} title={$t('videos').toUpperCase()} value={stats.videos} />
44-
<StatsCard icon={mdiChartPie} title={$t('storage').toUpperCase()} value={statsUsage} unit={statsUsageUnit} />
42+
<StatsCard icon={mdiCameraIris} title={$t('photos')} value={stats.photos} />
43+
<StatsCard icon={mdiPlayCircle} title={$t('videos')} value={stats.videos} />
44+
<StatsCard icon={mdiChartPie} title={$t('storage')} value={statsUsage} unit={statsUsageUnit} />
4545
</div>
4646
<div class="mt-5 flex lg:hidden">
4747
<div class="flex flex-col justify-between rounded-3xl bg-subtle p-5 dark:bg-immich-dark-gray">
4848
<div class="flex flex-wrap gap-x-12">
4949
<div class="flex place-items-center gap-4 text-immich-primary dark:text-immich-dark-primary">
5050
<Icon path={mdiCameraIris} size="25" />
51-
<p>{$t('photos').toUpperCase()}</p>
51+
<p class="uppercase">{$t('photos')}</p>
5252
</div>
5353

5454
<div class="relative text-center font-mono text-2xl font-semibold">
@@ -60,7 +60,7 @@
6060
<div class="flex flex-wrap gap-x-12">
6161
<div class="flex place-items-center gap-4 text-immich-primary dark:text-immich-dark-primary">
6262
<Icon path={mdiPlayCircle} size="25" />
63-
<p>{$t('videos').toUpperCase()}</p>
63+
<p class="uppercase">{$t('videos')}</p>
6464
</div>
6565

6666
<div class="relative text-center font-mono text-2xl font-semibold">
@@ -72,7 +72,7 @@
7272
<div class="flex flex-wrap gap-x-7">
7373
<div class="flex place-items-center gap-4 text-immich-primary dark:text-immich-dark-primary">
7474
<Icon path={mdiChartPie} size="25" />
75-
<p>{$t('storage').toUpperCase()}</p>
75+
<p class="uppercase">{$t('storage')}</p>
7676
</div>
7777

7878
<div class="relative flex text-center font-mono text-2xl font-semibold">
@@ -87,7 +87,7 @@
8787
</div>
8888

8989
<div>
90-
<p class="text-sm dark:text-immich-dark-fg">{$t('user_usage_detail').toUpperCase()}</p>
90+
<p class="text-sm dark:text-immich-dark-fg uppercase">{$t('user_usage_detail')}</p>
9191
<table class="mt-5 w-full text-start">
9292
<thead
9393
class="mb-4 flex h-12 w-full rounded-md border bg-gray-50 text-immich-primary dark:border-immich-dark-gray dark:bg-immich-dark-gray dark:text-immich-dark-primary"

‎web/src/lib/components/admin-page/server-stats/stats-card.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
<div class="flex h-[140px] w-full flex-col justify-between rounded-3xl bg-subtle text-primary p-5">
2525
<div class="flex place-items-center gap-4">
2626
<Icon path={icon} size="40" />
27-
<Text size="large" fontWeight="bold">{title}</Text>
27+
<Text size="large" fontWeight="bold" class="uppercase">{title}</Text>
2828
</div>
2929

3030
<div class="relative mx-auto font-mono text-2xl font-semibold">

‎web/src/lib/components/admin-page/settings/auth/auth-settings.svelte‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -183,7 +183,7 @@
183183

184184
<SettingInputField
185185
inputType={SettingInputFieldType.TEXT}
186-
label={$t('admin.oauth_timeout').toUpperCase()}
186+
label={$t('admin.oauth_timeout')}
187187
description={$t('admin.oauth_timeout_description')}
188188
required={true}
189189
bind:value={config.oauth.timeout}
@@ -193,7 +193,7 @@
193193

194194
<SettingInputField
195195
inputType={SettingInputFieldType.TEXT}
196-
label={$t('admin.oauth_storage_label_claim').toUpperCase()}
196+
label={$t('admin.oauth_storage_label_claim')}
197197
description={$t('admin.oauth_storage_label_claim_description')}
198198
bind:value={config.oauth.storageLabelClaim}
199199
required={true}
@@ -203,7 +203,7 @@
203203

204204
<SettingInputField
205205
inputType={SettingInputFieldType.TEXT}
206-
label={$t('admin.oauth_role_claim').toUpperCase()}
206+
label={$t('admin.oauth_role_claim')}
207207
description={$t('admin.oauth_role_claim_description')}
208208
bind:value={config.oauth.roleClaim}
209209
required={true}
@@ -213,7 +213,7 @@
213213

214214
<SettingInputField
215215
inputType={SettingInputFieldType.TEXT}
216-
label={$t('admin.oauth_storage_quota_claim').toUpperCase()}
216+
label={$t('admin.oauth_storage_quota_claim')}
217217
description={$t('admin.oauth_storage_quota_claim_description')}
218218
bind:value={config.oauth.storageQuotaClaim}
219219
required={true}
@@ -223,7 +223,7 @@
223223

224224
<SettingInputField
225225
inputType={SettingInputFieldType.NUMBER}
226-
label={$t('admin.oauth_storage_quota_default').toUpperCase()}
226+
label={$t('admin.oauth_storage_quota_default')}
227227
description={$t('admin.oauth_storage_quota_default_description')}
228228
bind:value={config.oauth.defaultStorageQuota}
229229
required={false}
@@ -233,29 +233,29 @@
233233

234234
<SettingInputField
235235
inputType={SettingInputFieldType.TEXT}
236-
label={$t('admin.oauth_button_text').toUpperCase()}
236+
label={$t('admin.oauth_button_text')}
237237
bind:value={config.oauth.buttonText}
238238
required={false}
239239
disabled={disabled || !config.oauth.enabled}
240240
isEdited={!(config.oauth.buttonText == savedConfig.oauth.buttonText)}
241241
/>
242242

243243
<SettingSwitch
244-
title={$t('admin.oauth_auto_register').toUpperCase()}
244+
title={$t('admin.oauth_auto_register')}
245245
subtitle={$t('admin.oauth_auto_register_description')}
246246
bind:checked={config.oauth.autoRegister}
247247
disabled={disabled || !config.oauth.enabled}
248248
/>
249249

250250
<SettingSwitch
251-
title={$t('admin.oauth_auto_launch').toUpperCase()}
251+
title={$t('admin.oauth_auto_launch')}
252252
subtitle={$t('admin.oauth_auto_launch_description')}
253253
disabled={disabled || !config.oauth.enabled}
254254
bind:checked={config.oauth.autoLaunch}
255255
/>
256256

257257
<SettingSwitch
258-
title={$t('admin.oauth_mobile_redirect_uri_override').toUpperCase()}
258+
title={$t('admin.oauth_mobile_redirect_uri_override')}
259259
subtitle={$t('admin.oauth_mobile_redirect_uri_override_description', {
260260
values: { callback: 'app.immich:///oauth-callback' },
261261
})}
@@ -267,7 +267,7 @@
267267
{#if config.oauth.mobileOverrideEnabled}
268268
<SettingInputField
269269
inputType={SettingInputFieldType.TEXT}
270-
label={$t('admin.oauth_mobile_redirect_uri').toUpperCase()}
270+
label={$t('admin.oauth_mobile_redirect_uri')}
271271
bind:value={config.oauth.mobileRedirectUri}
272272
required={true}
273273
disabled={disabled || !config.oauth.enabled}

‎web/src/lib/components/admin-page/settings/storage-template/storage-template-settings.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -184,7 +184,7 @@
184184
<h3 class="text-base font-medium text-immich-primary dark:text-immich-dark-primary">{$t('template')}</h3>
185185

186186
<div class="my-2 text-sm">
187-
<h4>{$t('preview').toUpperCase()}</h4>
187+
<h4 class="uppercase">{$t('preview')}</h4>
188188
</div>
189189

190190
<p class="text-sm">

‎web/src/lib/components/admin-page/settings/storage-template/supported-datetime-panel.svelte‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
</script>
1717

1818
<div class="mt-2 text-sm">
19-
<h4>{$t('date_and_time').toUpperCase()}</h4>
19+
<h4 class="uppercase">{$t('date_and_time')}</h4>
2020
</div>
2121

2222
<!-- eslint-disable svelte/no-useless-mustaches -->
@@ -27,7 +27,7 @@
2727
</div>
2828
<div class="flex gap-[40px]">
2929
<div>
30-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('year').toUpperCase()}</p>
30+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('year')}</p>
3131
<ul>
3232
{#each options.yearOptions as yearFormat, index (index)}
3333
<li>{'{{'}{yearFormat}{'}}'} - {getLuxonExample(yearFormat)}</li>
@@ -36,7 +36,7 @@
3636
</div>
3737

3838
<div>
39-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('month').toUpperCase()}</p>
39+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('month')}</p>
4040
<ul>
4141
{#each options.monthOptions as monthFormat, index (index)}
4242
<li>{'{{'}{monthFormat}{'}}'} - {getLuxonExample(monthFormat)}</li>
@@ -45,7 +45,7 @@
4545
</div>
4646

4747
<div>
48-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('week').toUpperCase()}</p>
48+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('week')}</p>
4949
<ul>
5050
{#each options.weekOptions as weekFormat, index (index)}
5151
<li>{'{{'}{weekFormat}{'}}'} - {getLuxonExample(weekFormat)}</li>
@@ -54,7 +54,7 @@
5454
</div>
5555

5656
<div>
57-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('day').toUpperCase()}</p>
57+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('day')}</p>
5858
<ul>
5959
{#each options.dayOptions as dayFormat, index (index)}
6060
<li>{'{{'}{dayFormat}{'}}'} - {getLuxonExample(dayFormat)}</li>
@@ -63,7 +63,7 @@
6363
</div>
6464

6565
<div>
66-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('hour').toUpperCase()}</p>
66+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('hour')}</p>
6767
<ul>
6868
{#each options.hourOptions as dayFormat, index (index)}
6969
<li>{'{{'}{dayFormat}{'}}'} - {getLuxonExample(dayFormat)}</li>
@@ -72,7 +72,7 @@
7272
</div>
7373

7474
<div>
75-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('minute').toUpperCase()}</p>
75+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('minute')}</p>
7676
<ul>
7777
{#each options.minuteOptions as dayFormat, index (index)}
7878
<li>{'{{'}{dayFormat}{'}}'} - {getLuxonExample(dayFormat)}</li>
@@ -81,7 +81,7 @@
8181
</div>
8282

8383
<div>
84-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('second').toUpperCase()}</p>
84+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('second')}</p>
8585
<ul>
8686
{#each options.secondOptions as dayFormat, index (index)}
8787
<li>{'{{'}{dayFormat}{'}}'} - {getLuxonExample(dayFormat)}</li>

‎web/src/lib/components/admin-page/settings/storage-template/supported-variables-panel.svelte‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,28 +3,28 @@
33
</script>
44

55
<div class="mt-4 text-sm">
6-
<h4>{$t('other_variables').toUpperCase()}</h4>
6+
<h4 class="uppercase">{$t('other_variables')}</h4>
77
</div>
88

99
<div class="p-4 mt-2 text-xs bg-gray-200 rounded-lg dark:bg-gray-700 dark:text-immich-dark-fg">
1010
<div class="flex gap-[50px]">
1111
<div>
12-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('filename').toUpperCase()}</p>
12+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('filename')}</p>
1313
<ul>
1414
<li>{`{{filename}}`} - IMG_123</li>
1515
<li>{`{{ext}}`} - jpg</li>
1616
</ul>
1717
</div>
1818

1919
<div>
20-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('filetype').toUpperCase()}</p>
20+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('filetype')}</p>
2121
<ul>
2222
<li>{`{{filetype}}`} - VID or IMG</li>
2323
<li>{`{{filetypefull}}`} - VIDEO or IMAGE</li>
2424
</ul>
2525
</div>
2626
<div>
27-
<p class="font-medium text-immich-primary dark:text-immich-dark-primary uppercase">{$t('other').toUpperCase()}</p>
27+
<p class="uppercase font-medium text-immich-primary dark:text-immich-dark-primary">{$t('other')}</p>
2828
<ul>
2929
<li>{`{{assetId}}`} - Asset ID</li>
3030
<li>{`{{assetIdShort}}`} - Asset ID (last 12 characters)</li>

‎web/src/lib/components/asset-viewer/detail-panel-tags.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@
3939
{#if isOwner && !authManager.isSharedLink}
4040
<section class="px-4 mt-4">
4141
<div class="flex h-10 w-full items-center justify-between text-sm">
42-
<h2>{$t('tags').toUpperCase()}</h2>
42+
<h2 class="uppercase">{$t('tags')}</h2>
4343
</div>
4444
<section class="flex flex-wrap pt-2 gap-1" data-testid="detail-panel-tags">
4545
{#each tags as tag (tag.id)}

‎web/src/lib/components/asset-viewer/detail-panel.svelte‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -168,7 +168,7 @@
168168
{#if !authManager.isSharedLink && isOwner}
169169
<section class="px-4 pt-4 text-sm">
170170
<div class="flex h-10 w-full items-center justify-between">
171-
<h2>{$t('people').toUpperCase()}</h2>
171+
<h2 class="uppercase">{$t('people')}</h2>
172172
<div class="flex gap-2 items-center">
173173
{#if people.some((person) => person.isHidden)}
174174
<IconButton
@@ -269,10 +269,10 @@
269269
<div class="px-4 py-4">
270270
{#if asset.exifInfo}
271271
<div class="flex h-10 w-full items-center justify-between text-sm">
272-
<h2>{$t('details').toUpperCase()}</h2>
272+
<h2 class="uppercase">{$t('details')}</h2>
273273
</div>
274274
{:else}
275-
<p class="text-sm">{$t('no_exif_info_available').toUpperCase()}</p>
275+
<p class="uppercase text-sm">{$t('no_exif_info_available')}</p>
276276
{/if}
277277

278278
{#if dateTime}
@@ -503,7 +503,7 @@
503503

504504
{#if currentAlbum && currentAlbum.albumUsers.length > 0 && asset.owner}
505505
<section class="px-6 dark:text-immich-dark-fg mt-4">
506-
<p class="text-sm">{$t('shared_by').toUpperCase()}</p>
506+
<p class="uppercase text-sm">{$t('shared_by')}</p>
507507
<div class="flex gap-4 pt-4">
508508
<div>
509509
<UserAvatar user={asset.owner} size="md" />
@@ -520,7 +520,7 @@
520520

521521
{#if albums.length > 0}
522522
<section class="px-6 pt-6 dark:text-immich-dark-fg">
523-
<p class="pb-4 text-sm">{$t('appears_in').toUpperCase()}</p>
523+
<p class="uppercase pb-4 text-sm">{$t('appears_in')}</p>
524524
{#each albums as album (album.id)}
525525
<a href="{AppRoute.ALBUMS}/{album.id}">
526526
<div class="flex gap-4 pt-2 hover:cursor-pointer items-center">

0 commit comments

Comments
 (0)