chore: renaming storybook examples

bootwindui · Feb 17, 2024 · aeff047 · aeff047
1 parent 5eaa75e
commit aeff047
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 31 deletions.
diff --git a/packages/ui/src/stories/examples/DataDisplay.stories.tsx b/packages/ui/src/stories/examples/DataDisplay.stories.tsx
@@ -4,13 +4,13 @@ import { Table, TableBody, TableCell, TableRow } from '@bootwind/table'
 import { HiPaperClip } from 'react-icons/hi2'
 
 export default {
-    title: 'Examples/DataDisplay',
+    title: '❖ • Examples/Data Display',
     argTypes: {},
 } as Meta;
 
 export const CardWithTable = () => {
     return (
-        <Card noPadding title="Applicant Information" className="max-w-[800px] overflow-hidden" subtitle="Personal details and application."  cardHeaderBorder>
+        <Card noPadding title="Applicant Information" className="max-w-[800px] overflow-hidden" subtitle="Personal details and application." cardHeaderBorder>
             <Table variant="striped">
                 <TableBody>
                     <TableRow>
@@ -35,7 +35,7 @@ export const CardWithTable = () => {
                             <ul>
                                 <li className="flex between items-center gap-2 justify-between">
                                     <div className="name flex items-center">
-                                        <HiPaperClip/>
+                                        <HiPaperClip />
                                         <span>resume_backend_developer.zip</span>
                                     </div>
                                     <a href="#">Download</a>
@@ -48,4 +48,3 @@ export const CardWithTable = () => {
         </Card>
     )
 }
-
diff --git a/packages/ui/src/stories/examples/Footer.stories.tsx b/packages/ui/src/stories/examples/Footer.stories.tsx
@@ -7,7 +7,7 @@ import { Input } from '@bootwind/forms'
 import { Button } from '@bootwind/button'
 
 export default {
-    title: 'Examples/Footer',
+    title: '❖ • Examples/Footer',
     argTypes: {},
 } as Meta;
 
@@ -30,13 +30,13 @@ export const FooterWithNewsletter = () => {
                                         <h4>{menu}</h4>
                                     </div>
                                     <div className="footer-menu-items ">
-                                            {menus[menu as keyof typeof menus].map(item => {
-                                                return (
-                                                    <div className="footer-menu-item mb-5">
-                                                        <a href="#" className="color-default">{item}</a>
-                                                    </div>
-                                                )
-                                            })}
+                                        {menus[menu as keyof typeof menus].map(item => {
+                                            return (
+                                                <div className="footer-menu-item mb-5">
+                                                    <a href="#" className="color-default">{item}</a>
+                                                </div>
+                                            )
+                                        })}
                                     </div>
                                 </div>
                             ))
@@ -45,7 +45,7 @@ export const FooterWithNewsletter = () => {
                     <div className="footer-newsletter">
                         <h4 className="font-bold text-lg mb-5">Newsletter</h4>
                         <p className="mb-8">Be the first one to know  about discounts, offers and events. Unsubscribe whenever you like.</p>
-                        <Input placeholder="Enter your email" leftSection={<HiEnvelope/>} rightSection={<Button className="mr-9">Submit</Button>}></Input>
+                        <Input placeholder="Enter your email" leftSection={<HiEnvelope />} rightSection={<Button className="mr-9">Submit</Button>}></Input>
                     </div>
                 </section>
                 <section className="footer-copyright text-center py-5">
@@ -59,14 +59,14 @@ const SocialMediaIcons = () => (
     <div className="social-media">
         <ul className="flex gap-3">
             {
-            [<BiLogoFacebookCircle/>, <BiLogoYoutube/>, <BiLogoDribbble/>, <BiLogoFigma/>, <BiLogoWhatsapp/>].map(logo => {
-                return (
-                <li>
-                    <a href="#" className="p-3 bg-indigo-100 block rounded-full">
-                        {logo}
-                    </a>
-                </li>
-                )
+                [<BiLogoFacebookCircle />, <BiLogoYoutube />, <BiLogoDribbble />, <BiLogoFigma />, <BiLogoWhatsapp />].map(logo => {
+                    return (
+                        <li>
+                            <a href="#" className="p-3 bg-indigo-100 block rounded-full">
+                                {logo}
+                            </a>
+                        </li>
+                    )
                 })
             }
         </ul>
@@ -81,9 +81,9 @@ export const FooterWithLogo = () => {
                     <div className="footer-left pr-48">
                         <h4 className="font-bold text-lg mb-5">Logo</h4>
                         <p className="mb-8">
-                        We ara a lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat... Read More
+                            We ara a lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat... Read More
                         </p>
-                        <SocialMediaIcons/>
+                        <SocialMediaIcons />
                     </div>
                     <div className="footer-menus grid lg:grid-cols-3">
                         {
@@ -93,13 +93,13 @@ export const FooterWithLogo = () => {
                                         <h4>{menu}</h4>
                                     </div>
                                     <div className="footer-menu-items ">
-                                            {menus[menu as keyof typeof menus].map(item => {
-                                                return (
-                                                    <div className="footer-menu-item mb-5">
-                                                        <a href="#" className="color-default">{item}</a>
-                                                    </div>
-                                                )
-                                            })}
+                                        {menus[menu as keyof typeof menus].map(item => {
+                                            return (
+                                                <div className="footer-menu-item mb-5">
+                                                    <a href="#" className="color-default">{item}</a>
+                                                </div>
+                                            )
+                                        })}
                                     </div>
                                 </div>
                             ))

diff --git a/packages/ui/src/stories/examples/TablePagination.stories.tsx b/packages/ui/src/stories/examples/TablePagination.stories.tsx
@@ -17,7 +17,7 @@ const columns = [
 ];
 
 export default {
-  title: 'Examples/Table with Pagination',
+  title: '❖ • Examples/Table with Pagination',
   component: Pagination,
   argTypes: {},
 } as Meta;