Subida del módulo y tema de PrestaShop

themes/hummingbird/stories/ui/badges/badges.html

@@ -0,0 +1,8 @@
+<span class="badge bg-primary">Primary</span>
+<span class="badge bg-secondary">Secondary</span>
+<span class="badge bg-success">Success</span>
+<span class="badge bg-danger">Danger</span>
+<span class="badge bg-warning text-dark">Warning</span>
+<span class="badge bg-info text-dark">Info</span>
+<span class="badge bg-light text-dark">Light</span>
+<span class="badge bg-dark">Dark</span>

themes/hummingbird/stories/ui/badges/index.stories.js

@@ -0,0 +1,44 @@
+import badgesContent from './badges.html'
+import pillsContent from './pills.html'
+import notificationsContent from './notifications.html'
+
+export default {
+  title: 'UI/Badges',
+  parameters: {
+    docs: {
+      description: {
+        component: 'Badges are used to display status, counts, or labels.'
+      }
+    }
+  }
+};
+
+export const Badges = () => badgesContent;
+Badges.parameters = {
+  docs: {
+    source: {
+      code: badgesContent
+    }
+  }
+};
+Badges.storyName = 'Badges';
+
+export const Pills = () => pillsContent;
+Pills.parameters = {
+  docs: {
+    source: {
+      code: pillsContent
+    }
+  }
+};
+Pills.storyName = 'Pills';
+
+export const Notifications = () => notificationsContent;
+Notifications.parameters = {
+  docs: {
+    source: {
+      code: notificationsContent
+    }
+  }
+};
+Notifications.storyName = 'Notifications pills';

themes/hummingbird/stories/ui/badges/notifications.html

@@ -0,0 +1,16 @@
+<div class="py-3">
+  <button type="button" class="btn btn-primary position-relative">
+    Inbox
+    <span class="position-absolute top-0 py-1 px-1 start-100 translate-middle badge rounded-pill bg-danger">
+      99+
+      <span class="visually-hidden">unread messages</span>
+    </span>
+  </button>
+
+  <button type="button" class="btn btn-primary position-relative mx-4">
+    Profile
+    <span class="position-absolute top-0 start-100 translate-middle p-2 bg-danger border border-light rounded-circle">
+      <span class="visually-hidden">New alerts</span>
+    </span>
+  </button>
+</div>

themes/hummingbird/stories/ui/badges/pills.html

@@ -0,0 +1,8 @@
+<span class="badge rounded-pill bg-primary">Primary</span>
+<span class="badge rounded-pill bg-secondary">Secondary</span>
+<span class="badge rounded-pill bg-success">Success</span>
+<span class="badge rounded-pill bg-danger">Danger</span>
+<span class="badge rounded-pill bg-warning text-dark">Warning</span>
+<span class="badge rounded-pill bg-info text-dark">Info</span>
+<span class="badge rounded-pill bg-light text-dark">Light</span>
+<span class="badge rounded-pill bg-dark">Dark</span>