diff --git a/templates/css/stylesheet.php b/templates/css/stylesheet.php index 1f0ce32..23a31f3 100644 --- a/templates/css/stylesheet.php +++ b/templates/css/stylesheet.php @@ -114,3 +114,43 @@ font-size: 16px; } + + + + #header, body { + width: calc(100% - 50px) !important; + } + + body { + position: absolute; + left: 50px; + } + + #side-menu { + display: block; + } + + .side-menu-apps-list { + top: 49px; + } + + #side-menu, .side-menu-header, .side-menu-apps-list { + width: 50px; + } + + #side-menu .side-menu-app-text, #header .side-menu-opener, .side-menu-logo { + display: none; + } + + #side-menu.open, #side-menu.open .side-menu-apps-list, #side-menu.open .side-menu-header { + width: 100%; + } + + #side-menu:hover, #side-menu:hover .side-menu-apps-list, #side-menu:hover .side-menu-header{ + width: 100%; + } + + #side-menu.open .side-menu-app-text, #side-menu:hover .side-menu-app-text { + display: inline; + } + diff --git a/templates/js/script.php b/templates/js/script.php index 660666b..90f3549 100644 --- a/templates/js/script.php +++ b/templates/js/script.php @@ -20,6 +20,8 @@ if (apps.length === 0) { sideMenu.removeClass('open') sideMenuOpener.addClass('hide') + sideMenu.remove() + body.style.left = 0; } else { sideMenuOpener.removeClass('hide') } @@ -109,4 +111,48 @@ + + window.setTimeout(function() { + var elements = document.querySelectorAll('*'); + var fixedElements = [] + + for (var i in elements) { + var element = elements[i] + + if (typeof element !== 'object') { + continue + } + + var position = window.getComputedStyle(element, null).getPropertyValue('position'); + + if (position !== 'fixed') { + continue + } + + if (element.getAttribute('id') === 'header') { + continue + } + + if (element.getAttribute('id') === 'side-menu') { + continue + } + + fixedElements.push(element) + } + + window.setTimeout(function() { + for (var i in fixedElements) { + var element = fixedElements[i] + + var value = window.getComputedStyle(element, null).getPropertyValue('left') + + if (value === 'initial') { + continue + } + + element.style.setProperty('left', 'initial') + element.style.setProperty('transform', 'translateX(' + value + ')') + } + }, 100); + }, 500); })();