fulldev-ui 0.4.29 → 0.5.0-beta.0

package/src/content/pages/blocks/{prices.mdx → _prices.mdx}

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Prices
-image: /images/blocks/prices.png
 ---
 
 ```astro live
@@ -11,7 +10,6 @@ import Prices from 'fulldev-ui/blocks/Prices.astro'
 ---
 
 <Prices
-  variant="subtle"
   heading="Choose the plan that suits you"
   text="Our plans are designed to meet the requirements of both beginners and advanced users."
   cards={[
@@ -52,10 +50,10 @@ import Prices from 'fulldev-ui/blocks/Prices.astro'
     value: 5,
     label: '100+ happy customers',
     avatars: [
-      '/images/avatars/1.jpeg',
-      '/images/avatars/2.jpeg',
-      '/images/avatars/3.jpeg',
-      '/images/avatars/4.jpeg',
+      'avatar-1.jpeg',
+      'avatar-2.jpeg',
+      'avatar-3.jpeg',
+      'avatar-4.jpeg',
     ],
   }}
   heading="Flexible Pricing Options"

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Product
-image: /images/blocks/product.png
 ---
 
 ```astro live

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Products
-image: /images/blocks/products.png
 ---
 
 ```astro live

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

@@ -1,5 +1,5 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Stats
 ---

package/src/content/pages/blocks/{_banner.mdx → banner.mdx}

@@ -1,5 +1,5 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Banner
 ---
@@ -9,5 +9,5 @@ title: Banner
 import Banner from 'fulldev-ui/blocks/Banner.astro'
 ---
 
-<Banner text="New feature: Customizable themes now available!" icon="paint" />
+<Banner text="This is a banner" />
 ```

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Colleagues
-image: /images/blocks/colleagues.png
 ---
 
 ```astro live
@@ -14,26 +13,25 @@ import Colleagues from 'fulldev-ui/blocks/Colleagues.astro'
   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"
+  panel
   cards={[
     {
-      image: '/images/avatars/500/1.jpeg',
+      image: 'avatar-1.jpeg',
       heading: 'John Doe',
       text: 'Ceo & Founder of ACME.',
     },
     {
-      image: '/images/avatars/500/2.jpeg',
+      image: 'avatar-2.jpeg',
       heading: 'Jane Doe',
       text: 'Manager of ACME.',
     },
     {
-      image: '/images/avatars/500/3.jpeg',
+      image: 'avatar-3.jpeg',
       heading: 'John Smith',
       text: 'Developer of ACME.',
     },
     {
-      image: '/images/avatars/500/4.jpeg',
+      image: 'avatar-4.jpeg',
       heading: 'Jane Smith',
       text: 'Developer of ACME.',
     },

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

@@ -0,0 +1,69 @@
+---
+presets: [docs, blocks]
+
+title: Contact
+---
+
+```astro live
+---
+import Contact from 'fulldev-ui/blocks/Contact.astro'
+---
+
+<Contact
+  heading="Contact us"
+  text="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
+  tagline="Get in touch"
+  channels={[
+    {
+      type: 'tel',
+      heading: 'Phone',
+      text: '123-456-7890',
+      icon: 'phone',
+      href: 'tel:123-456-7890',
+    },
+    {
+      type: 'email',
+      heading: 'Email',
+      text: 'contact@example.com',
+      icon: 'mail',
+      href: 'mailto:contact@example.com',
+    },
+    {
+      type: 'address',
+      heading: 'Address',
+      text: '1234 Main St, Springfield, IL 62701',
+      icon: 'map-pin',
+    },
+  ]}
+  socials={['https://facebook.com/example', 'https://instagram.com/example']}
+  form={{
+    action: '/thank-you',
+    fields: [
+      {
+        type: 'text',
+        name: 'name',
+        label: 'Name',
+        required: true,
+      },
+      {
+        type: 'email',
+        name: 'email',
+        label: 'Email',
+        required: true,
+      },
+      {
+        type: 'tel',
+        name: 'phone',
+        label: 'Phone',
+      },
+      {
+        type: 'textarea',
+        name: 'message',
+        label: 'Message',
+      },
+    ],
+    button: 'Send message',
+  }}
+  image="/images/placeholder-landscape.webp"
+/>
+```

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Content
-image: /images/blocks/content.png
 ---
 
 ```astro live
@@ -72,23 +71,6 @@ import Content from 'fulldev-ui/blocks/Content.astro'
 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"

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: CTA
-image: /images/blocks/cta.png
 ---
 
 ```astro live
@@ -131,7 +130,6 @@ import Cta from 'fulldev-ui/blocks/Cta.astro'
     { text: 'Lorem ipsum', href: '' },
   ]}
   structure="spread"
-  frame="fill"
 />
 ```
 
@@ -147,7 +145,6 @@ import Cta from 'fulldev-ui/blocks/Cta.astro'
     { text: 'Lorem ipsum', href: '' },
   ]}
   structure="spread"
-  frame="none"
   color="brand"
 />
 ```
@@ -157,27 +154,6 @@ import Cta from 'fulldev-ui/blocks/Cta.astro'
 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"
@@ -186,6 +162,7 @@ import Cta from 'fulldev-ui/blocks/Cta.astro'
     { text: 'Lorem ipsum', href: '' },
   ]}
   position="background"
+  theme="dark"
   align="center"
   image="/images/placeholder-landscape-dark.png"
 />

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Features
-image: /images/blocks/features.png
 ---
 
 ```astro live
@@ -108,7 +107,7 @@ 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"
+  panel
   position="inset"
   cards={[
     {

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Hero
-image: /images/blocks/hero.png
 ---
 
 ```astro live
@@ -18,6 +17,7 @@ import Hero from 'fulldev-ui/blocks/Hero.astro'
     { text: 'Lorem ipsum', href: '' },
     { text: 'Lorem ipsum', href: '' },
   ]}
+  position="inset"
   image="/images/placeholder-landscape.webp"
 />
 ```
@@ -35,6 +35,7 @@ import Hero from 'fulldev-ui/blocks/Hero.astro'
     { text: 'Lorem ipsum', href: '' },
   ]}
   structure="spread"
+  position="inset"
   image="/images/placeholder-landscape.webp"
 />
 ```
@@ -91,7 +92,8 @@ import Hero from 'fulldev-ui/blocks/Hero.astro'
   image="/images/placeholder-landscape-dark.png"
   position="background"
   align="center"
-  frame="viewport"
+  theme="dark"
   justify="center"
+  style={{ minHeight: '100vh', justifyContent: 'center' }}
 />
 ```

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Intro
-image: /images/blocks/intro.png
 ---
 
 ```astro live
@@ -86,7 +85,6 @@ import Intro from 'fulldev-ui/blocks/Intro.astro'
 ---
 
 <Intro
-  frame="fill"
   variant="primary"
   heading="Lorem ipsum dolor sit amet"
   text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla facilisi. Nulla facilisi. Nulla facilisi. Sed do eiusmod tempor."
@@ -103,7 +101,6 @@ import Intro from 'fulldev-ui/blocks/Intro.astro'
 ---
 
 <Intro
-  frame="fill"
   variant="primary"
   heading="Lorem ipsum dolor sit amet"
   text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla facilisi. Nulla facilisi. Nulla facilisi. Sed do eiusmod tempor."
@@ -120,7 +117,7 @@ import Intro from 'fulldev-ui/blocks/Intro.astro'
 ---
 
 <Intro
-  frame="panel"
+  panel
   variant="primary"
   heading="Lorem ipsum dolor sit amet"
   text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla facilisi. Nulla facilisi. Nulla facilisi. Sed do eiusmod tempor."

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Posts
-image: /images/blocks/posts.png
 ---
 
 ```astro live
@@ -13,6 +12,7 @@ import Posts from 'fulldev-ui/blocks/Posts.astro'
 <Posts
   heading="Latest posts"
   text="Read the latest articles from our blog."
+  panel={false}
   cards={[
     {
       tagline: '2024-03-15',
@@ -35,6 +35,13 @@ import Posts from 'fulldev-ui/blocks/Posts.astro'
       image: '/images/placeholder-landscape.webp',
       href: '',
     },
+    {
+      tagline: '2024-03-05',
+      heading: 'Lorem ipsum dolor sit amet consectetur',
+      text: 'Discover our flexible Content block with split layout and panel options. Ideal for presenting detailed information about your products or services.',
+      image: '/images/placeholder-landscape.webp',
+      href: '',
+    },
   ]}
 />
 ```

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

@@ -1,8 +1,7 @@
 ---
-_layout: BlockLayout
+presets: [docs, blocks]
 
 title: Reviews
-image: /images/blocks/reviews.png
 ---
 
 ```astro live
@@ -19,7 +18,7 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
     {
       rating: {
         value: 5,
-        avatar: '/images/avatars/1.jpeg',
+        avatar: 'avatar-1.jpeg',
         label: 'John Doe',
       },
       heading: 'Exceptional Service',
@@ -28,7 +27,7 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
     {
       rating: {
         value: 5,
-        avatar: '/images/avatars/2.jpeg',
+        avatar: 'avatar-2.jpeg',
         label: 'Jane Smith',
       },
       heading: 'Great Product',
@@ -37,7 +36,7 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
     {
       rating: {
         value: 5,
-        avatar: '/images/avatars/3.jpeg',
+        avatar: 'avatar-3.jpeg',
         label: 'Mike Johnson',
       },
       heading: 'Reliable and Efficient',
@@ -46,7 +45,7 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
     {
       rating: {
         value: 5,
-        avatar: '/images/avatars/4.jpeg',
+        avatar: 'avatar-4.jpeg',
         label: 'Emily Brown',
       },
       heading: 'Fantastic Experience',
@@ -55,7 +54,7 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
     {
       rating: {
         value: 5,
-        avatar: '/images/avatars/5.jpeg',
+        avatar: 'avatar-1.jpeg',
         label: 'David Wilson',
       },
       heading: 'Best in Class',
@@ -64,7 +63,7 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
     {
       rating: {
         value: 5,
-        avatar: '/images/avatars/6.jpeg',
+        avatar: 'avatar-2.jpeg',
         label: 'Sarah Davis',
       },
       heading: 'Innovative Design',
@@ -73,7 +72,7 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
     {
       rating: {
         value: 5,
-        avatar: '/images/avatars/7.jpeg',
+        avatar: 'avatar-3.jpeg',
         label: 'Alex Taylor',
       },
       heading: 'Time-Saver',
@@ -82,7 +81,7 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
     {
       rating: {
         value: 5,
-        avatar: '/images/avatars/8.jpeg',
+        avatar: 'avatar-4.jpeg',
         label: 'Olivia Martinez',
       },
       heading: 'Reliable and Durable',
@@ -102,10 +101,10 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
     value: 5,
     label: 'Rated 5,0 out of 86 reviews',
     avatars: [
-      '/images/avatars/1.jpeg',
-      '/images/avatars/2.jpeg',
-      '/images/avatars/3.jpeg',
-      '/images/avatars/4.jpeg',
+      'avatar-1.jpeg',
+      'avatar-2.jpeg',
+      'avatar-3.jpeg',
+      'avatar-4.jpeg',
     ],
   }}
   heading="What Our Customers Say"
@@ -220,28 +219,34 @@ import Reviews from 'fulldev-ui/blocks/Reviews.astro'
   heading="Customer Testimonials"
   text="See what our valued customers have to say about their experiences."
   structure="grid"
-  frame="panel"
   variant="primary"
   cards={[
     {
       rating: 5,
       heading: 'Life-Changing Product',
       text: "This product has revolutionized my daily routine. I can't imagine life without it now!",
-      avatar: '/images/avatars/1.jpeg',
+      avatar: 'avatar-1.jpeg',
       label: 'John Doe',
     },
     {
       rating: 4,
       heading: 'Great Value for Money',
       text: 'Excellent quality at a reasonable price. Definitely worth every penny.',
-      avatar: '/images/avatars/2.jpeg',
+      avatar: 'avatar-2.jpeg',
       label: 'Jane Smith',
     },
     {
       rating: 5,
       heading: 'Superb Customer Service',
       text: 'The support team went above and beyond to help me. Truly impressive!',
-      avatar: '/images/avatars/3.jpeg',
+      avatar: 'avatar-3.jpeg',
+      label: 'Mike Johnson',
+    },
+    {
+      rating: 5,
+      heading: 'Superb Customer Service',
+      text: 'The support team went above and beyond to help me. Truly impressive!',
+      avatar: 'avatar-3.jpeg',
       label: 'Mike Johnson',
     },
   ]}

package/src/content/pages/index.mdx

@@ -1,55 +1,54 @@
 ---
+presets: [base]
+component: PageLayout
+sidebar: false
+toc: false
+
 seo:
   title: Fulldev UI - Astro component and block library, open-source
   description: Make websites rapidly with pre-built components and blocks.
-  image: /images/og-image.png
+  image: og-image.png
+
+title: Home
 
 sections:
-  hero:
-    _bookshop_name: Hero
-    color: brand
+  - component: Hero
     badge:
-      as: a
-      text: We just released our biggest update yet 🎉
-      href: https://discord.gg/vXZqMbadm8
+      text: We added layouts, now you can build entire sites
+      href: /overview/installation/
     heading: The Astro UI library to build content sites
-    text: Make websites with prebuilt components and blocks
+    text: Make websites with prebuilt components, blocks and layouts
     buttons:
       - text: Get Started
-        href: /overview/installation
+        href: /overview/installation/
       - text: GitHub
         href: https://github.com/fulldotdev/ui
-        target: _blank
         icon: brand-github
-
-  blocks:
-    _bookshop_name: Content
+  - component: Article
+  - component: Content
     color: brand
     label: Blocks
     heading: Use pre-built blocks with just props
     text: we created a great gallery of blocks to build content sites with a modern look and feel, all of our blocks are build with components from the library to achieve a consistent look.
-    image: /images/block-code.png
-    reverse: odd
+    image: block-code.png
     buttons:
       - href: /blocks
         icon: layout
         text: View blocks
 
-  components:
-    _bookshop_name: Content
+  - component: Content
     color: brand
     label: Components
     heading: Or build your own, with easy to use components
     text: our rich set of components make it easy to build your own blocks with great customizability through props and global theming.
-    image: /images/component-code.png
+    image: component-code.png
     reverse: odd
     buttons:
       - href: /base/badge
         icon: code
         text: View components
 
-  cta:
-    _bookshop_name: Cta
+  - component: Cta
     size: lg
     variant: primary
     heading: Build content websites in a fraction of time

package/src/content/pages/layouts/docslayout.mdx

@@ -0,0 +1,5 @@
+---
+presets: [docs, blocks]
+
+title: DocsLayout
+---

package/src/content/pages/layouts/layout.mdx

@@ -0,0 +1,21 @@
+---
+presets: [docs, blocks]
+
+title: Layout
+---
+
+```astro live
+---
+import Hero from 'fulldev-ui/blocks/Hero.astro'
+import Layout from 'fulldev-ui/layouts/Layout.astro'
+---
+
+<Layout>
+  <Hero
+    heading="Layout"
+    text="The Layout component is used to wrap the content of a page."
+    align="center"
+    frame="viewport"
+  />
+</Layout>
+```

package/src/content/pages/layouts/pagelayout.mdx

@@ -0,0 +1,21 @@
+---
+presets: [docs, blocks]
+
+title: PageLayout
+---
+
+```astro live
+---
+import Hero from 'fulldev-ui/blocks/Hero.astro'
+import PageLayout from 'fulldev-ui/layouts/PageLayout.astro'
+---
+
+<PageLayout>
+  <Hero
+    heading="PageLayout"
+    text="The PageLayout component is used to wrap the content of a page."
+    align="center"
+    frame="viewport"
+  />
+</PageLayout>
+```