@start-base/start-ui
Version:
<p align="center"> <a href="https://startbase.dev" target="_blank"> <img src="https://startbase.dev/apple-touch-icon.png" width="60px" style="padding-top: 60px" /> </a> </p>
1 lines • 9.78 kB
CSS
.SUI-Toggle-module-root-D8-kB{align-items:center;border:1px solid var(--sui-transparent);border-radius:.375rem;cursor:pointer;display:inline-flex;font-family:var(--sui-font-family);font-weight:500;gap:1rem;justify-content:center;overflow:hidden;transition:var(--sui-transition);width:max-content}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-primary-h-i1b.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-toggled-YNu2n{background-color:var(--sui-toggle-primary-default-bg);color:var(--sui-toggle-primary-default-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-primary-h-i1b.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-toggled-YNu2n:hover{background-color:var(--sui-toggle-primary-default-hover-bg)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-primary-h-i1b.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-untoggled-rUL1M{background-color:var(--sui-transparent);color:var(--sui-toggle-primary-default-bg)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-primary-h-i1b.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-untoggled-rUL1M:hover{background-color:var(--sui-toggle-primary-default-hover-bg);color:var(--sui-toggle-primary-default-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-secondary-55MCx.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-toggled-YNu2n{background-color:var(--sui-toggle-secondary-default-bg);color:var(--sui-toggle-secondary-default-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-secondary-55MCx.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-toggled-YNu2n:hover{background-color:var(--sui-toggle-secondary-default-hover-bg)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-secondary-55MCx.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-untoggled-rUL1M{background-color:var(--sui-transparent);color:var(--sui-toggle-secondary-default-bg)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-secondary-55MCx.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-untoggled-rUL1M:hover{background-color:var(--sui-toggle-secondary-default-hover-bg);color:var(--sui-toggle-secondary-default-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-destructive-gayD7.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-toggled-YNu2n{background-color:var(--sui-toggle-destructive-default-bg);color:var(--sui-toggle-destructive-default-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-destructive-gayD7.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-toggled-YNu2n:hover{background-color:var(--sui-toggle-destructive-default-hover-bg)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-destructive-gayD7.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-untoggled-rUL1M{background-color:var(--sui-transparent);color:var(--sui-toggle-destructive-default-bg)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-destructive-gayD7.SUI-Toggle-module-default-4hR0n.SUI-Toggle-module-untoggled-rUL1M:hover{background-color:var(--sui-toggle-destructive-default-hover-bg);color:var(--sui-toggle-destructive-default-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-primary-h-i1b.SUI-Toggle-module-outline-mSn3s{border:1px solid var(--sui-toggle-primary-outline-border)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-primary-h-i1b.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-toggled-YNu2n{background-color:var(--sui-toggle-primary-outline-bg);color:var(--sui-toggle-primary-outline-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-primary-h-i1b.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-toggled-YNu2n:hover,.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-primary-h-i1b.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-untoggled-rUL1M:hover{background-color:var(--sui-toggle-primary-outline-hover-bg);color:var(--sui-toggle-primary-outline-hover-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-secondary-55MCx.SUI-Toggle-module-outline-mSn3s{border:1px solid var(--sui-toggle-secondary-outline-border)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-secondary-55MCx.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-toggled-YNu2n{background-color:var(--sui-toggle-secondary-outline-bg);color:var(--sui-toggle-secondary-outline-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-secondary-55MCx.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-toggled-YNu2n:hover{background-color:var(--sui-toggle-secondary-outline-hover-bg);color:var(--sui-toggle-secondary-outline-hover-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-secondary-55MCx.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-untoggled-rUL1M{background-color:var(--sui-transparent);color:var(--sui-toggle-secondary-outline-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-secondary-55MCx.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-untoggled-rUL1M:hover{background-color:var(--sui-toggle-secondary-outline-hover-bg);color:var(--sui-toggle-secondary-outline-hover-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-destructive-gayD7.SUI-Toggle-module-outline-mSn3s{border:1px solid var(--sui-toggle-destructive-outline-border)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-destructive-gayD7.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-toggled-YNu2n{background-color:var(--sui-toggle-destructive-outline-bg);color:var(--sui-toggle-destructive-outline-hover-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-destructive-gayD7.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-toggled-YNu2n:hover{background-color:var(--sui-toggle-destructive-outline-hover-bg);color:var(--sui-toggle-destructive-outline-hover-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-destructive-gayD7.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-untoggled-rUL1M{background-color:var(--sui-transparent);color:var(--sui-toggle-destructive-outline-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-destructive-gayD7.SUI-Toggle-module-outline-mSn3s.SUI-Toggle-module-untoggled-rUL1M:hover{background-color:var(--sui-toggle-destructive-outline-hover-bg);color:var(--sui-toggle-destructive-outline-hover-text)}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-small-nIJln{font-size:.75rem;height:24px;min-width:64px;padding:.375rem .75rem}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-medium-xuc5B{font-size:.875rem;height:36px;min-width:128px;padding:.5rem 1rem}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-large-cc7wQ{font-size:1rem;height:48px;min-width:192px;padding:.75rem 1.5rem}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-fluid-N2aHr{width:100%}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-disabled-6Mb3X{cursor:not-allowed;opacity:.4}.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-disabled-6Mb3X,.SUI-Toggle-module-root-D8-kB.SUI-Toggle-module-disabled-6Mb3X:hover{background-color:var(--sui-toggle-disabled-bg);color:var(--sui-toggle-disabled-text)}.light,:root,[data-theme=light]{--sui-toggle-primary-default-bg:var(--sui-black);--sui-toggle-primary-default-text:var(--sui-white);--sui-toggle-primary-default-hover-bg:var(--sui-gray-750);--sui-toggle-secondary-default-bg:var(--sui-gray-200);--sui-toggle-secondary-default-text:var(--sui-black);--sui-toggle-secondary-default-hover-bg:var(--sui-gray-100);--sui-toggle-destructive-default-bg:var(--sui-error);--sui-toggle-destructive-default-text:var(--sui-white);--sui-toggle-destructive-default-hover-bg:var(--sui-error-800);--sui-toggle-primary-outline-border:var(--sui-gray-800);--sui-toggle-primary-outline-hover-bg:var(--sui-gray-800);--sui-toggle-primary-outline-bg:var(--sui-gray-800);--sui-toggle-primary-outline-hover-text:var(--sui-white);--sui-toggle-primary-outline-text:var(--sui-white);--sui-toggle-secondary-outline-text:var(--sui-black);--sui-toggle-secondary-outline-hover-text:var(--sui-black);--sui-toggle-secondary-outline-border:var(--sui-gray-200);--sui-toggle-secondary-outline-bg:var(--sui-gray-200);--sui-toggle-secondary-outline-hover-bg:var(--sui-gray-200);--sui-toggle-destructive-outline-text:var(--sui-error-800);--sui-toggle-destructive-outline-hover-text:var(--sui-white);--sui-toggle-destructive-outline-border:var(--sui-error-200);--sui-toggle-destructive-outline-hover-bg:var(--sui-error-800);--sui-toggle-destructive-outline-bg:var(--sui-error-800);--sui-toggle-disabled-bg:var(--sui-gray-600);--sui-toggle-disabled-text:var(--sui-black)}.dark,[data-theme=dark]{--sui-toggle-primary-default-bg:var(--sui-gray-100);--sui-toggle-primary-default-text:var(--sui-black);--sui-toggle-primary-default-hover-bg:var(--sui-gray-200);--sui-toggle-secondary-default-bg:var(--sui-gray-700);--sui-toggle-secondary-default-text:var(--sui-white);--sui-toggle-secondary-default-hover-bg:var(--sui-gray-750);--sui-toggle-destructive-default-bg:var(--sui-error-dark-650);--sui-toggle-destructive-default-text:var(--sui-white);--sui-toggle-destructive-default-hover-bg:var(--sui-error-dark-600);--sui-toggle-primary-outline-border:var(--sui-gray-100);--sui-toggle-primary-outline-hover-bg:var(--sui-gray-100);--sui-toggle-primary-outline-bg:var(--sui-gray-100);--sui-toggle-primary-outline-hover-text:var(--sui-black);--sui-toggle-primary-outline-text:var(--sui-black);--sui-toggle-secondary-outline-text:var(--sui-gray-100);--sui-toggle-secondary-outline-hover-text:var(--sui-gray-100);--sui-toggle-secondary-outline-border:var(--sui-gray-500);--sui-toggle-secondary-outline-bg:var(--sui-gray-400);--sui-toggle-secondary-outline-hover-bg:var(--sui-gray-500);--sui-toggle-destructive-outline-text:var(--sui-error);--sui-toggle-destructive-outline-hover-text:var(--sui-white);--sui-toggle-destructive-outline-hover-bg:var(--sui-error-dark-600);--sui-toggle-destructive-outline-bg:var(--sui-error-dark-600);--sui-toggle-destructive-outline-border:var(--sui-error-800);--sui-toggle-destructive-outline-hover-border:var(--sui-error-dark-600);--sui-toggle-disabled-bg:var(--sui-gray-600);--sui-toggle-disabled-text:var(--sui-white)}