tChange page header disposition - partage - File upload system
 (HTM) git clone git://git.z3bra.org/partage.git
 (DIR) Log
 (DIR) Files
 (DIR) Refs
 (DIR) README
 (DIR) LICENSE
       ---
 (DIR) commit 5b3b4556a520c790aa0cc1598cb2d2c9f5b2a0c9
 (DIR) parent 7aa88fe61e82ebed86714d109ad063e27ea0ffd9
 (HTM) Author: Willy Goiffon <dev@z3bra.org>
       Date:   Mon, 18 Oct 2021 17:35:50 +0200
       
       Change page header disposition
       
       Diffstat:
         M static/partage.css                  |      26 +++++++++++++++-----------
       
       1 file changed, 15 insertions(+), 11 deletions(-)
       ---
 (DIR) diff --git a/static/partage.css b/static/partage.css
       t@@ -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 {
       t@@ -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) {