diff options
Diffstat (limited to 'help3xsl')
| -rw-r--r-- | help3xsl/default.css | 55 | ||||
| -rw-r--r-- | help3xsl/online_transform.xsl | 4 |
2 files changed, 41 insertions, 18 deletions
diff --git a/help3xsl/default.css b/help3xsl/default.css index 03eaf34cab..2104d01d4a 100644 --- a/help3xsl/default.css +++ b/help3xsl/default.css @@ -457,7 +457,6 @@ aside input[type=checkbox]:checked ~ .contents-treeview { padding: 0 0 0 20px; } .index-label { - float: left; font-size: 22px; color: #148603; padding-left: 20px; @@ -756,8 +755,13 @@ li.disabled a { background-color: #F4F7F7; border-right: 1px solid rgba(0,0,0,0.04); float: left; - width: 320px; - grid-area: sidebar; + width: 320px; + } + .leftside { + grid-area: leftside; + } + .rightside { + grid-area: rightside; } .google-search { margin: 0; @@ -777,28 +781,30 @@ li.disabled a { left: 80px; border: none; } - label[for=accordion-1] { - background-color: transparent; - text-decoration: none; - } - label[for=accordion-1]:hover { - background-color: transparent; - } - label[for=accordion-1]:after { - content: ""; - } #DisplayArea { padding: 10px 50px; width: 800px; } + #search-bar { + max-width: 290px; + } +} +@media screen and (min-width: 1440px) { #Contents { color: #333; z-index: 6; display: block; padding: 0 0 0 20px; } - #search-bar { - max-width: 290px; + label[for=accordion-1] { + background-color: transparent; + text-decoration: none; + } + label[for=accordion-1]:hover { + background-color: transparent; + } + label[for=accordion-1]:after { + content: ""; } } @supports (grid-area: auto) { @@ -806,9 +812,24 @@ li.disabled a { body { display: grid; grid-template-columns: 320px 1fr; - grid-template-rows: 1fr minmax(1em, auto); + grid-template-rows: minmax(1em, auto) minmax(1em, auto) 1fr; grid-template-areas: "header header" - "sidebar main" + "rightside main" + "leftside main" + } + } + @media screen and (min-width: 1440px) { + body { + display: grid; + grid-template-columns: 320px 900px 1fr; + grid-template-rows: 1fr minmax(1em, auto); + grid-template-areas: "header header header" + "leftside main rightside" + } + .rightside { + width: auto; + border-right: none; + border-left: 1px solid rgba(0,0,0,0.04); } } } diff --git a/help3xsl/online_transform.xsl b/help3xsl/online_transform.xsl index 8bfd5d31ba..889982fda3 100644 --- a/help3xsl/online_transform.xsl +++ b/help3xsl/online_transform.xsl @@ -200,10 +200,12 @@ </div> </xsl:if> </div> - <aside> + <aside class="rightside"> <input id="accordion-1" name="accordion-menu" type="checkbox"/> <label for="accordion-1"><xsl:value-of select="$ui_contents"/></label> <div id="Contents" class="contents-treeview"></div> + </aside> + <aside class="leftside"> <div id="Index"> <div class="index-label"><xsl:value-of select="$ui_index"/>  🔎︎ </div> <div id="Bookmarks"> |