welcome-ui/dist/Search.css

Customizable design system with react, typescript, tailwindcss and ariakit.

@layer components{._wrapper_8nhuz_2{position:relative}._indicators_8nhuz_5{position:absolute;padding:0;top:0;height:var(--search-height, 100%);right:var(--indicators-right, 0);display:flex;gap:var(--spacing-xs)}._dropdown-indicator_8nhuz_14{position:relative;height:100%;width:var(--search-clear-size);padding:0;outline:none!important;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;background:transparent;display:flex;align-items:center;justify-content:center}._input-wrapper_8nhuz_27{position:relative}._input-wrapper_8nhuz_27:has(>._icon-placement-right_8nhuz_30) ._indicators_8nhuz_5{--indicators-right: calc((var(--search-icon-size, 1rem) + var(--spacing-sm)))}._root_8nhuz_33{background-color:var(--search-background-color, var(--color-neutral-10));border-color:var(--search-border-color, var(--color-neutral-30));border-radius:var(--radius-md);border-style:solid;border-width:var(--border-width-sm);color:var(--search-text-color, var(--color-neutral-90));font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);line-height:var(--line-height-16);outline:2px solid var(--search-outline-color, transparent);cursor:default;width:100%;transition-property:all;transition-timing-function:var(--timing-primary);transition-duration:var(--duration-medium);-webkit-appearance:none;-moz-appearance:none;appearance:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:var(--search-height);padding-bottom:var(--search-padding-bottom);padding-left:var(--search-padding-left);padding-right:var(--search-padding-right);padding-top:var(--search-padding-top)}._root_8nhuz_33._icon-placement-left_8nhuz_63{padding-left:calc(var(--search-padding-left) + var(--search-icon-size, 1rem) + var(--spacing-sm))}._root_8nhuz_33._icon-placement-right_8nhuz_30{padding-right:calc(var(--search-padding-right) + (var(--search-icon-size, 1rem) + var(--spacing-sm)) * 2)}._root_8nhuz_33:disabled{--search-background-color: var(--search-color-beige-40);--search-text-color: var(--search-color-beige-70);cursor:not-allowed}._root_8nhuz_33:hover:not([class*=variant]){--search-border-color: var(--color-brand-40)}._root_8nhuz_33:focus:not([class*=variant]){--search-outline-color: var(--color-brand-20);--search-border-color: var(--color-brand-40)}._root_8nhuz_33._transparent_8nhuz_81{--search-border-color: transparent;--search-background-color: transparent}._root_8nhuz_33._transparent_8nhuz_81:hover{--search-border-color: var(--color-neutral-20)}._root_8nhuz_33::placeholder{color:var(--color-neutral-60)}._root_8nhuz_33 br{display:none}._variant-danger_8nhuz_94{--search-border-color: var(--color-red-70);--search-outline-color: var(--color-red-30)}._variant-success_8nhuz_98{--search-border-color: var(--color-green-60);--search-outline-color: var(--color-green-30)}._variant-warning_8nhuz_102{--search-border-color: var(--color-orange-60);--search-outline-color: var(--color-orange-20)}._size-lg_8nhuz_106{--search-height: var(--height-48);--search-clear-size: var(--search-height);--search-padding-bottom: var(--spacing-16);--search-padding-left: var(--spacing-12);--search-padding-right: var(--spacing-12);--search-padding-top: var(--spacing-16)}._size-md_8nhuz_114{--search-height: var(--height-40);--search-clear-size: var(--search-height);--search-padding-bottom: var(--spacing-12);--search-padding-left: var(--spacing-12);--search-padding-right: var(--spacing-12);--search-padding-top: var(--spacing-12)}._size-sm_8nhuz_122{--search-height: var(--height-32);--search-clear-size: var(--search-height);--search-padding-bottom: var(--spacing-8);--search-padding-left: var(--spacing-12);--search-padding-right: var(--spacing-12);--search-padding-top: var(--spacing-8)}._size-xs_8nhuz_130{--search-height: var(--height-24);--search-clear-size: var(--search-height);--search-padding-bottom: var(--spacing-4);--search-padding-left: var(--spacing-8);--search-padding-right: var(--spacing-8);--search-padding-top: var(--spacing-4);--search-icon-size: .75rem}._icon-wrapper_8nhuz_139{position:absolute;top:0;left:var(--icon-placement-left, auto);right:var(--icon-placement-right, auto);bottom:0;display:flex;justify-content:center;align-items:center;pointer-events:none;transition-property:all;transition-timing-function:var(--timing-primary);transition-duration:var(--duration-medium);color:var(--color-neutral-90)}._icon-wrapper_8nhuz_139._icon-placement-left_8nhuz_63{--icon-placement-left: var(--spacing-md)}._icon-wrapper_8nhuz_139._icon-placement-left_8nhuz_63._size-xs_8nhuz_130{--icon-placement-left: var(--spacing-sm)}._icon-wrapper_8nhuz_139._icon-placement-right_8nhuz_30{--icon-placement-right: var(--spacing-md)}._icon-wrapper_8nhuz_139._icon-placement-right_8nhuz_30._size-xs_8nhuz_130{--icon-placement-right: var(--spacing-sm)}._icon-wrapper_8nhuz_139>button{pointer-events:auto}._menu_8nhuz_170{max-height:9.6875rem;background-color:var(--color-neutral-10);border-color:var(--color-neutral-30);border-radius:var(--radius-md);border-style:solid;border-width:var(--border-width-sm);color:var(--color-neutral-90);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);line-height:var(--line-height-16);outline:none;position:absolute;z-index:2;right:0;left:0;margin:0;margin-top:var(--spacing-md);padding:0;transition-property:all;transition-timing-function:var(--timing-primary);transition-duration:var(--duration-medium);overflow:auto;-webkit-overflow-scrolling:touch}._menu_8nhuz_170:hover>*{cursor:pointer}._item_8nhuz_198{color:var(--item-text-color, var(--color-beige-70));cursor:var(--item-cursor, default);padding:var(--spacing-md);list-style:none;text-decoration:none;font-size:var(--font-size-sm);transition-property:background;transition-duration:var(--duration-medium);transition-timing-function:var(--timing-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}._item_8nhuz_198._highlighted_8nhuz_212{background-color:var(--color-beige-20)}._item_8nhuz_198._selected_8nhuz_215{--item-text-color: var(--color-neutral-90);font-weight:var(--font-weight-bold)}._item_8nhuz_198._selected_8nhuz_215._highlighted_8nhuz_212{background-image:linear-gradient(0deg,#00000014,#00000014)}}