generated from dwd/boilarplate-astro-tailwind
try to add listening options
This commit is contained in:
@@ -35,8 +35,9 @@ const items = data.data[idx];
|
||||
<main>
|
||||
<section class="container mx-auto px-4 mt-16">
|
||||
<div class="flex flex-col justify-center">
|
||||
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1>
|
||||
<h2 class="text-xl py-2">{items.title}</h2>
|
||||
<div class=""><button onclick="textSpeech();" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
|
||||
<h1 id="message1" class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1>
|
||||
<h2 id="message2" class="text-xl py-2">{items.title}</h2>
|
||||
<div class="flex flex-col place-items-center">
|
||||
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
|
||||
</div>
|
||||
@@ -50,16 +51,21 @@ const items = data.data[idx];
|
||||
<a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/${items.slug}&title=${items.title}&summary=${items.title}&source=${items.title}` onclick="window.open(this.href, 'mywin', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;"><img src="/img/link.svg" alt="Linkdin Logo"/></a>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-justify text-red-700 mt-4" set:html={items.content}></p>
|
||||
<p id="" class="text-justify text-red-700 mt-4" set:html={items.content}></p>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</Layout>
|
||||
<script is:inline>
|
||||
// let whatsAppurl = document.location.href;
|
||||
// console.log(whatsAppurl);
|
||||
// document.getElementById('whatsappURL').href = `whatsapp://send?text=${whatsAppurl}`;
|
||||
// document.getElementById('whatsappURL').href = `whatsapp://send?text=Sample Text%20goes%20here%20-%20${whatsAppurl}`
|
||||
function textSpeech(){
|
||||
let message1 = document.getElementById('message1').innerHTML;
|
||||
console.log(message1);
|
||||
let message2 = document.getElementById('message2').innerHTML;
|
||||
// let message3 = document.getElementById('message3').innerHTML;
|
||||
let allSpeechText = message1 + message2;
|
||||
let speechText = new SpeechSynthesisUtterance(allSpeechText);
|
||||
window.speechSynthesis.speak(speechText);
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
section > div > p > p {
|
||||
|
||||
Reference in New Issue
Block a user