Add style for rows
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
.row {
|
.row {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 48px 5fr 70px 2fr 3fr 60px 30px 30px;
|
grid-template-columns: 48px 5fr 70px 2fr 3fr 60px 30px 30px;
|
||||||
|
grid-gap: 8px;
|
||||||
text-wrap: nowrap;
|
text-wrap: nowrap;
|
||||||
height: 64px;
|
height: 64px;
|
||||||
background: var(--input-secondary);
|
background: var(--input-secondary);
|
||||||
@@ -14,6 +15,10 @@
|
|||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.release-date, .storage, .max-value {
|
||||||
|
color: rgb(184, 184, 184);
|
||||||
|
}
|
||||||
|
|
||||||
.pill {
|
.pill {
|
||||||
width: fit-content;
|
width: fit-content;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
@@ -31,9 +36,40 @@
|
|||||||
.platform-pill {
|
.platform-pill {
|
||||||
color: var(--violet);
|
color: var(--violet);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.platform-pill:hover {
|
.platform-pill:hover {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.detail {
|
||||||
|
transform: scale(0.8, 1.2) rotate(-90deg);
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
::deep .detail svg {
|
||||||
|
fill: var(--white);
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.max-value {
|
||||||
|
translate: 0 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 800px) {
|
||||||
|
.row {
|
||||||
|
grid-template-columns: 48px 5fr 2fr 3fr 30px 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.release-date, .storage {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user