Files
whatsappNucleo/app/assets/css/main.css
josedario87 b5606b78fc
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 3m19s
fix: Agregar importaciones de Tailwind CSS y Nuxt UI v3
Los estilos no se cargaban porque faltaban las importaciones
requeridas por Nuxt UI v3 que usa Tailwind CSS v4.
2025-12-02 19:17:26 -06:00

98 lines
1.7 KiB
CSS

@import "tailwindcss";
@import "@nuxt/ui";
/* WhatsApp Nucleo - Variables de tema */
:root {
/* WhatsApp colors */
--wa-green-dark: #075e54;
--wa-green-light: #25d366;
--wa-teal: #128c7e;
--wa-blue: #34b7f1;
/* UI colors */
--wa-bg: #111b21;
--wa-bg-light: #202c33;
--wa-bg-lighter: #2a3942;
--wa-surface: #1f2c34;
--wa-border: #2a3942;
--wa-text: #e9edef;
--wa-text-muted: #8696a0;
--wa-text-dark: #667781;
/* Message bubbles */
--wa-bubble-out: #005c4b;
--wa-bubble-in: #202c33;
}
/* Shell base */
.whatsapp-shell {
background-color: var(--wa-bg);
min-height: 100vh;
}
/* Override Nuxt UI dashboard colors */
.whatsapp-shell [class*="UDashboard"] {
--ui-bg: var(--wa-bg);
}
/* Scrollbar styling */
.whatsapp-shell ::-webkit-scrollbar {
width: 6px;
}
.whatsapp-shell ::-webkit-scrollbar-track {
background: var(--wa-bg);
}
.whatsapp-shell ::-webkit-scrollbar-thumb {
background: var(--wa-border);
border-radius: 3px;
}
.whatsapp-shell ::-webkit-scrollbar-thumb:hover {
background: var(--wa-text-muted);
}
/* Status indicators */
.status-connected {
color: var(--wa-green-light);
}
.status-disconnected {
color: #f15c6d;
}
.status-connecting {
color: var(--wa-blue);
}
/* Message bubbles */
.bubble-out {
background-color: var(--wa-bubble-out);
}
.bubble-in {
background-color: var(--wa-bubble-in);
}
/* Instance card */
.instance-card {
background-color: var(--wa-surface);
border: 1px solid var(--wa-border);
border-radius: 8px;
transition: border-color 0.2s;
}
.instance-card:hover {
border-color: var(--wa-green-dark);
}
/* Loading overlay */
html:not(.nuxt-ready) body::before {
content: '';
position: fixed;
inset: 0;
background: var(--wa-bg);
z-index: 9999;
}