Merge pull request #332 from aversini/docs-trying-to-deploy-preview-o…

…n-PR

docs: trying to deploy preview on PR

.github/workflows/deploy-pages.yml

@@ -41,7 +41,6 @@ jobs:
           pnpm install
           npx lerna run build --ignore @versini/documentation
           npx lerna run build:ci --scope=@versini/documentation
-
       - name: Setup Pages
         if: ${{ always() }}
         uses: actions/configure-pages@v4

packages/documentation/.ladle/config.mjs

@@ -1,7 +1,6 @@
 /** @type {import('@ladle/react').UserConfig} */
 
 export default {
-	base: "/ui-components/",
 	port: 8080,
 	defaultStory: "getting-started--overview",
 	storyOrder: [

packages/documentation/src/GettingStarted/overview.stories.mdx

@@ -11,16 +11,32 @@ import {
 
 # UI Components
 
-> UI Components provides a strong, responsive, and accessible library of foundational React components.
+<Flexgrid alignVertical="center">
+	<FlexgridItem span={6}>
+		> UI Components provides a strong, responsive, and accessible library of
+		foundational React components.
 
-<img
-	className="mt-5"
-	src="hero-13.jpg"
-	alt="An illustration of web page rendered on both desktop and mobile devices."
-	title="Hero image of a web page rendered on both desktop and mobile devices."
-	height={300}
-	width={300}
-/>
+    <ButtonIcon
+    	spacing={{ t: 8 }}
+    	labelLeft="Installation"
+    	noBorder
+    	onClick={linkTo("getting-started--installation")}
+    >
+    	<IconNext decorative monotone />
+    </ButtonIcon>
+
+  </FlexgridItem>
+  <FlexgridItem>
+		<img
+			className="mt-5"
+			src="hero-14.jpg"
+			alt="An illustration of web page rendered on both desktop and mobile devices."
+			title="Hero image of a web page rendered on both desktop and mobile devices."
+			height={400}
+			width={400}
+		/>
+  </FlexgridItem>
+</Flexgrid>
 
 ## Features
 
@@ -62,14 +78,3 @@ import {
 		</li>
 	</ul>
 </div>
-
-<div className="not-docs-typography mt-8">
-	<Flexgrid alignHorizontal="flex-end">
-		<FlexgridItem>
-			<ButtonIcon labelLeft="Installation" noBorder onClick={linkTo("getting-started--installation")}>
-				<IconNext decorative monotone />
-    		</ButtonIcon>
-    	</FlexgridItem>
-    </Flexgrid>
-
-</div>