modified: style.css
This commit is contained in:
@ -321,7 +321,11 @@ img.logo {
|
||||
|
||||
.main {
|
||||
grid-template-rows: 1fr;
|
||||
grid-template-columns: minmax(180px, 1fr) auto; /* ← back to 2 columns */
|
||||
#grid-template-columns: minmax(180px, 1fr) auto;
|
||||
#grid-template-columns: minmax(300px, auto) min(calc(100vw - 360px), calc(100vh * 16 / 9));
|
||||
#grid-template-columns: minmax(300px, auto) 1fr;
|
||||
#grid-template-columns: 1fr auto;
|
||||
grid-template-columns: minmax(300px, 1fr) auto;
|
||||
grid-template-areas: "conditions video";
|
||||
border-radius: var(--r-lg) 0 0 var(--r-lg);
|
||||
justify-content: center;
|
||||
@ -352,13 +356,27 @@ img.logo {
|
||||
}
|
||||
|
||||
.video {
|
||||
height: min(100%, calc((100vw - 180px) * 9 / 16));
|
||||
#height: 100%;
|
||||
max-width: calc(100vw - 180px);
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
aspect-ratio: 16 / 9;
|
||||
max-height: 100%;
|
||||
align-self: center;
|
||||
justify-self: end;
|
||||
overflow: hidden;
|
||||
max-width: calc(100vw - 300px);
|
||||
#max-width: 100%;
|
||||
#width: 100%;
|
||||
#height: min(100%, calc((100vw - 300px) * 9 / 16));
|
||||
#overflow: hidden;
|
||||
#display: flex;
|
||||
#align-items: center;
|
||||
#align-self: center;
|
||||
#justify-self: end;
|
||||
#height: 100%;
|
||||
#width: 100%;
|
||||
#max-width: calc(100vw - 0px);
|
||||
#aspect-ratio: 16 / 9;
|
||||
#max-height: 100%;
|
||||
#width: auto;
|
||||
}
|
||||
|
||||
.video img {
|
||||
@ -366,6 +384,7 @@ img.logo {
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
display: block;
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
p.header { grid-column: 1; grid-row: 1; }
|
||||
@ -387,8 +406,8 @@ img.logo {
|
||||
|
||||
.cat { font-size: 1rem; }
|
||||
.cat p { padding-left: 14px; }
|
||||
.data { font-size: 1.5rem; margin-top: 2px; padding: 2px 0; }
|
||||
.datapoint { margin-top: 14px; padding: 5px 0 0 8px; font-size: 0.75rem; }
|
||||
.data { font-size: 1.5rem; margin-top: 2px; padding: 0.5vh 1vw; }
|
||||
.datapoint { margin-top: 14px; padding: 0.5vh; font-size: 0.75rem; }
|
||||
|
||||
.popup h5 { font-size: 1rem; }
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user