eryn/erynwells.me
1
0
Fork 0
Code Issues 8 Pull requests 1 Projects Releases Packages Activity Actions

Fix the layout of the photo params table at smaller viewport sizes

Browse source
This commit is contained in:
Eryn Wells 2023-04-08 14:59:43 -07:00
parent cb025398b3
commit d0757067ed
1 changed files with 9 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

13
assets/styles/photos.css
View file

@ -91,7 +91,7 @@
} }
.photo-params { .photo-params {
width: 100%; padding-inline: calc(var(--body-item-spacing) / 2);
} }
.photo-params > .container { .photo-params > .container {
@ -100,7 +100,7 @@
border-radius: 10px; border-radius: 10px;
margin: var(--body-item-spacing) auto; margin: var(--body-item-spacing) auto;
padding: calc(var(--body-item-spacing) / 2); padding: calc(var(--body-item-spacing) / 2);
width: 66%; max-width: calc(0.66 * var(--content-width));
} }
.photo-params > .container > table { .photo-params > .container > table {
@ -108,19 +108,24 @@
color: var(--photo-params-color); color: var(--photo-params-color);
border-collapse: collapse; border-collapse: collapse;
border-radius: 6px; border-radius: 6px;
margin: 0;
table-layout: fixed; table-layout: fixed;
text-align: center; text-align: center;
width: 100%; width: 100%;
} }
.photo-params table > thead > tr > td { .photo-params thead td {
border-bottom: 1px solid var(--photo-params-border-color); border-bottom: 1px solid var(--photo-params-border-color);
font-size: 80%; font-size: 80%;
font-weight: bold; font-weight: bold;
} }
.photo-params tbody tr:first-child > td {
border: none;
border-bottom: 1px solid var(--photo-params-border-color);
}
.photo-params tr.exposure-attributes > td { .photo-params tr.exposure-attributes > td {
border: none;
border-top: 1px solid var(--photo-params-border-color); border-top: 1px solid var(--photo-params-border-color);
border-left: 1px solid var(--photo-params-border-color); border-left: 1px solid var(--photo-params-border-color);
} }