fulldev-ui 0.3.36 → 0.4.0-beta.1

package/src/content/pages/blocks/_products.mdx

@@ -0,0 +1,55 @@
+---
+_layout: BlockLayout
+
+title: Products
+image: /images/blocks/products.png
+---
+
+```astro live
+---
+import Products from 'fulldev-ui/blocks/Products.astro'
+---
+
+<Products
+  heading="Best selling"
+  text="Our top-rated products loved by customers."
+  cards={[
+    {
+      heading: 'Wireless Noise-Cancelling Headphones',
+      text: 'Premium sound quality with active noise cancellation for immersive listening.',
+      price: 249,
+      image: '/images/placeholder-landscape.webp',
+    },
+    {
+      heading: 'Smart Home Security Camera',
+      text: 'HD video with night vision and two-way audio for 24/7 home monitoring.',
+      price: 129,
+      image: '/images/placeholder-landscape.webp',
+    },
+    {
+      heading: 'Ergonomic Office Chair',
+      text: 'Adjustable lumbar support and breathable mesh for all-day comfort.',
+      price: 199,
+      image: '/images/placeholder-landscape.webp',
+    },
+    {
+      heading: 'Portable Solar Power Bank',
+      text: 'High-capacity battery with solar charging for eco-friendly power on the go.',
+      price: 79,
+      image: '/images/placeholder-landscape.webp',
+    },
+    {
+      heading: 'Multi-Function Air Fryer',
+      text: 'Versatile cooking appliance for healthier, crispy meals with less oil.',
+      price: 149,
+      image: '/images/placeholder-landscape.webp',
+    },
+    {
+      heading: 'Smart Fitness Tracker Watch',
+      text: 'Advanced health monitoring and workout tracking in a sleek design.',
+      price: 179,
+      image: '/images/placeholder-landscape.webp',
+    },
+  ]}
+/>
+```

package/src/content/pages/blocks/_stats.mdx

@@ -0,0 +1,34 @@
+---
+_layout: BlockLayout
+
+title: Stats
+---
+
+```astro live
+---
+import Stats from 'fulldev-ui/blocks/Stats.astro'
+---
+
+<Stats
+  heading="Already up there"
+  text="We've already reached some milestones with even more to come."
+  cards={[
+    {
+      heading: '1000+',
+      text: 'Downloads',
+    },
+    {
+      heading: '100+',
+      text: 'Contributors',
+    },
+    {
+      heading: '50+',
+      text: 'Components',
+    },
+    {
+      heading: '20+',
+      text: 'Blocks',
+    },
+  ]}
+/>
+```

package/src/content/pages/blocks/colleagues.mdx

@@ -0,0 +1,42 @@
+---
+_layout: BlockLayout
+
+title: Colleagues
+image: /images/blocks/colleagues.png
+---
+
+```astro live
+---
+import Colleagues from 'fulldev-ui/blocks/Colleagues.astro'
+---
+
+<Colleagues
+  align="start"
+  heading="Meet the team"
+  text="Our team is made up of experienced professionals who are dedicated to helping you achieve your goals."
+  frame="panel"
+  position="inset"
+  cards={[
+    {
+      image: '/images/avatars/500/1.jpeg',
+      heading: 'John Doe',
+      text: 'Ceo & Founder of ACME.',
+    },
+    {
+      image: '/images/avatars/500/2.jpeg',
+      heading: 'Jane Doe',
+      text: 'Manager of ACME.',
+    },
+    {
+      image: '/images/avatars/500/3.jpeg',
+      heading: 'John Smith',
+      text: 'Developer of ACME.',
+    },
+    {
+      image: '/images/avatars/500/4.jpeg',
+      heading: 'Jane Smith',
+      text: 'Developer of ACME.',
+    },
+  ]}
+/>
+```

package/src/content/pages/blocks/content.mdx

@@ -0,0 +1,101 @@
+---
+_layout: BlockLayout
+
+title: Content
+image: /images/blocks/content.png
+---
+
+```astro live
+---
+import Content from 'fulldev-ui/blocks/Content.astro'
+---
+
+<Content
+  color="brand"
+  label="Lorem ipsum"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus quia, nulla! Maiores et perferendis eaque, exercitationem praesentium nihil. Lorem ipsum dolor sit amet consectetur adipisicing elit. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Donec rutrum congue leo eget malesuada."
+  buttons={[{ text: 'Lorem ipsum', href: '' }]}
+  image="/images/placeholder-landscape.webp"
+/>
+```
+
+```astro live
+---
+import Content from 'fulldev-ui/blocks/Content.astro'
+---
+
+<Content
+  color="brand"
+  size="lg"
+  label="Lorem ipsum"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus quia, nulla! Maiores et perferendis eaque, exercitationem praesentium nihil. Lorem ipsum dolor sit amet consectetur adipisicing elit. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Donec rutrum congue leo eget malesuada."
+  buttons={[{ text: 'Lorem ipsum', href: '' }]}
+  image="/images/placeholder-landscape.webp"
+/>
+```
+
+```astro live
+---
+import Content from 'fulldev-ui/blocks/Content.astro'
+---
+
+<Content
+  color="brand"
+  size="sm"
+  label="Lorem ipsum"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus quia, nulla! Maiores et perferendis eaque, exercitationem praesentium nihil. Lorem ipsum dolor sit amet consectetur adipisicing elit. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Donec rutrum congue leo eget malesuada."
+  buttons={[{ text: 'Lorem ipsum', href: '' }]}
+  image="/images/placeholder-landscape.webp"
+/>
+```
+
+```astro live
+---
+import Content from 'fulldev-ui/blocks/Content.astro'
+---
+
+<Content
+  reverse="odd"
+  label="Lorem ipsum"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus quia, nulla! Maiores et perferendis eaque, exercitationem praesentium nihil. Lorem ipsum dolor sit amet consectetur adipisicing elit. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Donec rutrum congue leo eget malesuada."
+  buttons={[{ text: 'Lorem ipsum', href: '' }]}
+  image="/images/placeholder-landscape.webp"
+/>
+```
+
+```astro live
+---
+import Content from 'fulldev-ui/blocks/Content.astro'
+---
+
+<Content
+  label="Lorem ipsum dolor"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus quia, nulla! Maiores et perferendis eaque, exercitationem praesentium nihil. Lorem ipsum dolor sit amet consectetur adipisicing elit. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Donec rutrum congue leo eget malesuada."
+  buttons={[{ text: 'Lorem ipsum', href: '' }]}
+  image="/images/placeholder-landscape.webp"
+  frame="panel"
+  variant="subtle"
+  position="inset"
+/>
+```
+
+```astro live
+---
+import Content from 'fulldev-ui/blocks/Content.astro'
+---
+
+<Content
+  label="Lorem ipsum dolor"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus quia, nulla! Maiores et perferendis eaque, exercitationem praesentium nihil. Lorem ipsum dolor sit amet consectetur adipisicing elit. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Donec rutrum congue leo eget malesuada."
+  buttons={[{ text: 'Lorem ipsum', href: '' }]}
+  image="/images/placeholder-landscape.webp"
+  align="start"
+  structure="column"
+/>
+```

package/src/content/pages/blocks/cta.mdx

@@ -0,0 +1,192 @@
+---
+_layout: BlockLayout
+
+title: CTA
+image: /images/blocks/cta.png
+---
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur ades"
+  buttons={[
+    { text: 'Lorem ipsum', href: '', color: 'brand' },
+    { text: 'Lorem ipsum', href: '', color: 'brand' },
+  ]}
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur ades"
+  buttons={[
+    { text: 'Lorem ipsum', href: '', contrast: true },
+    { text: 'Lorem ipsum', href: '', contrast: true },
+  ]}
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  label="Lorem ipsum dolor"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur ades"
+  buttons={[
+    { text: 'Lorem ipsum', href: '' },
+    { text: 'Lorem ipsum', href: '' },
+  ]}
+  color="brand"
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  label="Lorem ipsum dolor"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur ades"
+  buttons={[
+    { text: 'Lorem ipsum', href: '', contrast: true },
+    { text: 'Lorem ipsum', href: '', contrast: true },
+  ]}
+  theme="light"
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  label="Lorem ipsum dolor"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur ades"
+  buttons={[
+    { text: 'Lorem ipsum', href: '', color: 'brand' },
+    { text: 'Lorem ipsum', href: '', color: 'brand' },
+  ]}
+  theme="light"
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  label="Lorem ipsum dolor"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur ades"
+  buttons={[
+    { text: 'Lorem ipsum', href: '' },
+    { text: 'Lorem ipsum', href: '' },
+  ]}
+  theme="light"
+  color="brand"
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  heading="Lorem ipsum dolor sit"
+  buttons={[
+    { text: 'Lorem ipsum', href: '' },
+    { text: 'Lorem ipsum', href: '' },
+  ]}
+  structure="spread"
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  heading="Lorem ipsum dolor sit"
+  buttons={[
+    { text: 'Lorem ipsum', href: '' },
+    { text: 'Lorem ipsum', href: '' },
+  ]}
+  structure="spread"
+  frame="fill"
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  heading="Lorem ipsum dolor sit"
+  buttons={[
+    { text: 'Lorem ipsum', href: '' },
+    { text: 'Lorem ipsum', href: '' },
+  ]}
+  structure="spread"
+  frame="none"
+  color="brand"
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  label="Lorem ipsum dolor"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur ades"
+  buttons={[
+    { text: 'Lorem ipsum', href: '' },
+    { text: 'Lorem ipsum', href: '' },
+  ]}
+  position="inset"
+  structure="split"
+  align="center"
+  color="brand"
+  image="/images/placeholder-landscape.webp"
+/>
+```
+
+```astro live
+---
+import Cta from 'fulldev-ui/blocks/Cta.astro'
+---
+
+<Cta
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur ades"
+  buttons={[
+    { text: 'Lorem ipsum', href: '', color: 'brand' },
+    { text: 'Lorem ipsum', href: '' },
+  ]}
+  position="background"
+  align="center"
+  image="/images/placeholder-landscape-dark.png"
+/>
+```

package/src/content/pages/blocks/features.mdx

@@ -0,0 +1,134 @@
+---
+_layout: BlockLayout
+
+title: Features
+image: /images/blocks/features.png
+---
+
+```astro live
+---
+import Features from 'fulldev-ui/blocks/Features.astro'
+---
+
+<Features
+  color="brand"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit."
+  cards={[
+    {
+      icon: 'rocket',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+      button: { text: 'Lorem ipsum', href: '' },
+    },
+    {
+      icon: 'pencil',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+      button: { text: 'Lorem ipsum', href: '' },
+    },
+    {
+      icon: 'typography',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+      button: { text: 'Lorem ipsum', href: '' },
+    },
+  ]}
+/>
+```
+
+```astro live
+---
+import Features from 'fulldev-ui/blocks/Features.astro'
+---
+
+<Features
+  color="brand"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit."
+  cards={[
+    {
+      icon: 'rocket',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+    },
+    {
+      icon: 'pencil',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+    },
+    {
+      icon: 'typography',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+    },
+  ]}
+/>
+```
+
+```astro live
+---
+import Features from 'fulldev-ui/blocks/Features.astro'
+---
+
+<Features
+  color="brand"
+  variant="primary"
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit."
+  buttons={[
+    { text: 'Lorem ipsum', href: '' },
+    { text: 'Lorem ipsum', href: '' },
+  ]}
+  cards={[
+    {
+      icon: 'rocket',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+    },
+    {
+      icon: 'pencil',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+    },
+    {
+      icon: 'typography',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+    },
+  ]}
+/>
+```
+
+```astro live
+---
+import Features from 'fulldev-ui/blocks/Features.astro'
+---
+
+<Features
+  heading="Lorem ipsum dolor sit"
+  text="Lorem ipsum dolor sit amet consectetur adipisicing elit."
+  frame="panel"
+  position="inset"
+  cards={[
+    {
+      image: '/images/placeholder-landscape.webp',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+      href: '',
+    },
+    {
+      image: '/images/placeholder-landscape.webp',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+      href: '',
+    },
+    {
+      image: '/images/placeholder-landscape.webp',
+      heading: 'Lorem ipsum',
+      text: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',
+      href: '',
+    },
+  ]}
+/>
+```

package/src/content/pages/blocks/footer.mdx

@@ -0,0 +1,71 @@
+---
+_layout: BlockLayout
+
+title: Footer
+image: /images/blocks/footer.png
+---
+
+```astro live
+---
+import Footer from 'fulldev-ui/components/Footer.astro'
+---
+
+<Footer
+  heading="Fulldev UI"
+  text="Rapidly build content-driven websites."
+  columns={[
+    {
+      heading: 'Pages',
+      links: [
+        { href: '/overview/introduction', text: 'Docs' },
+        { href: '/typography/heading', text: 'Components' },
+        { href: '/blocks', text: 'Blocks' },
+      ],
+    },
+  ]}
+/>
+```
+
+```astro live
+---
+import Footer from 'fulldev-ui/components/Footer.astro'
+---
+
+<Footer
+  heading="Fulldev UI"
+  text="Rapidly build content-driven websites."
+  frame="panel"
+  columns={[
+    {
+      heading: 'Pages',
+      links: [
+        { href: '/overview/introduction', text: 'Docs' },
+        { href: '/typography/heading', text: 'Components' },
+        { href: '/blocks', text: 'Blocks' },
+      ],
+    },
+  ]}
+/>
+```
+
+```astro live
+---
+import Footer from 'fulldev-ui/components/Footer.astro'
+---
+
+<Footer
+  heading="Fulldev UI"
+  text="Rapidly build content-driven websites."
+  frame="none"
+  columns={[
+    {
+      heading: 'Pages',
+      links: [
+        { href: '/overview/introduction', text: 'Docs' },
+        { href: '/typography/heading', text: 'Components' },
+        { href: '/blocks', text: 'Blocks' },
+      ],
+    },
+  ]}
+/>
+```