xd

Author: Porx312

app/blog/[...slug]/page.tsx

@@ -108,13 +108,16 @@ export default async function Page(props: { params: Promise<{ slug: string[] }>
 
   return (
     <>
+
       <script
         type="application/ld+json"
         dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
       />
-      <Layout content={mainContent} authorDetails={authorDetails} next={next} prev={prev}>
-        <MDXLayoutRenderer code={post.body.code} components={components} toc={post.toc} />
-      </Layout>
+      <div className=" mx-0 lg:mx-72 md:mx-32">
+        <Layout content={mainContent} authorDetails={authorDetails} next={next} prev={prev}>
+          <MDXLayoutRenderer code={post.body.code} components={components} toc={post.toc} />
+        </Layout>
+      </div>
     </>
   )
 }

app/tag-data.json

@@ -1,4 +1,5 @@
 {
+  "fullstack": 1,
   "nodejs": 2,
   "typescript": 1,
   "nextjs": 6,

components/MDXComponents.tsx

@@ -13,4 +13,5 @@ export const components: MDXComponents = {
   pre: Pre,
   table: TableWrapper,
   BlogNewsletterForm,
+  strong: 'strong',
 }

css/tailwind.css

@@ -27,8 +27,10 @@
 }
 
 .no-scrollbar {
-  -ms-overflow-style: none; /* IE and Edge */
-  scrollbar-width: none; /* Firefox */
+  -ms-overflow-style: none;
+  /* IE and Edge */
+  scrollbar-width: none;
+  /* Firefox */
 }
 
 /* https://stackoverflow.com/questions/61083813/how-to-avoid-internal-autofill-selected-style-to-be-applied */
@@ -48,9 +50,11 @@ input:-webkit-autofill:focus {
   margin-left: -24px;
   padding-right: 4px;
 }
+
 .content-header {
   color: rgb(194, 193, 193);
 }
+
 .content-header:hover .content-header-link,
 .content-header-link:hover {
   opacity: 1;
@@ -64,10 +68,12 @@ input:-webkit-autofill:focus {
 .gradient {
   background-image: linear-gradient(to bottom, #000000, #3d101c, #770c26, #b30025, #eb1212);
 }
+
 @keyframes slide {
   from {
     transform: translateX(0);
   }
+
   to {
     transform: translateX(-50%);
   }
@@ -151,6 +157,7 @@ input:-webkit-autofill:focus {
   transform: scale(2);
   transition-duration: 0.3s;
 }
+
 /* From Uiverse.io by qhns3 */
 .background-pattern {
   width: 100%;
@@ -165,17 +172,21 @@ input:-webkit-autofill:focus {
   --color: rgba(255, 255, 255, 0.2);
 
   background-image:
-    linear-gradient(
-      -90deg,
+    linear-gradient(-90deg,
       transparent calc(var(--gap) - var(--line)),
       var(--color) calc(var(--gap) - var(--line) + 1px),
-      var(--color) var(--gap)
-    ),
-    linear-gradient(
-      0deg,
+      var(--color) var(--gap)),
+    linear-gradient(0deg,
       transparent calc(var(--gap) - var(--line)),
       var(--color) calc(var(--gap) - var(--line) + 1px),
-      var(--color) var(--gap)
-    );
+      var(--color) var(--gap));
   background-size: var(--gap) var(--gap);
 }
+
+strong {
+  color: rgb(232, 232, 232) !important;
+}
+
+blockquote {
+  color: rgb(255, 0, 0) !important;
+}