Make main article view wider

diff --git a/src/jvmMain/resources/static/style.css b/src/jvmMain/resources/static/style.css
index 712da7543fb4e84591742ef6d0acde281c227a5f..412ab3537c50967d14f4bf6a2fc66b78b0737dc6 100644 (file)
--- a/src/jvmMain/resources/static/style.css
+++ b/src/jvmMain/resources/static/style.css
@@ -102,7 +102,7 @@ html {
        background-color: var(--back-color);
 
        font-family: sans-serif;
-       font-size: 100%;
+       font-size: 112.5%;
 
        --h1-size: 1.6em;
        --h2-size: 1.4em;
@@ -123,7 +123,7 @@ html {
        --panel-fill: rgba(255, 204, 51, 40%);
 
        --selection-fg: #eee;
-       --selection-bg: rgba(170, 136, 34, 0.6);
+       --selection-bg: rgba(170, 136, 34, 60%);
 
        --h1-border: #862;
        --h1-shadow: #431;
@@ -175,7 +175,7 @@ html {
        --comment-stroke: #541;
        --comment-fill: #ec6;
 
-       --quote-bg: rgba(0, 0, 0, 0.1);
+       --quote-bg: rgba(0, 0, 0, 10%);
 
        /*************
        * url params *
@@ -197,7 +197,7 @@ html[data-theme="dark"] {
        --panel-fill: rgba(85, 68, 17, 40%);
 
        --selection-fg: #111;
-       --selection-bg: rgba(255, 221, 119, 0.9);
+       --selection-bg: rgba(255, 221, 119, 90%);
 
        --h1-border: #862;
        --h1-shadow: #c93;
@@ -249,7 +249,7 @@ html[data-theme="dark"] {
        --comment-stroke: #feb;
        --comment-fill: #652;
 
-       --quote-bg: rgba(255, 255, 255, 0.1);
+       --quote-bg: rgba(255, 255, 255, 10%);
 
        /*************
        * url params *
@@ -272,7 +272,7 @@ html[data-theme="dark"] {
                --panel-fill: rgba(255, 204, 51, 40%);
 
                --selection-fg: #eee;
-               --selection-bg: rgba(170, 136, 34, 0.6);
+               --selection-bg: rgba(170, 136, 34, 60%);
 
                --h1-border: #862;
                --h1-shadow: #431;
@@ -324,7 +324,7 @@ html[data-theme="dark"] {
                --comment-stroke: #541;
                --comment-fill: #ec6;
 
-               --quote-bg: rgba(0, 0, 0, 0.1);
+               --quote-bg: rgba(0, 0, 0, 10%);
 
                /*************
                * url params *
@@ -346,7 +346,7 @@ html[data-theme="dark"] {
                --panel-fill: rgba(85, 68, 17, 40%);
 
                --selection-fg: #111;
-               --selection-bg: rgba(255, 221, 119, 0.9);
+               --selection-bg: rgba(255, 221, 119, 90%);
 
                --h1-border: #862;
                --h1-shadow: #c93;
@@ -398,7 +398,7 @@ html[data-theme="dark"] {
                --comment-stroke: #feb;
                --comment-fill: #652;
 
-               --quote-bg: rgba(255, 255, 255, 0.1);
+               --quote-bg: rgba(255, 255, 255, 10%);
 
                /*************
                * url params *
@@ -483,7 +483,7 @@ aside.mobile img {
 
 @media only screen and (min-width: 9.6in) {
        html {
-               padding: 1.25rem 4vw;
+               padding: 0;
 
                --h1-size: 2.6em;
                --h2-size: 2.2em;
@@ -510,33 +510,33 @@ aside.mobile img {
        }
 
        main {
-               padding: 4vh 0;
+               padding: 2vh 0;
        }
 
        /*noinspection CssOverwrittenProperties*/
        main > section, nav.desktop, aside.desktop {
-               border: 0.25em solid var(--panel-stroke);
-               border-radius: 1.5em;
+               border: 0.125em solid var(--panel-stroke);
+               border-radius: 0.75em;
                background-color: var(--panel-fill);
 
                box-sizing: border-box;
-               padding: 2.5em 3em;
+               padding: 1.25em 1.5em;
 
                position: relative;
                z-index: 1;
        }
 
        main > section {
-               width: 48vw;
-               margin: 4vh auto;
+               width: 64vw;
+               margin: 2vh auto;
        }
 
        main > section:first-of-type {
-               margin: 0 auto 4vh;
+               margin: 0 auto 2vh;
        }
 
        main > section:last-of-type {
-               margin: 4vh auto 0;
+               margin: 2vh auto 0;
        }
 
        main > section:only-of-type {
@@ -552,23 +552,23 @@ aside.mobile img {
        }
 
        nav.desktop {
-               width: 16vw;
+               width: 12vw;
                float: left;
-               margin: 4vh 4vw;
+               margin: 0 2vw;
 
                position: sticky;
-               top: calc(4vh + 1.25rem);
-               max-height: calc(92vh - 2.5rem);
+               top: 2vh;
+               max-height: 96vh;
        }
 
        aside.desktop {
-               width: 16vw;
+               width: 12vw;
                float: right;
-               margin: 4vh 4vw;
+               margin: 0 2vw;
 
                position: sticky;
-               top: calc(4vh + 1.25rem);
-               max-height: calc(92vh - 2.5rem);
+               top: 2vh;
+               max-height: 96vh;
        }
 
        aside.desktop img {
@@ -576,7 +576,7 @@ aside.mobile img {
        }
 
        aside.desktop div.list {
-               max-height: calc(92vh - 7.5rem);
+               max-height: calc(96vh - 3.75rem);
                overflow-y: auto;
        }