@lightspeed/crane 1.1.2 → 1.2.0

package/template/reference/sections/about-us/settings/design.ts

@@ -0,0 +1,74 @@
+export default {
+  image: {
+    type: 'IMAGE',
+    label: '$label.image_content.label',
+    colors: ['#000000', '#FFFFFF', '#333333', '#6281C5', '#C8D9FF', '#878787', '#101010'],
+    defaults: {
+      overlay: 'GRADIENT',
+      color: ['#FFFFFF', '#000000'],
+    },
+  },
+  title: {
+    type: 'TEXT',
+    label: '$label.section_title.label',
+    colors: ['#000000', '#FFFFFF', '#333333', '#6281C5', '#C8D9FF', '#878787', '#101010'],
+    sizes: [18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60],
+    defaults: {
+      font: 'noto_serif',
+      size: 44,
+      bold: true,
+      italic: false,
+      color: '#333333',
+      visible: true,
+    },
+  },
+  caption: {
+    type: 'TEXT',
+    label: '$label.caption.label',
+    colors: ['#000000', '#FFFFFF', '#333333', '#6281C5', '#C8D9FF', '#878787', '#101010'],
+    sizes: [18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60],
+    defaults: {
+      font: 'inter',
+      size: 16,
+      bold: true,
+      italic: false,
+      color: '#000000',
+      visible: true,
+    },
+  },
+  value: {
+    type: 'TEXT',
+    label: '$label.value.label',
+    colors: ['#000000', '#FFFFFF', '#333333', '#6281C5', '#C8D9FF', '#878787', '#101010'],
+    sizes: [18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60],
+    defaults: {
+      font: 'noto_serif',
+      size: 40,
+      bold: true,
+      italic: false,
+      color: '#6281C5',
+      visible: true,
+    },
+  },
+  background: {
+    type: 'BACKGROUND',
+    label: '$label.background.label',
+    colors: ['#000000', '#FFFFFF', '#333333', '#6281C5', '#C8D9FF', '#878787', '#101010'],
+    defaults: {
+      style: 'COLOR',
+      color: '#C8D9FF',
+    },
+  },
+  button: {
+    type: 'BUTTON',
+    label: '$label.button.label',
+    colors: ['#000000', '#FFFFFF', '#333333', '#6281C5', '#C8D9FF', '#878787', '#101010'],
+    defaults: {
+      appearance: 'SOLID',
+      size: 'MEDIUM',
+      style: 'pill',
+      color: '#000000',
+      visible: true,
+    },
+  },
+} as const;

package/template/reference/sections/about-us/settings/layout.ts

@@ -0,0 +1,12 @@
+export default [
+  {
+    layoutId: 'Images_With_Border_Radius',
+    selectedContentSettings: [],
+    selectedDesignSettings: [],
+  },
+  {
+    layoutId: 'Images_Without_Border_Radius',
+    selectedContentSettings: [],
+    selectedDesignSettings: [],
+  },
+] as const;

package/template/reference/sections/about-us/settings/translations.ts

@@ -0,0 +1,151 @@
+export default {
+  en: {
+    '$label.section_title.label': 'Main title',
+    '$label.caption.label': 'Caption',
+    '$label.value.label': 'Value',
+    '$label.section_title.placeholder': 'This will be the main title for this section',
+    '$label.image_content.label': 'Image Content',
+    '$label.stats.deck_title': 'Highlights',
+    '$label.stats.add_card_button': 'Add Highlight',
+    '$label.images.card_title': 'Highlight',
+    '$label.images.card_title_1': 'People',
+    '$label.images.card_title_2': 'Customers per month',
+    '$label.images.card_title_3': 'Unique customers so far',
+    '$label.stat_value.label': 'Value',
+    '$label.stat_value.placeholder': 'Value Placeholder',
+    '$label.stat_value.default.text': 'Value',
+    '$label.stat_caption.label': 'Caption',
+    '$label.stat_caption.placeholder': 'Caption Placeholder',
+    '$label.stat_caption.default.text': 'Caption',
+    '$label.button_content.label': 'Button',
+    '$label.button_content.title': 'Learn More',
+    '$label.background.label': 'Background',
+    '$label.button.label': 'Button',
+  },
+
+  fr: {
+    '$label.showcase_1.blockName': 'Section d\'information sur l\'entreprise',
+    '$label.showcase_1.section_title.text': 'Notre entreprise en chiffres',
+    '$label.showcase_1.stat_value_1.label': 'Valeur',
+    '$label.showcase_1.stat_value_1.placeholder': 'Valeur',
+    '$label.showcase_1.stat_value.default_1.text': '120',
+    '$label.showcase_1.stat_caption_1.label': 'Légende',
+    '$label.showcase_1.stat_caption_1.placeholder': 'Légende',
+    '$label.showcase_1.stat_caption_1.default.text': 'Personnes',
+    '$label.showcase_1.stat_value_2.label': 'Valeur',
+    '$label.showcase_1.stat_value_2.placeholder': 'Valeur',
+    '$label.showcase_1.stat_value.default_2.text': '1500',
+    '$label.showcase_1.stat_caption_2.label': 'Légende',
+    '$label.showcase_1.stat_caption_2.placeholder': 'Légende',
+    '$label.showcase_1.stat_caption_2.default.text': 'Clients par mois',
+    '$label.showcase_1.stat_value_3.label': 'Valeur',
+    '$label.showcase_1.stat_value_3.placeholder': 'Valeur',
+    '$label.showcase_1.stat_value.default_3.text': '1500000',
+    '$label.showcase_1.stat_caption_3.label': 'Légende',
+    '$label.showcase_1.stat_caption_3.placeholder': 'Légende',
+    '$label.showcase_1.stat_caption_3.default.text': 'Clients uniques jusqu\'à présent',
+    '$label.showcase_1.stat_value_4.label': 'Valeur',
+    '$label.showcase_1.stat_value_4.placeholder': 'Valeur',
+    '$label.showcase_1.stat_value.default_4.text': '3.3',
+    '$label.showcase_1.stat_caption_4.label': 'Légende',
+    '$label.showcase_1.stat_caption_4.placeholder': 'Légende',
+    '$label.showcase_1.stat_caption_4.default.text': 'Articles par commande en moyenne',
+    '$label.showcase_1.stat_value_5.label': 'Valeur',
+    '$label.showcase_1.stat_value_5.placeholder': 'Valeur',
+    '$label.showcase_1.stat_value.default_5.text': '15',
+    '$label.showcase_1.stat_caption_5.label': 'Légende',
+    '$label.showcase_1.stat_caption_5.placeholder': 'Légende',
+    '$label.showcase_1.stat_caption_5.default.text': 'Entrepôts',
+    '$label.showcase_1.button_content.title': 'En savoir plus',
+    '$label.showcase_2.blockName': 'Notre équipe',
+    '$label.showcase_2.section_title.text': 'Notre équipe',
+    '$label.showcase_2.stat_value_1.label': 'Valeur',
+    '$label.showcase_2.stat_value_1.placeholder': 'Valeur',
+    '$label.showcase_2.stat_value.default_1.text': '45',
+    '$label.showcase_2.stat_caption_1.label': 'Légende',
+    '$label.showcase_2.stat_caption_1.placeholder': 'Légende',
+    '$label.showcase_2.stat_caption_1.default.text': 'Personnes',
+    '$label.showcase_2.stat_value_2.label': 'Valeur',
+    '$label.showcase_2.stat_value_2.placeholder': 'Valeur',
+    '$label.showcase_2.stat_value.default_2.text': '15',
+    '$label.showcase_2.stat_caption_2.label': 'Légende',
+    '$label.showcase_2.stat_caption_2.placeholder': 'Légende',
+    '$label.showcase_2.stat_caption_2.default.text': 'Nationalités',
+    '$label.showcase_2.stat_value_3.label': 'Valeur',
+    '$label.showcase_2.stat_value_3.placeholder': 'Valeur',
+    '$label.showcase_2.stat_value.default_3.text': '0',
+    '$label.showcase_2.stat_caption_3.label': 'Légende',
+    '$label.showcase_2.stat_caption_3.placeholder': 'Légende',
+    '$label.showcase_2.stat_caption_3.default.text': 'Managers',
+    '$label.showcase_2.stat_value_4.label': 'Valeur',
+    '$label.showcase_2.stat_value_4.placeholder': 'Valeur',
+    '$label.showcase_2.stat_value.default_4.text': '75',
+    '$label.showcase_2.stat_caption_4.label': 'Légende',
+    '$label.showcase_2.stat_caption_4.placeholder': 'Légende',
+    '$label.showcase_2.stat_caption_4.default.text': 'Vélos que les membres de l\'équipe possèdent',
+    '$label.showcase_2.button_content.title': 'En savoir plus',
+  },
+
+  nl: {
+    '$label.showcase_1.blockName': 'Bedrijfsinformatie sectie',
+    '$label.showcase_1.section_title.text': 'Ons bedrijf in cijfers',
+    '$label.showcase_1.stat_value_1.label': 'Waarde',
+    '$label.showcase_1.stat_value_1.placeholder': 'Waarde',
+    '$label.showcase_1.stat_value.default_1.text': '120',
+    '$label.showcase_1.stat_caption_1.label': 'Bijschrift',
+    '$label.showcase_1.stat_caption_1.placeholder': 'Bijschrift',
+    '$label.showcase_1.stat_caption_1.default.text': 'Mensen',
+    '$label.showcase_1.stat_value_2.label': 'Waarde',
+    '$label.showcase_1.stat_value_2.placeholder': 'Waarde',
+    '$label.showcase_1.stat_value.default_2.text': '1500',
+    '$label.showcase_1.stat_caption_2.label': 'Bijschrift',
+    '$label.showcase_1.stat_caption_2.placeholder': 'Bijschrift',
+    '$label.showcase_1.stat_caption_2.default.text': 'Klanten per maand',
+    '$label.showcase_1.stat_value_3.label': 'Waarde',
+    '$label.showcase_1.stat_value_3.placeholder': 'Waarde',
+    '$label.showcase_1.stat_value.default_3.text': '1500000',
+    '$label.showcase_1.stat_caption_3.label': 'Bijschrift',
+    '$label.showcase_1.stat_caption_3.placeholder': 'Bijschrift',
+    '$label.showcase_1.stat_caption_3.default.text': 'Unieke klanten tot nu toe',
+    '$label.showcase_1.stat_value_4.label': 'Waarde',
+    '$label.showcase_1.stat_value_4.placeholder': 'Waarde',
+    '$label.showcase_1.stat_value.default_4.text': '3.3',
+    '$label.showcase_1.stat_caption_4.label': 'Bijschrift',
+    '$label.showcase_1.stat_caption_4.placeholder': 'Bijschrift',
+    '$label.showcase_1.stat_caption_4.default.text': 'Artikelen per bestelling gemiddeld',
+    '$label.showcase_1.stat_value_5.label': 'Waarde',
+    '$label.showcase_1.stat_value_5.placeholder': 'Waarde',
+    '$label.showcase_1.stat_value.default_5.text': '15',
+    '$label.showcase_1.stat_caption_5.label': 'Bijschrift',
+    '$label.showcase_1.stat_caption_5.placeholder': 'Bijschrift',
+    '$label.showcase_1.stat_caption_5.default.text': 'Magazijnen',
+    '$label.showcase_1.button_content.title': 'Meer informatie',
+    '$label.showcase_2.blockName': 'Ons team',
+    '$label.showcase_2.section_title.text': 'Ons team',
+    '$label.showcase_2.stat_value_1.label': 'Waarde',
+    '$label.showcase_2.stat_value_1.placeholder': 'Waarde',
+    '$label.showcase_2.stat_value.default_1.text': '45',
+    '$label.showcase_2.stat_caption_1.label': 'Bijschrift',
+    '$label.showcase_2.stat_caption_1.placeholder': 'Bijschrift',
+    '$label.showcase_2.stat_caption_1.default.text': 'Mensen',
+    '$label.showcase_2.stat_value_2.label': 'Waarde',
+    '$label.showcase_2.stat_value_2.placeholder': 'Waarde',
+    '$label.showcase_2.stat_value.default_2.text': '15',
+    '$label.showcase_2.stat_caption_2.label': 'Bijschrift',
+    '$label.showcase_2.stat_caption_2.placeholder': 'Bijschrift',
+    '$label.showcase_2.stat_caption_2.default.text': 'Nationaliteiten',
+    '$label.showcase_2.stat_value_3.label': 'Waarde',
+    '$label.showcase_2.stat_value_3.placeholder': 'Waarde',
+    '$label.showcase_2.stat_value.default_3.text': '0',
+    '$label.showcase_2.stat_caption_3.label': 'Bijschrift',
+    '$label.showcase_2.stat_caption_3.placeholder': 'Bijschrift',
+    '$label.showcase_2.stat_caption_3.default.text': 'Managers',
+    '$label.showcase_2.stat_value_4.label': 'Waarde',
+    '$label.showcase_2.stat_value_4.placeholder': 'Waarde',
+    '$label.showcase_2.stat_value.default_4.text': '75',
+    '$label.showcase_2.stat_caption_4.label': 'Bijschrift',
+    '$label.showcase_2.stat_caption_4.placeholder': 'Bijschrift',
+    '$label.showcase_2.stat_caption_4.default.text': 'Fietsen die teamleden hebben',
+    '$label.showcase_2.button_content.title': 'Meer informatie',
+  },
+} as const;

package/template/reference/sections/about-us/showcases/1.ts

@@ -0,0 +1,155 @@
+export default {
+  showcaseId: '1',
+  previewImage: {
+    set: {
+      ORIGINAL: {
+        url: 'our_company_in_numbers_preview.jpg',
+      },
+    },
+  },
+  layoutId: 'Images_With_Border_Radius',
+  blockName: '$label.showcase_1.blockName',
+  content: {
+    title: {
+      type: 'INPUTBOX',
+      text: '$label.showcase_1.section_title.text',
+    },
+    image: {
+      type: 'IMAGE',
+      imageData: {
+        set: {
+          LOW_RES: {
+            url: 'our_company_in_numbers.jpg',
+          },
+          MOBILE_WEBP_LOW_RES: {
+            url: 'our_company_in_numbers.jpg',
+          },
+          MOBILE_WEBP_HI_RES: {
+            url: 'our_company_in_numbers.jpg',
+          },
+          WEBP_LOW_RES: {
+            url: 'our_company_in_numbers.jpg',
+          },
+          WEBP_HI_2X_RES: {
+            url: 'our_company_in_numbers.jpg',
+          },
+        },
+        borderInfo: {},
+      },
+    },
+    stats: {
+      type: 'DECK',
+      cards: [
+        {
+          settings: {
+            stat_value: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_value.default_1.text',
+            },
+            stat_caption: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_caption_1.default.text',
+            },
+          },
+        },
+        {
+          settings: {
+            stat_value: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_value.default_2.text',
+            },
+            stat_caption: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_caption_2.default.text',
+            },
+          },
+        },
+        {
+          settings: {
+            stat_value: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_value.default_3.text',
+            },
+            stat_caption: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_caption_3.default.text',
+            },
+          },
+        },
+        {
+          settings: {
+            stat_value: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_value.default_4.text',
+            },
+            stat_caption: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_caption_4.default.text',
+            },
+          },
+        },
+        {
+          settings: {
+            stat_value: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_value.default_5.text',
+            },
+            stat_caption: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_1.stat_caption_5.default.text',
+            },
+          },
+        },
+      ],
+    },
+    button: {
+      type: 'BUTTON',
+      title: '$label.showcase_1.button_content.title',
+      buttonType: 'HYPER_LINK',
+    },
+  },
+  design: {
+    image: {
+      type: 'IMAGE',
+      overlay: 'GRADIENT',
+      color: ['#FFFFFF', '#000000'],
+    },
+    title: {
+      type: 'TEXT',
+      font: 'noto_serif',
+      size: 44,
+      bold: true,
+      italic: false,
+      color: '#333333',
+    },
+    caption: {
+      type: 'TEXT',
+      font: 'inter',
+      size: 16,
+      bold: true,
+      italic: false,
+      color: '#000000',
+    },
+    value: {
+      type: 'TEXT',
+      font: 'noto_serif',
+      size: 40,
+      bold: true,
+      italic: false,
+      color: '#6281C5',
+    },
+    background: {
+      type: 'BACKGROUND',
+      style: 'COLOR',
+      color: '#C8D9FF',
+    },
+    button: {
+      type: 'BUTTON',
+      font: 'inter',
+      appearance: 'OUTLINE',
+      size: 'LARGE',
+      shape: 'PILL',
+      color: '#000000',
+    },
+  },
+} as const;

package/template/reference/sections/about-us/showcases/2.ts

@@ -0,0 +1,143 @@
+export default {
+  showcaseId: '2',
+  previewImage: {
+    set: {
+      ORIGINAL: {
+        url: 'our_team_preview.jpg',
+      },
+    },
+  },
+  layoutId: 'Images_Without_Border_Radius',
+  blockName: '$label.showcase_2.blockName',
+  content: {
+    title: {
+      type: 'INPUTBOX',
+      text: '$label.showcase_2.section_title.text',
+    },
+    image: {
+      type: 'IMAGE',
+      imageData: {
+        set: {
+          LOW_RES: {
+            url: 'our_team.jpg',
+          },
+          MOBILE_WEBP_LOW_RES: {
+            url: 'our_team.jpg',
+          },
+          MOBILE_WEBP_HI_RES: {
+            url: 'our_team.jpg',
+          },
+          WEBP_LOW_RES: {
+            url: 'our_team.jpg',
+          },
+          WEBP_HI_2X_RES: {
+            url: 'our_team.jpg',
+          },
+        },
+        borderInfo: {},
+      },
+    },
+    stats: {
+      type: 'DECK',
+      cards: [
+        {
+          settings: {
+            stat_value: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_2.stat_value.default_1.text',
+            },
+            stat_caption: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_2.stat_caption_1.default.text',
+            },
+          },
+        },
+        {
+          settings: {
+            stat_value: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_2.stat_value.default_2.text',
+            },
+            stat_caption: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_2.stat_caption_2.default.text',
+            },
+          },
+        },
+        {
+          settings: {
+            stat_value: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_2.stat_value.default_3.text',
+            },
+            stat_caption: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_2.stat_caption_3.default.text',
+            },
+          },
+        },
+        {
+          settings: {
+            stat_value: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_2.stat_value.default_4.text',
+            },
+            stat_caption: {
+              type: 'INPUTBOX',
+              text: '$label.showcase_2.stat_caption_4.default.text',
+            },
+          },
+        },
+      ],
+    },
+    button: {
+      type: 'BUTTON',
+      title: '$label.showcase_2.button_content.title',
+      buttonType: 'HYPER_LINK',
+    },
+  },
+  design: {
+    image: {
+      type: 'IMAGE',
+      overlay: 'GRADIENT',
+      color: ['#FFFFFF', '#000000'],
+    },
+    title: {
+      type: 'TEXT',
+      font: 'pt_mono',
+      size: 48,
+      bold: true,
+      italic: false,
+      color: '#FFFFFF',
+    },
+    caption: {
+      type: 'TEXT',
+      font: 'inter',
+      size: 16,
+      bold: true,
+      italic: false,
+      color: '#FFFFFF',
+    },
+    value: {
+      type: 'TEXT',
+      font: 'pt_mono',
+      size: 40,
+      bold: true,
+      italic: false,
+      color: '#878787',
+    },
+    background: {
+      type: 'BACKGROUND',
+      style: 'COLOR',
+      color: '#101010',
+    },
+    button: {
+      type: 'BUTTON',
+      font: 'inter',
+      appearance: 'OUTLINE',
+      size: 'LARGE',
+      shape: 'RECTANGLE',
+      color: '#FFFFFF',
+    },
+  },
+} as const;