jotoho/my-website
1
0
Fork 0
Code Issues Pull requests Activity

Overhaul CSS for details mechanism

Browse source
This commit is contained in:
Jonas Tobias Hopusch 2024-01-13 00:34:39 +01:00
parent 722f5cb03a
commit e25df060ae
Signed by: jotoho
GPG key ID: 913BDF1196DCF600
1 changed files with 34 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
static/css/general.css
View file

@ -164,23 +164,43 @@ th {
img { img {
display: block; display: block;
width: fit-content; min-height: unset;
min-width: unset;
height: auto;
width: auto;
max-width: 100%; max-width: 100%;
height: fit-content; max-height: unset;
max-height: 90vh;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
object-fit: scale-down;
object-position: center;
} }
details { details {
border-color: grey; backdrop-filter: invert(100%);
border-width: 1px; padding: max(1mm, 1px);
border-style: dashed; width: min-content;
padding: calc(1rem / 3); max-width: fit-content;
min-width: unset;
display: block;
color: black;
}
details > summary {
max-width: fit-content;
width: max-content;
display: block;
}
details:not([open]) > summary::after {
content: "Click to expand";
display: block;
max-width: fit-content;
font-weight: bold;
} }
details[open] > summary { details[open] > summary {
margin-bottom: calc(1rem / 3); margin-bottom: max(1mm, 1px);
} }
#licenseimg { #licenseimg {
@ -232,8 +252,8 @@ details[open] > summary {
border-color: white; border-color: white;
} }
.black-white-svg { details {
filter: invert(100%); color: black;
} }
} }
@ -256,4 +276,8 @@ details[open] > summary {
th { th {
border-color: black; border-color: black;
} }
details {
color: white;
}
} }