partage

Unnamed repository; edit this file 'description' to name the repository.
git clone git://git.z3bra.org/partage.git
Log | Files | Refs

commit 5b3b4556a520c790aa0cc1598cb2d2c9f5b2a0c9
parent 7aa88fe61e82ebed86714d109ad063e27ea0ffd9
Author: Willy Goiffon <dev@z3bra.org>
Date:   Mon, 18 Oct 2021 17:35:50 +0200

Change page header disposition

Diffstat:
Mstatic/partage.css | 26+++++++++++++++-----------
1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/static/partage.css b/static/partage.css @@ -11,17 +11,16 @@ body { header { display: flex; + flex-direction: column; + flex-wrap: wrap-reverse; align-items: center; align-content: center; - justify-content: center; - max-height: 30vh; - gap: 8px; } -h1 { font-size: 3rem; } -img#logo { height: 4rem; } -ul { list-style: none; padding: 0; } +img#logo { height: 100%; max-height: 30vh; } +h1 { font-size: 4.5rem; } +ul { list-style: none; padding: 0; } /* font attributes are not inherited by default */ input, input::file-selector-button { @@ -30,11 +29,16 @@ input, input::file-selector-button { font-size: inherit; } - -@media (orientation: portrait) { - header { flex-direction: column; max-height: 50vh; } - h1 { font-size: 3rem; } - img#logo { height: 30vh; } +@media (min-aspect-ratio: 18/9) { + header { + flex-direction: row; + } + h1 { font-size: 3rem; margin-right: 10px; } + img#logo { + height: 50%; + max-height: 20vh; + order: 2; + } } @media (prefers-color-scheme: light) {