mirror of
https://github.com/MacRimi/ProxMenux.git
synced 2025-11-18 03:26:17 +00:00
Update globals.css
This commit is contained in:
@@ -139,104 +139,106 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* ===================== */
|
/* ===================== */
|
||||||
/* Base layer */
|
/* Base styles */
|
||||||
/* ===================== */
|
/* ===================== */
|
||||||
@layer base {
|
/* Removed @layer base to fix Tailwind CSS v4 compatibility */
|
||||||
* {
|
* {
|
||||||
@apply border-border outline-ring/50;
|
border-color: var(--border);
|
||||||
}
|
outline-color: color-mix(in oklch, var(--ring), transparent 50%);
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
@apply bg-background text-foreground;
|
background-color: var(--background);
|
||||||
}
|
color: var(--foreground);
|
||||||
|
}
|
||||||
|
|
||||||
/* Foco accesible */
|
/* Foco accesible */
|
||||||
:is(button, [role="button"], a, input, select, textarea, [tabindex]:not([tabindex="-1"])):focus {
|
:is(button, [role="button"], a, input, select, textarea, [tabindex]:not([tabindex="-1"])):focus {
|
||||||
@apply outline-none;
|
outline: none;
|
||||||
}
|
}
|
||||||
:is(button, [role="button"], a, input, select, textarea, [tabindex]:not([tabindex="-1"])):focus-visible {
|
|
||||||
@apply ring-2;
|
:is(button, [role="button"], a, input, select, textarea, [tabindex]:not([tabindex="-1"])):focus-visible {
|
||||||
--tw-ring-color: var(--ring);
|
outline: 2px solid color-mix(in oklch, var(--ring), transparent 50%);
|
||||||
--tw-ring-opacity: 0.5; /* equivalente al /50 */
|
outline-offset: 2px;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ===================== */
|
/* ===================== */
|
||||||
/* Ajustes para Charts */
|
/* Component styles */
|
||||||
/* ===================== */
|
/* ===================== */
|
||||||
@layer components {
|
/* Removed @layer components to fix Tailwind CSS v4 compatibility */
|
||||||
/* Recharts axis */
|
|
||||||
.recharts-cartesian-axis-tick tspan {
|
|
||||||
fill: var(--muted-foreground);
|
|
||||||
}
|
|
||||||
.recharts-cartesian-axis-line,
|
|
||||||
.recharts-cartesian-grid line {
|
|
||||||
stroke: var(--border);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Chart.js axis */
|
/* Recharts axis */
|
||||||
.chartjs-render-monitor text {
|
.recharts-cartesian-axis-tick tspan {
|
||||||
fill: var(--muted-foreground);
|
fill: var(--muted-foreground);
|
||||||
}
|
}
|
||||||
.chartjs-render-monitor line {
|
|
||||||
stroke: var(--border);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Estilos personalizados para notas de ProxMenux */
|
.recharts-cartesian-axis-line,
|
||||||
/* Asegura que el contenido HTML de ProxMenux se renderice correctamente */
|
.recharts-cartesian-grid line {
|
||||||
.proxmenux-notes {
|
stroke: var(--border);
|
||||||
/* Centrar el contenido */
|
}
|
||||||
|
|
||||||
|
/* Chart.js axis */
|
||||||
|
.chartjs-render-monitor text {
|
||||||
|
fill: var(--muted-foreground);
|
||||||
|
}
|
||||||
|
|
||||||
|
.chartjs-render-monitor line {
|
||||||
|
stroke: var(--border);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Estilos personalizados para notas de ProxMenux */
|
||||||
|
/* Asegura que el contenido HTML de ProxMenux se renderice correctamente */
|
||||||
|
.proxmenux-notes {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Asegurar que las tablas dentro de las notas se vean correctamente */
|
/* Asegurar que las tablas dentro de las notas se vean correctamente */
|
||||||
.proxmenux-notes table {
|
.proxmenux-notes table {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.proxmenux-notes table td {
|
.proxmenux-notes table td {
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
padding: 0.5rem;
|
padding: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Asegurar que las imágenes dentro de las notas se vean correctamente */
|
/* Asegurar que las imágenes dentro de las notas se vean correctamente */
|
||||||
.proxmenux-notes img {
|
.proxmenux-notes img {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Asegurar que los enlaces (badges) se mantengan en línea horizontal */
|
/* Asegurar que los enlaces (badges) se mantengan en línea horizontal */
|
||||||
.proxmenux-notes p a {
|
.proxmenux-notes p a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-right: 0.25rem;
|
margin-right: 0.25rem;
|
||||||
margin-bottom: 0.25rem;
|
margin-bottom: 0.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.proxmenux-notes p a img {
|
.proxmenux-notes p a img {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Añadir separador visual después de la tabla (similar a Proxmox) */
|
/* Añadir separador visual después de la tabla (similar a Proxmox) */
|
||||||
.proxmenux-notes table + p {
|
.proxmenux-notes table + p {
|
||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
padding-top: 1rem;
|
padding-top: 1rem;
|
||||||
border-top: 1px solid var(--border);
|
border-top: 1px solid var(--border);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Estilos para los párrafos de información de discos */
|
/* Estilos para los párrafos de información de discos */
|
||||||
.proxmenux-notes div p {
|
.proxmenux-notes div p {
|
||||||
margin: 0.25rem 0;
|
margin: 0.25rem 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Asegurar que los títulos se vean correctamente */
|
/* Asegurar que los títulos se vean correctamente */
|
||||||
.proxmenux-notes h1,
|
.proxmenux-notes h1,
|
||||||
.proxmenux-notes h2,
|
.proxmenux-notes h2,
|
||||||
.proxmenux-notes h3 {
|
.proxmenux-notes h3 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
line-height: 1.2;
|
line-height: 1.2;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user