[RZA-2500050]: reader page audio issue fixed

Author: xkeshav

.vscode/dictionaries/project-words.txt

@@ -8,6 +8,7 @@ audiorecorder
 bincount
 clsx
 cmdk
+controlslist
 datetime
 dhaga
 ensurepip
@@ -24,6 +25,7 @@ kmeans
 linalg
 lucide
 matras
+nodownload
 Organja
 orgenja
 Peina

src/assets/styles/varnmala/reader.css

@@ -3,23 +3,20 @@
   --mute-button__bg: hsla(255, 100%, 50%, 0.281);
 }
 
-#container__reader {
+.container__reader {
   font-size: min(40rem, 35vw);
   display: grid;
   place-items: center;
   grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
-  place-content: center;
   color: var(--main__txt);
   outline: none;
   text-transform: uppercase;
   transform: rotate(0deg);
   transition: all 0.3s ease-in-out;
   will-change: contents;
-  text-align: center;
   line-height: 1;
-  padding: 1rem;
   gap: 0.5rem;
-  overflow: hidden;
+  height: 80%;
 }
 
 .hide {
@@ -68,7 +65,7 @@
   cursor: pointer;
 }
 
-.speaker > span {
+.speaker>span {
   padding: 0.5rem;
   border: 1px solid var(--primary);
   border-radius: 5px;
@@ -80,17 +77,17 @@
 }
 
 @media screen and (max-width: 768px) {
-  #container__reader {
+  .container__reader {
     font-size: min(30rem, 55vw);
   }
 }
 
 @media screen and (max-width: 480px) {
-  #container__reader {
+  .container__reader {
     font-size: min(200rem, 70vw);
   }
 
   .mute-button {
     font-size: min(2.5rem, 8vw);
   }
-}
+}

src/pages/varnmala/reader.astro

@@ -2,11 +2,10 @@
 import "@/assets/styles/varnmala/reader.css";
 import Help from "@/components/Help.astro";
 import BaseLayout from "@/layouts/Base";
-
 import BackButton from "@/components/ui/backButton.astro";
 ---
 
-<BaseLayout meta={{ title: "Reader" }}>
+<BaseLayout meta={{ title: "Audio Reader" }}>
   <Fragment slot="header-right">
     <div class="action">
       <button type="button" title="click audio" id="mute" class="mute-button mute-button-audio"></button>
@@ -23,7 +22,7 @@ import BackButton from "@/components/ui/backButton.astro";
   </Fragment>
 
   <BackButton />
-  <article id="container__reader">a🍎</article>
+  <article id="container__reader" class="container__reader">a🍎</article>
   <section class="section--audio hide">
     <audio id="audioPlayer" controlslist="nodownload" controls autoplay></audio>
   </section>
@@ -69,9 +68,10 @@ import BackButton from "@/components/ui/backButton.astro";
       const target = e.target as HTMLButtonElement;
       target.classList.toggle("mute");
     });
-
     const getEmoji = (letter: string) => {
-      const { [letter.toUpperCase()]: list = [] } = emojiList as { [key: string]: number[] };
+      type List = { [key: string]: number[] };
+      const upperCase = letter.toUpperCase();
+      const list = (emojiList as List)[upperCase];
       if (list.length) {
         const codePoint = random(list);
         return String.fromCodePoint(codePoint);

src/utils/common.ts

@@ -56,7 +56,6 @@ export const matras = {
 };
 
 export const barahkhadi = (code: number) => {
-  console.log({ code });
   const sanyukat = Object.values(matras);
   const list = [String.fromCharCode(code)];
   return list.concat(sanyukat);