almost change all layouts to ssr

This commit is contained in:
Ehsan
2025-05-11 15:16:51 +03:30
parent b3bdf6c332
commit 1b2f579d0d
20 changed files with 121 additions and 124 deletions
+4 -4
View File
@@ -9,7 +9,7 @@ function Caption({ data, loading }) {
<CustomLoading loading={loading} width="full" height={500}>
<Image
className="rounded-[8px] overflow-hidden w-full"
src={data.cover_first}
src={data?.cover_first}
alt="cover-blog"
height={570}
width={808}
@@ -19,14 +19,14 @@ function Caption({ data, loading }) {
<MultilineLoading loading={loading} width="full" height={18} line={20}>
<div
className="my-[12px] sm:my-[16px] md:my-[20px] lg:my-[24px] text-[#525252] text-[14px] md:text-[15px] lg:text-[16px] font-normal leading-[26px] sm:leading-[28px] md:leading-[30px] lg:leading-[32px]"
dangerouslySetInnerHTML={{ __html: data.caption }}
dangerouslySetInnerHTML={{ __html: data?.caption }}
/>
</MultilineLoading>
</div>
<CustomLoading loading={loading} width="full" height={500}>
<Image
className="rounded-[8px] overflow-hidden w-full"
src={data.cover_second}
src={data?.cover_second}
alt="cover-blog"
height={570}
width={808}
@@ -36,7 +36,7 @@ function Caption({ data, loading }) {
<MultilineLoading loading={loading} width="full" height={18} line={20}>
<div
className="my-[12px] sm:my-[16px] md:my-[20px] lg:my-[24px] text-[#525252] text-[14px] md:text-[15px] lg:text-[16px] font-normal leading-[26px] sm:leading-[28px] md:leading-[30px] lg:leading-[32px]"
dangerouslySetInnerHTML={{ __html: data.caption }}
dangerouslySetInnerHTML={{ __html: data?.caption }}
/>
</MultilineLoading>
</div>
+2 -2
View File
@@ -34,7 +34,7 @@ function Head({ data, loading }) {
</p>
<TextLoading width={55} height={22} loading={loading}>
<p className="text-[#9B9B9B] text-[11px] md:text-[14px] lg:text-[16px] font-medium">
{data.date_of_release}
{data?.date_of_release}
</p>
</TextLoading>
</div>
@@ -44,7 +44,7 @@ function Head({ data, loading }) {
</p>
<TextLoading width={55} height={22} loading={loading}>
<p className="text-[#9B9B9B] text-[11px] md:text-[14px] lg:text-[16px] font-medium">
{data.time}
{data?.time}
</p>
</TextLoading>
</div>
+33
View File
@@ -0,0 +1,33 @@
import { getStateInfo } from "@/lib/getStateInfo";
import Footer from "./footer";
import Header from "./header";
function StLayout({ children }) {
const { matchedCity } = getStateInfo();
return (
<div>
<main className="w-full min-h-screen">
<header className="w-full sticky bg-[#FFF] !z-[70] shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)] mt-[12px] sm:mt-[21px] md:mt-[30px] lg:mt-[40px] top-0 right-1/2">
<div className="w-full padding-responsive">
<Header matchedCity={matchedCity} />
</div>
</header>
<section
className="opacity-page -mt-[calc(48px_+_12px)] sm:-mt-[calc(56px_+_21px)] md:-mt-[calc(64px_+_30px)] lg:-mt-[calc(80px_+_40px)]"
>
{children}
</section>
</main>
<footer className="bg-[#F5F5F5] mt-[100px] bg-banner-footer !bg-center !bg-no-repeat !bg-cover">
<div className="pt-[44px] bg-[rgba(255,255,255,0.45)]">
<div className="padding-responsive">
<Footer matchedCity={matchedCity} />
</div>
</div>
</footer>
</div>
);
}
export default StLayout;
+16 -11
View File
@@ -17,15 +17,23 @@ import HeadMenu from "./menu/HeadMenu";
import ListMenu from "./menu/ListMenu";
import { useState } from "react";
const socialMedias = [<Linkedin />, <Telegram />, <Whatsapp />, <Instagram />];
const head = [
{ icon: <LocationF />, text: "جستجوی پزشک در شهر شما" },
{ icon: <CalendarAddF />, text: "نوبت گیری سریع و آسان" },
{ icon: <StethoscopeF />, text: "دشبورد اختصاصی برای پزشکان" },
];
function Footer() {
function Footer({ matchedCity }) {
const socialMedias = [{
icon: <Instagram />,
name: 'instagram'
}, {
icon: <Telegram />,
name: 'telegram'
}, {
icon: <Whatsapp />,
name: 'whatsapp'
}];
const [openMenu, setOpenMenu] = useState({
right: false,
left: false,
@@ -59,11 +67,8 @@ function Footer() {
<div className="w-full lg:w-fit flex gap-[12px] lg:gap-[30px] flex-col items-start">
{/* Icon */}
<Logo />
<p className="w-full lg:w-fit text-[#616161] text-[14px] font-normal">
724 یک وبسایت نوبت دهی آنلاین می باشد که
<br className="hidden lg:flex" /> بستری آسان برای پزشکان و بیماران
فراهم کرده
<br className="hidden lg:flex" /> است.{" "}
<p className="w-full lg:w-fit lg:max-w-[260px] text-[#616161] text-[14px] font-normal">
{matchedCity?.footerDescription}
</p>
<div className="hidden lg:flex">
<LogoNamad />
@@ -101,8 +106,8 @@ function Footer() {
key={idx}
className="p-2.5 bg-[#EAECFA] hover-rotate-icon cursor-pointer rounded-full w-fit"
>
<Link href="/" className="min-h-fit">
{item}
<Link href={matchedCity?.socialMedia[item.name] || '/'} className="min-h-fit">
{item.icon}
</Link>
</li>
))}
@@ -113,7 +118,7 @@ function Footer() {
</div>
</div>
<p className="text-center text-[#7E7E7E] text-[12px] font-normal">
کلیه حقوق وبسایت برای این شرکت می باشد.
{matchedCity?.footerDisclaimer}
</p>
</div>
);
+2 -2
View File
@@ -10,7 +10,7 @@ import BgGray from "./list/col/BgGray";
import UserLogin from "@/components/icons/UserLogin";
import { useState } from "react";
function Content({ matchedCity }) {
function Content({ matchedCity, name }) {
const [isActive, setIsActive] = useState(false);
return (
@@ -23,7 +23,7 @@ function Content({ matchedCity }) {
>
<div>
<BgGray isActive={isActive} setIsActive={setIsActive} />
<Col name={name} isActive={isActive} setIsActive={setIsActive} />
<Col name={name} isActive={isActive} />
<div className="relative flex flex-row-reverse gap-2">
<Logo matchedCity={matchedCity} />
<div className="flex lg:hidden z-20">
+3 -4
View File
@@ -1,13 +1,12 @@
import Content from "./Content";
// import { getStateInfo } from "@/lib/getStateInfo";
function Header({ name }) {
// const { matchedCity } = getStateInfo();
function Header({ matchedCity, name }) {
return (
<div className="bg-[#FFF] rounded-lg w-full mx-auto">
<Content
// matchedCity={matchedCity}
matchedCity={matchedCity}
name={name}
/>
</div>
);
+1 -1
View File
@@ -3,7 +3,7 @@ import { Button } from "@mui/material";
import Link from "next/link";
import { isActiveURL } from "@/helper";
function Col({ isActive, setIsActive, name }) {
function Col({ isActive, name }) {
return (
<div className="flex lg:hidden">
<div
+3 -6
View File
@@ -1,7 +1,5 @@
import { getStateInfo } from "@/lib/getStateInfo";
import Footer from "./footer";
import Header from "./header";
import Sidebar from "./sidebar";
function Layout({
@@ -17,9 +15,8 @@ function Layout({
user,
value,
setValue,
matchedCity
}) {
const { matchedCity } = getStateInfo();
return (
<div>
<main
@@ -28,7 +25,7 @@ function Layout({
>
<header className="w-full sticky bg-[#FFF] !z-[70] shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)] mt-[12px] sm:mt-[21px] md:mt-[30px] lg:mt-[40px] top-0 right-1/2">
<div className="w-full padding-responsive">
<Header name={name} />
<Header name={name} matchedCity={matchedCity} />
</div>
</header>
<section
@@ -57,7 +54,7 @@ function Layout({
<footer className="bg-[#F5F5F5] mt-[100px] bg-banner-footer !bg-center !bg-no-repeat !bg-cover">
<div className="pt-[44px] bg-[rgba(255,255,255,0.45)]">
<div className="padding-responsive">
<Footer />
<Footer matchedCity={matchedCity} />
</div>
</div>
</footer>