From: PhiTux <redacted>
Date: Wed, 8 Oct 2025 15:09:41 +0000 (+0200)
Subject: css fixes
X-Git-Url: http://git.99rst.org/?a=commitdiff_plain;h=4d8144ffa3b092e7a2a3d816df3d28ae6cd867ae;p=DailyTxT.git

css fixes
---

diff --git a/.prettierignore b/.prettierignore
new file mode 100644
index 0000000..2e1fa2d
--- /dev/null
+++ b/.prettierignore
@@ -0,0 +1 @@
+*.md
\ No newline at end of file
diff --git a/frontend/src/lib/settings/Admin.svelte b/frontend/src/lib/settings/Admin.svelte
index 70342ff..cd83fe6 100644
--- a/frontend/src/lib/settings/Admin.svelte
+++ b/frontend/src/lib/settings/Admin.svelte
@@ -281,7 +281,7 @@
 
 			<!-- Admin status bar -->
 			<div
-				class="d-flex align-items-center mb-4 p-3 bg-success bg-opacity-25 border border-success rounded"
+				class="d-flex align-items-center mb-4 p-3 alert alert-success border border-success rounded-4"
 			>
 				<span class="text-success me-3">🔓 {$t('settings.admin.authorized')} </span>
 				<button class="btn btn-outline-secondary btn-sm ms-2" onclick={resetAdminState}>
@@ -329,7 +329,7 @@
 						</div>
 
 						{#if registrationAllowedTemporary && registrationUntil}
-							<div class="alert alert-success" transition:slide>
+							<div class="alert alert-success rounded-4" transition:slide>
 								{@html $t('settings.admin.registration_allowed_until', {
 									date_and_time: new Date(registrationUntil).toLocaleString($tolgee.getLanguage(), {
 										year: 'numeric',
@@ -406,29 +406,31 @@
 												{/if}
 
 												{#if deleteUserId === user.id}
-													<div class="mt-2" transition:slide>
-														<div class="alert alert-danger">
-															<p class="mb-2">
-																<strong>{$t('settings.admin.confirm_delete')}</strong><br />
-																{$t('settings.admin.delete_warning', { username: user.username })}
-															</p>
-															<div class="d-flex gap-2">
-																<button
-																	class="btn btn-secondary btn-sm"
-																	onclick={() => (deleteUserId = null)}
-																>
-																	{$t('settings.admin.cancel')}
-																</button>
-																<button
-																	class="btn btn-danger btn-sm"
-																	onclick={() => deleteUser(user.id, user.username)}
-																	disabled={isDeletingUser}
-																>
-																	{#if isDeletingUser}
-																		<span class="spinner-border spinner-border-sm me-1"></span>
-																	{/if}
-																	{$t('settings.admin.delete')}
-																</button>
+													<div transition:slide>
+														<div class="pt-2">
+															<div class="alert alert-danger mb-0">
+																<p class="mb-2">
+																	<strong>{$t('settings.admin.confirm_delete')}</strong><br />
+																	{$t('settings.admin.delete_warning')}
+																</p>
+																<div class="d-flex gap-2">
+																	<button
+																		class="btn btn-secondary btn-sm"
+																		onclick={() => (deleteUserId = null)}
+																	>
+																		{$t('settings.admin.cancel')}
+																	</button>
+																	<button
+																		class="btn btn-danger btn-sm"
+																		onclick={() => deleteUser(user.id, user.username)}
+																		disabled={isDeletingUser}
+																	>
+																		{#if isDeletingUser}
+																			<span class="spinner-border spinner-border-sm me-1"></span>
+																		{/if}
+																		{$t('settings.admin.delete')}
+																	</button>
+																</div>
 															</div>
 														</div>
 													</div>
@@ -461,6 +463,15 @@
 							</div>
 						</div>
 					{/if}
+
+					<div class="mt-4 d-flex justify-content-center">
+						<button class="btn btn-outline-primary" onclick={loadUsers} disabled={isLoadingUsers}>
+							{#if isLoadingUsers}
+								<span class="spinner-border spinner-border-sm me-2"></span>
+							{/if}
+							{$t('settings.admin.refresh_users')}
+						</button>
+					</div>
 				</div>
 			</div>
 
@@ -506,29 +517,31 @@
 							</button>
 
 							{#if confirmDeleteOldData}
-								<div class="mt-3" transition:slide>
-									<div class="alert alert-danger">
-										<p class="mb-2">
-											<strong>{$t('settings.admin.confirm_delete_old_data')}</strong><br />
-											{@html $t('settings.admin.delete_old_data_warning')}
-										</p>
-										<div class="d-flex gap-2">
-											<button
-												class="btn btn-secondary btn-sm"
-												onclick={toggleDeleteOldDataConfirmation}
-											>
-												{$t('settings.admin.cancel')}
-											</button>
-											<button
-												class="btn btn-danger btn-sm"
-												onclick={deleteOldData}
-												disabled={isDeletingOldData}
-											>
-												{#if isDeletingOldData}
-													<span class="spinner-border spinner-border-sm me-1"></span>
-												{/if}
-												{$t('settings.admin.delete')}
-											</button>
+								<div transition:slide class="">
+									<div class="pt-3">
+										<div class="alert alert-danger mb-0">
+											<p class="mb-2">
+												<strong>{$t('settings.admin.confirm_delete_old_data')}</strong><br />
+												{@html $t('settings.admin.delete_old_data_warning')}
+											</p>
+											<div class="d-flex gap-2">
+												<button
+													class="btn btn-secondary btn-sm"
+													onclick={toggleDeleteOldDataConfirmation}
+												>
+													{$t('settings.admin.cancel')}
+												</button>
+												<button
+													class="btn btn-danger btn-sm"
+													onclick={deleteOldData}
+													disabled={isDeletingOldData}
+												>
+													{#if isDeletingOldData}
+														<span class="spinner-border spinner-border-sm me-1"></span>
+													{/if}
+													{$t('settings.admin.delete')}
+												</button>
+											</div>
 										</div>
 									</div>
 								</div>
@@ -582,16 +595,6 @@
 					{/if}
 				</div>
 			</div>
-
-			<!-- Reload Button moved to bottom -->
-			<div class="mt-4 d-flex justify-content-center">
-				<button class="btn btn-outline-primary" onclick={loadUsers} disabled={isLoadingUsers}>
-					{#if isLoadingUsers}
-						<span class="spinner-border spinner-border-sm me-2"></span>
-					{/if}
-					{$t('settings.admin.refresh_users')}
-				</button>
-			</div>
 		</div>
 	{/if}
 
diff --git a/frontend/src/routes/(authed)/+layout.svelte b/frontend/src/routes/(authed)/+layout.svelte
index b9c0e54..4002901 100644
--- a/frontend/src/routes/(authed)/+layout.svelte
+++ b/frontend/src/routes/(authed)/+layout.svelte
@@ -1,6 +1,6 @@
 <script>
 	import * as bootstrap from 'bootstrap';
-	import Fa from 'svelte-fa';
+	import Fa, { FaLayers } from 'svelte-fa';
 	import { goto } from '$app/navigation';
 	import { onDestroy, onMount } from 'svelte';
 	import {
@@ -33,7 +33,8 @@
 		faSun,
 		faMoon,
 		faCircleUp,
-		faBars
+		faBars,
+		faCircle
 	} from '@fortawesome/free-solid-svg-icons';
 	import Tag from '$lib/Tag.svelte';
 	import SelectTimezone from '$lib/SelectTimezone.svelte';
@@ -1173,11 +1174,10 @@
 				>
 					<Fa icon={faSliders} />
 					{#if updateAvailable}
-						<Fa
-							icon={faCircleUp}
-							size="1.2x"
-							class="position-absolute top-0 start-100 translate-middle text-info"
-						/>
+						<FaLayers class="position-absolute top-0 start-100 translate-middle">
+							<Fa icon={faCircle} size="1.2x" color="white" />
+							<Fa icon={faCircleUp} size="1.2x" class="text-info" />
+						</FaLayers>
 					{/if}
 				</button>
 				<button class="btn btn-outline-secondary" onclick={() => logout(null)}
@@ -1346,7 +1346,10 @@
 									>
 										💡 {$t('settings.about')}
 										{#if updateAvailable}
-											<Fa icon={faCircleUp} size="1.2x" class="text-info" />
+											<FaLayers>
+												<Fa icon={faCircle} size="1.2x" color="white" />
+												<Fa icon={faCircleUp} size="1.2x" class="text-info" />
+											</FaLayers>
 										{/if}
 									</button>
 								</nav>
@@ -1573,22 +1576,30 @@
 											<label class="form-check-label" for="language_manual">
 												{$t('settings.set_language_manually')}
 												{#if !$tempSettings.useBrowserLanguage}
-													<select
-														transition:slide
-														class="form-select"
-														bind:value={$tempSettings.language}
-														disabled={$tempSettings.useBrowserLanguage}
-													>
-														{#each $tolgee.getInitialOptions().availableLanguages as lang}
-															<option value={lang}>{loadFlagEmoji(lang)} {lang}</option>
-														{/each}
-													</select>
+													<div transition:slide>
+														<select
+															class="form-select"
+															bind:value={$tempSettings.language}
+															disabled={$tempSettings.useBrowserLanguage}
+														>
+															{#each $tolgee.getInitialOptions().availableLanguages as lang}
+																<option value={lang}>{loadFlagEmoji(lang)} {lang}</option>
+															{/each}
+														</select>
+													</div>
 												{/if}
 											</label>
 										</div>
 										<div class="form-text">
 											{$t('settings.language.reload_info')}
 										</div>
+										<div class="alert alert-info rounded-4 mt-2" role="alert">
+											{$t('settings.language.help_translate')}
+											<a
+												href="https://github.com/PhiTux/DailyTxT/blob/main/TRANSLATION.md"
+												target="_blank">GitHub</a
+											>
+										</div>
 									</div>
 									<div id="timezone">
 										{#if $tempSettings.useBrowserTimezone !== $settings.useBrowserTimezone || ($tempSettings.timezone !== undefined && $tempSettings.timezone?.value !== $settings.timezone?.value)}
@@ -1626,9 +1637,11 @@
 											<br />
 											<SelectTimezone />
 											{#if !$tempSettings.useBrowserTimezone}
-												<span transition:fade>
-													{$t('settings.timezone.selected')} <code>{$tempSettings.timezone}</code>
-												</span>
+												<div transition:slide>
+													<span>
+														{$t('settings.timezone.selected')} <code>{$tempSettings.timezone}</code>
+													</span>
+												</div>
 											{/if}
 										</div>
 
@@ -2039,7 +2052,11 @@
 													>{$t('settings.password.confirm_new_password')}</label
 												>
 											</div>
-											<button class="btn btn-primary" onclick={changePassword}>
+											<button
+												class="btn btn-primary"
+												disabled={!currentPassword || !newPassword || !confirmNewPassword}
+												onclick={changePassword}
+											>
 												{#if isChangingPassword}
 													<!-- svelte-ignore a11y_no_static_element_interactions -->
 													<div class="spinner-border" role="status">
@@ -2346,7 +2363,7 @@
 									<br />
 
 									{#if updateAvailable}
-										<p class="alert alert-info d-flex align-items-center mt-2 mb-2 p-2">
+										<p class="alert alert-info rounded-4 d-flex align-items-center mt-2 mb-2 p-2">
 											<Fa icon={faCircleUp} size="2x" class="text-info me-2" />
 											{$t('settings.about.update_available')}
 										</p>