AderKonstantin/darkwave
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ feat: Enhance blog post layout and typography

Browse Source 
This commit introduces the following changes:

- Increase the maximum width of the blog post layout from 3XL to 4XL
  on larger screens, providing more space for content.
- Change the body font from "JetBrains Mono" to "Open Sans" to improve
  readability and aesthetics.
- Increase the horizontal margin on larger screens from 72px to 80px,
  creating more breathing room around the content.

These changes aim to enhance the overall presentation and user
experience of the blog post layout, making it more visually appealing
and comfortable to read.
This commit is contained in:
AderKonstantin
2025-03-28 18:25:22 +03:00
parent 6c0243c5e2
commit 9ab9089f4f
3 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/blogpost/layout.tsx
View File

@@ -9,7 +9,7 @@ import MainFooter from "@/components/footer/main";
export default function RootLayout({ children }: { children: React.ReactNode }) { export default function RootLayout({ children }: { children: React.ReactNode }) {
return ( return (
<div className="m-auto text-base 2xl:w-3xl xl:w-3xl md:w-full"> <div className="m-auto text-base 2xl:w-4xl xl:w-3xl md:w-full">
{children} {children}
</div> </div>
); );

2
app/globals.css
View File

@@ -15,7 +15,7 @@
body { body {
color: var(--foreground); color: var(--foreground);
background: var(--background); background: var(--background);
font-family: "JetBrains Mono", monospace; font-family: "Open Sans", sans-serif;
} }
.dark { .dark {

2
app/layout.tsx
View File

@@ -32,7 +32,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
return ( return (
<html className="dark" lang="en"> <html className="dark" lang="en">
<body className={`bg-black text-white dark:bg-white dark:text-black font-sans`}> <body className={`bg-black text-white dark:bg-white dark:text-black font-sans`}>
<div className="text-xl 2xl:mx-72 xl:mx-36 md:mx-6"> <div className="text-xl 2xl:mx-80 xl:mx-36 md:mx-6">
<MainHeader /> <MainHeader />
{children} {children}
<MainFooter /> <MainFooter />