11/21/24, 1:22 PM Code

1 // import RelatedPost from "@/components/Blog/RelatedPost";

2 // import SharePost from "@/components/Blog/SharePost";
3 // import { Metadata } from "next";
4 // import Image from "next/image";
5
6 // export const metadata: Metadata = {
7 // title: "Blog Details Page ",
8 // description: "This is Blog details page ",
9 // // other metadata
10 // };
11
12 // const SingleBlogPage = async () => {
13 // return (
14 // <>
15 // <section className="pb-20 pt-35 lg:pb-25 lg:pt-45 xl:pb-30 xl:pt-50">
16 // <div className="mx-auto max-w-c-1390 px-4 md:px-8 2xl:px-0">
17 // <div className="flex flex-col-reverse gap-7.5 lg:flex-row xl:gap-
12.5">
18 // <div className="md:w-1/2 lg:w-[32%]">
19 // <div className="animate_top mb-10 rounded-md border border-
stroke bg-white p-3.5 shadow-solid-13 dark:border-strokedark dark:bg-
blacksection">
20 // <form
21 // action="https://formbold.com/s/unique_form_id"
22 // method="POST"
23 // >
24 // <div className="relative">
25 // <input
26 // type="text"
27 // placeholder="Search Here..."
28 // className="w-full rounded-lg border border-stroke px-6
py-4 shadow-solid-12 focus:border-primary focus:outline-none dark:border-
strokedark dark:bg-black dark:shadow-none dark:focus:border-primary"
29 // />
30
31 // <button
32 // className="absolute right-0 top-0 p-5"
33 // aria-label="search-icon"
34 // >
35 // <svg
36 // className="fill-black transition-all duration-300
hover:fill-primary dark:fill-white dark:hover:fill-primary"
37 // width="21"
38 // height="21"
39 // viewBox="0 0 21 21"
40 // fill="none"
41 // xmlns="http://www.w3.org/2000/svg"
42 // >
43 // <path d="M16.031 14.617L20.314 18.899L18.899
20.314L14.617 16.031C13.0237 17.3082 11.042 18.0029 9 18C4.032 18 0 13.968 0
https://tarikjaber.github.io/Code-to-PDF/ 1/8
11/21/24, 1:22 PM Code

9C0 4.032 4.032 0 9 0C13.968 0 18 4.032 18 9C18.0029 11.042 17.3082 13.0237

16.031 14.617ZM14.025 13.875C15.2941 12.5699 16.0029 10.8204 16 9C16 5.132
12.867 2 9 2C5.132 2 2 5.132 2 9C2 12.867 5.132 16 9 16C10.8204 16.0029 12.5699
15.2941 13.875 14.025L14.025 13.875Z" />
44 // </svg>
45 // </button>
46 // </div>
47 // </form>
48 // </div>
49
50 // <div className="animate_top mb-10 rounded-md border border-
stroke bg-white p-9 shadow-solid-13 dark:border-strokedark dark:bg-
blacksection">
51 // <h4 className="mb-7.5 text-2xl font-semibold text-black
dark:text-white">
52 // Categories
53 // </h4>
54
55 // <ul>
56 // <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
57 // <a href="#">Blog</a>
58 // </li>
59 // <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
60 // <a href="#">Events</a>
61 // </li>
62 // <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
63 // <a href="#">Grids</a>
64 // </li>
65 // <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
66 // <a href="#">News</a>
67 // </li>
68 // <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
69 // <a href="#">Rounded</a>
70 // </li>
71 // </ul>
72 // </div>
73
74 // <RelatedPost />
75 // </div>
76
77 // <div className="lg:w-2/3">
78 // <div className="animate_top rounded-md border border-stroke
bg-white p-7.5 shadow-solid-13 dark:border-strokedark dark:bg-blacksection
md:p-10">
79 // <div className="mb-10 w-full overflow-hidden ">

https://tarikjaber.github.io/Code-to-PDF/ 2/8
11/21/24, 1:22 PM Code

80 // <div className="relative aspect-[97/60] w-full sm:aspect-

[97/44]">
81 // <Image
82 // src={"/images/blog/blog-01.png"}
83 // alt="Kobe Steel plant that supplied"
84 // fill
85 // className="rounded-md object-cover object-center"
86 // />
87 // </div>
88 // </div>
89
90 // <h2 className="mb-5 mt-11 text-3xl font-semibold text-black
dark:text-white 2xl:text-sectiontitle2">
91 // Kobe Steel plant that supplied
92 // </h2>
93
94 // <ul className="mb-9 flex flex-wrap gap-5 2xl:gap-7.5">
95 // <li>
96 // <span className="text-black dark:text-white">Author:
</span>{" "}
97 // Jhon Doe
98 // </li>
99 // <li>
100 // <span className="text-black dark:text-white">
101 // Published On: July 30, 2023
102 // </span>{" "}
103 // </li>
104 // <li>
105 // <span className="text-black dark:text-white">
106 // Category:
107 // </span>
108 // Events
109 // </li>
110 // </ul>
111
112 // <div className="blog-details">
113 // <p>
114 // Lorem ipsum dolor sit amet, consectetur adipiscing elit.
115 // Nunc quis nibh lorem. Duis sed odio lorem. In a
efficitur
116 // leo. Ut venenatis rhoncus quam sed condimentum.
Curabitur
117 // vel turpis in dolor volutpat imperdiet in ut mi. Integer
non
118 // volutpat nulla. Nunc elementum elit viverra, tempus quam
119 // non, interdum ipsum.
120 // </p>
121
122 // <p>
123 // Aenean augue ex, condimentum vel metus vitae, aliquam
porta

https://tarikjaber.github.io/Code-to-PDF/ 3/8
11/21/24, 1:22 PM Code

124 // elit. Quisque non metus ac orci mollis posuere. Mauris

vel
125 // ipsum a diam interdum ultricies sed vitae neque. Nulla
126 // porttitor quam vitae pulvinar placerat. Nulla fringilla
elit
127 // sit amet justo feugiat sodales. Morbi eleifend, enim non
128 // eleifend laoreet, odio libero lobortis lectus, non
porttitor
129 // sem urna sit amet metus. In sollicitudin quam est,
130 // pellentesque consectetur felis fermentum vitae.
131 // </p>
132
133 // <div className="flex flex-wrap gap-5">
134 // <Image
135 // src={"/images/blog/blog-01.png"}
136 // width={350}
137 // height={200}
138 // alt="image"
139 // />
140 // <Image
141 // src={"/images/blog/blog-02.png"}
142 // width={350}
143 // height={200}
144 // alt="image"
145 // />
146 // </div>
147
148 // <h3 className="pt-8">
149 // Nunc elementum elit viverra, tempus quam non
150 // </h3>
151
152 // <p>
153 // Lorem ipsum dolor sit amet, consectetur adipiscing elit.
154 // Nunc quis nibh lorem. Duis sed odio lorem. In a
efficitur
155 // leo. Ut venenatis rhoncus quam sed condimentum.
Curabitur
156 // vel turpis in dolor volutpat imperdiet in ut mi. Integer
non
157 // volutpat nulla. Nunc elementum elit viverra, tempus quam
158 // non, interdum ipsum.
159 // </p>
160 // </div>
161
162 // <SharePost />
163 // </div>
164 // </div>
165 // </div>
166 // </div>
167 // </section>
168 // </>

https://tarikjaber.github.io/Code-to-PDF/ 4/8
11/21/24, 1:22 PM Code

169 // );
170 // };
171
172 // export default SingleBlogPage;
173
174
175 import RelatedPost from "@/components/Blog/RelatedPost";
176 import SharePost from "@/components/Blog/SharePost";
177 import { Metadata } from "next";
178 import Image from "next/image";
179
180 export const metadata: Metadata = {
181 title: "Medical Blog Details Page",
182 description: "This is a Medical blog details page providing insights on
health and wellness.",
183 // other metadata
184 };
185
186 const SingleBlogPage = async () => {
187 return (
188 <>
189 <section className="pb-20 pt-35 lg:pb-25 lg:pt-45 xl:pb-30 xl:pt-50">
190 <div className="mx-auto max-w-c-1390 px-4 md:px-8 2xl:px-0">
191 <div className="flex flex-col-reverse gap-7.5 lg:flex-row xl:gap-
12.5">
192 <div className="md:w-1/2 lg:w-[32%]">
193 <div className="animate_top mb-10 rounded-md border border-stroke
bg-white p-3.5 shadow-solid-13 dark:border-strokedark dark:bg-blacksection">
194 <form
195 action="https://formbold.com/s/unique_form_id"
196 method="POST"
197 >
198 <div className="relative">
199 <input
200 type="text"
201 placeholder="Search Medical Topics..."
202 className="w-full rounded-lg border border-stroke px-6
py-4 shadow-solid-12 focus:border-primary focus:outline-none dark:border-
strokedark dark:bg-black dark:shadow-none dark:focus:border-primary"
203 />
204
205 <button
206 className="absolute right-0 top-0 p-5"
207 aria-label="search-icon"
208 >
209 <svg
210 className="fill-black transition-all duration-300
hover:fill-primary dark:fill-white dark:hover:fill-primary"
211 width="21"
212 height="21"
213 viewBox="0 0 21 21"

https://tarikjaber.github.io/Code-to-PDF/ 5/8
11/21/24, 1:22 PM Code

214 fill="none"
215 xmlns="http://www.w3.org/2000/svg"
216 >
217 <path d="M16.031 14.617L20.314 18.899L18.899
20.314L14.617 16.031C13.0237 17.3082 11.042 18.0029 9 18C4.032 18 0 13.968 0
9C0 4.032 4.032 0 9 0C13.968 0 18 4.032 18 9C18.0029 11.042 17.3082 13.0237
16.031 14.617ZM14.025 13.875C15.2941 12.5699 16.0029 10.8204 16 9C16 5.132
12.867 2 9 2C5.132 2 2 5.132 2 9C2 12.867 5.132 16 9 16C10.8204 16.0029 12.5699
15.2941 13.875 14.025L14.025 13.875Z" />
218 </svg>
219 </button>
220 </div>
221 </form>
222 </div>
223
224 <div className="animate_top mb-10 rounded-md border border-stroke
bg-white p-9 shadow-solid-13 dark:border-strokedark dark:bg-blacksection">
225 <h4 className="mb-7.5 text-2xl font-semibold text-black
dark:text-white">
226 Categories
227 </h4>
228
229 <ul>
230 <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
231 <a href="#">Health Tips</a>
232 </li>
233 <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
234 <a href="#">Wellness</a>
235 </li>
236 <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
237 <a href="#">Nutrition</a>
238 </li>
239 <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
240 <a href="#">Diseases</a>
241 </li>
242 <li className="mb-3 transition-all duration-300 last:mb-0
hover:text-primary">
243 <a href="#">Fitness</a>
244 </li>
245 </ul>
246 </div>
247
248 <RelatedPost />
249 </div>
250
251 <div className="lg:w-2/3">

https://tarikjaber.github.io/Code-to-PDF/ 6/8
11/21/24, 1:22 PM Code

252 <div className="animate_top rounded-md border border-stroke bg-

white p-7.5 shadow-solid-13 dark:border-strokedark dark:bg-blacksection md:p-
10">
253 <div className="mb-10 w-full overflow-hidden ">
254 <div className="relative aspect-[97/60] w-full sm:aspect-
[97/44]">
255 <Image
256 src={"/images/blog/blog-01.png"}
257 alt="Understanding Heart Health"
258 fill
259 className="rounded-md object-cover object-center"
260 />
261 </div>
262 </div>
263
264 <h2 className="mb-5 mt-11 text-3xl font-semibold text-black
dark:text-white 2xl:text-sectiontitle2">
265 Understanding Heart Health
266 </h2>
267
268 <ul className="mb-9 flex flex-wrap gap-5 2xl:gap-7.5">
269 <li>
270 <span className="text-black dark:text-white">Author:
</span>{" "}
271 Dr. Jane Smith
272 </li>
273 <li>
274 <span className="text-black dark:text-white">
275 Published On: November 10, 2024
276 </span>{" "}
277 </li>
278 <li>
279 <span className="text-black dark:text-white">
280 Category:
281 </span>
282 Health Tips
283 </li>
284 </ul>
285
286 <div className="blog-details">
287 <p>
288 Cardiovascular health is a critical component of overall
289 wellness. Regular exercise, a balanced diet, and stress
290 management play vital roles in maintaining a healthy heart.
291 </p>
292
293 <p>
294 Recent studies highlight the benefits of a Mediterranean
295 diet, rich in fruits, vegetables, and whole grains, for
296 reducing the risk of heart diseases. Incorporating
297 mindfulness practices can further enhance well-being.

https://tarikjaber.github.io/Code-to-PDF/ 7/8
11/21/24, 1:22 PM Code

298 </p>
299
300 <div className="flex flex-wrap gap-5">
301 <Image
302 src={"/images/blog/blog-01.png"}
303 width={350}
304 height={200}
305 alt="Healthy Heart"
306 />
307 <Image
308 src={"/images/blog/blog-02.png"}
309 width={350}
310 height={200}
311 alt="Exercise Benefits"
312 />
313 </div>
314
315 <h3 className="pt-8">
316 The Importance of Regular Checkups
317 </h3>
318
319 <p>
320 Routine checkups help in early detection and prevention of
321 potential health issues. Stay proactive in consulting your
322 healthcare provider to ensure a long, healthy life.
323 </p>
324 </div>
325
326 <SharePost />
327 </div>
328 </div>
329 </div>
330 </div>
331 </section>
332 </>
333 );
334 };
335
336 export default SingleBlogPage;
337

https://tarikjaber.github.io/Code-to-PDF/ 8/8