storybook for toggle button

old-sae-airwatch/src/app/buttons/main-button/main-button.stories.ts

@@ -1,94 +0,0 @@
-import type {Meta, StoryObj} from '@storybook/angular';
-import {MainButton} from './main-button';
-import {moduleMetadata} from '@storybook/angular';
-import {CommonModule} from '@angular/common';
-
-// More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction
-const meta: Meta<MainButton> = {
-  title: 'Components/MainButton',
-  component: MainButton,
-  tags: ['autodocs'],
-  decorators: [
-    moduleMetadata({
-      imports: [CommonModule],
-      providers: []
-    })
-  ],
-  argTypes: {
-    label: {control: 'text'},
-    icon: {control: 'text'},
-    kind: {
-      control: 'select',
-      options: ['', 'primary', 'secondary', 'info', 'success', 'warning', 'danger'],
-      description: 'Style du bouton'
-    },
-  },
-};
-
-export default meta;
-type Story = StoryObj<MainButton>;
-
-// More on writing stories with args: https://storybook.js.org/docs/angular/writing-stories/args
-export const Primary: Story = {
-  args: {
-    label: 'Button',
-    icon: 'home-line-2',
-    kind: 'primary'
-  },
-};
-
-export const Secondary: Story = {
-  args: {
-    label: 'Secondary Button',
-    icon: 'settings-line',
-    kind: 'secondary'
-  },
-};
-
-export const Info: Story = {
-  args: {
-    label: 'Info Button',
-    icon: 'information-line',
-    kind: 'info'
-  },
-};
-
-export const Success: Story = {
-  args: {
-    label: 'Success Button',
-    icon: 'check-line',
-    kind: 'success'
-  },
-};
-
-export const Warning: Story = {
-  args: {
-    label: 'Warning Button',
-    icon: 'alert-line',
-    kind: 'warning'
-  },
-};
-
-export const Danger: Story = {
-  args: {
-    label: 'Danger Button',
-    icon: 'close-circle-line',
-    kind: 'danger'
-  },
-};
-
-export const WithoutIcon: Story = {
-  args: {
-    label: 'Button without icon',
-    icon: '',
-    kind: 'primary'
-  },
-};
-
-export const WithIcon: Story = {
-  args: {
-    label: 'Button with icon',
-    icon: 'user-line',
-    kind: ''
-  },
-};

old-sae-airwatch/src/app/chatbot/toggle-button/toggle-button.scss

@@ -6,12 +6,17 @@
   line-height: 8px;
   font-weight: 600;
 
+  color: #005AA2;
+  text-align: center;
+  font-style: normal;
+
+  display: inline-flex;
+  padding: 10px 10px 12px 10px;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
   border-radius: 20px;
-  padding: 10px;
-  border-width: 2px;
   background: transparent;
-  margin-right: 10px;
-  margin-bottom: 10px;
 
   // Custom tooltip styling
   &[title] {
@@ -42,9 +47,14 @@
     border: solid 1px #005aa2;
     color: #005aa2;
 
+
     &.is-active {
       background: #083b7d;
       color: white;
+      &:hover {
+        color: #7FB8E7;
+        border: solid 1px #7FB8E7;
+      }
     }
   }
 
@@ -52,6 +62,10 @@
     border: solid 1px #50d494;
     color: #50d494;
 
+    &:hover {
+      color: #159256;
+      border: solid 1px #159256;
+    }
     &.is-active {
       background: #159256;
       color: white;

old-sae-airwatch/src/app/chatbot/toggle-button/toggle-button.stories.ts

@@ -0,0 +1,46 @@
+import type {Meta, StoryObj} from '@storybook/angular';
+import {ToggleButton} from './toggle-button';
+
+// More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction
+const meta: Meta<ToggleButton> = {
+  title: 'Components/ToggleButton',
+  component: ToggleButton,
+  tags: ['autodocs'],
+  argTypes: {
+    label: {control: 'text'},
+    icon: {control: 'text'},
+  },
+};
+
+export default meta;
+type Story = StoryObj<ToggleButton>;
+
+// More on writing stories with args: https://storybook.js.org/docs/angular/writing-stories/args
+export const LocalButton: Story = {
+  args: {
+    label: 'Button local',
+    kind: 'local',
+  },
+};
+export const LocalButtonActive: Story = {
+  args: {
+    label: 'Button local',
+    kind: 'local',
+    active: true,
+  },
+};
+
+export const OutsideButton: Story = {
+  args: {
+    label: 'Button outside',
+    kind: 'outside',
+    active: false,
+  },
+};
+export const OutsideButtonActive: Story = {
+  args: {
+    label: 'Button outside',
+    kind: 'outside',
+    active: true,
+  },
+};

old-sae-airwatch/src/app/logo/logo.ts

@@ -5,7 +5,7 @@ import { Component } from '@angular/core';
   imports: [],
   template: `
     <span class="logo">
-    😎 logo  
+    <img alt="logo" src="safran_logo.svg">
     </span>
     `,
   styles: ``