From 9cd459466e4eb4c3a4730004ad9b819cdd3e77a2 Mon Sep 17 00:00:00 2001
From: jmfrancois <jmfrancois@talend.com>
Date: Fri, 29 Sep 2023 09:58:15 +0200
Subject: [PATCH] fix: styles and demo page

---
 .github/workflows/before-surge.sh                         | 2 +-
 .surge/index.html                                         | 2 +-
 .../src/components/Statuses/Status.module.scss            | 1 -
 .../storybook-docs/src/components/Statuses/Statuses.tsx   | 8 ++++----
 4 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/.github/workflows/before-surge.sh b/.github/workflows/before-surge.sh
index cc0fc83ab3..e13db83916 100755
--- a/.github/workflows/before-surge.sh
+++ b/.github/workflows/before-surge.sh
@@ -5,7 +5,7 @@ rm -rf .static
 mkdir .static
 mkdir .static/cmf
 mkdir .static/containers
-mkdir .static/design-docs
+mkdir .static/design-system
 mkdir .static/faceted-search
 mkdir .static/theme
 mkdir .static/storybook-one
diff --git a/.surge/index.html b/.surge/index.html
index aa08fe3dae..42a079b356 100644
--- a/.surge/index.html
+++ b/.surge/index.html
@@ -7,7 +7,7 @@
 		<meta name="description" content="" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
 
-		<link rel="stylesheet" href="/theme/dist/bootstrap.css" />
+		<link rel="stylesheet" href="/theme/bootstrap.css" />
 		<style>
 			.layout {
 				position: relative;
diff --git a/packages/storybook-docs/src/components/Statuses/Status.module.scss b/packages/storybook-docs/src/components/Statuses/Status.module.scss
index 2693d79a29..73ac03f43a 100644
--- a/packages/storybook-docs/src/components/Statuses/Status.module.scss
+++ b/packages/storybook-docs/src/components/Statuses/Status.module.scss
@@ -7,7 +7,6 @@
 	font: tokens.$coral-paragraph-s-bold;
 	background-color: white;
 	color: hsl(0, 0%, 13%) !important;
-	width: 100px;
 
 	&,
 	&:hover,
diff --git a/packages/storybook-docs/src/components/Statuses/Statuses.tsx b/packages/storybook-docs/src/components/Statuses/Statuses.tsx
index 353c49b42f..6c28c799cd 100644
--- a/packages/storybook-docs/src/components/Statuses/Statuses.tsx
+++ b/packages/storybook-docs/src/components/Statuses/Statuses.tsx
@@ -17,9 +17,9 @@ function getIcon(statusType: StatusType) {
 export function ComponentStatuses(statuses: Statuses) {
 	return (
 		<Unstyled>
-			<StackHorizontal gap="XS" as="ul" role="list" align="start">
+			<ul style={{ listStyleType: 'none', width: 400 }}>
 				{Object.entries(statuses).map(([statusType, { status, link }]) => (
-					<StackItem as="li" key={statusType}>
+					<li key={statusType} style={{ display: 'inline', marginRight: 4 }}>
 						<Status
 							{...{
 								status,
@@ -28,9 +28,9 @@ export function ComponentStatuses(statuses: Statuses) {
 								label: statusType,
 							}}
 						/>
-					</StackItem>
+					</li>
 				))}
-			</StackHorizontal>
+			</ul>
 		</Unstyled>
 	);
 }