📝 docs: add vertical tabs to the example page

packages/frontend/src/components/shared/Button/Button.theme.ts

@@ -118,29 +118,6 @@ export const buttonTheme = tv(
           'disabled:border-transparent',
           'disabled:shadow-none',
         ],
-        link: [
-          'p-0',
-          'gap-1.5',
-          'text-elements-link',
-          'rounded',
-          'focus-ring',
-          'hover:underline',
-          'hover:text-elements-link-hovered',
-          'disabled:text-controls-disabled',
-          'disabled:hover:no-underline',
-        ],
-        'link-emphasized': [
-          'p-0',
-          'gap-1.5',
-          'text-elements-high-em',
-          'rounded',
-          'underline',
-          'focus-ring',
-          'hover:text-elements-link-hovered',
-          'disabled:text-controls-disabled',
-          'disabled:hover:no-underline',
-          'dark:text-elements-on-high-contrast',
-        ],
         unstyled: [],
       },
     },

packages/frontend/src/pages/components/index.tsx

@@ -7,11 +7,7 @@ import {
 } from './renders/checkbox';
 import { avatars, avatarsFallback } from './renders/avatar';
 import { renderBadges } from './renders/badge';
-import {
-  renderButtonIcons,
-  renderButtons,
-  renderLinks,
-} from './renders/button';
+import { renderButtonIcons, renderButtons } from './renders/button';
 import {
   renderTabWithBadges,
   renderTabs,
@@ -116,16 +112,6 @@ const Page = () => {
             <h1 className="text-2xl font-bold">Vertical Tabs</h1>
             {renderVerticalTabs()}
           </div>
-
-          <div className="w-full h border border-gray-200 px-20 my-10" />
-
-          {/* Link */}
-          <div className="flex flex-col gap-10 items-center justify-between">
-            <h1 className="text-2xl font-bold">Link</h1>
-            <div className="flex gap-4 items-center justify-center">
-              {renderLinks()}
-            </div>
-          </div>
         </div>
       </div>
     </div>

packages/frontend/src/pages/components/renders/button.tsx

@@ -47,19 +47,3 @@ export const renderButtonIcons = () => {
     </div>
   ));
 };
-
-export const renderLinks = () => {
-  return ['link', 'link-emphasized', 'disabled'].map((variant) => (
-    <Button
-      variant={
-        variant !== 'disabled' ? (variant as ButtonTheme['variant']) : 'link'
-      }
-      key={variant}
-      leftIcon={<PlusIcon />}
-      rightIcon={<PlusIcon />}
-      disabled={variant === 'disabled'}
-    >
-      Link
-    </Button>
-  ));
-};