how to remove the "border" around the shadcn select when the cursor is inside
I have a select which I only want a dropdown arrow and a line beneath. I manage to remove the top/left/right borders. Even when I dropdown the select, there is no border. However, when the dropdown is close and the cursor is in the text, a black border shows up.
How do I remove this border ?
Thanks very much !
Solution
Try to remove ring, add class to SelectTrigger as below:
class="ring-0 focus:ring-0"
- how to remove the "border" around the shadcn select when the cursor is inside
- Reset SELECT value for ShadCN/UI <Select> component
- Type assignment error in array of object: Typescript, Dynamic Forms using Shadcn UI, React hook form and ZOD
- Server action function not being called Nextjs Shadcn React hook form
- Ignore Tailwind CSS dark attribute
- Why do I get "npm ERR! code ENOENT" when trying to install shadcn ui
- Can not change state from Dialog button onClick event
- What does slash doing in css class as "group/indicator"
- Data-table Filters not working in shadcn-ui/radix-ui dialog component
- How to use absolute positioning in Shadcn Accordion?
- Tailwind CSS is not being applied in Shadcn component
- Shadcn ui select component state not updating after change
- FormMessage not displaying zod validation error - Shadcn, Zod, react-hook-form, Next.js
- Shadcn/ui Tooltip around Button causes form validation
- Shadcn select default value
- Sheet component from shadcn ui does not close
- Shadcn ui property 'open' does not exist for Sheet component
- "A component is changing an uncontrolled input to be controlled" on the browser console
- How to properly style shadcn/ui library Button component?
- useState not retaining the values while using the same common form for register and login using selective rendering
- Prevent closing of shadcn Sheet component based on a certain condition
- Why is hot reloading extremely slow in my Next.js 14 project with TailwindCSS, Shadcn, and React Icons?
- Schema validation with Zod - Vue 3
- Next js 14 & ShadCN Error: Hydration failed because the initial UI does not match what was rendered on the server
- How to work with Shadcn/ui error messages for an array of FormFields
- Error when submitting dependent select components with ShadCN/react-hook-form. How to use custom change functions
- Modal doesn't close on submission
- Input loses focus when Popover opens in ShadCN
- Nextjs 14 server side actions with Shadcn form
- how to hide the X at the top of the shadcn dialog box?