From bb4bd1cdd293f72696c553af7c92a1d5807d72d0 Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Sat, 9 Sep 2023 22:14:37 -0700
Subject: refactor(settings): setting hint

---
 src/routes/settings/+page.svelte | 23 +++++++++++------------
 1 file changed, 11 insertions(+), 12 deletions(-)

(limited to 'src/routes/settings')

diff --git a/src/routes/settings/+page.svelte b/src/routes/settings/+page.svelte
index 18abf87f..19f25828 100644
--- a/src/routes/settings/+page.svelte
+++ b/src/routes/settings/+page.svelte
@@ -6,6 +6,7 @@
 	import anime from '../../stores/anime';
 	import settings from '../../stores/settings';
 	import SettingToggle from '$lib/Settings/SettingToggle.svelte';
+	import SettingHint from '$lib/Settings/SettingHint.svelte';
 
 	export let data;
 
@@ -46,23 +47,23 @@
 	<SettingToggle setting={'showCompletedAnime'} on={'Hide'} off={'Show'}>
 		completed anime
 	</SettingToggle>
-	<SettingToggle setting={'displayPausedMedia'} on={'Hide'} off={'Show'} sectionBreak={true}>
+	<SettingToggle setting={'displayPausedMedia'} on={'Hide'} off={'Show'} sectionBreak>
 		paused media
 	</SettingToggle>
 
 	<SettingToggle setting={'displayUnresolved'} on={'Hide'} off={'Show'}>unresolved</SettingToggle>
-	<small style="opacity: 50%;">Displays unresolved chapter counts as "?"</small>
+	<SettingHint>Displays unresolved chapter counts as "?"</SettingHint>
 
 	<p />
 
 	<SettingToggle setting={'displayNotStarted'} on={'Hide'} off={'Show'}>
 		media with zero progress
 	</SettingToggle>
-	<small style="opacity: 50%;">
+	<SettingHint>
 		May cause <a href="https://en.wikipedia.org/wiki/Rate_limiting" target="_blank">
 			rate-limiting
 		</a> depending on how much releasing manga are on your lists
-	</small>
+	</SettingHint>
 
 	<p />
 
@@ -83,9 +84,9 @@
 	<SettingToggle setting={'roundDownChapters'} on={'Maintain'} off={'Round down'}>
 		chapters
 	</SettingToggle>
-	<small style="opacity: 50%;">
+	<SettingHint>
 		50/50.6 would {@html $settings.roundDownChapters ? '<b>not</b>' : ''} be due
-	</small>
+	</SettingHint>
 
 	<h2>Cache</h2>
 
@@ -112,12 +113,11 @@
 		placeholder="60"
 	/>
 	minutes
-	<br />
-	<small style="opacity: 50%;">
+	<SettingHint lineBreak>
 		Low values may cause <a href="https://en.wikipedia.org/wiki/Rate_limiting" target="_blank">
 			rate-limiting
 		</a> depending on how much releasing manga are on your lists
-	</small>
+	</SettingHint>
 
 	<h2>Reset</h2>
 
@@ -126,8 +126,7 @@
 	<p />
 
 	<a href={'#'} on:click={() => localStorage.clear()}>Clear <code>localStorage</code> </a>
-	<br />
-	<small style="opacity: 50%;">
+	<SettingHint lineBreak>
 		Doesn't break anything, but resets all settings and key caches. Recommended after updates
-	</small>
+	</SettingHint>
 {/if}
-- 
cgit v1.2.3