@levo-so/blocks 0.1.0 → 0.1.2

package/src/blocks/cards/cards-8.schema.ts

@@ -0,0 +1,691 @@
+import type { IBlock } from "@levo-so/studio";
+
+const DEFAULT_CONTENT = {
+  layout: null,
+  container: null,
+  header_section: null,
+  main_title: "Career Opportunity",
+  header_button: "View All",
+  grid: [
+    {
+      card: null,
+      badge: "3+ Years of Experience",
+      content_container: null,
+      text_section: null,
+      title: "Senior Software Engineer",
+      description:
+        "Join our innovative development team to build cutting-edge solutions using modern technologies and agile methodologies.",
+      cta: "Apply Now",
+    },
+    {
+      card: null,
+      badge: "1+ Years of Experience",
+      content_container: null,
+      text_section: null,
+      title: "Product Marketing Manager",
+      description:
+        "Drive product growth and market expansion through strategic marketing campaigns and data-driven insights.",
+      cta: "Apply Now",
+    },
+    {
+      card: null,
+      badge: "2+ Years of Experience",
+      content_container: null,
+      text_section: null,
+      title: "UX Research Specialist",
+      description:
+        "Lead user research initiatives to enhance product experiences and inform design decisions across our platform.",
+      cta: "Apply Now",
+    },
+    {
+      card: null,
+      badge: "5+ Years of Experience",
+      content_container: null,
+      text_section: null,
+      title: "Data Science Lead",
+      description:
+        "Spearhead machine learning projects and analytics initiatives to unlock business insights and drive innovation.",
+      cta: "Apply Now",
+    },
+  ],
+  header_button_rightIcon: {
+    kind: "custom",
+    data: {
+      id: "UpLVWyg9E9QC",
+      location: "https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs.png",
+      mimetype: "image/png",
+      kind: "image",
+      srcset: {
+        "1080w":
+          "https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-1080w.webp",
+        "1200w":
+          "https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-1200w.webp",
+        "1920w":
+          "https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-1920w.webp",
+        "320w":
+          "https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-320w.webp",
+        "640w":
+          "https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-640w.webp",
+        "750w":
+          "https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-750w.webp",
+        "828w":
+          "https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-828w.webp",
+        path: "https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-320w.webp 320w, https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-750w.webp 750w, https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-640w.webp 640w, https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-1200w.webp 1200w, https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-1920w.webp 1920w, https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-828w.webp 828w, https://space.levo.in.net/W6OEVMW8/image-sR8IjbcW18vs-1080w.webp 1080w",
+      },
+    },
+  },
+};
+
+export type ICards8Content = typeof DEFAULT_CONTENT;
+
+export const Cards8: IBlock = {
+  category_id: "cards",
+  title: "Cards 8",
+  key: "cards-8",
+  version: "v1",
+  prompt_description:
+    "Career opportunities section with header title and 'View All' button, featuring job cards in a grid layout. Each card displays a badge, job title, description, and a single CTA button in a flex layout.",
+  content_schema: [
+    {
+      key: "layout",
+      label: "Layout",
+      field_interface: "LayoutWidget",
+      hint: {
+        prompt_description:
+          "Overall section layout for the career opportunities block. Controls spacing, background, and structure.",
+      },
+    },
+    {
+      key: "container",
+      label: "Container",
+      field_interface: "ContainerWidget",
+      hint: {
+        prompt_description:
+          "Main container for centering and constraining the content width.",
+      },
+    },
+    {
+      key: "header_section",
+      label: "Header Section",
+      field_interface: "BoxWidget",
+      hint: {
+        prompt_description:
+          "Header area containing the main title and view all button, positioned horizontally.",
+      },
+    },
+    {
+      key: "main_title",
+      label: "Main Title",
+      field_interface: "HeadingWidget",
+      hint: {
+        prompt_description:
+          "Main section heading that describes the career opportunities section. Should be engaging and professional.",
+        min_characters: 10,
+        max_characters: 40,
+      },
+    },
+    {
+      key: "header_button",
+      label: "Header Button",
+      field_interface: "ButtonWidget",
+      hint: {
+        prompt_description:
+          "Secondary action button for viewing all career opportunities. Should encourage exploration.",
+        min_characters: 6,
+        max_characters: 20,
+      },
+    },
+    {
+      key: "grid",
+      label: "Job Cards",
+      kind: "group",
+      field_interface: "BoxWidget",
+      fields: [
+        {
+          key: "card",
+          label: "Card Container",
+          field_interface: "BoxWidget",
+          hint: {
+            prompt_description:
+              "Individual job card container for styling and layout. No direct content.",
+          },
+        },
+        {
+          key: "badge",
+          label: "Experience Badge",
+          field_interface: "TypographyWidget",
+          hint: {
+            prompt_description:
+              "Small badge showing experience requirements, displayed as a capsule above the card content.",
+            min_characters: 10,
+            max_characters: 30,
+          },
+        },
+        {
+          key: "content_container",
+          label: "Content Container",
+          field_interface: "BoxWidget",
+          hint: {
+            prompt_description:
+              "Main content container that holds the text section and CTA in a flex layout.",
+          },
+        },
+        {
+          key: "text_section",
+          label: "Text Section",
+          field_interface: "BoxWidget",
+          hint: {
+            prompt_description:
+              "Left section containing job title and description in the flex layout.",
+          },
+        },
+        {
+          key: "title",
+          label: "Job Title",
+          field_interface: "HeadingWidget",
+          hint: {
+            prompt_description:
+              "Job position title that's clear, professional, and attractive to potential candidates.",
+            min_characters: 15,
+            max_characters: 40,
+          },
+        },
+        {
+          key: "description",
+          label: "Job Description",
+          field_interface: "TypographyWidget",
+          hint: {
+            prompt_description:
+              "Brief job description explaining key responsibilities and requirements. Should be engaging and informative.",
+            min_characters: 60,
+            max_characters: 150,
+          },
+        },
+        {
+          key: "cta",
+          label: "Apply Button",
+          field_interface: "ButtonWidget",
+          hint: {
+            prompt_description:
+              "Primary call-to-action button for job application. Should be compelling and action-oriented.",
+            min_characters: 6,
+            max_characters: 20,
+          },
+        },
+      ],
+      hint: {
+        prompt_description:
+          "Collection of job opportunity cards featuring experience badges, titles, descriptions, and apply buttons.",
+        min_items: 2,
+        max_items: 6,
+      },
+    },
+  ],
+  layouts: [
+    {
+      title: "Default",
+      key: "default",
+      styles: {
+        layout: {
+          "padding-top": "6xl",
+          "padding-bottom": "6xl",
+          "padding-left": "xl",
+          "padding-right": "xl",
+          "background-color": "oklch(0.9643 0.0169 61.9599)",
+          tablet: {
+            "padding-top": "4xl",
+            "padding-bottom": "4xl",
+            "padding-left": "lg",
+            "padding-right": "lg",
+          },
+          mobile: {
+            "padding-top": "3xl",
+            "padding-bottom": "3xl",
+            "padding-left": "base",
+            "padding-right": "base",
+          },
+        },
+        container: {
+          "max-width": "1280px",
+          "margin-left": "auto",
+          "margin-right": "auto",
+          filter: "none",
+        },
+        header_section: {
+          display: "flex",
+          "justify-content": "space-between",
+          "align-items": "center",
+          "margin-bottom": "4xl",
+          mobile: {
+            "flex-direction": "column",
+            "align-items": "center",
+            "row-gap": "lg",
+            filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+            "justify-content": "center",
+          },
+          filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+        },
+        header_button: {
+          color: "text-3",
+          "font-size": "base",
+          "font-weight": "500",
+          display: "flex",
+          "align-items": "center",
+          "column-gap": "xs",
+          filter: "none",
+          "text-decoration": "none",
+        },
+        grid_levoGroup: {
+          filter: "none",
+          display: "grid",
+          "grid-template-columns": "repeat(2, minmax(0, 1fr))",
+          "row-gap": "xl",
+          "column-gap": "xl",
+          mobile: {
+            filter: "none",
+            "grid-template-columns": "repeat(1, minmax(0, 1fr))",
+          },
+        },
+        grid: [
+          {
+            card: {
+              filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+              display: "block",
+              "background-color": "white",
+              "padding-top": "3xl",
+              "padding-bottom": "3xl",
+              "padding-left": "3xl",
+              "padding-right": "3xl",
+              "border-radius": "xl",
+              mobile: {
+                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+                "padding-top": "xl",
+                "padding-left": "xl",
+                "padding-right": "xl",
+                "padding-bottom": "xl",
+              },
+              tablet: {
+                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+                "padding-top": "xl",
+                "padding-right": "xl",
+                "padding-left": "xl",
+                "padding-bottom": "xl",
+              },
+            },
+            badge: {
+              filter: "none",
+              "font-size": "sm",
+              "font-weight": "500",
+              "background-color": "oklch(0.9289 0.0214 142.4953)",
+              color: "oklch(0.4451 0.1328 142.4953)",
+              "padding-top": "xs",
+              "padding-bottom": "xs",
+              "padding-left": "sm",
+              "padding-right": "sm",
+              "border-radius": "3xl",
+              display: "inline-block",
+              "margin-bottom": "lg",
+            },
+            content_container: {
+              filter: "none",
+              display: "flex",
+              "align-items": "start",
+              "column-gap": "lg",
+              mobile: {
+                filter: "none",
+                "flex-direction": "column",
+                "row-gap": "lg",
+              },
+              tablet: {
+                filter: "none",
+                "flex-direction": "column",
+                "row-gap": "lg",
+              },
+              "justify-content": "start",
+            },
+            text_section: {
+              filter: "none",
+              display: "flex",
+              "flex-direction": "column",
+              "row-gap": "sm",
+              "flex-grow": "1",
+            },
+            title: {
+              filter: "none",
+              "font-size": "2xl",
+              "font-weight": "700",
+              color: "text-1",
+              "line-height": "1.3",
+            },
+            description: {
+              filter: "none",
+              "font-size": "base",
+              color: "text-2",
+              "line-height": "1.5",
+              display: "none",
+            },
+            cta: {
+              filter: "none",
+              "border-radius": "base",
+              "flex-shrink": "0",
+              mobile: {
+                filter: "none",
+                width: "100%",
+              },
+              tablet: {
+                filter: "none",
+                width: "100%",
+              },
+            },
+          },
+          {
+            card: {
+              filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+              display: "block",
+              "background-color": "white",
+              "padding-top": "3xl",
+              "padding-bottom": "3xl",
+              "padding-left": "3xl",
+              "padding-right": "3xl",
+              "border-radius": "xl",
+              mobile: {
+                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+                "padding-top": "xl",
+                "padding-left": "xl",
+                "padding-right": "xl",
+                "padding-bottom": "xl",
+              },
+              tablet: {
+                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+                "padding-top": "xl",
+                "padding-right": "xl",
+                "padding-left": "xl",
+                "padding-bottom": "xl",
+              },
+            },
+            badge: {
+              filter: "none",
+              "font-size": "sm",
+              "font-weight": "500",
+              "background-color": "oklch(0.9289 0.0214 142.4953)",
+              color: "oklch(0.4451 0.1328 142.4953)",
+              "padding-top": "xs",
+              "padding-bottom": "xs",
+              "padding-left": "sm",
+              "padding-right": "sm",
+              "border-radius": "3xl",
+              display: "inline-block",
+              "margin-bottom": "lg",
+            },
+            content_container: {
+              filter: "none",
+              display: "flex",
+              "align-items": "flex-start",
+              "column-gap": "lg",
+              mobile: {
+                filter: "none",
+                "flex-direction": "column",
+                "row-gap": "lg",
+              },
+              tablet: {
+                filter: "none",
+                "flex-direction": "column",
+                "row-gap": "lg",
+              },
+            },
+            text_section: {
+              filter: "none",
+              display: "flex",
+              "flex-direction": "column",
+              "row-gap": "sm",
+              "flex-grow": "1",
+            },
+            title: {
+              filter: "none",
+              "font-size": "2xl",
+              "font-weight": "700",
+              color: "text-1",
+              "line-height": "1.3",
+            },
+            description: {
+              filter: "none",
+              "font-size": "base",
+              color: "text-2",
+              "line-height": "1.5",
+              display: "none",
+            },
+            cta: {
+              filter: "none",
+              "border-radius": "base",
+              "flex-shrink": "0",
+              mobile: {
+                filter: "none",
+                width: "100%",
+              },
+              tablet: {
+                filter: "none",
+                width: "100%",
+              },
+            },
+          },
+          {
+            card: {
+              filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+              display: "block",
+              "background-color": "white",
+              "padding-top": "3xl",
+              "padding-bottom": "3xl",
+              "padding-left": "3xl",
+              "padding-right": "3xl",
+              "border-radius": "xl",
+              mobile: {
+                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+                "padding-top": "xl",
+                "padding-left": "xl",
+                "padding-right": "xl",
+                "padding-bottom": "xl",
+              },
+              tablet: {
+                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+                "padding-top": "xl",
+                "padding-right": "xl",
+                "padding-left": "xl",
+                "padding-bottom": "xl",
+              },
+            },
+            badge: {
+              filter: "none",
+              "font-size": "sm",
+              "font-weight": "500",
+              "background-color": "oklch(0.9289 0.0214 142.4953)",
+              color: "oklch(0.4451 0.1328 142.4953)",
+              "padding-top": "xs",
+              "padding-bottom": "xs",
+              "padding-left": "sm",
+              "padding-right": "sm",
+              "border-radius": "3xl",
+              display: "inline-block",
+              "margin-bottom": "lg",
+            },
+            content_container: {
+              filter: "none",
+              display: "flex",
+              "align-items": "flex-start",
+              "column-gap": "lg",
+              mobile: {
+                filter: "none",
+                "flex-direction": "column",
+                "row-gap": "lg",
+              },
+              tablet: {
+                filter: "none",
+                "flex-direction": "column",
+                "row-gap": "lg",
+              },
+            },
+            text_section: {
+              filter: "none",
+              display: "flex",
+              "flex-direction": "column",
+              "row-gap": "sm",
+              "flex-grow": "1",
+            },
+            title: {
+              filter: "none",
+              "font-size": "2xl",
+              "font-weight": "700",
+              color: "text-1",
+              "line-height": "1.3",
+            },
+            description: {
+              filter: "none",
+              "font-size": "base",
+              color: "text-2",
+              "line-height": "1.5",
+              display: "none",
+            },
+            cta: {
+              filter: "none",
+              "border-radius": "base",
+              "flex-shrink": "0",
+              mobile: {
+                filter: "none",
+                width: "100%",
+              },
+              tablet: {
+                filter: "none",
+                width: "100%",
+              },
+            },
+          },
+          {
+            card: {
+              filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+              display: "block",
+              "background-color": "white",
+              "padding-top": "3xl",
+              "padding-bottom": "3xl",
+              "padding-left": "3xl",
+              "padding-right": "3xl",
+              "border-radius": "xl",
+              mobile: {
+                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+                "padding-top": "xl",
+                "padding-left": "xl",
+                "padding-right": "xl",
+                "padding-bottom": "xl",
+              },
+              tablet: {
+                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+                "padding-top": "xl",
+                "padding-right": "xl",
+                "padding-left": "xl",
+                "padding-bottom": "xl",
+              },
+            },
+            badge: {
+              filter: "none",
+              "font-size": "sm",
+              "font-weight": "500",
+              "background-color": "oklch(0.9289 0.0214 142.4953)",
+              color: "oklch(0.4451 0.1328 142.4953)",
+              "padding-top": "xs",
+              "padding-bottom": "xs",
+              "padding-left": "sm",
+              "padding-right": "sm",
+              "border-radius": "3xl",
+              display: "inline-block",
+              "margin-bottom": "lg",
+            },
+            content_container: {
+              filter: "none",
+              display: "flex",
+              "align-items": "flex-start",
+              "column-gap": "lg",
+              mobile: {
+                filter: "none",
+                "flex-direction": "column",
+                "row-gap": "lg",
+              },
+              tablet: {
+                filter: "none",
+                "flex-direction": "column",
+                "row-gap": "lg",
+              },
+            },
+            text_section: {
+              filter: "none",
+              display: "flex",
+              "flex-direction": "column",
+              "row-gap": "sm",
+              "flex-grow": "1",
+            },
+            description: {
+              filter: "none",
+              "font-size": "base",
+              color: "text-2",
+              "line-height": "1.5",
+              display: "none",
+            },
+            cta: {
+              filter: "none",
+              "border-radius": "base",
+              "flex-shrink": "0",
+              mobile: {
+                filter: "none",
+                width: "100%",
+              },
+              tablet: {
+                filter: "none",
+                width: "100%",
+              },
+            },
+          },
+        ],
+        header_button_rightIcon: {
+          width: "18px",
+          filter: "none",
+        },
+      },
+      content: DEFAULT_CONTENT,
+      config: {
+        main_title: {
+          selectedVariants: {
+            Heading_Level: "H2",
+          },
+        },
+
+        "grid.0.cta": {
+          selectedVariants: {
+            Button_Variants: "Primary",
+          },
+        },
+        "grid.1.cta": {
+          selectedVariants: {
+            Button_Variants: "Primary",
+          },
+        },
+        "grid.2.cta": {
+          selectedVariants: {
+            Button_Variants: "Primary",
+          },
+        },
+        "grid.3.cta": {
+          selectedVariants: {
+            Button_Variants: "Primary",
+          },
+        },
+        header_button: {
+          selectedVariants: {
+            Button_Variants: "Link",
+          },
+          button_icons: {
+            right: {
+              enabled: true,
+            },
+          },
+        },
+      },
+    },
+  ],
+};