Afiq eab2ca3647 Add Searchable Select Component and Update Styles
- Introduced a new 'searchSelect' component to the form builder, allowing users to search and select options from a dropdown.
- Updated FormBuilderComponents.vue to include the new searchable select component with default properties and options.
- Enhanced form validation rules in various components to support the new searchable select input type.
- Adjusted z-index values in multiple components and styles for improved layering and visibility.
- Refined CSS styles for modal and header components to ensure consistent appearance across the application.
2025-08-06 21:34:56 +08:00

43 lines
962 B
CSS

body {
color: rgb(var(--text-color));
background-color: rgb(var(--bg-1));
}
.w-header {
@apply z-[1000] fixed top-0 right-0 px-5 py-3 duration-300 shadow-md;
background-color: rgb(var(--bg-2));
box-shadow: var(--box-shadow);
}
.w-header-search {
@apply px-4 z-40 duration-300 shadow-md -top-20 focus-within:top-0 right-0;
background-color: rgb(var(--bg-2));
}
.vertical-menu {
@apply text-base h-screen fixed w-64 top-0 z-50 duration-300 border-l-0 shadow-md;
background-color: rgb(var(--bg-2));
box-shadow: var(--box-shadow);
}
.icon-btn {
@apply flex
items-center
justify-center
transition-colors
duration-300;
color: rgb(var(--text-color));
}
.icon-btn.profile {
@apply border;
border-radius: var(--rounded-box);
border: 1px solid rgb(var(--border-color));
color: rgb(var(--text-color));
}
.icon-btn:hover {
color: rgb(var(--text-color));
background-color: rgb(var(--bg-1));
}