Browse Source

fix(@vben-core/shadcn-ui): 修复 Input 组件 focus 时边框被父容器 overflow hidden 裁剪

pull/7894/head
Yanghai.Lin 5 months ago
parent
commit
150eab7911
  1. 6
      packages/@core/ui-kit/shadcn-ui/src/ui/input/Input.vue

6
packages/@core/ui-kit/shadcn-ui/src/ui/input/Input.vue

@ -24,7 +24,7 @@ const modelValue = useVModel(props, 'modelValue', emits, {
v-model="modelValue" v-model="modelValue"
:class=" :class="
cn( cn(
'border-input bg-background ring-offset-background placeholder:text-muted-foreground/50 focus-visible:ring-ring flex h-10 w-full rounded-md border px-3 py-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-1 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50', 'border-input bg-background ring-offset-background placeholder:text-muted-foreground/50 focus-visible:outline-none flex h-10 w-full rounded-md border px-3 py-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:cursor-not-allowed disabled:opacity-50',
props.class, props.class,
) )
" "
@ -34,6 +34,10 @@ const modelValue = useVModel(props, 'modelValue', emits, {
input { input {
--ring: var(--primary); --ring: var(--primary);
&:focus-visible {
box-shadow: inset 0 0 0 1px hsl(var(--ring));
}
&::-ms-reveal, &::-ms-reveal,
&::-ms-clear { &::-ms-clear {
display: none; display: none;

Loading…
Cancel
Save