Skip to content

Commit

Permalink
ui color change
Browse files Browse the repository at this point in the history
  • Loading branch information
tntanvir committed Feb 24, 2025
1 parent f43d7c4 commit ad1df31
Show file tree
Hide file tree
Showing 16 changed files with 458 additions and 59 deletions.
22 changes: 11 additions & 11 deletions .firebase/hosting.ZGlzdA.cache
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
vite.png,1703403210000,c7e8b220c2ad5d70459bcbabf1023fbc4d4730c057a55724c48eac987fc8580b
tawheed.png,1706790530451,3fd82bed41cf5d587139d4425af07773d30fbaed50f78152c9191f9c9e3a75ce
favicon.ico,1703403210000,3ef54200b11160280d9ffe3f80fa91c9ba259364d337eaf853bce3ba20698071
404.png,1701798433482,faa8a7081c307c4aebf4040d58297c35e53bbe36ea1c0672ebb9b16d70ddfb87
index.html,1729869627986,f27998634f7f45ac808d89084541c4248f41689205aab55d819fa6a4e9b9f198
assets/purify.es-BZcJlXyC.js,1729869627986,2a0b4acf81d951ac70b052a34b3a38af17f1560bca447431c5111fb4cc4e5ab5
assets/html2canvas-z-DZaOsF.js,1729869627986,9500ec8a05aa5bb0dff0c1ee2498164d215cb708da6ef4ec8de1c0298fded671
assets/index-BBioUny3.css,1729869627986,f36a689fafd4ae68bdd49abf0b507f04607ea8f0869eb51eb06f39fafa535a74
assets/index.es-B-vZ23tE.js,1729869627986,9efdbe75c02652f580877ab6711e7a9e2079db96fada795be0560f22c50e03b8
assets/404-BdmjsMXD.png,1729869627980,faa8a7081c307c4aebf4040d58297c35e53bbe36ea1c0672ebb9b16d70ddfb87
assets/index-Bim2jItj.js,1729869627988,c30a4354a840d4e54249c37d13e3ac7f944b74c159a3b41a333d46f57e3b7172
vite.png,1732796517246,c7e8b220c2ad5d70459bcbabf1023fbc4d4730c057a55724c48eac987fc8580b
tawheed.png,1732796517246,3fd82bed41cf5d587139d4425af07773d30fbaed50f78152c9191f9c9e3a75ce
favicon.ico,1732796517245,3ef54200b11160280d9ffe3f80fa91c9ba259364d337eaf853bce3ba20698071
404.png,1732796517241,faa8a7081c307c4aebf4040d58297c35e53bbe36ea1c0672ebb9b16d70ddfb87
index.html,1740431539454,ef2c9c7da2c031591f2ec198e3a9a938d7f14b63e6752961d625fa61deb97006
assets/purify.es-zHtM-7sw.js,1740431539454,2a0b4acf81d951ac70b052a34b3a38af17f1560bca447431c5111fb4cc4e5ab5
assets/index-4F7b09O5.css,1740431539454,d7f5f79f540ac3b8e2c04bd87cc6802e4a167c48e7864fcbf0067f90e80d8c05
assets/index.es-Fjamt0xJ.js,1740431539454,c8b166fa8ac6134ea83d2ed0a2fbba32c99ad94fa3763d72bc78a428e49c4ff3
assets/html2canvas.esm-Ry1SfrtC.js,1740431539454,a219c0507678d278f143163b10e84e5cf75d7528e8c58e9df3fc1ec0ab3b71fa
assets/404-XZo7DFw5.png,1740431539454,faa8a7081c307c4aebf4040d58297c35e53bbe36ea1c0672ebb9b16d70ddfb87
assets/index-4-tH8fEa.js,1740431539458,dcf4cd37aba71b332896f489e62b368eb334e5840e89bc2fe30ecaf031fd6903
3 changes: 2 additions & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -13,4 +13,5 @@
<script type="module" src="/src/main.jsx"></script>
</body>

</html>
</html>

4 changes: 4 additions & 0 deletions src/App.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,8 @@ import HadisAllbook from "./component/Hadis/HadisAllbook";
import HadisSection from "./component/Hadis/HadisSection";
import Singlehadis from "./component/Hadis/Singlehadis";
import Qari from "./component/Alquran/Qari";
import Planer from "./component/Planer/Planer";
import Calendermain from "./component/calender/Calendermain";

function App() {

Expand All @@ -20,8 +22,10 @@ function App() {

<Routes >
<Route path="/" element={<Home />} />
<Route path="/celender" element={<Calendermain />} />
<Route path="/qari/:id" element={<Alquran />} />
<Route path="/qari" element={<Qari />} />
<Route path="/planer" element={<Planer />} />

<Route path="/qari/:qari/alquran/:id" element={<Sura />} />
<Route path="/hadis" element={<MainHadis />} />
Expand Down
8 changes: 4 additions & 4 deletions src/component/Alquran/Sura.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -164,7 +164,7 @@ const Sura = () => {
</div>
<div className=' flex flex-col gap-7 justify-center mt-3 items-center '>

<div className={`h-fit flex justify-center items-center bg-[#2e2e40] gap-5 p-0 rounded-md fixed bottom-1 w-[90vw] ${show ? "block" : "hidden"} transition duration-1000`}>
<div className={`h-fit flex justify-center items-center bg-[#1d1d21ef] gap-5 p-0 rounded-md fixed bottom-1 w-[90vw] ${show ? "block" : "hidden"} transition duration-1000`}>

{

Expand Down Expand Up @@ -196,7 +196,7 @@ const Sura = () => {
<div className=' gap-7 flex flex-col md:p-4'>
{
activeTab == "Arabi" && sura.ayahs && sura.ayahs.map(({ text, numberInSurah, audio }) => (
<div key={numberInSurah} className='bg-[#27272a] rounded-md py-5 md:px-2 min-h-[10rem] md:flex justify-between cursor-pointer '>
<div key={numberInSurah} className='bg-[#0f1014] rounded-md py-5 md:px-2 min-h-[10rem] md:flex justify-between cursor-pointer '>
<div className='flex items-center md:flex-col w-16 xs:bg-red-900 pb-6 gap-5'>
<div className='flex justify-center items-center w-11 h-11 p-1 rounded-full border-2'>
{/* <h1 className='text-2xl'>{e.number}</h1> */}
Expand All @@ -215,7 +215,7 @@ const Sura = () => {
}
{
activeTab == "Bangla" && bangla && bangla.map(({ text, id, translation }) => (
<div key={id} className='bg-[#27272a] rounded-md py-5 md:px-2 min-h-[10rem] md:flex justify-between cursor-pointer '>
<div key={id} className='bg-[#0f1014] rounded-md py-5 md:px-2 min-h-[10rem] md:flex justify-between cursor-pointer '>
<div className='flex items-center md:flex-col w-16 xs:bg-red-900 pb-6 gap-5'>
<div className='flex justify-center items-center w-11 h-11 p-1 rounded-full border-2'>
{/* <h1 className='text-2xl'>{e.number}</h1> */}
Expand All @@ -235,7 +235,7 @@ const Sura = () => {
}
{
activeTab == "English" && english && english.map(({ text, id, translation }) => (
<div key={id} className='bg-[#27272a] rounded-md py-5 md:px-2 min-h-[10rem] md:flex justify-between cursor-pointer '>
<div key={id} className='bg-[#0f1014] rounded-md py-5 md:px-2 min-h-[10rem] md:flex justify-between cursor-pointer '>
<div className='flex items-center md:flex-col w-16 xs:bg-red-900 pb-6 gap-5'>
<div className='flex justify-center items-center w-11 h-11 p-1 rounded-full border-2'>
{/* <h1 className='text-2xl'>{e.number}</h1> */}
Expand Down
2 changes: 1 addition & 1 deletion src/component/Footer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { Typography } from "@material-tailwind/react";

export function FooterWithLogo() {
return (
<footer className="w-full bg-[#18181B] text-white p-8">
<footer className="w-full bg-[#000000] text-white p-8">
<div className="flex flex-row flex-wrap items-center justify-center gap-y-6 gap-x-12 text-white text-center md:justify-between">
{/* <img src="https://docs.material-tailwind.com/img/logo-ct-dark.png" alt="logo-ct" className="w-10" /> */}
<h1 className="font-bold tracking-[0.2rem]">TAWHEED</h1>
Expand Down
2 changes: 1 addition & 1 deletion src/component/Hadis/HadisSection.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,7 @@ const HadisSection = () => {
<div className='gap-2 flex flex-col '>
{
section && section.hadiths.map(e => (
<div key={e.hadithnumber} className='bg-[#27272a] rounded-md py-5 md:px-2 min-h-[10rem] md:flex justify-between cursor-pointer duration-1000'>
<div key={e.hadithnumber} className='bg-grayr rounded-md py-5 md:px-2 min-h-[10rem] md:flex justify-between cursor-pointer duration-1000'>
<div className='flex items-center md:flex-col w-16 xs:bg-red-900 pb-6 gap-4'>
<div className='flex justify-center items-center w-11 h-11 p-1 rounded-full border-2'>

Expand Down
12 changes: 6 additions & 6 deletions src/component/Hero.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -123,7 +123,7 @@ const Hero = () => {

return (
<div className="min-h-screen md:px-5">
<div className="bg-[#27272a] text-white mt-10 md:p-10 p-3 md:rounded-md ">
<div className="bg-[#0f1014] text-white mt-10 md:p-10 p-3 md:rounded-md ">

<div className="flex flex-col md:flex-row justify-between ">
<h1 className="text-center md:text-2xl">Salat Times in {location.charAt(0).toUpperCase() + location.slice(1)}</h1>
Expand Down Expand Up @@ -159,7 +159,7 @@ const Hero = () => {
{
data.Fajr ?

<div className="bg-[#323232] hover:bg-[#27272a] hover:border-2 hover:border-[#1d4ed8] hover:duration-100 hover:shadow-lg hover:shadow-[#1d4ed8] hover:bg[#7777] rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<div className="bg-[#ffffff0e] hover:bg-[#27272a] rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<h1 className="font-semibold text-2xl ">Fajr</h1>
<h1 className="text-2xl ">0{count(data.Fajr)}</h1>
<CountdownTimer time={count(data.Fajr)} id={1} />
Expand All @@ -171,7 +171,7 @@ const Hero = () => {
data.Dhuhr ?

// console.log(data.Fajr)
<div className="bg-[#323232] hover:bg-[#27272a] hover:border-2 hover:border-[#1d4ed8] hover:duration-100 hover:shadow-lg hover:shadow-[#1d4ed8] shadow-sm rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<div className="bg-[#ffffff0e] hover:bg-[#27272a] shadow-sm rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<h1 className="font-semibold text-2xl">Dhuhr</h1>
<h1 className="text-2xl ">{count(data.Dhuhr)}</h1>
<CountdownTimer time={count(data.Dhuhr)} id={2} />
Expand All @@ -183,7 +183,7 @@ const Hero = () => {
data.Asr ?

// console.log(data.Asr)
<div className="bg-[#323232] hover:bg-[#27272a] hover:border-2 hover:border-[#1d4ed8] hover:duration-100 hover:shadow-lg hover:shadow-[#1d4ed8] shadow-sm rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<div className="bg-[#ffffff0e] hover:bg-[#27272a] shadow-sm rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<h1 className="font-semibold text-2xl">Asr</h1>
<h1 className="text-2xl ">0{count(data.Asr)}</h1>
<CountdownTimer time={count(data.Asr)} id={3} />
Expand All @@ -195,7 +195,7 @@ const Hero = () => {
data.Maghrib ?

// console.log(data.Asr)
<div className="bg-[#323232] hover:bg-[#27272a] hover:border-2 hover:border-[#1d4ed8] hover:duration-100 hover:shadow-lg hover:shadow-[#1d4ed8] shadow-sm rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<div className="bg-[#ffffff0e] hover:bg-[#27272a] shadow-sm rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<h1 className="font-semibold text-2xl">Maghrib</h1>
<h1 className="text-2xl "> 0{count(data.Maghrib)}</h1>
<CountdownTimer time={count(data.Maghrib)} id={4} />
Expand All @@ -207,7 +207,7 @@ const Hero = () => {
data.Isha ?

// console.log(data.Asr)
<div className="bg-[#323232] hover:bg-[#27272a] hover:border-2 hover:border-[#1d4ed8] hover:duration-100 hover:shadow-lg hover:shadow-[#1d4ed8] shadow-sm hover:bg[#7777] rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<div className="bg-[#ffffff0e] hover:bg-[#27272a] shadow-sm hover:bg[#7777] rounded-md text-center w-36 h-36 md:w-48 md:h-48 flex justify-center items-center flex-col md:p-3 cursor-pointer">
<h1 className="font-semibold text-2xl">Isha</h1>
<h1 className="text-2xl ">0{count(data.Isha)}</h1>
<CountdownTimer time={count(data.Isha)} id={5} />
Expand Down
4 changes: 3 additions & 1 deletion src/component/Home.jsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import Hero from "./Hero";
import MainHome from "./MainHome";

import Calendermain from "./calender/Calendermain";


Expand All @@ -13,7 +14,8 @@ const Home = () => {

<MainHome />
<Hero></Hero>
<Calendermain></Calendermain>
{/* <Calendermain></Calendermain> */}

</div>

);
Expand Down
88 changes: 72 additions & 16 deletions src/component/MainHome.jsx
Original file line number Diff line number Diff line change
@@ -1,36 +1,92 @@
// import { Button } from '@material-tailwind/react';
// import React from 'react';
// import { Link } from "react-router-dom";
// import { IoLogoGithub } from "react-icons/io5";
// import { TypeAnimation } from 'react-type-animation';
// const MainHome = () => {
// return (
// <div className='h-screen flex justify-center items-center flex-col max-w-2xl m-auto text-center text-white '>


// <TypeAnimation
// sequence={[
// 'TAWHEED',
// 1000,
// ]}
// speed={15}

// className='text-7xl text-white font-bold text-center tracking-[0.2rem] md:tracking-[0.4rem]'
// repeat={1}
// cursor={false}
// />

// <p className='text-gray-400 text-3xl tracking-[0.2rem] md:tracking-[0.4rem]'>Digital home for all things Muslim</p>
// <div className='mt-5'>

// <Link to="https://github.com/tntanvir/muslimpro" target='__blank'><Button className="bg-[#1d4ed8] flex justify-center items-center gap-2 hover:shadow-[#1d4ed8] duration-700" size="sm">
// <IoLogoGithub className='text-2xl' />
// github
// </Button></Link>


// </div>
// </div>
// );
// };

// export default MainHome;


import { Button } from '@material-tailwind/react';
import React from 'react';
import { Link } from "react-router-dom";
import { IoLogoGithub } from "react-icons/io5";
import { TypeAnimation } from 'react-type-animation';
import { FaTelegramPlane } from 'react-icons/fa';

const MainHome = () => {
return (
<div className='h-screen flex justify-center items-center flex-col max-w-2xl m-auto text-center text-white '>
<div className="relative h-screen flex flex-col justify-center items-center mx-auto text-center text-white px-4">

{/* Blurred Blue Background Effect */}
<div className="absolute inset-0 flex items-end justify-end -z-50">
<div className="blurred-bg animate-bounce-slow "></div>
</div>
{/* <div className="absolute inset-0 flex items-start justify-start -z-50">
<div className="blurred-bg "></div>
</div> */}

{/* Animated Title */}
<TypeAnimation
sequence={[
'TAWHEED',
1000,
]}
sequence={['TAWHEED', 1000]}
speed={15}

className='text-7xl text-white font-bold text-center tracking-[0.2rem] md:tracking-[0.4rem]'
className="text-5xl sm:text-7xl font-bold tracking-[0.2rem] md:tracking-[0.4rem] "
repeat={1}
cursor={false}
/>

<p className='text-gray-400 text-3xl tracking-[0.2rem] md:tracking-[0.4rem]'>Digital home for all things Muslim</p>
<div className='mt-5'>

<Link to="https://github.com/tntanvir/muslimpro" target='__blank'><Button className="bg-[#1d4ed8] flex justify-center items-center gap-2 hover:shadow-[#1d4ed8] duration-700" size="sm">
<IoLogoGithub className='text-2xl' />
github
</Button></Link>

{/* Subtitle */}
<p className="text-gray-400 text-xl sm:text-3xl tracking-[0.2rem] md:tracking-[0.4rem] mt-2">
Digital home for all things Muslim
</p>

{/* GitHub Button */}
<div className="mt-5 flex gap-3 justify-center items-center">
<Link to="https://github.com/tntanvir/muslimpro" target="__blank">
<Button className="bg-[#1d4ed8] flex items-center gap-2 px-4 py-2 rounded-lg transition duration-300 hover:shadow-lg hover:bg-[#1e40af]" size="sm">
<IoLogoGithub className="text-2xl" />
GitHub
</Button>
</Link>
<Link to="https://t.me/tawheed_by_tanvir_bot" target="__blank">
<Button className="bg-[#1d4ed8] flex items-center gap-2 px-4 py-2 rounded-lg transition duration-300 hover:shadow-lg hover:bg-[#1e40af]" size="sm">
<FaTelegramPlane className="text-2xl" />
Telegram
</Button>
</Link>
</div>
</div>
);
};

export default MainHome;
export default MainHome;
28 changes: 17 additions & 11 deletions src/component/NavListMenu.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -41,19 +41,25 @@ const navListMenuItems = [

},
{
title: "Blog",
title: "Celender",
description: "Find the perfect solution for your needs.",
icon: Bars4Icon,
link: "/blog",
link: "/celender",

},

{
title: "Contact",
description: "Find the perfect solution for your needs.",
icon: PhoneIcon,
link: "/contact",
},
// {
// title: "Contact",
// description: "Find the perfect solution for your needs.",
// icon: PhoneIcon,
// link: "/contact",
// },
// {
// title: "Planer",
// description: "Find the perfect solution for your needs.",
// icon: PhoneIcon,
// link: "/planer",
// },

];

Expand All @@ -65,7 +71,7 @@ function NavListMenu() {
// <a key={key} className="">
<Link key={key} to={link} >

<div className="flex p-0.5 items-center gap-3 rounded-lg hover:bg-[#323232] my-1">
<div className="flex p-0.5 items-center gap-3 rounded-lg hover:bg-[#ffffff0e] my-1">
<div className="flex items-center justify-center rounded-lg bg-[#1d4ed8] p-2 ">
{ }
{React.createElement(icon, {
Expand Down Expand Up @@ -125,7 +131,7 @@ function NavListMenu() {
</ListItem>
</Typography>
</MenuHandler>
<MenuList className="hidden max-w-screen-xl rounded-xl lg:block bg-[#18181B]">
<MenuList className="hidden max-w-screen-xl rounded-xl lg:block bg-[#0f1014]">
<ul className="grid grid-cols-2 gap-y-2 outline-none outline-0 gap-3 ">
{renderItems}
</ul>
Expand Down Expand Up @@ -198,7 +204,7 @@ export function NavbarWithMegaMenu() {


return (
<Navbar className={`sticky z-50 top-0 m-0 mx-auto max-w-full px-4 py-2 rounded-none bg-[#18181B] text-white border-0 ${nav ? 'shadow-md' : 'shadow-none'}`}>
<Navbar className={`sticky z-50 top-0 m-0 mx-auto max-w-full px-4 py-2 rounded-none bg-[#000000] text-white border-0 ${nav ? 'shadow-md' : 'shadow-none'}`}>
<div className="flex items-center justify-between text-white">
<Typography
as="li"
Expand Down
Loading

0 comments on commit ad1df31

Please sign in to comment.