fixed pause button size in bottom toolbar

marwan · Nov 27, 2024 · 87cce69 · 87cce69
1 parent db4033c
commit 87cce69
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 10 deletions.
diff --git a/src/components/svgs/Pause.svelte b/src/components/svgs/Pause.svelte
@@ -2,6 +2,4 @@
 	export let size = 4;
 </script>
 
-<svg class="w-{size} h-{size}" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 10 16">
-	<path fill-rule="evenodd" d="M0 .8C0 .358.32 0 .714 0h1.429c.394 0 .714.358.714.8v14.4c0 .442-.32.8-.714.8H.714a.678.678 0 0 1-.505-.234A.851.851 0 0 1 0 15.2V.8Zm7.143 0c0-.442.32-.8.714-.8h1.429c.19 0 .37.084.505.234.134.15.209.354.209.566v14.4c0 .442-.32.8-.714.8H7.857c-.394 0-.714-.358-.714-.8V.8Z" clip-rule="evenodd" />
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" class="w-{size} h-{size}" fill="currentColor" id="Filled" viewBox="0 0 24 24" width="512" height="512"><path d="M6.5,0A3.5,3.5,0,0,0,3,3.5v17a3.5,3.5,0,0,0,7,0V3.5A3.5,3.5,0,0,0,6.5,0Z" /><path d="M17.5,0A3.5,3.5,0,0,0,14,3.5v17a3.5,3.5,0,0,0,7,0V3.5A3.5,3.5,0,0,0,17.5,0Z" /></svg>
diff --git a/src/components/svgs/PlaySolid.svelte b/src/components/svgs/PlaySolid.svelte
@@ -1,7 +1,5 @@
 <script>
-	export let size = 6;
+	export let size = 4;
 </script>
 
-<svg class="w-{size} h-{size}" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24">
-	<path fill-rule="evenodd" d="M8.6 5.2A1 1 0 0 0 7 6v12a1 1 0 0 0 1.6.8l8-6a1 1 0 0 0 0-1.6l-8-6Z" clip-rule="evenodd" />
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" class="w-{size} h-{size}" fill="currentColor" id="Filled" viewBox="0 0 24 24" width="512" height="512"><path d="M20.492,7.969,10.954.975A5,5,0,0,0,3,5.005V19a4.994,4.994,0,0,0,7.954,4.03l9.538-6.994a5,5,0,0,0,0-8.062Z" /></svg>
diff --git a/src/components/ui/BottomToolbar/AudioButton.svelte b/src/components/ui/BottomToolbar/AudioButton.svelte
@@ -24,7 +24,7 @@
 <!-- play/pause button -->
 <div class="flex items-center justify-center">
 	<button type="button" title={$__audioSettings.isPlaying ? 'Pause' : 'Play'} on:click={() => audioHandler()} class="inline-flex flex-col items-center justify-center w-12 h-12 bg-black/15 rounded-full group focus:ring-2 focus:ring-gray-300 focus:outline-none">
-		<span class="opacity-70"><svelte:component this={$__audioSettings.isPlaying ? Pause : PlaySolid} size={6} /></span>
+		<span class="opacity-70"><svelte:component this={$__audioSettings.isPlaying ? Pause : PlaySolid} size={5} /></span>
 		<span class="sr-only">{$__audioSettings.isPlaying ? 'Pause' : 'Play'}</span>
 
 		<!-- show badge when a verse is playing -->

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
@@ -27,7 +27,7 @@
 	<HomepageTabs />
 </div>
 
-<!-- banner for updates: currently v4 launch -->
+<!-- banner for website updates: currently v4 launch -->
 <Banner id="newSiteBanner" position="fixed" divClass="z-10 flex justify-between p-4 !bg-gray-100 theme">
 	<p class="flex items-center text-sm font-normal text-gray-500 space-x-1">
 		<span class="inline-flex p-2 bg-gray-200 rounded-full text-black">
@@ -36,7 +36,7 @@
 		</span>
 
 		<span class="text-black text-xs md:text-sm">
-			Experience the Enhanced QuranWBW. <button class="inline font-medium text-primary-600 underline underline-offset-2 decoration-600 decoration-solid hover:no-underline" on:click={() => __newSiteChangelogModalVisible.set(true)}> Read More {@html '&#x2192;'}</button>.
+			Experience the Enhanced QuranWBW. <button class="inline font-medium text-primary-600 underline underline-offset-2 decoration-600 decoration-solid hover:no-underline" on:click={() => __newSiteChangelogModalVisible.set(true)}> Read More {@html '&#x2192;'}</button>
 		</span>
 	</p>
 </Banner>