v1.1.3

V1.1.3

Author: officialrajdeepsingh

examples/demo-section-blog/src/pages/index.mdx

@@ -58,6 +58,7 @@ Aenean gravida, lacus non gravida fermentum, ante enim `console.log` facilisis d
   <Braces />
 </div>
 
+<Space h={"sm"} />
 
 ## Alert
 
@@ -70,6 +71,8 @@ Aenean gravida, lacus non gravida fermentum, ante enim `console.log` facilisis d
   </AlertDescription>
 </Alert>
 
+<Space h={"sm"} />
+
 
 ## Tabs
 
@@ -107,6 +110,9 @@ function MyButton() {
   return <button>I'm a button</button>;
 }
 ```
+
+<Space h={"sm"} />
+
 ## Space
 
 <Space h={"sm"} />

package.json

@@ -9,7 +9,8 @@
     "dev:docs": "turbo run dev --filter=docs",
     "lint": "turbo run lint",
     "format": "prettier --write \"**/*.{ts,tsx,md}\"",
-    "release": "changeset publish "
+    "release": "changeset publish",
+    "publish-npm":"pnpm publish --filter=section-blog-theme"
   },
   "devDependencies": {
     "@turbo/gen": "^1.11.3",

packages/section-blog-theme/components/Article/Article.tsx

@@ -10,7 +10,7 @@ export function Article({ className, children }: ArticleProps) {
   return (
     <article
       className={cn(
-        "max-w-none nx-mt-5 nx-px-5 sm:nx-px-0 nx-mb-20 nx-format nx-format-section nx-format-img:nx-mx-auto sm:nx-format-sm md:nx-format-base lg:nx-format-lg xl:nx-format-2xl 2xl:nx-format-2xl nx-mx-auto",
+        "nx-mt-5 nx-px-5 sm:nx-px-0 nx-mb-20 nx-format nx-format-section nx-format-img:nx-mx-auto sm:nx-format-sm md:nx-format-base lg:nx-format-lg nx-mx-auto",
         className,
       )}
     >

packages/section-blog-theme/components/Banner/Banner.tsx

@@ -8,10 +8,11 @@ export function Banner({
   hideBanner: () => void;
 }) {
   return (
-    <div className="print:nx-hidden nx-flex nx-flex-row nx-justify-around nx-bg-primary/80 nx-text-primary-foreground nx-px-4 nx-py-3 sm:nx-flex-nowrap sm:items-center sm:nx-justify-center sm:nx-gap-3 sm:nx-pr-8 md:nx-px-8">
+    <div className="print:nx-hidden nx-flex nx-flex-row nx-justify-around nx-bg-primary nx-text-primary-foreground nx-px-4 nx-py-3 sm:nx-flex-nowrap sm:items-center sm:nx-justify-center sm:nx-gap-3 sm:nx-pr-8 md:nx-px-8">
       {/* Message */}
       <div
-        className="nx-text-primary-foreground nx-order-1 nx-mb-2 nx-inline-block nx-w-11/12 nx-text-sm sm:nx-order-none sm:nx-mb-0 sm:nx-w-auto md:nx-text-base"
+        className="nx-order-1 nx-mb-2 nx-inline-block nx-w-11/12 nx-text-sm sm:nx-order-none sm:nx-mb-0 sm:nx-w-auto md:nx-text-base"
+        aria-label="banner message"
         dangerouslySetInnerHTML={{
           __html: message,
         }}
@@ -23,7 +24,7 @@ export function Banner({
           aria-label="close banner"
           onClick={hideBanner}
           type="button"
-          className="nx-text-primary-foreground nx-transition nx-duration-100"
+          className="nx-transition nx-duration-100"
         >
           <X width={20} height={20} />
         </button>

packages/section-blog-theme/components/Footer/Footer.tsx

@@ -18,18 +18,18 @@ export function Footer({
   socialLinks: SocialLinks[];
 }) {
   return (
-    <footer className="print:nx-hidden nx-container nx-flex nx-flex-wrap nx-flex-row nx-item-center nx-justify-center nx-my-5 nx-p-5 nx-mx-auto lg:nx-flex-row nx-divide-gray-400">
+    <footer className="nx-container print:nx-hidden nx-mt-3 nx-px-4 lg:nx-px-6 nx-py-8 nx-flex nx-gap-y-5 nx-justify-center nx-flex-col sm:nx-flex-row md:nx-justify-between nx-items-center nx-mx-auto">
       <Link
         aria-label="brand logo"
-        target={Logo.target ? Logo.target : "_blank"}
+        target={Logo.target ? Logo.target : "_self"}
         href={Logo.link ? Logo.link : "/"}
         className="nx-flex nx-flex-row nx-items-center nx-justify-between"
       >
         {renderComponent(Logo.logo)}
       </Link>
 
       <NavigationMenu className="nx-my-3 nx-flex nx-flex-wrap nx-justify-between nx-items-center nx-mx-auto md:nx-my-0">
-        <NavigationMenuList>
+        <NavigationMenuList className="nx-flex-wrap sm:nx-flex-row">
           {SecondaryNavigation.map((navigation: Navigation) => {
             return (
               <NavigationItem key={navigation.title} navigation={navigation} />

packages/section-blog-theme/components/Header/Header.tsx

@@ -32,7 +32,7 @@ export function Header({
       </Link>
 
       <NavigationMenu className="nx-my-3 nx-flex nx-flex-wrap nx-justify-between nx-items-center nx-mx-auto md:nx-my-0">
-        <NavigationMenuList className="nx-flex-wrap sm:nx-fle-row">
+        <NavigationMenuList className="nx-flex-wrap sm:nx-flex-row">
           {PrimaryNavigation.map((navigation: Navigation) => {
             if (navigation.subNav === true) {
               return (

packages/section-blog-theme/components/Layouts/404.tsx

@@ -4,35 +4,24 @@ import Link from "next/link";
 export function Error404() {
   return (
     <>
-      <NextSeo
-        title="404 Error"
-        description="Something went wrong, sorry, we couldn't find this page."
-        noindex={true}
-      />
-      <section className="nx-flex nx-items-center nx-h-full nx-p-16">
-        <div className="nx-container nx-flex nx-flex-col nx-items-center nx-justify-center nx-px-5 nx-mx-auto nx-my-8">
-          <div className="nx-max-w-md nx-text-center">
-            <h2 className="nx-mb-8 nx-font-extrabold nx-text-9xl ">
-              <span className="nx-sr-only">Error</span>404
-            </h2>
+      <NextSeo title="404 Error" description="Something went wrong, sorry, we couldn't find this page." noindex={true} />
+      <section className="nx-flex nx-items-center nx-h-full nx-p-16 nx-container nx-text-center  nx-flex-col nx-justify-center nx-px-5 nx-mx-auto nx-my-8">
+        <h2 className="nx-mb-8 nx-font-extrabold nx-text-9xl ">
+          <span className="nx-sr-only">Error</span>404
+        </h2>
 
-            <p className="nx-text-2xl nx-font-semibold md:nx-text-3xl">
-              Sorry, we couldn't find this page.
-            </p>
+        <p className="nx-text-1xl nx-font-semibold md:nx-text-3xl">
+          Sorry, we couldn't find this page.
+        </p>
 
-            <p className="nx-mt-4 nx-mb-8 ">
-              But dont worry, you can find plenty of other things on our
-              homepage.
-            </p>
+        <p className="nx-text-md md:nx-text-xl nx-mt-4 nx-mb-8 ">
+          But dont worry, you can find plenty of other things on our
+          homepage.
+        </p>
 
-            <Link
-              href="/"
-              className="nx-px-8 nx-py-3 nx-font-semibold nx-rounded dark:nx-bg-violet-400 dark:nx-text-gray-900"
-            >
-              Back to homepage
-            </Link>
-          </div>
-        </div>
+        <Link href="/" className="nx-px-8 nx-py-3 nx-font-semibold nx-rounded nx-bg-secondary nx-text-secondary-foreground">
+          Back to homepage
+        </Link>
       </section>
     </>
   );

packages/section-blog-theme/components/Layouts/500.tsx

@@ -9,30 +9,23 @@ export function Error500() {
         description="Something went wrong, sorry, we couldn't find this page."
         noindex={true}
       />
-      <section className="nx-flex nx-items-center nx-h-full nx-p-16">
-        <div className="nx-container nx-flex nx-flex-col nx-items-center nx-justify-center nx-px-5 nx-mx-auto nx-my-8">
-          <div className="nx-max-w-md nx-text-center">
-            <h2 className="nx-mb-8 nx-font-extrabold nx-text-9xl ">
-              <span className="nx-sr-only">Error</span>500
-            </h2>
+       <section className="nx-flex nx-items-center nx-h-full nx-p-16 nx-container nx-text-center  nx-flex-col nx-justify-center nx-px-5 nx-mx-auto nx-my-8">
+        <h2 className="nx-mb-8 nx-font-extrabold nx-text-9xl ">
+          <span className="nx-sr-only">Error</span>500
+        </h2>
 
-            <p className="nx-text-2xl nx-font-semibold md:nx-text-3xl">
-              Sorry, we couldn't find this page.
-            </p>
+        <p className="nx-text-1xl nx-font-semibold md:nx-text-3xl">
+          Sorry, we couldn't find this page.
+        </p>
 
-            <p className="nx-mt-4 nx-mb-8 ">
-              But dont worry, you can find plenty of other things on our
-              homepage.
-            </p>
+        <p className="nx-text-md md:nx-text-xl nx-mt-4 nx-mb-8 ">
+          But dont worry, you can find plenty of other things on our
+          homepage.
+        </p>
 
-            <Link
-              href="/"
-              className="nx-px-8 nx-py-3 nx-font-semibold nx-rounded dark:nx-bg-violet-400 dark:nx-text-gray-900"
-            >
-              Back to homepage
-            </Link>
-          </div>
-        </div>
+        <Link href="/" className="nx-px-8 nx-py-3 nx-font-semibold nx-rounded nx-bg-secondary nx-text-secondary-foreground">
+          Back to homepage
+        </Link>
       </section>
     </>
   );

packages/section-blog-theme/components/Layouts/Read.tsx

@@ -52,7 +52,7 @@ export function Read({
 
       <Seo pageOpts={pageOpts} themeConfig={themeConfig} />
 
-      <Card className="nx-mt-12 nx-border-none nx-shadow-none nx-format nx-format-section sm:nx-format-sm md:nx-format-base lg:nx-format-lg xl:nx-format-xl 2xl:nx-format-xl mx-auto">
+      <Card className="nx-mt-12 nx-border-none nx-shadow-none nx-format nx-format-section sm:nx-format-sm md:nx-format-base lg:nx-format-lg xl:nx-format-xl 2xl:nx-format-xl nx-mx-auto">
 
         <CardContent className="nx-px-5 !nx-pb-0 sm:nx-px-0">
           <h1 className="nx-antialiased !nx-mb-3 nx-text-3xl nx-font-bold nx-tracking-wide sm:nx-text-4xl md:nx-text-5xl">{frontMatter.title}</h1>

packages/section-blog-theme/components/SocialLink/SocialLink.tsx

@@ -5,7 +5,7 @@ import Icon from "@/components/SocialLink/DynmicIcon";
 
 export function SocialLink({ socialLink }: { socialLink: SocialLinks }) {
   return (
-    <Link className={"self-center"} key={socialLink.name} target="_blank" href={socialLink.url}>
+    <Link className={"nx-self-center"} key={socialLink.name} target="_blank" href={socialLink.url}>
       <Button aria-label="Search article" variant={"ghost"} size={"icon"}>
         <Icon name={socialLink.name} className="nx-h-5 nx-w-5" />
       </Button>