15 Commits
b3 ... b4

Author SHA1 Message Date
dev sp
f378065344 remove weather 2024-01-24 14:07:59 +00:00
dev sp
e59a1168ce change homepage desgine 2024-01-23 08:15:50 +00:00
dev sp
80e8bc4f91 add weater information 2024-01-19 16:25:38 +00:00
dev sp
aeb9362f6d add htacces 2024-01-19 08:00:38 +00:00
kar
c75595b741 Add .htaccess 2024-01-19 07:58:27 +00:00
dev sp
78d9081f87 add listening options 2024-01-19 07:57:07 +00:00
dev sp
d4043d1678 try to add listening options 2024-01-18 17:27:57 +00:00
dev sp
e90b7329c4 add publish date 2024-01-18 14:09:40 +00:00
dev sp
4982a72f0c change twitter link text 2024-01-17 16:18:06 +00:00
dev sp
ee0bc8482a add 404 2024-01-17 07:30:35 +00:00
dev sp
318e7f4c48 add 404 2024-01-17 07:28:05 +00:00
dev sp
443422300d add 404 2024-01-17 07:25:07 +00:00
dev sp
37155aa643 add 404 2024-01-17 07:20:50 +00:00
dev sp
9191fb5642 done og image issue in facebook shares 2024-01-16 12:52:15 +00:00
dev sp
5d5c73b65b remove canonical from every pages 2024-01-16 12:15:23 +00:00
32 changed files with 1182 additions and 400 deletions

2
.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,2 @@
{
}

4
public/.htaccess Normal file
View File

@@ -0,0 +1,4 @@
RewriteEngine On
RewriteBase /
RewriteCond %{HTTP_HOST} ^www\.(.*)$ [NC]
RewriteRule ^(.*)$ https://%1/$1 [R=301,L]

BIN
public/img/clear_sky.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

View File

@@ -26,10 +26,20 @@
<!-- <a href="/contact">Contact</a> --> <!-- <a href="/contact">Contact</a> -->
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<div class="flex bg-[#780a0a] text-white justify-center place-items-center border-t-4 border-white py-4"> <div class="flex bg-[#780a0a] text-white justify-center place-items-center border-t-4 border-white py-4">
<a href="https://dwd.siliconpin.com/" target="_blank">Powered by <span class="font-bold">DWD Consultancy Services</span></a> <a href="https://dwd.siliconpin.com/" target="_blank">Powered by <span class="font-bold">DWD Consultancy Services</span></a>
</div> </div>
</div> </div>
</main> </main>
<!-- Google tag (gtag.js) -->
<script is:inline async src="https://www.googletagmanager.com/gtag/js?id=G-GXF4D64859"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-GXF4D64859');
</script>

View File

@@ -0,0 +1,140 @@
<main>
<div>
<section class="container mx-auto px-4">
<div id="swicthDIVBG">
<p id="cityName"></p>
<p id="temper"></p>
<p id="description"></p>
</div>
</section>
<div class="flex flex-col justify-center place-items-center fixed top-[50%] right-[50%] bg-white md:max-w-lg w-full p-6 rounded-2xl shadow-xl" style="display: none;" id="weatherPermission">
<p>know weather information allow location Permission</p>
<div class="flex flex-row gap-6">
<button id="yesButton" class="border-2 border-[#580a0a] text-[#580a0a] px-4 py-2 rounded-xl">Allow</button>
<button id="noButton" class="border-2 border-[#580a0a] text-[#580a0a] px-4 py-2 rounded-xl">Deny</button>
</div>
</div>
<!-- <div class="bg-red-500 text-black" id="weatherInfo"></div> -->
</div>
</main>
<script is:inline>
async function getCurrentLocation() {
return new Promise((resolve, reject) => {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(
(position) => resolve(position.coords),
(error) => reject(error)
);
} else {
reject(new Error('Geolocation is not supported by this browser.'));
}
});
}
async function getCityName(latitude, longitude) {
const apiKey = '4d54049b61eb45c4b121ab2cff9808ba'; // Replace with your OpenCage API key
const apiUrl = `https://api.opencagedata.com/geocode/v1/json?q=${latitude}+${longitude}&key=${apiKey}`;
try {
const response = await fetch(apiUrl);
if (!response.ok) {
throw new Error('Error fetching data from the server.');
}
const data = await response.json();
if (data.results && data.results.length > 0) {
const city = data.results[0].components.city;
return city;
} else {
throw new Error('City not found.');
}
} catch (error) {
console.error('Error:', error.message);
throw new Error('Error fetching city name.');
}
}
async function getWeatherData(city) {
const apiKey = 'aed8dd87581613e1d2bbbf63eeb618da';
const apiUrl = `https://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${apiKey}`;
try {
const response = await fetch(apiUrl);
if (!response.ok) {
throw new Error('Error fetching weather data from the server.');
}
const data = await response.json();
return data;
} catch (error) {
console.error('Error:', error.message);
throw new Error('Error fetching weather data.');
}
}
async function showCityName() {
try {
const location = await getCurrentLocation();
const city = await getCityName(location.latitude, location.longitude);
// document.getElementById('weatherInfo').innerText = 'Current City: ' + city;
const weatherData = await getWeatherData(city);
displayWeather(weatherData);
} catch (error) {
console.error(error.message);
// document.getElementById('weatherInfo').innerText = 'Error fetching data.';
}
}
function displayWeather(data) {
// const weatherInfoDiv = document.getElementById('weatherInfo');
// Extract relevant information from the API response
const cityName = data.name;
const temperature = data.main.temp;
const description = data.weather[0].description;
document.getElementById('cityName').innerHTML= 'City: ' + cityName;
document.getElementById('temper').innerHTML = 'Temperature: ' + temperature;
document.getElementById('description').innerHTML = 'Description: ' + description;
let switchBG = document.innerHTML = description;
if (switchBG === 'clear sky') {
let clearSkyBG = document.getElementById('swicthDIVBG').style.backgroundImage = 'url(/img/clear_sky.webp)';
clearSkyBG.style.backgroundRepeat = 'no-repeat';
clearSkyBG.style.backgroundSize = 'cover';
}
// Display the weather information switchDiv.style.backgroundImage = 'url("path/to/clear-sky-image.jpg")';
// weatherInfoDiv.innerHTML = `
// <p>City: ${cityName}</p>
// <p>Temperature: ${temperature} °C</p>
// <p>Description: ${description}</p>
// `;
}
function windowOnload() {
document.getElementById('weatherPermission').style.display = 'block';
// Attach click event handlers to the buttons
document.getElementById('yesButton').addEventListener('click', onYesButtonClick);
document.getElementById('noButton').addEventListener('click', onNoButtonClick);
}
function onYesButtonClick() {
// Call the function to display the city name and weather information
showCityName();
// Hide the weather permission div
document.getElementById('weatherPermission').style.display = 'none';
}
function onNoButtonClick() {
// Hide the weather permission div without fetching weather information
document.getElementById('weatherPermission').style.display = 'none';
}
window.onload = windowOnload;
</script>

View File

@@ -1,6 +1,7 @@
--- ---
import MainHeader from '../components/MainHeader.astro'; import MainHeader from '../components/MainHeader.astro';
import Footer from '../components/Footer.astro'; import Footer from '../components/Footer.astro';
import WeatherandTime from '../components/WeatherandTime.astro';
export interface Props { export interface Props {
title: string; metaTitle: string; description: string; ogImg: string; tiwtterCard: string; tiwtterImage: string; tiwtterTitle: string; tiwtterDesc: string; tiwtterURL: string; artPubTime: string; artUpdtTime: string; ogSiteName: string; ogType: string; ogTitle: string; ogDesc: string; ogURL: string; canonical: string; title: string; metaTitle: string; description: string; ogImg: string; tiwtterCard: string; tiwtterImage: string; tiwtterTitle: string; tiwtterDesc: string; tiwtterURL: string; artPubTime: string; artUpdtTime: string; ogSiteName: string; ogType: string; ogTitle: string; ogDesc: string; ogURL: string; canonical: string;
} }
@@ -36,7 +37,7 @@ const { title, metaTitle, description, ogImg, tiwtterCard, tiwtterImage, tiwtter
<meta property="og:image:width" content="526" /> <meta property="og:image:width" content="526" />
<meta property="og:image:height" content="275" /> <meta property="og:image:height" content="275" />
<meta name="og:image:secure_url" content={ogImg} /> <meta name="og:image:secure_url" content={ogImg} />
<script type="application/ld+json"> <!-- <script type="application/ld+json">
{ {
"@context": "https://schema.org", "@context": "https://schema.org",
"@type": "News Portal", "@type": "News Portal",
@@ -52,14 +53,14 @@ const { title, metaTitle, description, ogImg, tiwtterCard, tiwtterImage, tiwtter
"https://www.facebook.com/bartaindia?mibextid=eHce3h", "https://www.facebook.com/bartaindia?mibextid=eHce3h",
] ]
} }
</script> </script> -->
</head> </head>
<body> <body>
<div> <div>
<MainHeader /> <MainHeader />
</div> </div>
<div class="mt-[150px]"> <div class="mt-[100px]">
<!-- <WeatherandTime /> -->
<slot /> <slot />
</div> </div>
<Footer /> <Footer />

View File

@@ -1,6 +1,5 @@
--- ---
import MainHeaderBN from '../components/MainHeaderBN.astro'; import MainHeaderBN from '../components/MainHeaderBN.astro';
import TopHeader from '../components/TopHeader.astro';
import Footer from '../components/Footer.astro'; import Footer from '../components/Footer.astro';
export interface Props { export interface Props {
title: string; metaTitle: string; description: string; ogImg: string; tiwtterCard: string; tiwtterImage: string; tiwtterTitle: string; tiwtterDesc: string; tiwtterURL: string; artPubTime: string; artUpdtTime: string; ogSiteName: string; ogType: string; ogTitle: string; ogDesc: string; ogURL: string; canonical: string; title: string; metaTitle: string; description: string; ogImg: string; tiwtterCard: string; tiwtterImage: string; tiwtterTitle: string; tiwtterDesc: string; tiwtterURL: string; artPubTime: string; artUpdtTime: string; ogSiteName: string; ogType: string; ogTitle: string; ogDesc: string; ogURL: string; canonical: string;
@@ -15,8 +14,8 @@ const { title, metaTitle, description, ogImg, tiwtterCard, tiwtterImage, tiwtter
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/ico+xml" href="/favicon.ico" /> <link rel="icon" type="image/ico+xml" href="/favicon.ico" />
<link rel="canonical" href={canonical} />
<meta name="generator" content="barta-india.in html generator" /> <meta name="generator" content="barta-india.in html generator" />
<link rel="canonical" href={canonical} />
<title>{title}</title> <title>{title}</title>
<meta name="title" content={metaTitle}> <meta name="title" content={metaTitle}>
<meta name="description" content={description}> <meta name="description" content={description}>
@@ -37,7 +36,7 @@ const { title, metaTitle, description, ogImg, tiwtterCard, tiwtterImage, tiwtter
<meta property="og:image:width" content="526" /> <meta property="og:image:width" content="526" />
<meta property="og:image:height" content="275" /> <meta property="og:image:height" content="275" />
<meta name="og:image:secure_url" content={ogImg} /> <meta name="og:image:secure_url" content={ogImg} />
<script type="application/ld+json"> <!-- <script type="application/ld+json">
{ {
"@context": "https://schema.org", "@context": "https://schema.org",
"@type": "News Portal", "@type": "News Portal",
@@ -53,12 +52,11 @@ const { title, metaTitle, description, ogImg, tiwtterCard, tiwtterImage, tiwtter
"https://www.facebook.com/bartaindia?mibextid=eHce3h", "https://www.facebook.com/bartaindia?mibextid=eHce3h",
] ]
} }
</script> </script> -->
</head> </head>
<body> <body>
<div> <div>
<MainHeaderBN /> <MainHeaderBN />
</div> </div>
<div class="mt-[150px]"> <div class="mt-[150px]">
<slot /> <slot />

10
src/pages/404.astro Normal file
View File

@@ -0,0 +1,10 @@
---
import Layout from "../layouts/Layout.astro"
---
<Layout title="404 Page Not Found | Barta-India">
<main>
<div>
<h1 class="text-3xl text-center py-40 text-[#580a0a] font-bold">404 Page Not Found</h1>
</div>
</main>
</Layout>

View File

@@ -31,13 +31,13 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/${items.slug}` ogURL=`https://barta-india.in/${items.slug}`
canonical=`https://barta-india.in/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -45,23 +45,46 @@ const items = data.data[idx];
<div class="flex flex-row place-items-center p-2 shadow-lg shadow-[#780a0a] border-b-2 border-[#780a0a] rounded-b-2xl w-fit"> <div class="flex flex-row place-items-center p-2 shadow-lg shadow-[#780a0a] border-b-2 border-[#780a0a] rounded-b-2xl w-fit">
<p class="text-xl font-bold text-[#780a0a]">Share on: </p> <p class="text-xl font-bold text-[#780a0a]">Share on: </p>
<a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a> <a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<!-- <a href=`https://www.facebook.com/sharer/sharer.php?u=https://barta-india.in/retail-inflation-rate-due-to-the-sharp-increase-in-the-cost-of-dal-and-vegetables-this-is-the-greatest-rate-of-retail-inflation-in-the-previous-four-months-rice` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> --> <a href=`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<!-- <a href=`https://www.facebook.com/sharer/sharer.php?u=https://barta-india.in/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> --> <!-- <a href=`https://www.facebook.com/share.php?u=https://barta-india.in/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> -->
<a href=`https://www.facebook.com/share.php?u=https://barta-india.in/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> <a href=`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a href=`http://www.x.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<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> <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>
</div> </div>
<p class="text-justify text-red-700 mt-4" set:html={items.content}></p> <p id="message3" class="text-justify text-red-700 mt-4" set:html={items.content}></p>
</div> </div>
</section> </section>
</main> </main>
</Layout> </Layout>
<script is:inline> <script is:inline>
// let whatsAppurl = document.location.href; let isListening = false;
// console.log(whatsAppurl); let speechSynthesisInstance = window.speechSynthesis;
// document.getElementById('whatsappURL').href = `whatsapp://send?text=${whatsAppurl}`;
// document.getElementById('whatsappURL').href = `whatsapp://send?text=Sample Text%20goes%20here%20-%20${whatsAppurl}` function toggleSpeech() {
if (isListening) {
stopSpeech();
} else {
startSpeech();
}
}
function startSpeech() {
let message1 = document.getElementById('message1').innerText;
let message2 = document.getElementById('message2').innerText;
let allSpeechText = message1 + ' ' + message2;
let speechText = new SpeechSynthesisUtterance(allSpeechText);
speechSynthesisInstance.speak(speechText);
document.getElementById('listenButton').innerText = 'Stop';
isListening = true;
}
function stopSpeech() {
speechSynthesisInstance.cancel();
document.getElementById('listenButton').innerText = 'Listen';
isListening = false;
}
</script> </script>
<style> <style>
section > div > p > p { section > div > p > p {

View File

@@ -30,13 +30,13 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/bn/${items.slug}` ogURL=`https://barta-india.in/bn/${items.slug}`
canonical=`https://barta-india.in/bn/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -45,7 +45,7 @@ const items = data.data[idx];
<p class="text-xl font-bold text-[#780a0a]">Share on: </p> <p class="text-xl font-bold text-[#780a0a]">Share on: </p>
<a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a> <a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> <a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/${items.slug}&text=Your%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a> <a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/${items.slug}&text=%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/${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> <a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/${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>
</div> </div>
@@ -54,6 +54,42 @@ const items = data.data[idx];
</section> </section>
</main> </main>
</LayoutBN> </LayoutBN>
<script is:inline>
let isListening = false;
let speechSynthesisInstance = window.speechSynthesis;
function toggleSpeech() {
if (isListening) {
stopSpeech();
} else {
startSpeech();
}
}
function startSpeech() {
let message1 = document.getElementById('message1').innerText;
let message2 = document.getElementById('message2').innerText;
let allSpeechText = message1 + ' ' + message2;
let speechText = new SpeechSynthesisUtterance(allSpeechText);
speechText.lang = 'bn'; // Set language to Bengali
speechSynthesisInstance.speak(speechText);
document.getElementById('listenButton').innerText = 'Stop';
isListening = true;
}
function stopSpeech() {
speechSynthesisInstance.cancel();
document.getElementById('listenButton').innerText = 'Listen';
isListening = false;
}
// if(window.location.reload()){
// isListening = false;
// }
</script>
<style> <style>
section > div > p > p { section > div > p > p {
text-align: justify; text-align: justify;

View File

@@ -12,54 +12,71 @@ const items = metaJSON.data[0];
--- ---
<LayoutBN title={items.title} <LayoutBN title={items.title}
metaTitle={items.meta_title} metaTitle={items.meta_title}
description={items.description} description={items.description}
ogImg={`https://api7.siliconpin.com/assets/${items.img}`} ogImg={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterCard="summary_large_image" tiwtterCard="summary_large_image"
tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`} tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterTitle={items.title} tiwtterTitle={items.title}
tiwtterDesc={items.description} tiwtterDesc={items.description}
tiwtterURL=`https://barta-india.in/bn` tiwtterURL=`https://barta-india.in/bn`
ogSiteName=`https://barta-india.in/bn` ogSiteName=`https://barta-india.in/bn`
ogType={items.og_type} ogType={items.og_type}
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in/bn` ogURL=`https://barta-india.in/bn`
canonical=`https://barta-india.in/bn` >
>
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<div class="my-16"> <div class="my-16">
<span class="text-[#780a0a] font-bold" id="pageName"></span> <span class="text-[#780a0a] font-bold" id="pageName"></span>
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1>
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/bn/${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/bn/${items.slug}`}>
<img class="aspect-video " src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} /> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<div class="h-[100px] overflow-y-hidden"> <h2 class="text-lg text-justify ">{items.title}</h2>
<p id="" set:html={items.content}></p> </a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/bn/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex flex-row place-content-between">
<a href={`/bn/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a> <button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
</div> <p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/bn/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div>
</div> </div>
)} )}
</div> <!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
<!-- <div class="flex flex-col"> </div>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </section>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main> </main>
</LayoutBN> </LayoutBN>
<script is:inline> <script is:inline>

View File

@@ -30,13 +30,13 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/bn/local/${items.slug}` ogURL=`https://barta-india.in/bn/local/${items.slug}`
canonical=`https://barta-india.in/bn/local/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -45,7 +45,7 @@ const items = data.data[idx];
<p class="text-xl font-bold text-[#780a0a]">Share on: </p> <p class="text-xl font-bold text-[#780a0a]">Share on: </p>
<a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/local/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a> <a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/local/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/local/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> <a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/local/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/local/${items.slug}&text=Your%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a> <a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/local/${items.slug}&text=%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/local/${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> <a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/local/${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>
</div> </div>
@@ -54,6 +54,41 @@ const items = data.data[idx];
</section> </section>
</main> </main>
</LayoutBN> </LayoutBN>
<script is:inline>
let isListening = false;
let speechSynthesisInstance = window.speechSynthesis;
function toggleSpeech() {
if (isListening) {
stopSpeech();
} else {
startSpeech();
}
}
function startSpeech() {
let message1 = document.getElementById('message1').innerText;
let message2 = document.getElementById('message2').innerText;
let allSpeechText = message1 + ' ' + message2;
let speechText = new SpeechSynthesisUtterance(allSpeechText);
speechText.lang = 'bn'; // Set language to Bengali
speechSynthesisInstance.speak(speechText);
document.getElementById('listenButton').innerText = 'Stop';
isListening = true;
}
function stopSpeech() {
speechSynthesisInstance.cancel();
document.getElementById('listenButton').innerText = 'Listen';
isListening = false;
}
// if(window.location.reload()){
// isListening = false;
// }
</script>
<style> <style>
section > div > p > p { section > div > p > p {
text-align: justify; text-align: justify;

View File

@@ -8,58 +8,74 @@ const metaJSON = await fetchMeta.json();
const items = metaJSON.data[0]; const items = metaJSON.data[0];
// const imageData = data.image; // const imageData = data.image;
// const data = fetchDataJSON.data; // const data = fetchDataJSON.data;
// console.log()
--- ---
<LayoutBN title={items.title} <LayoutBN title={items.title}
metaTitle={items.title} metaTitle={items.title}
description={items.description} description={items.description}
ogImg={`https://api7.siliconpin.com/assets/${items.img}`} ogImg={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterCard="summary_large_image" tiwtterCard="summary_large_image"
tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`} tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterTitle={items.title} tiwtterTitle={items.title}
tiwtterDesc={items.description} tiwtterDesc={items.description}
tiwtterURL=`https://barta-india.in/bn/local/` tiwtterURL=`https://barta-india.in/bn/local/`
ogSiteName=`https://barta-india.in/bn/local/` ogSiteName=`https://barta-india.in/bn/local/`
ogType={items.og_type} ogType={items.og_type}
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in/bn/local/` ogURL=`https://barta-india.in/bn/local/`
canonical=`https://barta-india.in/bn/local` >
>
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<div class="my-16"> <div class="my-16">
<span class="text-[#780a0a] font-bold" id="pageName"></span> <span class="text-[#780a0a] font-bold" id="pageName"></span>
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1>
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/bn/${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/bn/local/${items.slug}`}>
<img class="aspect-video " src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title}/> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<div class="h-[100px] overflow-y-hidden"> <h2 class="text-lg text-justify ">{items.title}</h2>
<p id="" set:html={items.content}></p> </a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/bn/local/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex flex-row place-content-between">
<a href={`/bn/local/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a> <button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
</div> <p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/bn/local/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div>
</div> </div>
)} )}
</div> <!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
<!-- <div class="flex flex-col"> </div>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </section>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main> </main>
</LayoutBN> </LayoutBN>
<script is:inline> <script is:inline>

View File

@@ -30,13 +30,13 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/bn/national/${items.slug}` ogURL=`https://barta-india.in/bn/national/${items.slug}`
canonical=`https://barta-india.in/bn/local/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -45,7 +45,7 @@ const items = data.data[idx];
<p class="text-xl font-bold text-[#780a0a]">Share on: </p> <p class="text-xl font-bold text-[#780a0a]">Share on: </p>
<a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/national/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a> <a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/national/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/national/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> <a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/national/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/national/${items.slug}&text=Your%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a> <a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/national/${items.slug}&text=%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/national/${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> <a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/national/${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>
</div> </div>
@@ -54,6 +54,41 @@ const items = data.data[idx];
</section> </section>
</main> </main>
</LayoutBN> </LayoutBN>
<script is:inline>
let isListening = false;
let speechSynthesisInstance = window.speechSynthesis;
function toggleSpeech() {
if (isListening) {
stopSpeech();
} else {
startSpeech();
}
}
function startSpeech() {
let message1 = document.getElementById('message1').innerText;
let message2 = document.getElementById('message2').innerText;
let allSpeechText = message1 + ' ' + message2;
let speechText = new SpeechSynthesisUtterance(allSpeechText);
speechText.lang = 'bn'; // Set language to Bengali
speechSynthesisInstance.speak(speechText);
document.getElementById('listenButton').innerText = 'Stop';
isListening = true;
}
function stopSpeech() {
speechSynthesisInstance.cancel();
document.getElementById('listenButton').innerText = 'Listen';
isListening = false;
}
// if(window.location.reload()){
// isListening = false;
// }
</script>
<style> <style>
section > div > p > p { section > div > p > p {
text-align: justify; text-align: justify;

View File

@@ -11,54 +11,71 @@ const items = metaJSON.data[0];
// console.log() // console.log()
--- ---
<LayoutBN title={items.title} <LayoutBN title={items.title}
metaTitle={items.title} metaTitle={items.title}
description={items.description} description={items.description}
ogImg={`https://api7.siliconpin.com/assets/${items.img}`} ogImg={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterCard="summary_large_image" tiwtterCard="summary_large_image"
tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`} tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterTitle={items.title} tiwtterTitle={items.title}
tiwtterDesc={items.description} tiwtterDesc={items.description}
tiwtterURL=`https://barta-india.in/bn/national/` tiwtterURL=`https://barta-india.in/bn/national/`
ogSiteName=`https://barta-india.in/bn/national/` ogSiteName=`https://barta-india.in/bn/national/`
ogType={items.og_type} ogType={items.og_type}
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in/bn/national/` ogURL=`https://barta-india.in/bn/national/`
canonical=`https://barta-india.in/bn/national` >
>
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<div class="my-16"> <div class="my-16">
<span class="text-[#780a0a] font-bold" id="pageName"></span> <span class="text-[#780a0a] font-bold" id="pageName"></span>
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1>
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/bn/national/${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/bn/national/${items.slug}`}>
<img class="aspect-video" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title}/> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<div class="h-[100px] overflow-y-hidden"> <h2 class="text-lg text-justify ">{items.title}</h2>
<p id="" set:html={items.content}></p> </a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/bn/national/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex flex-row place-content-between">
<a href={`/bn/national/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a> <button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
</div> <p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/bn/national/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div>
</div> </div>
)} )}
</div> <!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
<!-- <div class="flex flex-col"> </div>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </section>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main> </main>
</LayoutBN> </LayoutBN>
<script is:inline> <script is:inline>

View File

@@ -30,13 +30,13 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/bn/politics/${items.slug}` ogURL=`https://barta-india.in/bn/politics/${items.slug}`
canonical=`https://barta-india.in/bn/politics/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -45,7 +45,7 @@ const items = data.data[idx];
<p class="text-xl font-bold text-[#780a0a]">Share on: </p> <p class="text-xl font-bold text-[#780a0a]">Share on: </p>
<a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/politics/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a> <a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/politics/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/politics/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> <a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/politics/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/politics/${items.slug}&text=Your%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a> <a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/politics/${items.slug}&text=%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/politics/${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> <a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/politics/${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>
</div> </div>
@@ -54,6 +54,41 @@ const items = data.data[idx];
</section> </section>
</main> </main>
</LayoutBN> </LayoutBN>
<script is:inline>
let isListening = false;
let speechSynthesisInstance = window.speechSynthesis;
function toggleSpeech() {
if (isListening) {
stopSpeech();
} else {
startSpeech();
}
}
function startSpeech() {
let message1 = document.getElementById('message1').innerText;
let message2 = document.getElementById('message2').innerText;
let allSpeechText = message1 + ' ' + message2;
let speechText = new SpeechSynthesisUtterance(allSpeechText);
speechText.lang = 'bn'; // Set language to Bengali
speechSynthesisInstance.speak(speechText);
document.getElementById('listenButton').innerText = 'Stop';
isListening = true;
}
function stopSpeech() {
speechSynthesisInstance.cancel();
document.getElementById('listenButton').innerText = 'Listen';
isListening = false;
}
// if(window.location.reload()){
// isListening = false;
// }
</script>
<style> <style>
/* section > div > p > p { /* section > div > p > p {
text-align: justify; text-align: justify;

View File

@@ -12,54 +12,71 @@ const items = metaJSON.data[0];
--- ---
<LayoutBN title={items.title} <LayoutBN title={items.title}
metaTitle={items.title} metaTitle={items.title}
description={items.description} description={items.description}
ogImg={`https://api7.siliconpin.com/assets/${items.img}`} ogImg={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterCard="summary_large_image" tiwtterCard="summary_large_image"
tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`} tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterTitle={items.title} tiwtterTitle={items.title}
tiwtterDesc={items.description} tiwtterDesc={items.description}
tiwtterURL=`https://barta-india.in/bn/politics/` tiwtterURL=`https://barta-india.in/bn/politics/`
ogSiteName=`https://barta-india.in/bn/politics/` ogSiteName=`https://barta-india.in/bn/politics/`
ogType={items.og_type} ogType={items.og_type}
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in/bn/politics/` ogURL=`https://barta-india.in/bn/politics/`
canonical=`https://barta-india.in/bn/politics` >
>
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<div class="my-16"> <div class="my-16">
<span class="text-[#780a0a] font-bold" id="pageName"></span> <span class="text-[#780a0a] font-bold" id="pageName"></span>
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1>
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/bn/politics/${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/bn/politics/${items.slug}`}>
<img class="aspect-video " src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title}/> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<div class="h-[100px] overflow-y-hidden"> <h2 class="text-lg text-justify ">{items.title}</h2>
<p id="" set:html={items.content}></p> </a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/bn/politics/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex flex-row place-content-between">
<a href={`/bn/politics/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a> <button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
</div> <p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/bn/politics/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div>
</div> </div>
)} )}
</div> <!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
<!-- <div class="flex flex-col"> </div>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </section>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main> </main>
</LayoutBN> </LayoutBN>
<script is:inline> <script is:inline>

View File

@@ -30,13 +30,13 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/bn/technology/${items.slug}` ogURL=`https://barta-india.in/bn/technology/${items.slug}`
canonical=`https://barta-india.in/bn/politics/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -45,7 +45,7 @@ const items = data.data[idx];
<p class="text-xl font-bold text-[#780a0a]">Share on: </p> <p class="text-xl font-bold text-[#780a0a]">Share on: </p>
<a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/technology/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a> <a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/bn/technology/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/technology/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> <a href=`https://www.facebook.com/share.php?u=https://barta-india.in/bn/technology/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/technology/${items.slug}&text=Your%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a> <a href=`http://www.twitter.com/share?url=https://barta-india.in/bn/technology/${items.slug}&text=%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/technology/${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> <a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/bn/technology/${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>
</div> </div>

View File

@@ -12,54 +12,71 @@ const items = metaJSON.data[0];
--- ---
<LayoutBN title={items.title} <LayoutBN title={items.title}
metaTitle={items.title} metaTitle={items.title}
description={items.description} description={items.description}
ogImg={`https://api7.siliconpin.com/assets/${items.img}`} ogImg={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterCard="summary_large_image" tiwtterCard="summary_large_image"
tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`} tiwtterImage={`https://api7.siliconpin.com/assets/${items.img}`}
tiwtterTitle={items.title} tiwtterTitle={items.title}
tiwtterDesc={items.description} tiwtterDesc={items.description}
tiwtterURL=`https://barta-india.in/bn/technology/` tiwtterURL=`https://barta-india.in/bn/technology/`
ogSiteName=`https://barta-india.in/bn/technology/` ogSiteName=`https://barta-india.in/bn/technology/`
ogType={items.og_type} ogType={items.og_type}
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in/bn/technology/` ogURL=`https://barta-india.in/bn/technology/`
canonical=`https://barta-india.in/bn/technology` >
>
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<div class="my-16"> <div class="my-16">
<span class="text-[#780a0a] font-bold" id="pageName"></span> <span class="text-[#780a0a] font-bold" id="pageName"></span>
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1>
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/bn/technology/${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/bn/technology/${items.slug}`}>
<img class="aspect-video" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} /> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<div class="h-[100px] overflow-y-hidden"> <h2 class="text-lg text-justify ">{items.title}</h2>
<p id="" set:html={items.content}></p> </a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/bn/technology/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex flex-row place-content-between">
<a href={`/bn/technology/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a> <button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
</div> <p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/bn/technology/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div>
</div> </div>
)} )}
</div> <!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
<!-- <div class="flex flex-col"> </div>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </section>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main> </main>
</LayoutBN> </LayoutBN>
<script is:inline> <script is:inline>

View File

@@ -26,38 +26,55 @@ const items = metaJSON.data[0];
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in` ogURL=`https://barta-india.in`
canonical=`https://barta-india.in`
> >
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A] my-16">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A] my-16">Latest News</h1>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/${items.slug}`}>
<img class="aspect-video " src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} /> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<div class="h-[100px] overflow-y-hidden"> <h2 class="text-lg text-justify">{items.title}</h2>
<p id="" set:html={items.content}></p> </a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex flex-row place-content-between">
<a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a> <button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
</div> <p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div>
</div> </div>
)} )}
</div> <!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
<!-- <div class="flex flex-col"> </div>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </section>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main> </main>
</Layout> </Layout>
<script is:inline> <script is:inline>

View File

@@ -30,13 +30,13 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/local/${items.slug}` ogURL=`https://barta-india.in/local/${items.slug}`
canonical=`https://barta-india.in/local/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -44,8 +44,8 @@ const items = data.data[idx];
<div class="flex flex-row place-items-center p-2 shadow-lg shadow-[#780a0a] border-b-2 border-[#780a0a] rounded-b-2xl w-fit"> <div class="flex flex-row place-items-center p-2 shadow-lg shadow-[#780a0a] border-b-2 border-[#780a0a] rounded-b-2xl w-fit">
<p class="text-xl font-bold text-[#780a0a]">Share on: </p> <p class="text-xl font-bold text-[#780a0a]">Share on: </p>
<a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/local/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a> <a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/local/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a href=`https://www.facebook.com/share.php?u=https://barta-india.in/local/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> <a href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2Flocal%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a href=`http://www.twitter.com/share?url=https://barta-india.in/local/${items.slug}&text=Your%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a> <a href=`http://www.twitter.com/share?url=https://barta-india.in/local/${items.slug}&text=%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/local/${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> <a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/local/${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>
</div> </div>
@@ -54,6 +54,35 @@ const items = data.data[idx];
</section> </section>
</main> </main>
</Layout> </Layout>
<script is:inline>
let isListening = false;
let speechSynthesisInstance = window.speechSynthesis;
function toggleSpeech() {
if (isListening) {
stopSpeech();
} else {
startSpeech();
}
}
function startSpeech() {
let message1 = document.getElementById('message1').innerText;
let message2 = document.getElementById('message2').innerText;
let allSpeechText = message1 + ' ' + message2;
let speechText = new SpeechSynthesisUtterance(allSpeechText);
speechSynthesisInstance.speak(speechText);
document.getElementById('listenButton').innerText = 'Stop';
isListening = true;
}
function stopSpeech() {
speechSynthesisInstance.cancel();
document.getElementById('listenButton').innerText = 'Listen';
isListening = false;
}
</script>
<style> <style>
section > div > p > p { section > div > p > p {
text-align: justify; text-align: justify;

View File

@@ -25,42 +25,60 @@ const items = metaJSON.data[0];
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in/local/` ogURL=`https://barta-india.in/local/`
canonical=`https://barta-india.in/local`
> >
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<div class="my-16"> <div class="my-16">
<span class="text-[#780a0a] font-bold" id="pageName"></span> <span class="text-[#780a0a] font-bold" id="pageName"></span>
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1>
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/local${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/local/${items.slug}`}>
<img class="aspect-video " src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} /> <a class="flex flex-col" href={`/${items.slug}`}>
<div class="h-[100px] overflow-y-hidden"> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<p id="" set:html={items.content}></p> <h2 class="text-lg text-justify">{items.title}</h2>
</a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/local/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div>
</div>
<div class="flex flex-row place-content-between">
<button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
<p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/local/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div> </div>
</div> </div>
<div class="flex justify-end">
<a href={`/local/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a>
</div>
</div>
)} )}
<!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
</div> </div>
<!-- <div class="flex flex-col"> </section>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </main>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main>
</Layout> </Layout>
<script is:inline> <script is:inline>
const pageName = window.location.href.split('/')[3]; const pageName = window.location.href.split('/')[3];

View File

@@ -31,13 +31,13 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/national/${items.slug}` ogURL=`https://barta-india.in/national/${items.slug}`
canonical=`https://barta-india.in/national/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -46,7 +46,7 @@ const items = data.data[idx];
<p class="text-xl font-bold text-[#780a0a]">Share on: </p> <p class="text-xl font-bold text-[#780a0a]">Share on: </p>
<a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/national/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a> <a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/national/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a href=`https://www.facebook.com/share.php?u=https://barta-india.in/national/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> <a href=`https://www.facebook.com/share.php?u=https://barta-india.in/national/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a href=`http://www.twitter.com/share?url=https://barta-india.in/national/${items.slug}&text=Your%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a> <a href=`http://www.twitter.com/share?url=https://barta-india.in/national/${items.slug}&text=%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/national/${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> <a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/national/${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>
</div> </div>
@@ -55,6 +55,35 @@ const items = data.data[idx];
</section> </section>
</main> </main>
</Layout> </Layout>
<script is:inline>
let isListening = false;
let speechSynthesisInstance = window.speechSynthesis;
function toggleSpeech() {
if (isListening) {
stopSpeech();
} else {
startSpeech();
}
}
function startSpeech() {
let message1 = document.getElementById('message1').innerText;
let message2 = document.getElementById('message2').innerText;
let allSpeechText = message1 + ' ' + message2;
let speechText = new SpeechSynthesisUtterance(allSpeechText);
speechSynthesisInstance.speak(speechText);
document.getElementById('listenButton').innerText = 'Stop';
isListening = true;
}
function stopSpeech() {
speechSynthesisInstance.cancel();
document.getElementById('listenButton').innerText = 'Listen';
isListening = false;
}
</script>
<style> <style>
section > div > p > p { section > div > p > p {
text-align: justify; text-align: justify;

View File

@@ -25,42 +25,60 @@ const items = metaJSON.data[0];
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in/national/` ogURL=`https://barta-india.in/national/`
canonical=`https://barta-india.in/national`
> >
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<div class="my-16"> <div class="my-16">
<span class="text-[#780a0a] font-bold" id="pageName"></span> <span class="text-[#780a0a] font-bold" id="pageName"></span>
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1>
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/national${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/national/${items.slug}`}>
<img class="aspect-video " src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} /> <a class="flex flex-col" href={`/${items.slug}`}>
<div class="h-[100px] overflow-y-hidden"> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<p id="" set:html={items.content}></p> <h2 class="text-lg text-justify">{items.title}</h2>
</a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/national/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div>
</div>
<div class="flex flex-row place-content-between">
<button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
<p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/national/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div> </div>
</div> </div>
<div class="flex justify-end">
<a href={`/national/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a>
</div>
</div>
)} )}
<!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
</div> </div>
<!-- <div class="flex flex-col"> </section>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </main>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main>
</Layout> </Layout>
<script is:inline> <script is:inline>
const pageName = window.location.href.split('/')[3]; const pageName = window.location.href.split('/')[3];

View File

@@ -30,14 +30,14 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/politics/${items.slug}` ogURL=`https://barta-india.in/politics/${items.slug}`
canonical=`https://barta-india.in/politics/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -46,7 +46,7 @@ const items = data.data[idx];
<p class="text-xl font-bold text-[#780a0a]">Share on: </p> <p class="text-xl font-bold text-[#780a0a]">Share on: </p>
<a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/politics/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a> <a href=`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/politics/${items.slug}` data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a href=`https://www.facebook.com/share.php?u=https://barta-india.in/politics/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a> <a href=`https://www.facebook.com/share.php?u=https://barta-india.in/politics/${items.slug}` target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a href=`http://www.twitter.com/share?url=https://barta-india.in/politics/${items.slug}&text=Your%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a> <a href=`http://www.twitter.com/share?url=https://barta-india.in/politics/${items.slug}&text=%20${items.title}` target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/politics/${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> <a href=`https://www.linkedin.com/shareArticle?mini=true&url=https://barta-india.in/politics/${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>
</div> </div>
@@ -55,6 +55,35 @@ const items = data.data[idx];
</section> </section>
</main> </main>
</Layout> </Layout>
<script is:inline>
let isListening = false;
let speechSynthesisInstance = window.speechSynthesis;
function toggleSpeech() {
if (isListening) {
stopSpeech();
} else {
startSpeech();
}
}
function startSpeech() {
let message1 = document.getElementById('message1').innerText;
let message2 = document.getElementById('message2').innerText;
let allSpeechText = message1 + ' ' + message2;
let speechText = new SpeechSynthesisUtterance(allSpeechText);
speechSynthesisInstance.speak(speechText);
document.getElementById('listenButton').innerText = 'Stop';
isListening = true;
}
function stopSpeech() {
speechSynthesisInstance.cancel();
document.getElementById('listenButton').innerText = 'Listen';
isListening = false;
}
</script>
<style> <style>
/* section > div > p > p { /* section > div > p > p {
text-align: justify; text-align: justify;

View File

@@ -25,42 +25,60 @@ const items = metaJSON.data[0];
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in/politics/` ogURL=`https://barta-india.in/politics/`
canonical=`https://barta-india.in/politics`
> >
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<div class="my-16"> <div class="my-16">
<span class="text-[#780a0a] font-bold" id="pageName"></span> <span class="text-[#780a0a] font-bold" id="pageName"></span>
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1>
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/politics${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/politics/${items.slug}`}>
<img class="aspect-video " src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} /> <a class="flex flex-col" href={`/${items.slug}`}>
<div class="h-[100px] overflow-y-hidden"> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<p id="" set:html={items.content}></p> <h2 class="text-lg text-justify">{items.title}</h2>
</a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/politics/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div>
</div>
<div class="flex flex-row place-content-between">
<button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
<p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/politics/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div> </div>
</div> </div>
<div class="flex justify-end">
<a href={`/politics/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a>
</div>
</div>
)} )}
<!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
</div> </div>
<!-- <div class="flex flex-col"> </section>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </main>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main>
</Layout> </Layout>
<script is:inline> <script is:inline>
const pageName = window.location.href.split('/')[3]; const pageName = window.location.href.split('/')[3];

View File

@@ -2,7 +2,6 @@
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
--- ---
<Layout title="Privacy Policy | Barta-India" <Layout title="Privacy Policy | Barta-India"
canonical=`https://barta-india.in/privacy-policy`
> >
<main> <main>

View File

@@ -0,0 +1,25 @@
---
import Layout from "../layouts/Layout.astro";
---
<Layout title="Text to Speech | Barta">
<main>
<div>
<section class="container mx-auto px-4 max-w-xl">
<div class="flex flex-col justify-center space-y-4">
<h1>Text to Speech</h1>
<label for="message"></label>
<textarea name="message" id="message" cols="30" rows="10" class="border-2 border-gray-400 focus:outline-none focus:border-[4px] focus:border-[#780a0a] rounded-2xl shadow-lg p-4"></textarea>
<button onclick="textSpeech();" class="bg-[#780a0a] px-6b py-2 rounded-lg text-white font-bold ">Speech</button>
<!-- <input name="message" id="message" type="text" class=""> -->
</div>
</section>
</div>
</main>
</Layout>
<script is:inline>
function textSpeech(){
let message = document.getElementById('message').value;
let speechText = new SpeechSynthesisUtterance(message);
window.speechSynthesis.speak(speechText);
}
</script>

View File

@@ -30,13 +30,13 @@ const items = data.data[idx];
ogTitle={items.meta_title} ogTitle={items.meta_title}
ogDesc={items.meta_description} ogDesc={items.meta_description}
ogURL=`https://barta-india.in/technology/${items.slug}` ogURL=`https://barta-india.in/technology/${items.slug}`
canonical=`https://barta-india.in/technology/${items.slug}`
> >
<main> <main>
<section class="container mx-auto px-4 mt-16"> <section class="container mx-auto px-4 mt-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<h1 class="text-3xl font-bold border-b-4 border-[#780A0A]">{items.heading}</h1> <div class=""><button onclick="toggleSpeech();" id="listenButton" class="float-right text-white font-bold px-6 py-2 rounded-lg bg-[#780a0a]">Listen</button></div>
<h2 class="text-xl py-2">{items.title}</h2> <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"> <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%]" /> <img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} class="md:w-[40%]" />
</div> </div>
@@ -54,6 +54,35 @@ const items = data.data[idx];
</section> </section>
</main> </main>
</Layout> </Layout>
<script is:inline>
let isListening = false;
let speechSynthesisInstance = window.speechSynthesis;
function toggleSpeech() {
if (isListening) {
stopSpeech();
} else {
startSpeech();
}
}
function startSpeech() {
let message1 = document.getElementById('message1').innerText;
let message2 = document.getElementById('message2').innerText;
let allSpeechText = message1 + ' ' + message2;
let speechText = new SpeechSynthesisUtterance(allSpeechText);
speechSynthesisInstance.speak(speechText);
document.getElementById('listenButton').innerText = 'Stop';
isListening = true;
}
function stopSpeech() {
speechSynthesisInstance.cancel();
document.getElementById('listenButton').innerText = 'Listen';
isListening = false;
}
</script>
<style> <style>
section > div > p > p { section > div > p > p {
text-align: justify; text-align: justify;

View File

@@ -25,42 +25,60 @@ const items = metaJSON.data[0];
ogTitle={items.title} ogTitle={items.title}
ogDesc={items.description} ogDesc={items.description}
ogURL=`https://barta-india.in/technology/` ogURL=`https://barta-india.in/technology/`
canonical=`https://barta-india.in/technology`
> >
<main> <main>
<section class="container mx-auto px-4"> <section class="container mx-auto px-4">
<div class="my-16"> <div class="my-16">
<span class="text-[#780a0a] font-bold" id="pageName"></span> <span class="text-[#780a0a] font-bold" id="pageName"></span>
<h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1> <h1 class="text-4xl font-bold border-b-4 border-[#780A0A]">Latest News</h1>
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined;}) => {data.map((items: {id: string | undefined; heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined; slug : string | undefined; date_created : string | undefined; in_brief: string | undefined;}) =>
<div class="flex flex-col border-2 border-[#780a0a] gap-6 p-6 place-content-between rounded-lg"> <div class="flex flex-col border-2 border-[#780a0a] gap-6 p-4 place-content-between rounded-lg">
<div class="flex flex-col"> <div class="flex flex-col">
<a href={`/technology${items.slug}`} class="border-b-4 border-[#780a0a] text-2xl font-bold line-clamp-1">{items.heading}</a> <div class="">
<h2 class="text-lg line-clamp-1">{items.title}</h2> <a class="flex flex-col" href={`/technology/${items.slug}`}>
<img class="aspect-video " src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} /> <a class="flex flex-col" href={`/${items.slug}`}>
<div class="h-[100px] overflow-y-hidden"> <img class="aspect-video rounded-t-lg" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<p id="" set:html={items.content}></p> <h2 class="text-lg text-justify">{items.title}</h2>
</a>
</div>
<div>
<dialog id={`d-${items.id}`} class="shadow-xl rounded-xl md:w-[50%] xl:w-[30%]">
<form method="dialog">
<div class="flex flex-col md:flex-col">
<a href={`/technology/${items.slug}`} class="flex flex-col md:flex-col">
<img class="rounded-t-xl" src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt={items.title} />
<h1 class="text-lg font-bold">{items.heading} </h1>
<h2 class="text-justify ">{items.in_brief}</h2>
</a>
<div class="flex flex-row place-content-between place-items-center">
<div class="flex flex-row place-content-between place-items-center p-2 space-x-6 shadow-lg shadow-gray-400 rounded-2xl">
<a class="hover:-translate-y-2 duration-[1s]" href={`whatsapp://send?text=${items.title}%20%0A%20https://barta-india.in/${items.slug}`} data-action="share/whatsapp/share"><img src="/img/whatsapp.svg" alt="WhatsApp Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbarta-india.in%2F${items.slug}`} target="_blank"><img src="/img/facebook.svg" alt="Facebook Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" href={`http://www.twitter.com/share?url=https://barta-india.in/${items.slug}&text=${items.title}`} target="_blank"><img src="/img/x.svg" alt="Twitter/X Logo"/></a>
<a class="hover:-translate-y-2 duration-[1s]" 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 class="flex border-b-4 border-gray-500 border-t rounded-full text-3xl hover:rotate-180 duration-[3s]">
<button class="text-white font-bold py-2 px-4 bg-[#780a0a] rounded-full shadow-xl" onclick={`document.getElementById('d-${items.id}').close()`}>&#10008;</button>
</div>
</div>
</div>
</form>
</dialog>
</div>
</div>
<div class="flex flex-row place-content-between">
<button onclick={`document.getElementById('d-${items.id}').showModal()`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">In Brief</button>
<p class="">Publish at: <br/> {items.date_created.split(':')[0].split('T')[0]}</p>
<a href={`/technology/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Details</a>
</div> </div>
</div> </div>
<div class="flex justify-end">
<a href={`/technology/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold py-2 px-6">Read More</a>
</div>
</div>
)} )}
<!-- <a href={`/${items.slug}`} class="bg-[#780A0A] text-white rounded-md font-bold px-6 ">Read More>></a> -->
</div> </div>
<!-- <div class="flex flex-col"> </section>
{data.map((items: {heading: string | undefined; img: string | undefined; title : string | undefined; content : string | undefined;}) => </main>
<div class="flex flex-col border-2 gap-6 p-6">
<h1 class="border-b-4 border-[#780a0a] text-2xl font-bold">{items.heading}</h1>
<h2 class="text-lg">{items.title}</h2>
<img src={`https://api7.siliconpin.com/assets/${items.img}?quality=50&format=jpeg`} alt=""/>
</div>
)}
</div> -->
</section>
</main>
</Layout> </Layout>
<script is:inline> <script is:inline>
const pageName = window.location.href.split('/')[3]; const pageName = window.location.href.split('/')[3];

View File

@@ -1,7 +1,7 @@
--- ---
import Layout from "../layouts/Layout.astro" import Layout from "../layouts/Layout.astro"
--- ---
<Layout title="Terms & Conditions | Barta-India" canonical=`https://barta-india.in/terms-and-conditions`> <Layout title="Terms & Conditions | Barta-India">
<main> <main>
<div class="mt-16"> <div class="mt-16">
<section class="container mx-auto px-4 "> <section class="container mx-auto px-4 ">

140
src/pages/weather.astro Normal file
View File

@@ -0,0 +1,140 @@
<main>
<div>
<section class="container mx-auto px-4">
<div id="swicthDIVBG">
<p id="cityName"></p>
<p id="temper"></p>
<p id="description"></p>
</div>
</section>
<div class="flex flex-col justify-center place-items-center fixed top-[50%] right-[50%] bg-white md:max-w-lg w-full p-6 rounded-2xl shadow-xl" style="display: none;" id="weatherPermission">
<p>know weather information allow location Permission</p>
<div class="flex flex-row gap-6">
<button id="yesButton" class="border-2 border-[#580a0a] text-[#580a0a] px-4 py-2 rounded-xl">Allow</button>
<button id="noButton" class="border-2 border-[#580a0a] text-[#580a0a] px-4 py-2 rounded-xl">Deny</button>
</div>
</div>
<!-- <div class="bg-red-500 text-black" id="weatherInfo"></div> -->
</div>
</main>
<script is:inline>
async function getCurrentLocation() {
return new Promise((resolve, reject) => {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(
(position) => resolve(position.coords),
(error) => reject(error)
);
} else {
reject(new Error('Geolocation is not supported by this browser.'));
}
});
}
async function getCityName(latitude, longitude) {
const apiKey = '4d54049b61eb45c4b121ab2cff9808ba'; // Replace with your OpenCage API key
const apiUrl = `https://api.opencagedata.com/geocode/v1/json?q=${latitude}+${longitude}&key=${apiKey}`;
try {
const response = await fetch(apiUrl);
if (!response.ok) {
throw new Error('Error fetching data from the server.');
}
const data = await response.json();
if (data.results && data.results.length > 0) {
const city = data.results[0].components.city;
return city;
} else {
throw new Error('City not found.');
}
} catch (error) {
console.error('Error:', error.message);
throw new Error('Error fetching city name.');
}
}
async function getWeatherData(city) {
const apiKey = 'aed8dd87581613e1d2bbbf63eeb618da';
const apiUrl = `https://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${apiKey}`;
try {
const response = await fetch(apiUrl);
if (!response.ok) {
throw new Error('Error fetching weather data from the server.');
}
const data = await response.json();
return data;
} catch (error) {
console.error('Error:', error.message);
throw new Error('Error fetching weather data.');
}
}
async function showCityName() {
try {
const location = await getCurrentLocation();
const city = await getCityName(location.latitude, location.longitude);
// document.getElementById('weatherInfo').innerText = 'Current City: ' + city;
const weatherData = await getWeatherData(city);
displayWeather(weatherData);
} catch (error) {
console.error(error.message);
// document.getElementById('weatherInfo').innerText = 'Error fetching data.';
}
}
function displayWeather(data) {
// const weatherInfoDiv = document.getElementById('weatherInfo');
// Extract relevant information from the API response
const cityName = data.name;
const temperature = data.main.temp;
const description = data.weather[0].description;
document.getElementById('cityName').innerHTML= 'City: ' + cityName;
document.getElementById('temper').innerHTML = 'Temperature: ' + temperature;
document.getElementById('description').innerHTML = 'Description: ' + description;
let switchBG = document.innerHTML = description;
if (switchBG === 'clear sky') {
let clearSkyBG = document.getElementById('swicthDIVBG').style.backgroundImage = 'url(/img/clear_sky.webp)';
clearSkyBG.style.backgroundRepeat = 'no-repeat';
clearSkyBG.style.backgroundSize = 'cover';
}
// Display the weather information switchDiv.style.backgroundImage = 'url("path/to/clear-sky-image.jpg")';
// weatherInfoDiv.innerHTML = `
// <p>City: ${cityName}</p>
// <p>Temperature: ${temperature} °C</p>
// <p>Description: ${description}</p>
// `;
}
function windowOnload() {
document.getElementById('weatherPermission').style.display = 'block';
// Attach click event handlers to the buttons
document.getElementById('yesButton').addEventListener('click', onYesButtonClick);
document.getElementById('noButton').addEventListener('click', onNoButtonClick);
}
function onYesButtonClick() {
// Call the function to display the city name and weather information
showCityName();
// Hide the weather permission div
document.getElementById('weatherPermission').style.display = 'none';
}
function onNoButtonClick() {
// Hide the weather permission div without fetching weather information
document.getElementById('weatherPermission').style.display = 'none';
}
window.onload = windowOnload;
</script>