script.js

const container = document.querySelector("main");
const search = document.querySelector(".search label");
const expander = document.querySelector("main .menu .expander");
const current = document.querySelector(".current");
const menuItems = document.querySelectorAll("main .menu .primary .menu-item");
const mainCards = document.querySelectorAll("main .dashboard .card");
const weatherContent = document.querySelector(".side .weather .content");
const date = document.querySelector("main .side .date");
const time = document.querySelector("main .side .time");

// Fix :active touch on mobiles
document.addEventListener("touchstart", () => {}, true);

// Search Expand
search.addEventListener("click", () => container.classList.toggle("search"));

// Main Menu
menuItems.forEach((item) => {
  item.addEventListener("click", () => {
    current.innerText = item.querySelector(".desc").textContent;
    menuItems.forEach((item) => item.classList.remove("active"));
    item.classList.add("active");
  });
});

// Set Date, Time
const today = new Date();
const formatZero = (value) => value<10 ? '0'+value : value;
const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
date.innerText= `${today.getDate()} ${months[today.getMonth()]}, ${today.getFullYear()}`;
time.innerText= `${today.getHours()}:${formatZero(today.getMinutes())}`;

// Populate News
const dummyData = () => {
  mainCards.forEach((card, i) => {
    card.querySelector(".title").innerText =
      "L k";
    card.querySelector(
      ".content"
    ).innerText = " K  ".slice(
      0,
      Math.round(Math.random() * -200)
    );
  });
};

// Weather Data from open-meteo.com
const weatherData = async () => {
  const weather =
    "https://api.open-meteo.com/v1/forecast?latitude=28.4020&longitude=76.82602&hourly=temperature_2m&current_weather=true";
  const res = await fetch(weather);
  const data = await res.json();

  if (data) {
    weatherContent.innerHTML = `
    ${data.current_weather.temperature}<span class='celsius'>°C</span>
    `;
  }
};

dummyData();
weatherData();