Merge pull request #3191 from KBVE/patch-atomic-herbmail-shad-build-1…

…1-07-2024-1731037546 [CI] Merge patch-atomic-herbmail-shad-build-11-07-2024-1731037546 into dev
KBVE · Nov 8, 2024 · eb7824f · eb7824f
2 parents 2abe149 + 5062535
commit eb7824f
Show file tree

Hide file tree

Showing 7 changed files with 176 additions and 68 deletions.
diff --git a/apps/herbmail.com/astro.config.mjs b/apps/herbmail.com/astro.config.mjs
@@ -6,6 +6,9 @@ import sitemap from '@astrojs/sitemap';
 import tailwind from '@astrojs/tailwind';
 import mdx from '@astrojs/mdx';
 
+import starlight from '@astrojs/starlight';
+
+
 import { fileURLToPath } from 'node:url';
 import markdownConfig from './markdown.config';
 
@@ -17,6 +20,74 @@ export default defineConfig({
   markdown: markdownConfig,
   prefetch: true,
   integrations: [
+    starlight({
+			title: 'Herbmail Docs',
+			editLink: {
+				baseUrl: 'https://github.com/kbve/kbve/edit/dev/apps/herbmail.com',
+			},
+			tableOfContents: { minHeadingLevel: 2, maxHeadingLevel: 5 },
+			expressiveCode: false,
+			defaultLocale: 'root',
+			locales: {
+				root: {
+					label: 'English',
+					lang: 'en',
+				},
+
+			},
+
+			sidebar: [
+				{
+					label: 'Quick Start Guides',
+					autogenerate: { directory: 'guides' },
+				},
+				{
+					label: 'Applications',
+					collapsed: true,
+					autogenerate: { directory: 'application' },
+				},
+				{
+					label: 'Webmaster',
+					autogenerate: { directory: 'webmaster' },
+				},
+				{
+					label: 'Theory',
+					autogenerate: { directory: 'theory' },
+				},
+
+
+			],
+			social: {
+				github: 'https://github.com/kbve/kbve',
+				discord: 'https://kbve.com/discord/',
+			},
+			disable404Route: true,
+			// customCss: ['./src/styles/starlight.css'],
+			favicon: '/favicon.ico',
+			components: {
+				// SiteTitle: './src/components/ui/starlight/SiteTitle.astro',
+				// Head: './src/components/ui/starlight/Head.astro',
+				// Footer: './src/components/ui/starlight/Footer.astro',
+				// TableOfContents:
+				// 	'./src/components/ui/starlight/TableOfContents.astro',
+			},
+			head: [
+				{
+					tag: 'meta',
+					attrs: {
+						property: 'og:image',
+						content: 'https://kbve.com' + '/social.webp',
+					},
+				},
+				{
+					tag: 'meta',
+					attrs: {
+						property: 'twitter:image',
+						content: 'https://kbve.com' + '/social.webp',
+					},
+				},
+			],
+		}),
     react(),
     svelte(),
     partytown(),

diff --git a/apps/herbmail.com/src/layouts/Footer.astro b/apps/herbmail.com/src/layouts/Footer.astro
@@ -1,45 +1,85 @@
 ---
 import { Button } from '@kbve/shadcnui/button';
 import { Icon } from '@astrojs/starlight/components';
+import Logo from '../../public/assets/img/logo.svg?raw';
 
----
+const navigationLinks = [
+	{ href: '/about', icon: 'seti:folder', label: 'About' },
+	{ href: '/services', icon: 'seti:folder', label: 'Services' },
+	{ href: '/blog', icon: 'rss', label: 'Blog' },
+	{ href: 'https://kbve.com/contact', icon: 'email', label: 'Contact' },
+];
 
+const socialLinks = [
+	{
+		href: 'https://twitter.com/yourbrand',
+		icon: 'seti:folder',
+		label: 'Twitter',
+	},
+	{
+		href: 'https://github.com/kbve',
+		icon: 'seti:github',
+		label: 'GitHub',
+	},
+	{
+		href: 'https://linkedin.com/company/yourbrand',
+		icon: 'linkedin',
+		label: 'LinkedIn',
+	},
+];
+---
 
-<footer class="bg-zinc-950 text-white py-8">
-	<div class="container mx-auto px-4 flex flex-col md:flex-row justify-between items-center">
+<footer
+	class="border-t border-border/40 py-6 dark:border-border md:px-8 md:py-0 text-primary"
+	role="contentinfo">
+	<div
+		class="container mx-auto px-4 flex flex-col md:flex-row justify-between items-center">
 		<!-- Logo or Brand Name -->
-		<div class="mb-4 md:mb-0">
-			<a href="/" class="text-lg font-bold hover:text-gray-300">
-				YourBrand
+		<div class="mb-4 md:mb-0 hover:animate-float">
+			<a href="/" class="text-lg font-bold">
+				<Fragment set:html={Logo} />
 			</a>
 		</div>
-
-		<!-- Navigation Links -->
-		<nav class="mb-4 md:mb-0">
+
+		<div class="mb-4 md:mb-0 p-4">
 			<ul class="flex space-x-4">
-				<li><a href="/about" class="hover:text-gray-300">About</a></li>
-				<li><a href="/services" class="hover:text-gray-300">Services</a></li>
-				<li><a href="/blog" class="hover:text-gray-300">Blog</a></li>
-				<li><a href="/contact" class="hover:text-gray-300">Contact</a></li>
+				{
+					navigationLinks.map(({ href, icon, label }) => (
+						<li>
+							<Button variant="secondary" size="sm">
+								<a
+									href={href}
+									class="flex items-center space-x-2">
+									<Icon name={icon} class="h-4 w-4" />
+									<span class="ml-1">{label}</span>
+								</a>
+							</Button>
+						</li>
+					))
+				}
 			</ul>
-		</nav>
+		</div>
 
 		<!-- Social Media Icons -->
 		<div class="flex space-x-4">
-			<a href="https://twitter.com/yourbrand" target="_blank" rel="noopener noreferrer">
-				<Icon name="seti:folder" class="h-6 w-6 hover:text-gray-300" />
-			</a>
-			<a href="https://github.com/yourbrand" target="_blank" rel="noopener noreferrer">
-				<Icon name="seti:github" class="h-6 w-6 hover:text-gray-300" />
-			</a>
-			<a href="https://linkedin.com/company/yourbrand" target="_blank" rel="noopener noreferrer">
-				<Icon name="seti:mdo" class="h-6 w-6 hover:text-gray-300" />
-			</a>
+			{
+				socialLinks.map(({ href, icon, label }) => (
+					<Button variant="secondary" size="icon" aria-label={label}>
+						<a
+							href={href}
+							target="_blank"
+							rel="noopener noreferrer"
+							class="hover:scale-110">
+							<Icon name={icon} class="h-6 w-6" />
+						</a>
+					</Button>
+				))
+			}
 		</div>
 	</div>
 
 	<!-- Copyright Section -->
 	<div class="text-center mt-4 text-sm text-gray-400">
-		&copy; {new Date().getFullYear()} YourBrand. All rights reserved.
+		&copy; {new Date().getFullYear()} HerbMail. All rights reserved.
 	</div>
-</footer>
+</footer>
diff --git a/apps/herbmail.com/src/layouts/Layout.astro b/apps/herbmail.com/src/layouts/Layout.astro
@@ -36,8 +36,7 @@ import './global.css';
 
 	<body role="document">
 		<slot role="main" />
-		<footer role="contentinfo">
-			<Footer />
-		</footer>
+		<Footer />
 	</body>
+
 </html>
diff --git a/apps/herbmail.com/src/pages/index.astro b/apps/herbmail.com/src/pages/index.astro
@@ -7,13 +7,13 @@ let description =
 import { Button } from '@kbve/shadcnui/button';
 
 import {
-  Card,
-  CardContent,
-  CardDescription,
-  CardFooter,
-  CardHeader,
-  CardTitle,
-} from  '@kbve/shadcnui/card';
+	Card,
+	CardContent,
+	CardDescription,
+	CardFooter,
+	CardHeader,
+	CardTitle,
+} from '@kbve/shadcnui/card';
 ---
 
 <Layout title={title} description={description}>
@@ -31,22 +31,22 @@ import {
 							src="/assets/json/lottie/mailer.lottie"
 						></dotlottie-player>
 					</div>
+
+				</div>
+				<div class="flex items-center justify-center">
+					<Card>
+						<CardHeader>
+							<CardTitle>Card Title</CardTitle>
+							<CardDescription>Card Description</CardDescription>
+						</CardHeader>
+						<CardContent>
+							<Button variant="secondary"> Hi </Button>
+						</CardContent>
+						<CardFooter>
+							<p>Card Footer</p>
+						</CardFooter>
+					</Card>
 				</div>
-
-				<Card>
-					<CardHeader>
-					  <CardTitle>Card Title</CardTitle>
-					  <CardDescription>Card Description</CardDescription>
-					</CardHeader>
-					<CardContent>
-						<Button variant="secondary"> Hi
-						</Button>
-					</CardContent>
-					<CardFooter>
-					  <p>Card Footer</p>
-					</CardFooter>
-				</Card>
-
 			</div>
 		</section>
 	</main>

diff --git a/apps/herbmail.com/tailwind.config.cjs b/apps/herbmail.com/tailwind.config.cjs
@@ -13,18 +13,4 @@ module.exports = buildConfig(__dirname, {
 		),
 		...createGlobPatternsForDependencies(__dirname),
 	],
-	theme: {
-		extend: {
-			keyframes: {
-				float: {
-					'0%, 100%': { transform: 'translate3d(0, 0, 0)' },
-					'50%': { transform: 'translate3d(0, 30px, 0)' },
-				},
-				'ltr-linear-infinite': {
-					'0%, 100%': { 'background-position': '0 0' },
-					'50%': { 'background-position': '400% 0%' },
-				},
-			},
-		},
-	},
 });
diff --git a/packages/shadcnui/src/button.tsx b/packages/shadcnui/src/button.tsx
@@ -15,7 +15,7 @@ const buttonVariants = cva(
         outline:
           "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
         secondary:
-          "bg-secondary text-secondary-foreground hover:bg-secondary/80 hover:scale-110",
+          "bg-secondary text-secondary-foreground hover:bg-secondary/80 hover:scale-110 ease-in-out duration-1000",
         ghost: "hover:bg-accent hover:text-accent-foreground",
         link: "text-primary underline-offset-4 hover:underline",
       },

diff --git a/packages/shadcnutils/src/tailwind.config.ts b/packages/shadcnutils/src/tailwind.config.ts
@@ -1,6 +1,8 @@
 import { createGlobPatternsForDependencies } from '@nx/react/tailwind'
 import { join } from 'node:path'
 import TailwindAnimate from 'tailwindcss-animate'
+// import defaultTheme from 'tailwindcss/defaultTheme';
+
 
 import type { Config } from 'tailwindcss'
 
@@ -11,13 +13,14 @@ export function buildConfig(
     content: [
       join(
         appDir,
-        '{src,pages,components,app}/**/*!(*.stories|*.spec).{ts,tsx,html}'
+        '{src,pages,components,app}/**/*!(*.stories|*.spec).{ts,tsx,html,astro,md,mdx}'
       ),
       ...createGlobPatternsForDependencies(appDir)
     ],
     theme: {
       extend: {
         colors: {
+          //...defaultTheme.colors,
           border: 'hsl(var(--border))',
           input: 'hsl(var(--input))',
           ring: 'hsl(var(--ring))',
@@ -65,11 +68,20 @@ export function buildConfig(
           'accordion-up': {
             from: { height: 'var(--radix-accordion-content-height)' },
             to: { height: '0' }
-          }
+          },
+          float: {
+            '0%, 100%': { transform: 'translate3d(0, 0, 0)' },
+            '50%': { transform: 'translate3d(0, 30px, 0)' },
+          },
+          'ltr-linear-infinite': {
+            '0%, 100%': { 'background-position': '0 0' },
+            '50%': { 'background-position': '400% 0%' },
+          },
         },
         animation: {
           'accordion-down': 'accordion-down 0.2s ease-out',
-          'accordion-up': 'accordion-up 0.2s ease-out'
+          'accordion-up': 'accordion-up 0.2s ease-out',
+          'float': 'float 2s ease-in-out infinite',
         }
       }
     },