artabro/site/templates/css/main.css

38 lines
No EOL
845 B
CSS

:root
{
--separacion: 1rem;
--contido-max: 60rem;
--destacado-max: 75rem;
--destacado: calc((var(--destacado-max) - var(--contido-max)) / 2);
}
.grella
{
display: grid;
grid-template-columns:
[completo-start] minmax(var(--separacion), 1fr)
[destacado-start] minmax(0, var(--destacado))
[contido-start] min(100% - (var(--separacion) * 2), var(--contido-max)) [contido-end]
minmax(0, var(--destacado)) [destacado-end]
minmax(var(--separacion), 1fr) [completo-end]
;
}
.grella > :not(.destacado, .completo),
.completo > :not(.destacado, .completo)
{
grid-column: contido;
}
.grella > .completo
{
display: grid;
grid-column: completo;
grid-template-columns: inherit;
}
.grella > .destacado,
.completo > .destacado
{
grid-column: destacado;
}