last changes

This commit is contained in:
Víctor Losada Hernández
2026-10-06 23:12:25 +02:00
parent 87994b0de9
commit 8eb7d28222
@@ -262,16 +262,17 @@
span { display : inline-block; margin : 0; }
.brewTags {
display : inline-flex;
flex-wrap : wrap;
grid-area : tags;
align-items : center;
width : fit-content;
max-width : 100px;
&:has(span:nth-of-type(4)) {
width : 100%;
i, span { margin-right : 5px; }
&:has(span:nth-of-type(3)) {
position : relative;
display : flex;
flex-wrap : wrap;
overflow : hidden;
span:nth-of-type(n + 4) { display : none; }
span:nth-of-type(n + 3) { display : none; }
}
}
.brewAuthors {
@@ -323,35 +324,33 @@
//these media queries are just for the list layout and could be moved inside it, not sure it is a good idea
@media screen and (max-width : 1400px) {
.brewCollection .brewGroup {
&.list {
.brewItem:not(.detailsOpen) {
.info {
grid-template-areas : 'tags update storage';
grid-template-columns : 2fr 1fr 20px;
width : clamp(200px, 100%, 650px);
}
.brewPages,
.lastViewed,
.brewAuthors { display : none; }
.brewCollection .brewGroup.list {
.brewItem:not(.detailsOpen) {
.info {
grid-template-areas : 'tags update storage';
grid-template-columns : 2fr 1fr 20px;
width : clamp(200px, 100%, 650px);
}
.brewItem {
cursor : pointer;
transition : height @defaultDuration;
&:hover {
box-shadow : 0 0 5px var(--bg-clr);
filter : brightness(0.97);
}
}
.detailsOpen {
grid-template-columns : 25% 3fr 150px;
height : 70px;
.brewPages,
.lastViewed,
.brewAuthors { display : none; }
}
.brewItem {
cursor : pointer;
transition : height @defaultDuration;
&:hover {
box-shadow : 0 0 5px var(--bg-clr);
filter : brightness(0.97);
}
}
.detailsOpen {
grid-template-columns : 25% 3fr 150px;
height : 70px;
}
}
}
@media screen and (max-width : 1200px) {
.brewCollection .brewGroup .list {
.brewCollection .brewGroup.list {
.brewItem:not(.detailsOpen) {
grid-template-columns : 35% 3fr 150px;
.info {
@@ -378,7 +377,7 @@
}
}
@media screen and (max-width : 800px) {
.brewCollection .brewGroup .list {
.brewCollection .brewGroup.list {
.brewItem:not(.detailsOpen) {
.info {
grid-template-areas : 'tags';
@@ -432,7 +431,7 @@
}
}
@media screen and (max-width : 650px) {
.brewCollection .brewGroup .list {
.brewCollection .brewGroup.list {
.brewItem:not(.detailsOpen) {
grid-template-columns : 3fr 2fr;
.info { display : none; }