From 9abb3a8abe68e386c842ecb85af124318b1fe3b5 Mon Sep 17 00:00:00 2001 From: jordi hermes babalako Date: Mon, 24 Jun 2024 03:59:57 +0200 Subject: [PATCH] feat/logo --- assets/images/placeholder-logo.svg | 13 +++++++ assets/images/thelia-black.svg | 4 ++ assets/images/thelia-white.svg | 4 ++ components/Atoms/Logos/Logo.stories.js | 54 ++++++++++++++++++++++++++ components/Atoms/Logos/Logo.twig | 11 ++++++ 5 files changed, 86 insertions(+) create mode 100644 assets/images/placeholder-logo.svg create mode 100644 assets/images/thelia-black.svg create mode 100644 assets/images/thelia-white.svg create mode 100644 components/Atoms/Logos/Logo.stories.js create mode 100644 components/Atoms/Logos/Logo.twig diff --git a/assets/images/placeholder-logo.svg b/assets/images/placeholder-logo.svg new file mode 100644 index 0000000..9d9ca5a --- /dev/null +++ b/assets/images/placeholder-logo.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/assets/images/thelia-black.svg b/assets/images/thelia-black.svg new file mode 100644 index 0000000..b275db7 --- /dev/null +++ b/assets/images/thelia-black.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/images/thelia-white.svg b/assets/images/thelia-white.svg new file mode 100644 index 0000000..86bd90c --- /dev/null +++ b/assets/images/thelia-white.svg @@ -0,0 +1,4 @@ + + + + diff --git a/components/Atoms/Logos/Logo.stories.js b/components/Atoms/Logos/Logo.stories.js new file mode 100644 index 0000000..b9b2746 --- /dev/null +++ b/components/Atoms/Logos/Logo.stories.js @@ -0,0 +1,54 @@ +import Logo from './Logo.twig'; + +export default { + title: 'Design System/Atoms/Logos' +}; + +export const logo = { +render: (args) => Logo(args), +parameters: { + layout: 'centered', + backgrounds: { + default: 'light', + values: [ + { + name: 'light', + value: '#FFFFFF', + }, + { + name: 'dark', + value: '#282828', + }, + ], + }, +}, +args: { + type: 'thelia', + theme: 'dark', + path: '/images/placeholder-logo.svg', + alt: 'Thelia Logo', + }, + argTypes: { + type: { + options: ['placeholder', 'thelia'], + control: { type: 'radio' }, + defaultValue: 'placeholder', + }, + theme: { + options: ['light', 'dark'], + control: { type: 'radio' }, + defaultValue: 'light', + description: 'Select the theme for the Thelia Logotype', + if: { arg: 'type', eq: 'thelia' }, + }, + path: { + control: 'text', + description: 'Path to the logo image' + }, + alt: { + control: 'text', + description: 'Alternative text for the logo image', + defaultValue: 'Placeholder Logo', + }, + } + }; diff --git a/components/Atoms/Logos/Logo.twig b/components/Atoms/Logos/Logo.twig new file mode 100644 index 0000000..37fa4d0 --- /dev/null +++ b/components/Atoms/Logos/Logo.twig @@ -0,0 +1,11 @@ + \ No newline at end of file