diff options
Diffstat (limited to 'plugins/base/src/main/resources')
3 files changed, 55 insertions, 44 deletions
diff --git a/plugins/base/src/main/resources/dokka/scripts/platformContentHandler.js b/plugins/base/src/main/resources/dokka/scripts/platformContentHandler.js index 78d65333..bc34d6a6 100644 --- a/plugins/base/src/main/resources/dokka/scripts/platformContentHandler.js +++ b/plugins/base/src/main/resources/dokka/scripts/platformContentHandler.js @@ -17,8 +17,23 @@ window.addEventListener('load', () => { } initTabs() handleAnchor() + initHidingLeftNavigation() }) +const initHidingLeftNavigation = () => { + document.getElementById("leftToggler").onclick = function(event) { + //Events need to be prevented from bubbling since they will trigger next handler + event.preventDefault(); + event.stopPropagation(); + event.stopImmediatePropagation(); + document.getElementById("leftColumn").classList.toggle("open"); + } + + document.getElementById("main").onclick = () => { + document.getElementById("leftColumn").classList.remove("open"); + } +} + // Hash change is needed in order to allow for linking inside the same page with anchors // If this is not present user is forced to refresh the site in order to use an anchor window.onhashchange = handleAnchor diff --git a/plugins/base/src/main/resources/dokka/scripts/scripts.js b/plugins/base/src/main/resources/dokka/scripts/scripts.js deleted file mode 100644 index 85dfd86f..00000000 --- a/plugins/base/src/main/resources/dokka/scripts/scripts.js +++ /dev/null @@ -1,17 +0,0 @@ -document.getElementById("navigationFilter").oninput = function (e) { - var input = e.target.value; - var menuParts = document.getElementsByClassName("sideMenuPart") - for (let part of menuParts) { - if(part.querySelector("a").textContent.startsWith(input)) { - part.classList.remove("filtered"); - } else { - part.classList.add("filtered"); - } - } -} - -window.addEventListener("DOMContentLoaded", () => { - document.getElementById("leftToggler").onclick = function() { - document.getElementById("leftColumn").classList.toggle("open"); - } -}
\ No newline at end of file diff --git a/plugins/base/src/main/resources/dokka/styles/style.css b/plugins/base/src/main/resources/dokka/styles/style.css index 37d6383c..7b4aaa33 100644 --- a/plugins/base/src/main/resources/dokka/styles/style.css +++ b/plugins/base/src/main/resources/dokka/styles/style.css @@ -9,6 +9,7 @@ --footer-height: 64px; --footer-padding-top: 48px; --horizontal-spacing-for-content: 42px; + --mobile-horizontal-spacing-for-content: 8px; } #content { @@ -142,6 +143,10 @@ border-bottom: 2px solid white; } +.title { + overflow-x: auto; +} + .title > .divergent-group:first-of-type { padding-top: 0; } @@ -166,18 +171,8 @@ flex: 0 0 auto; } -@media screen and (max-width: 600px) { - #container { - flex-direction: column; - } - - #leftColumn { - border-right: none; - } -} - #sideMenu { - max-height: calc(100% - 90px); + max-height: calc(100% - 140px); padding-top: 16px; position: relative; } @@ -240,7 +235,7 @@ code.paragraph { background-color: #F4F4F4; align-items: center; display: block; - padding: 8px 8px 8px 16px; + padding: 8px 32px 8px 8px; box-sizing: border-box; white-space: pre-wrap; font-weight: bold; @@ -453,7 +448,6 @@ h1.cover { margin-left: calc(-1 * var(--horizontal-spacing-for-content)); margin-right: calc(-1 * var(--horizontal-spacing-for-content)); padding-left: var(--horizontal-spacing-for-content); - padding-right: var(--horizontal-spacing-for-content); border-bottom: 1px solid #DADFE6; margin-bottom: 0; @@ -663,8 +657,8 @@ footer { } .platform-tags { - flex: 0 0 auto; display: flex; + flex-wrap: wrap; } .platform-tags > .platform-tag { @@ -700,6 +694,7 @@ footer { top: 20px; right: 88px; z-index: 0; + flex-wrap: wrap; } .platform-selector:hover { @@ -728,6 +723,7 @@ td.content { flex-direction: row; padding: 0; justify-content: space-between; + flex-wrap: wrap; } .main-subrow > span { @@ -996,10 +992,6 @@ td.content { } @media print, screen and (max-width: 480px) { - body { - padding-right: 15px; - } - header ul { display: none; } @@ -1076,16 +1068,24 @@ div.runnablesample { margin-bottom: 0.2em; } +@media screen and (max-width: 1119px) { + /* TODO this feels wrong as only is an aproximation of correct solution*/ + .filter-section { + position: unset; + } +} + @media screen and (max-width: 759px) { #main { max-width: 100%; } #leftColumn { - position: absolute; + position: fixed; margin-left: -280px; transition: margin .2s ease-out; z-index: 4; background: white; + height: 100%; } #leftColumn.open { margin-left: 0; @@ -1093,29 +1093,42 @@ div.runnablesample { #leftColumn.open ~ #main #searchBar { display: none; } - #leftToggler { + #leftToggler { display: unset; position: fixed; top: 50%; transform: translateY(-50%); - margin-left: 12px; z-index: 5; - font-size: 30px; + font-size: 20px; transition: margin .2s ease-out; + + color: var(--average-color); + border: 1px solid var(--average-color); + border-left: 0; + border-top-right-radius: 1em; + border-bottom-right-radius: 1em; + padding: 8px 4px 8px 8px; + background-color: white; + } + #leftToggler .icon-toggler:hover { + cursor: pointer; } #leftColumn.open ~ #main #leftToggler { - margin-left: 280px;; + margin-left: 280px; } .icon-toggler::before { content: "\232A"; } #leftColumn.open ~ #main .icon-toggler::before { content: "\2329"; + padding-right: 0.5em; + margin-left: -0.5em; } - .sideMenuPart > .overview:before { - width: 100%; + #content { + padding: 0 var(--mobile-horizontal-spacing-for-content); } - .popup-wrapper { - width: 100%; !important + #sideMenu { + padding-bottom: 16px; + overflow: auto; } }
\ No newline at end of file |