Skip to content

Instantly share code, notes, and snippets.

@ehbc221
Last active July 23, 2024 15:56
Show Gist options
  • Save ehbc221/8472ed36759ce6a16fbef0a63e60e0f0 to your computer and use it in GitHub Desktop.
Save ehbc221/8472ed36759ce6a16fbef0a63e60e0f0 to your computer and use it in GitHub Desktop.
Bulk add shadcn components
npx shadcn-ui@latest add accordion && npx shadcn-ui@latest add alert && npx shadcn-ui@latest add alert-dialog && npx shadcn-ui@latest add aspect-ratio && npx shadcn-ui@latest add avatar && npx shadcn-ui@latest add badge && npx shadcn-ui@latest add breadcrumb && npx shadcn-ui@latest add button && npx shadcn-ui@latest add calendar && npx shadcn-ui@latest add card && npx shadcn-ui@latest add carousel && npx shadcn-ui@latest add chart && npx shadcn-ui@latest add checkbox && npx shadcn-ui@latest add collapsible && npx shadcn-ui@latest add command && npx shadcn-ui@latest add context-menu && npx shadcn-ui@latest add table && npm install @tanstack/react-table && npx shadcn-ui@latest add dialog && npx shadcn-ui@latest add drawer && npx shadcn-ui@latest add dropdown-menu && npx shadcn-ui@latest add form && npx shadcn-ui@latest add hover-card && npx shadcn-ui@latest add input && npx shadcn-ui@latest add input-otp && npx shadcn-ui@latest add label && npx shadcn-ui@latest add menubar && npx shadcn-ui@latest add navigation-menu && npx shadcn-ui@latest add pagination && npx shadcn-ui@latest add popover && npx shadcn-ui@latest add progress && npx shadcn-ui@latest add radio-group && npx shadcn-ui@latest add resizable && npx shadcn-ui@latest add scroll-area && npx shadcn-ui@latest add select && npx shadcn-ui@latest add separator && npx shadcn-ui@latest add sheet && npx shadcn-ui@latest add skeleton && npx shadcn-ui@latest add slider && npx shadcn-ui@latest add sonner && npx shadcn-ui@latest add switch && npx shadcn-ui@latest add table && npx shadcn-ui@latest add tabs && npx shadcn-ui@latest add textarea && npx shadcn-ui@latest add toast && npx shadcn-ui@latest add toggle && npx shadcn-ui@latest add toggle-group && npx shadcn-ui@latest add tooltip
@ehbc221
Copy link
Author

ehbc221 commented Jul 23, 2024

For OTP input, add this to tailwind.config.ts:

/** @type {import('tailwindcss').Config} */
module.exports = {
  theme: {
    extend: {
      keyframes: {
        "caret-blink": {
          "0%,70%,100%": { opacity: "1" },
          "20%,50%": { opacity: "0" },
        },
      },
      animation: {
        "caret-blink": "caret-blink 1.25s ease-out infinite",
      },
    },
  },
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment