This commit is contained in:
214
sigpro-css.css
214
sigpro-css.css
@@ -94,97 +94,25 @@
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.tab-content-inner {
|
||||
animation: tabFadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transform-origin: top;
|
||||
}
|
||||
|
||||
/* 1. El contenedor manda */
|
||||
.input-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
/* 2. El label de DaisyUI debe ocupar todo el ancho */
|
||||
.input-container .input {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 3. El panel flotante */
|
||||
.input-content {
|
||||
position: absolute;
|
||||
top: 100%; /* Justo debajo */
|
||||
left: 0;
|
||||
right: 0; /* Esto lo obliga a estirarse de izquierda a derecha */
|
||||
z-index: 50;
|
||||
background: oklch(var(--b1)); /* Fondo del tema */
|
||||
border: 1px solid oklch(var(--bc) / 0.2);
|
||||
border-radius: var(--rounded-box, 1rem);
|
||||
margin-top: 0.25rem;
|
||||
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
|
||||
overflow: hidden; /* Para que el 'menu' no se salga de los bordes redondeados */
|
||||
}
|
||||
|
||||
/* 4. La lista interna */
|
||||
.input-content .menu {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@keyframes tabFadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: scaleY(0.95);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: scaleY(1);
|
||||
}
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
@keyframes fade-in {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(-8px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fade-out {
|
||||
from {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
transform: translateY(-8px);
|
||||
}
|
||||
}
|
||||
|
||||
.animate-fade-in {
|
||||
animation: fade-in 0.15s ease-out forwards;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* sigpro-ui daisyUI classes - extracted from components */
|
||||
|
||||
/* join join-vertical lg:join-horizontal divider divider-horizontal validator validator-hint glass */
|
||||
|
||||
/* Icons */
|
||||
/* .icon-[lucide--calendar] .icon-[lucide--chevrons-left] .icon-[lucide--chevron-left] .icon-[lucide--chevron-right] .icon-[lucide--chevrons-right] .icon-[lucide--info] .icon-[lucide--check-circle] .icon-[lucide--alert-triangle] .icon-[lucide--alert-circle] .icon-[lucide--heart] */
|
||||
/* .icon-[lucide--upload], .icon-[lucide--x], .icon-[lucide--text], .icon-[lucide--lock], .icon-[lucide--calendar], .icon-[lucide--hash], .icon-[lucide--mail], .icon-[lucide--search], .icon-[lucide--phone], .icon-[lucide--link], .icon-[lucide--eye-off], .icon-[lucide--eye] */
|
||||
|
||||
/* Accordion */
|
||||
/* .input, .input-bordered, .input-ghost, .input-primary, .input-secondary, .input-accent, .input-info, .input-success, .input-warning, .input-error, .input-xs, .input-sm, .input-md, .input-lg, .floating-label, */
|
||||
|
||||
/* Alert */
|
||||
/* .alert, .alert-info, .alert-success, .alert-warning, .alert-error, .alert-soft, .alert-outline, .alert-dash, */
|
||||
/* .icon-[lucide--info], .icon-[lucide--check-circle], .icon-[lucide--alert-triangle], .icon-[lucide--alert-circle], */
|
||||
|
||||
/* Avatar */
|
||||
/* .avatar .avatar-group .avatar-online .avatar-offline .avatar-placeholder */
|
||||
|
||||
/* Breadcrumbs */
|
||||
/* .breadcrumbs */
|
||||
|
||||
/* Autocomplete */
|
||||
/* .menu, .menu-dropdown, .menu-dropdown-show, */
|
||||
@@ -203,9 +131,6 @@
|
||||
|
||||
/* Colorpicker */
|
||||
|
||||
/* Datepicker */
|
||||
/* .icon-[lucide--calendar], .icon-[lucide--chevrons-left], .icon-[lucide--chevron-left], .icon-[lucide--chevron-right], .icon-[lucide--chevrons-right], */
|
||||
|
||||
/* Drawer */
|
||||
/* .drawer, .drawer-end .drawer-toggle, .drawer-content, .drawer-side, .drawer-overlay, */
|
||||
|
||||
@@ -218,15 +143,11 @@
|
||||
/* Fieldset */
|
||||
/* .fieldset, .fieldset-legend, */
|
||||
|
||||
/* Fileinput */
|
||||
/* .icon-[lucide--upload], .icon-[lucide--x], */
|
||||
|
||||
/* Indicator */
|
||||
/* .indicator, .indicator-item, */
|
||||
|
||||
/* Input */
|
||||
/* .input, .input-bordered, .input-ghost, .input-primary, .input-secondary, .input-accent, .input-info, .input-success, .input-warning, .input-error, .input-xs, .input-sm, .input-md, .input-lg, .floating-label, */
|
||||
/* .icon-[lucide--text], .icon-[lucide--lock], .icon-[lucide--calendar], .icon-[lucide--hash], .icon-[lucide--mail], .icon-[lucide--search], .icon-[lucide--phone], .icon-[lucide--link], .icon-[lucide--eye-off], .icon-[lucide--eye], */
|
||||
|
||||
/* List */
|
||||
/* .list, .list-row, .list-bullet, .list-image, .list-none, */
|
||||
@@ -269,127 +190,12 @@
|
||||
|
||||
/* Tabs */
|
||||
/* .tabs, .tabs-box, .tabs-lift, .tabs-border, .tab, .tab-content, */
|
||||
/* .icon-[lucide--x], */
|
||||
|
||||
/* Timeline */
|
||||
/* .timeline, .timeline-vertical, .timeline-horizontal, .timeline-compact, .timeline-start, .timeline-middle, .timeline-end, .timeline-box, */
|
||||
/* .icon-[lucide--info], .icon-[lucide--check-circle], .icon-[lucide--alert-triangle], .icon-[lucide--alert-circle], */
|
||||
|
||||
/* Toast */
|
||||
/* .icon-[lucide--x], */
|
||||
|
||||
/* Tooltip */
|
||||
/* .tooltip, .tooltip-top, .tooltip-bottom, .tooltip-left, .tooltip-right, .tooltip-primary, .tooltip-secondary, .tooltip-accent, .tooltip-info, .tooltip-success, .tooltip-warning, .tooltip-error, .tooltip-open, */
|
||||
|
||||
/* ===== Tailwind ===== */
|
||||
|
||||
/* Background */
|
||||
/* .bg-base-100, .bg-base-200, .bg-base-content, .bg-primary, .bg-primary/10, .bg-secondary, */
|
||||
|
||||
/* Border */
|
||||
/* .border, .border-2, .border-base-300, .border-base-content/20, .border-dashed, .border-primary, */
|
||||
|
||||
/* Bottom */
|
||||
/* .bottom-6, */
|
||||
|
||||
/* Cursor */
|
||||
/* .cursor-pointer, */
|
||||
|
||||
/* Duration */
|
||||
/* .duration-200, .duration-300, */
|
||||
|
||||
/* Flex */
|
||||
/* .flex, .flex-1, .flex-col, .flex-col-reverse, */
|
||||
|
||||
/* Font */
|
||||
/* .font-black, .font-bold, .font-medium, */
|
||||
|
||||
/* Grid */
|
||||
/* .grid, .grid-cols-7, .grid-cols-8, */
|
||||
|
||||
/* Height */
|
||||
/* .h-12, .min-h-full, */
|
||||
|
||||
/* Inset */
|
||||
/* .inset-0, */
|
||||
|
||||
/* Items */
|
||||
/* .items-center, .items-end, */
|
||||
|
||||
/* Justify */
|
||||
/* .justify-between, .justify-start, */
|
||||
|
||||
/* Left */
|
||||
/* .left-0, */
|
||||
|
||||
/* Loading */
|
||||
/* .loading, .loading-spinner, */
|
||||
|
||||
/* Max Height */
|
||||
/* .max-h-60, */
|
||||
|
||||
/* Opacity */
|
||||
/* .opacity-0, .opacity-40, .opacity-50, .opacity-60, .opacity-70, */
|
||||
|
||||
/* Overflow */
|
||||
/* .overflow-x-auto, .overflow-y-auto, */
|
||||
|
||||
/* Padding */
|
||||
/* .p-2, .p-3, .p-4, .p-6, */
|
||||
|
||||
/* Pointer events */
|
||||
/* .pointer-events-auto, .pointer-events-none, */
|
||||
|
||||
/* Position */
|
||||
/* .absolute, .fixed, .relative, */
|
||||
|
||||
/* Right */
|
||||
/* .right-0, */
|
||||
|
||||
/* Rounded */
|
||||
/* .rounded-box, .rounded-lg, */
|
||||
|
||||
/* Shadow */
|
||||
/* .shadow-2xl, .shadow-lg, .shadow-sm, .shadow-xl, */
|
||||
|
||||
/* Shrink */
|
||||
/* .shrink-0, */
|
||||
|
||||
/* Space */
|
||||
/* .space-y-1, */
|
||||
|
||||
/* Spacing */
|
||||
/* .gap-1, .gap-2, .gap-3, */
|
||||
|
||||
/* Text */
|
||||
/* .text-center, .text-error, .text-left, .text-lg, .text-primary-content, .text-right, .text-secondary, .text-sm, .text-xl, .text-xs, */
|
||||
|
||||
/* Text custom */
|
||||
/* .text-[10px], */
|
||||
|
||||
/* Top */
|
||||
/* .top-0, */
|
||||
|
||||
/* Transform */
|
||||
/* .translate-x-10, */
|
||||
|
||||
/* Transition */
|
||||
/* .transition-all, */
|
||||
|
||||
/* Truncate */
|
||||
/* .truncate, */
|
||||
|
||||
/* Width */
|
||||
/* .w-full, .w-52, .w-64, .w-80, */
|
||||
|
||||
/* Z-index */
|
||||
/* .z-100, .z-50, .z-90, .z-[100], .z-[9999], */
|
||||
|
||||
/* Tailwind variants */
|
||||
/* .hover:bg-base-200, */
|
||||
|
||||
/* Misc */
|
||||
/* .active, .hr, .label, .label-text, */
|
||||
|
||||
/* Icons */
|
||||
/* .icon-[lucide--heart] */
|
||||
|
||||
Reference in New Issue
Block a user