Merge branch 'develop' into feat/labels

thelia · Jun 25, 2024 · 1acf9c4 · 1acf9c4
2 parents 3f14a57 + db7f747
commit 1acf9c4
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 0 deletions.
diff --git a/components/Atoms/Progress/Progress.stories.js b/components/Atoms/Progress/Progress.stories.js
@@ -0,0 +1,22 @@
+import Progress from './Progress.twig';
+
+export default {
+  title: 'Design System/Atoms/Progress'
+};
+
+export const base = {
+  render: (args) => Progress(args),
+  args: {
+    progress: 50
+  },
+  argTypes: {
+    progress: {
+      control: {
+        type: 'range',
+        min: 0,
+        max: 100,
+        step: 1
+      }
+    }
+  }
+};
diff --git a/components/Atoms/Progress/Progress.twig b/components/Atoms/Progress/Progress.twig
@@ -0,0 +1,3 @@
+<div class="Progress">
+    <div class="Progress-bar" style="width: {{ progress }}%"></div>
+</div>
diff --git a/components/Atoms/Progress/progress.css b/components/Atoms/Progress/progress.css
@@ -0,0 +1,12 @@
+.Progress {
+  height: 8px;
+  background-color: var(--vermillon-light);
+  border-radius: 5px;
+  padding: 2px;
+}
+
+.Progress-bar {
+  height: 100%;
+  background-color: var(--vermillon);
+  border-radius: 5px;
+}