Prefer gap over space for SectionListItemButton and SectionListItemLi…

…nk (#290) * fix theme reference of SectionListItem stories * use gap instead of space utilities for SectionListItemButton and SectionListItemLink
aboutbits · Sep 20, 2023 · b5cbb7f · b5cbb7f
1 parent 61b7e31
commit b5cbb7f
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/src/components/section/SectionItem/SectionListItemButton.stories.mdx b/src/components/section/SectionItem/SectionListItemButton.stories.mdx
@@ -35,7 +35,7 @@ export const Template = ({ children, ...args }) => {
 
 
 
-<Theme component="section" items={['listItemButton']} />
+<Theme component="section" items={['listItemButtonLink']} />
 
 ## Example: Usage within Section
 

diff --git a/src/components/section/SectionItem/SectionListItemLink.stories.mdx b/src/components/section/SectionItem/SectionListItemLink.stories.mdx
@@ -32,7 +32,7 @@ export const Template = ({ children, ...args }) => {
 
 
 
-<Theme component="section" items={['listItemLink']} />
+<Theme component="section" items={['listItemButtonLink']} />
 
 ## Example: Usage within Section
 

diff --git a/src/components/section/theme.ts b/src/components/section/theme.ts
@@ -39,7 +39,7 @@ export default {
     },
   },
   listItemButtonLink: {
-    base: 'block w-full focus:outline-neutral-800 justify-between space-x-4 hover:bg-neutral-100 active:bg-neutral-100',
+    base: 'w-full focus:outline-neutral-800 justify-between gap-4 hover:bg-neutral-100 active:bg-neutral-100',
     icon: 'fill-current',
   },
   subsectionTitle: {
Original file line number	Diff line number	Diff line change
Expand Up		@@ -35,7 +35,7 @@ export const Template = ({ children, ...args }) => {



		<Theme component="section" items={['listItemButton']} />
		<Theme component="section" items={['listItemButtonLink']} />

		## Example: Usage within Section

Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -32,7 +32,7 @@ export const Template = ({ children, ...args }) => {



		<Theme component="section" items={['listItemLink']} />
		<Theme component="section" items={['listItemButtonLink']} />

		## Example: Usage within Section

Expand Down