From 9207169568d7d5471d5161fec26afaf3ed334475 Mon Sep 17 00:00:00 2001 From: Galin Iliev Date: Wed, 29 May 2024 14:51:41 +0300 Subject: [PATCH 01/12] G4E-5814 - Update settings panel. --- index.html | 170 +++++++++++++++++++++++++---------------------- js/layouts.js | 2 +- js/settings.js | 41 ++++++++---- js/utils.js | 18 ++--- scss/app.css | 2 +- scss/app.css.map | 2 +- scss/app.scss | 30 +++++++++ 7 files changed, 160 insertions(+), 105 deletions(-) diff --git a/index.html b/index.html index 1818e7e..718267d 100644 --- a/index.html +++ b/index.html @@ -257,44 +257,34 @@
Save Layouts
-
-
-
+
+
+
General Settings
-
-
+
+
-
- - -
- + + Show tutorial on startup + +
-
-
Select Theme
+ +
+
+
Theme
+
  • @@ -314,8 +304,11 @@
    Select Theme
-
-
Select Toolbar Length
+ +
+
+
Toolbar Length
+
  • @@ -330,69 +323,86 @@
    Select Toolbar Length
- - * How many menu items will be shown at a time. - + * How many menu items will be shown at a time.
-
-
Search
-
-
+ +
+
+
Layouts
+
+
+
-
+ + Save current on exit + +
+
+ +
+
+
Notifications
+
+
+
- + + Allow notifications + +
+
+ +
-
-
Notifications
-
-
+ +
+
+
Search
+
+
+
-
+ + Search clients + +
+
+
- + + Search instruments + +
diff --git a/js/layouts.js b/js/layouts.js index bbfcec3..af57dda 100644 --- a/js/layouts.js +++ b/js/layouts.js @@ -28,7 +28,7 @@ function init() { .fromEvent(q('#layout-search'), 'keyup') .pipe( rxjs.operators.map((event) => { - return event.srcElement.value.toString().toLowerCase().trim(); + return event.target.value.toString().toLowerCase().trim(); }) ) .pipe(rxjs.operators.distinctUntilChanged()) diff --git a/js/settings.js b/js/settings.js index 0a54209..6143e24 100644 --- a/js/settings.js +++ b/js/settings.js @@ -26,36 +26,51 @@ async function init() { trackSettingsChange(); } -async function populateSettings() { +function populateSettings() { + const settingsContainer = document.querySelector('#settings-content'); + for (const setting in settings) { - if ( - typeof settings[setting] === 'boolean' && - q(`#settings-content [setting='${setting}']`) - ) { - let checkbox = q(`#settings-content [setting='${setting}']`); + const settingElement = settingsContainer.querySelector( + `[data-setting='${setting}']` + ); + + if (!settingElement) { + continue; + } + if (typeof settings[setting] === 'boolean') { getSetting(setting) - ? checkbox.setAttribute('checked', true) - : checkbox.removeAttribute('checked'); + ? settingElement.setAttribute('checked', true) + : settingElement.removeAttribute('checked'); } } } function trackSettingsChange() { - q('#settings-content').addEventListener('change', (e) => { + const settingsContainer = document.querySelector('#settings-content'); + + settingsContainer.addEventListener('change', (e) => { + const settingDropdown = + e.target.getAttribute('name') === 'theme' || + e.target.getAttribute('name') === 'length'; + + if (settingDropdown) { + return; + } + let settingElement = e .composedPath() - .find((e) => e && e.getAttribute && e.getAttribute('setting')); + .find((el) => el && el.dataset.setting); if (settingElement) { const setting = {}; - setting[settingElement.getAttribute('setting')] = e.srcElement.checked; + setting[settingElement.dataset.setting] = e.target.checked; setSetting(setting); if ( - e.target.getAttribute('setting') === 'enableNotifications' && - e.srcElement.checked === false + e.target.dataset.setting === 'enableNotifications' && + e.target.checked === false ) { setSetting({ enableNotifications: false, enableToasts: false }); } diff --git a/js/utils.js b/js/utils.js index bbef788..f1844fd 100644 --- a/js/utils.js +++ b/js/utils.js @@ -222,7 +222,7 @@ function focusMenuInputAfterTransition(e) { return; } - let menu = e.srcElement; + let menu = e.target; menu.removeEventListener('transitionend', focusMenuInputAfterTransition); @@ -526,7 +526,7 @@ function populateSettingsDropdown( class="select_input" type="radio" name="${elementName}" - id="${elementName}-${element.name + i}" + id="${elementName}-${element.name}" ${elementName}-name="${element.name}" ${ element.name === selectOptionsObj.selected.name @@ -535,7 +535,7 @@ function populateSettingsDropdown( } /> `; @@ -557,12 +557,12 @@ async function handleAppRowsChange() { const numberOfRows = getSetting('toolbarAppRows'); const appSelectOptions = { all: [ - { name: '8', displayName: '8 Items (Default)' }, - { name: '10', displayName: '10 Items' }, - { name: '12', displayName: '12 Items' }, - { name: '14', displayName: '14 Items' }, - { name: '16', displayName: '16 Items' }, - { name: '18', displayName: '18 Items' }, + { name: '8', displayName: '8 items (Default)' }, + { name: '10', displayName: '10 items' }, + { name: '12', displayName: '12 items' }, + { name: '14', displayName: '14 items' }, + { name: '16', displayName: '16 items' }, + { name: '18', displayName: '18 items' }, ], }; diff --git a/scss/app.css b/scss/app.css index 97e2bf5..b4e44dc 100644 --- a/scss/app.css +++ b/scss/app.css @@ -1 +1 @@ -@keyframes runleft{0%{opacity:0;transform:translateX(1rem)}100%{opacity:1;transform:translateX(0)}}@keyframes runright{0%{opacity:0;transform:translateX(-1rem)}100%{opacity:1;transform:translateX(0)}}html.dark .viewport{border:1px solid rgba(255,255,255,.075)}html.dark .toggle-content{background-color:var(--t42-body);border-top:1px solid rgba(255,255,255,.075);border-bottom:1px solid rgba(255,255,255,.075);border-right:1px solid rgba(255,255,255,.075);border-left-color:rgba(255,255,255,.075)}html.dark .toggle-content .close-drawer{color:#bbb}html.dark .toggle-content .close-drawer:hover{color:#fff}html.dark .applications-nav::after{background-color:rgba(255,255,255,.075);content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px)}html.dark .applications-nav:hover::after{background-color:rgba(0,0,0,0)}html.dark .viewport-footer::after{background-color:rgba(255,255,255,.075);content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px)}html.dark .viewport-footer:hover::after{background-color:rgba(0,0,0,0)}html.dark .favorite::after{background-color:rgba(255,255,255,.075)}html.dark .favorite i{background:#1e1e1e}html.dark .nav .layout-menu-tool{background-color:rgba(var(--t42-bg-light), 0.95)}html.dark .nav .layout-menu-tool li:first-of-type{border-right:1px solid rgba(255,255,255,.05)}html.dark .nav .layout-menu-tool li:hover,html.dark .nav .layout-menu-tool li.hover,html.dark .nav .layout-menu-tool li.active{background-color:rgba(255,255,255,.05);color:#fff}html.dark .nav .nav-link img{transition-property:filter;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;filter:grayscale(100%) brightness(1)}html.dark .nav .nav-link.active img,html.dark .nav .nav-link:hover img{filter:none}html.dark .select:hover{background-color:#252525}html.dark .select_items{border-color:rgba(255,255,255,.075)}html.dark .select_items:hover{border-color:#2080d3}html.dark .select_option{background-color:#1e1e1e}html.dark .select_expand::after{color:#eee}html.dark .select_expand:checked+.select_closeLabel+.select_options .select_label:hover{background-color:#252525}html.dark .horizontal .layout-menu-tool{border:1px solid rgba(255,255,255,.075)}html.dark .horizontal .layout-menu-tool li:first-child{border-bottom:1px solid rgba(255,255,255,.1)}html.dark .folder-content{background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 100%)}html.light .viewport{border:1px solid rgba(219,222,230,.8)}html.light .toggle-content{background-color:#fafafa;border-top:1px solid rgba(219,222,230,.8);border-bottom:1px solid rgba(219,222,230,.8);border-right:1px solid rgba(219,222,230,.8);border-left-color:rgba(219,222,230,.8)}html.light .toggle-content .close-drawer{color:#757575}html.light .toggle-content .close-drawer:hover{color:#0d0d0d}html.light .applications-nav::after{background-color:rgba(219,222,230,.8);content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px)}html.light .applications-nav:hover::after{background-color:rgba(0,0,0,0)}html.light .viewport-footer::after{background-color:rgba(219,222,230,.8);content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px)}html.light .viewport-footer:hover::after{background-color:rgba(0,0,0,0)}html.light .favorite::after{background-color:rgba(219,222,230,.8)}html.light .favorite i{background:#fafafa}html.light .nav .layout-menu-tool{background:#fff}html.light .nav .layouts-nav div:first-of-type{border-right:1px solid rgba(219,222,230,.8)}html.light .nav .layouts-nav div:hover,html.light .nav .layouts-nav div.hover,html.light .nav .layouts-nav div.active{background-color:rgba(219,222,230,.8);color:#000}html.light .nav .nav-link img{filter:invert(1)}html.light .nav .nav-link.active img,html.light .nav .nav-link:hover img{filter:invert(1) brightness(1.2)}html.light .select:hover{background-color:#fff}html.light .select_items:hover{border-color:#2080d3}html.light .select_option{background-color:#fafafa}html.light .select_option label{color:#757575}html.light .select_expand::after{color:#2c2c2c}html.light .select_expand:checked+.select_closeLabel+.select_options .select_label:hover{background-color:#f2f2f2;color:#2c2c2c}html.light .horizontal .layout-menu-tool{border:1px solid rgba(219,222,230,.8)}html.light .horizontal .layout-menu-tool li:first-child{border-bottom:1px solid rgba(0,0,0,.075)}html.light .folder-content{background:linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 100%)}.nav li.folder{flex-grow:0;overflow:hidden}.nav li.folder .action-menu .icon-size-16{width:1rem}.nav li.folder .action-menu .action-menu-tool .icon-angle-down{margin-right:.188rem}.nav li.folder .action-menu .action-menu-tool .icon-angle-down::before{display:inline-block;transform:rotate(-90deg)}.nav li.folder .action-menu .icon-folder-open-empty{display:none}.nav li.folder .action-menu:hover span:last-of-type{padding-right:0}.nav li.folder .nav-link.action-menu{min-height:3rem;max-height:3rem}.nav li.folder .folder-content{margin-left:5px}.nav li.folder.folder-open{flex-grow:0;flex-basis:auto}.nav li.folder.folder-open>.action-menu .icon-folder-open-empty{display:block}.nav li.folder.folder-open>.action-menu .icon-folder-empty{display:none}.nav li.folder.folder-open>.action-menu .action-menu-tool .icon-angle-down::before{transform:rotate(0)}:root{--logo-color-accent: #007be5}.dark{--logo-color-base: #ffffff}.light{--logo-color-base: #083044}html{height:100%}html body{height:100%;overflow:hidden;display:flex;justify-content:flex-start;background-color:rgba(0,0,0,0)}html .loaded .app{opacity:1}html .app{position:relative;height:100%;opacity:0}html .app.vertical{display:inline-flex}html .app.horizontal{display:flex;flex-direction:column}html .app.switching-orientation *{transition:none !important}html .app.switching-orientation *::before,html .app.switching-orientation *::after{transition:none !important}html .app *:focus{outline:none}html img,html a{user-select:none;-webkit-user-drag:none;-webkit-user-select:none}html .draggable{-webkit-app-region:drag}html .toggle-content{transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;height:100%;width:300px;overflow:hidden;visibility:visible;display:flex;flex-direction:column}html .toggle-content .input-group{flex-wrap:nowrap}html .toggle-content.hide{width:0;border-right:0 solid rgba(0,0,0,0)}html .toggle-content.hide .action-menu-tool{opacity:0}html .toggle-content>.nav{overflow:auto}html .toggle-content h5{white-space:nowrap;padding:0 .063rem}html .toggle-content .close-drawer{transition-property:color;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;font-size:.688rem;margin-left:.125rem;margin-right:.3125rem;cursor:pointer;transform:rotate(90deg)}html .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;opacity:0;transform:translateX(-1rem);overflow:hidden;text-overflow:ellipsis;margin:0 .5rem}html .nav-item.hover .nav-link{border-color:var(--t42-color-opacity-10);color:var(--t42-link-color);background-color:var(--t42-link-hover-bg)}html .nav.nav-tabs{border-bottom:none}html .nav.nav-tabs li{white-space:nowrap;flex-basis:3rem;flex-shrink:0}html .nav.nav-tabs .nav-item{user-select:none;position:relative;display:flex;flex-direction:column}html .nav.nav-tabs .nav-item.is-active .chevron{transform:rotate(180deg)}html .nav.nav-tabs .nav-link{height:auto;border:0;padding-left:14px;flex-grow:1;margin-right:0}html .nav.nav-tabs .nav-link .icon-size-16,html .nav.nav-tabs .nav-link>img,html .nav.nav-tabs .nav-link .title-app,html .nav.nav-tabs .nav-link .title-folder{margin:0 .5rem}html .nav.nav-tabs .nav-link img{transition-property:filter;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .nav.flex-column{flex-wrap:nowrap}html .nav.flex-column .nav-link{margin-bottom:0 !important}html .nav .applications-nav{position:relative;overflow:hidden}html .nav .applications-nav i{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .nav .applications-nav:hover .icon-angle-down,html .nav .applications-nav.active .icon-angle-down{opacity:1}html .nav .favorite{white-space:nowrap;flex-basis:1.25rem !important;user-select:none;overflow:hidden;text-align:center}html .nav .favorite i{position:relative;z-index:20;padding:0 .25rem}html .nav .favorite::after{content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px);bottom:11px}html .nav #fav-apps>li:not(.nav-item){transition-property:opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;opacity:0;white-space:nowrap}html .nav ul.nav .nav-item .nav-link.active::before,html .nav ul.nav .nav-item .nav-link:hover::before{width:0;height:0}html .nav .action-menu-tool{transition-property:opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;opacity:.65;margin-left:auto}html .nav .action-menu-tool .dropdown-menu{left:auto;right:0;z-index:20}html .nav .action-menu{cursor:pointer;overflow:hidden}html .nav .action-menu .dropdown-menu{min-width:auto}html .nav .action-menu a{text-decoration:none}html .nav .action-menu a:hover{text-decoration:none}html .nav .action-menu span:last-of-type{text-overflow:ellipsis;overflow:hidden;transition-property:opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .nav .action-menu .add-favorite{padding:0;height:2rem;width:2rem}html .nav .action-menu:hover .action-menu-tool{opacity:1}html .nav .layout-menu-tool{transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;display:flex;height:3rem;padding:0;opacity:0;position:absolute;visibility:hidden;width:100%;top:0;z-index:1}html .nav .layout-menu-tool li{display:flex;align-items:center;justify-content:center;flex:1 1 auto;width:100%;height:100%;cursor:pointer}html .nav .show-actions{position:relative;flex-shrink:0}html .nav .show-actions:hover i,html .nav .show-actions:hover .text-animation,html .nav .show-actions:hover .action-menu-tool,html .nav .show-actions:hover span,html .nav .show-actions.hover i,html .nav .show-actions.hover .text-animation,html .nav .show-actions.hover .action-menu-tool,html .nav .show-actions.hover span,html .nav .show-actions.active i,html .nav .show-actions.active .text-animation,html .nav .show-actions.active .action-menu-tool,html .nav .show-actions.active span{opacity:0;visibility:hidden}html .nav .show-actions:hover .layout-menu-tool,html .nav .show-actions.hover .layout-menu-tool,html .nav .show-actions.active .layout-menu-tool{opacity:1;visibility:visible}html .nav .show-actions:hover .layout-menu-tool li:first-of-type,html .nav .show-actions.hover .layout-menu-tool li:first-of-type,html .nav .show-actions.active .layout-menu-tool li:first-of-type{animation:runleft 300ms cubic-bezier(0.34, 0.03, 0.13, 0.93)}html .nav .show-actions:hover .layout-menu-tool li:last-of-type,html .nav .show-actions.hover .layout-menu-tool li:last-of-type,html .nav .show-actions.active .layout-menu-tool li:last-of-type{animation:runright 300ms cubic-bezier(0.34, 0.03, 0.13, 0.93)}html .nav-item[client-id] .action-menu,html .nav-item[instrument-id] .action-menu{cursor:initial}html .nav-item[client-id] .second-level .nav-link,html .nav-item[instrument-id] .second-level .nav-link{cursor:pointer}html .viewport{position:relative;z-index:15;border:1px solid rgba(255,255,255,.075);background-color:var(--t42-body);width:60px;user-select:none;transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .viewport .menu{display:flex}html .viewport .menu .icon-window-minimize{font-size:.5rem}html .viewport .menu .dropdown-menu{background-color:rgba(var(--t42-bg-light), 0.95)}html .viewport .viewport-header{position:relative}html .viewport .viewport-header a{text-decoration:none}html .viewport .viewport-header a:hover{text-decoration:none}html .viewport .viewport-header .menu{position:relative}html .viewport .viewport-header .menu .btn-icon{display:flex;align-items:center}html .viewport .viewport-header .dropdown-menu{top:32px;right:0;left:auto}html .viewport .viewport-header .logo{display:flex;align-items:center;width:100%;height:100%;padding:0 1.25em;overflow:hidden}html .viewport .viewport-header .logo svg{width:100%;height:100%}html .viewport .viewport-header .logo-icon{flex-shrink:0;width:2.33em;height:60%}html .viewport .accordion .active-app{position:absolute;left:57px}html .viewport .viewport-footer{position:relative;margin-top:auto}html .viewport .viewport-footer .nav.nav-tabs .nav-link{text-decoration:none}html .viewport .viewport-footer .nav.nav-tabs .nav-link:hover{text-decoration:none}html .viewport .viewport-footer .circle-index{transition-property:transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;align-items:center;background-color:#2080d3;border-radius:50%;display:flex;font-size:.5rem;height:.875rem;justify-content:center;margin-left:.875rem;margin-top:-0.375rem;position:absolute;transform:scale(1);width:.875rem}html .viewport .viewport-footer .circle-index.empty{transform:scale(0)}html .profile-actions .btn{flex:1 1 auto}html .modal.fade{display:block;width:200px;visibility:hidden}html .modal.fade .about-logo{width:2.5rem;overflow:hidden;margin:0 auto}html .modal.fade .modal-fill-in{justify-content:flex-start}html .modal.fade .modal-fill-in .modal-header .close{position:absolute;right:1rem;top:1rem}html .modal.fade.show{visibility:visible}html .active-app{margin-left:-14px}html [app-name].nav-item.fav-app i.icon-star-empty-1{display:none}html [app-name].nav-item:not(.fav-app) i.icon-star-full{display:none}html .select{list-style:none;display:flex;justify-content:center;align-items:center;width:100%;height:2rem;cursor:pointer;position:relative}html .select input[type=radio]{opacity:1}html .select_expand{width:0;height:2rem;position:absolute;top:0;right:0}html .select_expand:hover::after{opacity:1}html .select_expand:checked::after{transform:translate(-65%, -55%) rotate(-180deg)}html .select_expandLabel{display:block;width:100%;height:2rem;position:absolute;top:0;left:0;cursor:pointer;margin-bottom:0}html .select_close{display:none}html .select_closeLabel{position:fixed;top:0;left:0;display:none;margin-bottom:0}html .select_items{width:100%;position:absolute;top:0;left:0;min-height:2rem;border-width:1px;border-style:solid}html .select_input{display:none}html .select_label{transition:all 250ms cubic-bezier(0.4, 0.25, 0.3, 1);display:block;height:0;line-height:2rem;overflow:hidden;cursor:pointer;margin-bottom:0;padding-left:.875rem}html .select_label-placeholder{height:2rem;vertical-align:middle;position:absolute;top:0;left:0;background-color:rgba(0,0,0,0)}html .select_expand:checked+.select_closeLabel{display:block}html .select_expand:checked+.select_closeLabel::before,html .select_expand:checked+.select_closeLabel::after{display:none}html .select_expand:checked+.select_closeLabel+.select_options .select_label{height:2rem}html .select_expand:checked+.select_closeLabel+.select_options+.select_expandLabel{display:none}html .select_input:checked+.select_label{height:2rem}html .select_options{list-style:none;padding-left:0}html .vertical.open-left{transition-property:left, width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical.open-left.has-drawer{left:0}html .vertical.open-left .viewport{order:1}html .vertical.open-left .toggle-content{width:300px;transition-property:width, left;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical.open-left .toggle-content.hide{width:0px}html .vertical.open-left .toggle-content>div,html .vertical.open-left .toggle-content>.nav{width:auto}html .vertical.open-left .toggle-content h3{padding-right:0}html .vertical.open-left .toggle-content .close-drawer{transform:rotate(-90deg)}html .vertical{width:auto;left:300px}html .vertical .viewport{height:100%}html .vertical .viewport>.flex-column{height:100%}html .vertical .menu{max-width:0;opacity:0;transition-property:max-width, opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical .viewport-header{overflow:hidden}html .vertical .viewport-header .logo-wordmark{display:flex;align-items:center;justify-content:center;max-width:0;height:25%;padding-left:0;opacity:0;transition-property:all;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical .viewport-header .menu{max-width:0;opacity:0;pointer-events:none;margin-right:0;transition-property:all;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical .viewport-header .dropdown-menu{right:-0.75em}html .vertical .fav-app-nav{flex-grow:1;overflow:hidden}html .vertical .expand{width:200px}html .vertical .expand .viewport-header{display:flex;align-items:center;justify-content:space-between;overflow:initial}html .vertical .expand .viewport-header .logo-wordmark{max-width:100%;padding-left:.8em;opacity:1}html .vertical .expand .menu{max-width:100%;opacity:1;pointer-events:all;margin-right:.75em}html .vertical .expand .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;opacity:1;transform:translateX(0)}html .vertical .expand .favorite{transition-property:opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:300ms}html .vertical .expand .favorite i{padding:0 .75rem}html .vertical .expand .fav-app-nav{overflow-y:auto}html .vertical .expand .nav-link{max-width:200px}html .vertical .expand .accordion .nav .toggle-content{left:200px;display:list-item;transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:50ms}html .vertical .expand .accordion .nav .hide{width:0;transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:50ms}html .vertical .expand #fav-apps>li:not(.nav-item){opacity:1}html .horizontal.open-top{justify-content:flex-end}html .horizontal.open-top .viewport{order:1;margin-bottom:0;transition-property:margin-bottom;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:50ms}html .horizontal.open-top .viewport .dropdown-menu{top:auto;bottom:100%}html .horizontal.open-top .viewport .layouts-nav .layout-menu-tool{top:calc(-6rem + 2px)}html .horizontal.open-top .viewport .nav-item .chevron{transform:rotate(-90deg)}html .horizontal.open-top .viewport .nav-item.is-active .chevron{transform:rotate(90deg)}html .horizontal.open-top .toggle-content{border-top:1px solid rgba(255,255,255,.075);border-bottom:0}html .horizontal.open-top .toggle-content.hide{border-top:0}html .horizontal.open-top .toggle-content h3{padding-right:.25rem}html .horizontal.open-top .toggle-content .close-drawer{transform:rotate(0);margin:.25rem 0 0 0}html .horizontal{width:100%;max-height:48px;justify-content:flex-start}html .horizontal .viewport{display:flex;width:100%}html .horizontal .viewport>.nav{flex-wrap:nowrap;width:calc(100% - 40px)}html .horizontal .viewport .accordion{overflow-x:hidden;overflow-y:auto}html .horizontal .viewport .logo-wordmark{display:none}html .horizontal .viewport .viewport-header{position:static}html .horizontal .viewport .viewport-header .menu{position:absolute;top:50%;right:.5em;z-index:11;transform:translateY(-50%)}html .horizontal .viewport .viewport-header .dropdown-menu{right:-1em}html .horizontal .viewport .app-active::before{transition-property:width, left, right;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;width:23px;height:3px;top:unset;right:30%;bottom:0;left:30%}html .horizontal .viewport .app-active:hover::before{top:unset;width:100%;left:0}html .horizontal .viewport .nav-item .chevron{transform:rotate(90deg)}html .horizontal .viewport .nav-item.is-active .chevron{transform:rotate(-90deg)}html .horizontal .viewport .nav .applications-nav::before,html .horizontal .viewport .nav .favorite::after,html .horizontal .viewport .nav .viewport-footer:before{left:0;width:1px;height:calc(100% - 16px);top:8px}html .horizontal .viewport .nav .favorite::after{left:.563rem}html .horizontal .viewport .nav .favorite{height:3rem}html .horizontal .viewport .nav .favorite i{padding:.25rem 0;top:1rem}html .horizontal .viewport .nav .show-actions{overflow:hidden}html .horizontal .viewport .nav .show-actions:hover,html .horizontal .viewport .nav .show-actions.hover,html .horizontal .viewport .nav .show-actions.active{overflow:visible}html .horizontal .viewport .nav .show-actions:hover i,html .horizontal .viewport .nav .show-actions:hover .text-animation,html .horizontal .viewport .nav .show-actions:hover .action-menu-tool,html .horizontal .viewport .nav .show-actions:hover span,html .horizontal .viewport .nav .show-actions.hover i,html .horizontal .viewport .nav .show-actions.hover .text-animation,html .horizontal .viewport .nav .show-actions.hover .action-menu-tool,html .horizontal .viewport .nav .show-actions.hover span,html .horizontal .viewport .nav .show-actions.active i,html .horizontal .viewport .nav .show-actions.active .text-animation,html .horizontal .viewport .nav .show-actions.active .action-menu-tool,html .horizontal .viewport .nav .show-actions.active span{opacity:1;visibility:visible}html .horizontal .viewport .nav .show-actions:hover .layouts-nav .icon-size-16,html .horizontal .viewport .nav .show-actions.hover .layouts-nav .icon-size-16,html .horizontal .viewport .nav .show-actions.active .layouts-nav .icon-size-16{opacity:1;visibility:visible}html .horizontal .viewport .nav .show-actions:hover .layout-menu-tool li:first-of-type,html .horizontal .viewport .nav .show-actions.hover .layout-menu-tool li:first-of-type,html .horizontal .viewport .nav .show-actions.active .layout-menu-tool li:first-of-type{animation:none;border-right:0}html .horizontal .viewport .nav .show-actions:hover .layout-menu-tool li:last-of-type,html .horizontal .viewport .nav .show-actions.hover .layout-menu-tool li:last-of-type,html .horizontal .viewport .nav .show-actions.active .layout-menu-tool li:last-of-type{animation:none}html .horizontal .viewport .fav-app-nav{flex-wrap:nowrap}html .horizontal .viewport .nav-tabs{height:100%}html .horizontal .viewport .nav-tabs li{flex-basis:59px;width:60px}html .horizontal .viewport .nav-tabs li.fav-app-nav{flex-grow:1;display:flex;align-items:center}html .horizontal .viewport .nav-tabs li.fav-app-nav::-webkit-scrollbar{height:1px}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav{flex-wrap:nowrap;width:100%}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav::-webkit-scrollbar{width:0;height:1px}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav::-webkit-scrollbar-button{display:none}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav::-webkit-scrollbar-thumb{background-color:rgba(255,255,255,.3)}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav:hover{overflow-x:auto;overflow-y:scroll}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav:hover .app-active::before{height:2px}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav .nav-item{flex-basis:59px;overflow:hidden}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav .nav-item .text-animation,html .horizontal .viewport .nav-tabs li.fav-app-nav .nav .nav-item .text-animation:hover{display:none}html .horizontal .viewport .nav-tabs .nav-item{transition-property:flex-basis;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .horizontal .viewport .nav-tabs .nav-item.hover,html .horizontal .viewport .nav-tabs .nav-item:hover{flex-basis:11rem}html .horizontal .viewport .nav-tabs .nav-item.hover .nav-link .text-animation,html .horizontal .viewport .nav-tabs .nav-item:hover .nav-link .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:100ms;opacity:1;transform:translateX(0)}html .horizontal .viewport .nav-tabs .nav-item .nav-link.active::before{bottom:0}html .horizontal .viewport .nav-tabs .nav-item .nav-link.active .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:100ms;opacity:0;transform:translateX(0)}html .horizontal .viewport .nav-tabs .nav-item .nav-link.active:hover .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:100ms;opacity:1;transform:translateX(0)}html .horizontal .viewport .nav-tabs .layout-menu-tool{top:100%;flex-direction:column;height:6rem}html .horizontal .viewport .nav-tabs .layout-menu-tool li{width:100%;flex:0 1 auto}html .horizontal .viewport .nav-tabs .layout-menu-tool li:hover,html .horizontal .viewport .nav-tabs .layout-menu-tool li.hover,html .horizontal .viewport .nav-tabs .layout-menu-tool li.active{flex:0 1 auto}html .horizontal .viewport .nav-tabs.expand .menu{display:flex}html .horizontal .viewport .nav-tabs .viewport-footer{margin-top:initial;margin-left:auto;overflow-x:clip}html .horizontal .toggle-content{width:100%;max-height:1000px;border-top:0 solid rgba(0,0,0,0);border-left-width:1px;border-left-style:solid;transition-property:max-height;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .horizontal .toggle-content>.nav,html .horizontal .toggle-content>div{width:100%}html .horizontal .toggle-content:not(#app-content){height:auto}html .horizontal .toggle-content.hide{width:100%;max-height:0;border-bottom:0 solid rgba(0,0,0,0)}html .horizontal .close-drawer{transform:rotate(180deg);margin-left:0;margin-bottom:.375rem}.app-active{position:relative;background-color:rgba(255,255,255,.025)}.app-active::before{content:"";width:3px;position:absolute;top:30%;bottom:30%;left:0;background-color:#2080d3;transition:top .3s cubic-bezier(0.34, 0.03, 0.13, 0.93),bottom .3s cubic-bezier(0.34, 0.03, 0.13, 0.93)}.app-active:hover::before{top:0;bottom:0}/*# sourceMappingURL=app.css.map */ +@keyframes runleft{0%{opacity:0;transform:translateX(1rem)}100%{opacity:1;transform:translateX(0)}}@keyframes runright{0%{opacity:0;transform:translateX(-1rem)}100%{opacity:1;transform:translateX(0)}}html.dark .viewport{border:1px solid rgba(255,255,255,.075)}html.dark .toggle-content{background-color:var(--t42-body);border-top:1px solid rgba(255,255,255,.075);border-bottom:1px solid rgba(255,255,255,.075);border-right:1px solid rgba(255,255,255,.075);border-left-color:rgba(255,255,255,.075)}html.dark .toggle-content .close-drawer{color:#bbb}html.dark .toggle-content .close-drawer:hover{color:#fff}html.dark .applications-nav::after{background-color:rgba(255,255,255,.075);content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px)}html.dark .applications-nav:hover::after{background-color:rgba(0,0,0,0)}html.dark .viewport-footer::after{background-color:rgba(255,255,255,.075);content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px)}html.dark .viewport-footer:hover::after{background-color:rgba(0,0,0,0)}html.dark .favorite::after{background-color:rgba(255,255,255,.075)}html.dark .favorite i{background:#1e1e1e}html.dark .nav .layout-menu-tool{background-color:rgba(var(--t42-bg-light), 0.95)}html.dark .nav .layout-menu-tool li:first-of-type{border-right:1px solid rgba(255,255,255,.05)}html.dark .nav .layout-menu-tool li:hover,html.dark .nav .layout-menu-tool li.hover,html.dark .nav .layout-menu-tool li.active{background-color:rgba(255,255,255,.05);color:#fff}html.dark .nav .nav-link img{transition-property:filter;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;filter:grayscale(100%) brightness(1)}html.dark .nav .nav-link.active img,html.dark .nav .nav-link:hover img{filter:none}html.dark .select:hover{background-color:#252525}html.dark .select_items{border-color:rgba(255,255,255,.075)}html.dark .select_items:hover{border-color:#2080d3}html.dark .select_option{background-color:#1e1e1e}html.dark .select_expand::after{color:#eee}html.dark .select_expand:checked+.select_closeLabel+.select_options .select_label:hover{background-color:#252525}html.dark .horizontal .layout-menu-tool{border:1px solid rgba(255,255,255,.075)}html.dark .horizontal .layout-menu-tool li:first-child{border-bottom:1px solid rgba(255,255,255,.1)}html.dark .folder-content{background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 100%)}html.light .viewport{border:1px solid rgba(219,222,230,.8)}html.light .toggle-content{background-color:#fafafa;border-top:1px solid rgba(219,222,230,.8);border-bottom:1px solid rgba(219,222,230,.8);border-right:1px solid rgba(219,222,230,.8);border-left-color:rgba(219,222,230,.8)}html.light .toggle-content .close-drawer{color:#757575}html.light .toggle-content .close-drawer:hover{color:#0d0d0d}html.light .applications-nav::after{background-color:rgba(219,222,230,.8);content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px)}html.light .applications-nav:hover::after{background-color:rgba(0,0,0,0)}html.light .viewport-footer::after{background-color:rgba(219,222,230,.8);content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px)}html.light .viewport-footer:hover::after{background-color:rgba(0,0,0,0)}html.light .favorite::after{background-color:rgba(219,222,230,.8)}html.light .favorite i{background:#fafafa}html.light .nav .layout-menu-tool{background:#fff}html.light .nav .layouts-nav div:first-of-type{border-right:1px solid rgba(219,222,230,.8)}html.light .nav .layouts-nav div:hover,html.light .nav .layouts-nav div.hover,html.light .nav .layouts-nav div.active{background-color:rgba(219,222,230,.8);color:#000}html.light .nav .nav-link img{filter:invert(1)}html.light .nav .nav-link.active img,html.light .nav .nav-link:hover img{filter:invert(1) brightness(1.2)}html.light .select:hover{background-color:#fff}html.light .select_items:hover{border-color:#2080d3}html.light .select_option{background-color:#fafafa}html.light .select_option label{color:#757575}html.light .select_expand::after{color:#2c2c2c}html.light .select_expand:checked+.select_closeLabel+.select_options .select_label:hover{background-color:#f2f2f2;color:#2c2c2c}html.light .horizontal .layout-menu-tool{border:1px solid rgba(219,222,230,.8)}html.light .horizontal .layout-menu-tool li:first-child{border-bottom:1px solid rgba(0,0,0,.075)}html.light .folder-content{background:linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 100%)}.nav li.folder{flex-grow:0;overflow:hidden}.nav li.folder .action-menu .icon-size-16{width:1rem}.nav li.folder .action-menu .action-menu-tool .icon-angle-down{margin-right:.188rem}.nav li.folder .action-menu .action-menu-tool .icon-angle-down::before{display:inline-block;transform:rotate(-90deg)}.nav li.folder .action-menu .icon-folder-open-empty{display:none}.nav li.folder .action-menu:hover span:last-of-type{padding-right:0}.nav li.folder .nav-link.action-menu{min-height:3rem;max-height:3rem}.nav li.folder .folder-content{margin-left:5px}.nav li.folder.folder-open{flex-grow:0;flex-basis:auto}.nav li.folder.folder-open>.action-menu .icon-folder-open-empty{display:block}.nav li.folder.folder-open>.action-menu .icon-folder-empty{display:none}.nav li.folder.folder-open>.action-menu .action-menu-tool .icon-angle-down::before{transform:rotate(0)}:root{--logo-color-accent: #007be5}.dark{--logo-color-base: #ffffff}.light{--logo-color-base: #083044}html{height:100%}html body{height:100%;overflow:hidden;display:flex;justify-content:flex-start;background-color:rgba(0,0,0,0)}html .loaded .app{opacity:1}html .app{position:relative;height:100%;opacity:0}html .app.vertical{display:inline-flex}html .app.horizontal{display:flex;flex-direction:column}html .app.switching-orientation *{transition:none !important}html .app.switching-orientation *::before,html .app.switching-orientation *::after{transition:none !important}html .app *:focus{outline:none}html img,html a{user-select:none;-webkit-user-drag:none;-webkit-user-select:none}html .draggable{-webkit-app-region:drag}html .toggle-content{transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;height:100%;width:300px;overflow:hidden;visibility:visible;display:flex;flex-direction:column}html .toggle-content .input-group{flex-wrap:nowrap}html .toggle-content.hide{width:0;border-right:0 solid rgba(0,0,0,0)}html .toggle-content.hide .action-menu-tool{opacity:0}html .toggle-content>.nav{overflow:auto}html .toggle-content h5{white-space:nowrap;padding:0 .063rem}html .toggle-content .close-drawer{transition-property:color;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;font-size:.688rem;margin-left:.125rem;margin-right:.3125rem;cursor:pointer;transform:rotate(90deg)}html .settings-content{display:flex;flex-direction:column}html .settings-content>div{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}html .settings-content>div>div{display:flex;justify-content:space-between;align-items:center}html .switch .slider{border-color:rgba(0,0,0,0) !important;border-radius:.5rem;background-color:color-mix(in srgb, var(--secondary), transparent 75%)}html .switch .slider::before{border-radius:50%}html .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;opacity:0;transform:translateX(-1rem);overflow:hidden;text-overflow:ellipsis;margin:0 .5rem}html .nav-item.hover .nav-link{border-color:var(--t42-color-opacity-10);color:var(--t42-link-color);background-color:var(--t42-link-hover-bg)}html .nav.nav-tabs{border-bottom:none}html .nav.nav-tabs li{white-space:nowrap;flex-basis:3rem;flex-shrink:0}html .nav.nav-tabs .nav-item{user-select:none;position:relative;display:flex;flex-direction:column}html .nav.nav-tabs .nav-item.is-active .chevron{transform:rotate(180deg)}html .nav.nav-tabs .nav-link{height:auto;border:0;padding-left:14px;flex-grow:1;margin-right:0}html .nav.nav-tabs .nav-link .icon-size-16,html .nav.nav-tabs .nav-link>img,html .nav.nav-tabs .nav-link .title-app,html .nav.nav-tabs .nav-link .title-folder{margin:0 .5rem}html .nav.nav-tabs .nav-link img{transition-property:filter;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .nav.flex-column{flex-wrap:nowrap}html .nav.flex-column .nav-link{margin-bottom:0 !important}html .nav .applications-nav{position:relative;overflow:hidden}html .nav .applications-nav i{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .nav .applications-nav:hover .icon-angle-down,html .nav .applications-nav.active .icon-angle-down{opacity:1}html .nav .favorite{white-space:nowrap;flex-basis:1.25rem !important;user-select:none;overflow:hidden;text-align:center}html .nav .favorite i{position:relative;z-index:20;padding:0 .25rem}html .nav .favorite::after{content:"";height:1px;left:8px;position:absolute;width:calc(100% - 16px);bottom:11px}html .nav #fav-apps>li:not(.nav-item){transition-property:opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;opacity:0;white-space:nowrap}html .nav ul.nav .nav-item .nav-link.active::before,html .nav ul.nav .nav-item .nav-link:hover::before{width:0;height:0}html .nav .action-menu-tool{transition-property:opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;opacity:.65;margin-left:auto}html .nav .action-menu-tool .dropdown-menu{left:auto;right:0;z-index:20}html .nav .action-menu{cursor:pointer;overflow:hidden}html .nav .action-menu .dropdown-menu{min-width:auto}html .nav .action-menu a{text-decoration:none}html .nav .action-menu a:hover{text-decoration:none}html .nav .action-menu span:last-of-type{text-overflow:ellipsis;overflow:hidden;transition-property:opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .nav .action-menu .add-favorite{padding:0;height:2rem;width:2rem}html .nav .action-menu:hover .action-menu-tool{opacity:1}html .nav .layout-menu-tool{transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;display:flex;height:3rem;padding:0;opacity:0;position:absolute;visibility:hidden;width:100%;top:0;z-index:1}html .nav .layout-menu-tool li{display:flex;align-items:center;justify-content:center;flex:1 1 auto;width:100%;height:100%;cursor:pointer}html .nav .show-actions{position:relative;flex-shrink:0}html .nav .show-actions:hover i,html .nav .show-actions:hover .text-animation,html .nav .show-actions:hover .action-menu-tool,html .nav .show-actions:hover span,html .nav .show-actions.hover i,html .nav .show-actions.hover .text-animation,html .nav .show-actions.hover .action-menu-tool,html .nav .show-actions.hover span,html .nav .show-actions.active i,html .nav .show-actions.active .text-animation,html .nav .show-actions.active .action-menu-tool,html .nav .show-actions.active span{opacity:0;visibility:hidden}html .nav .show-actions:hover .layout-menu-tool,html .nav .show-actions.hover .layout-menu-tool,html .nav .show-actions.active .layout-menu-tool{opacity:1;visibility:visible}html .nav .show-actions:hover .layout-menu-tool li:first-of-type,html .nav .show-actions.hover .layout-menu-tool li:first-of-type,html .nav .show-actions.active .layout-menu-tool li:first-of-type{animation:runleft 300ms cubic-bezier(0.34, 0.03, 0.13, 0.93)}html .nav .show-actions:hover .layout-menu-tool li:last-of-type,html .nav .show-actions.hover .layout-menu-tool li:last-of-type,html .nav .show-actions.active .layout-menu-tool li:last-of-type{animation:runright 300ms cubic-bezier(0.34, 0.03, 0.13, 0.93)}html .nav-item[client-id] .action-menu,html .nav-item[instrument-id] .action-menu{cursor:initial}html .nav-item[client-id] .second-level .nav-link,html .nav-item[instrument-id] .second-level .nav-link{cursor:pointer}html .viewport{position:relative;z-index:15;border:1px solid rgba(255,255,255,.075);background-color:var(--t42-body);width:60px;user-select:none;transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .viewport .menu{display:flex}html .viewport .menu .icon-window-minimize{font-size:.5rem}html .viewport .menu .dropdown-menu{background-color:rgba(var(--t42-bg-light), 0.95)}html .viewport .viewport-header{position:relative}html .viewport .viewport-header a{text-decoration:none}html .viewport .viewport-header a:hover{text-decoration:none}html .viewport .viewport-header .menu{position:relative}html .viewport .viewport-header .menu .btn-icon{display:flex;align-items:center}html .viewport .viewport-header .dropdown-menu{top:32px;right:0;left:auto}html .viewport .viewport-header .logo{display:flex;align-items:center;width:100%;height:100%;padding:0 1.25em;overflow:hidden}html .viewport .viewport-header .logo svg{width:100%;height:100%}html .viewport .viewport-header .logo-icon{flex-shrink:0;width:2.33em;height:60%}html .viewport .accordion .active-app{position:absolute;left:57px}html .viewport .viewport-footer{position:relative;margin-top:auto}html .viewport .viewport-footer .nav.nav-tabs .nav-link{text-decoration:none}html .viewport .viewport-footer .nav.nav-tabs .nav-link:hover{text-decoration:none}html .viewport .viewport-footer .circle-index{transition-property:transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;align-items:center;background-color:#2080d3;border-radius:50%;display:flex;font-size:.5rem;height:.875rem;justify-content:center;margin-left:.875rem;margin-top:-0.375rem;position:absolute;transform:scale(1);width:.875rem}html .viewport .viewport-footer .circle-index.empty{transform:scale(0)}html .profile-actions .btn{flex:1 1 auto}html .modal.fade{display:block;width:200px;visibility:hidden}html .modal.fade .about-logo{width:2.5rem;overflow:hidden;margin:0 auto}html .modal.fade .modal-fill-in{justify-content:flex-start}html .modal.fade .modal-fill-in .modal-header .close{position:absolute;right:1rem;top:1rem}html .modal.fade.show{visibility:visible}html .active-app{margin-left:-14px}html [app-name].nav-item.fav-app i.icon-star-empty-1{display:none}html [app-name].nav-item:not(.fav-app) i.icon-star-full{display:none}html .select{list-style:none;display:flex;justify-content:center;align-items:center;width:100%;height:2rem;cursor:pointer;position:relative}html .select input[type=radio]{opacity:1}html .select_expand{width:0;height:2rem;position:absolute;top:0;right:0}html .select_expand:hover::after{opacity:1}html .select_expand:checked::after{transform:translate(-65%, -55%) rotate(-180deg)}html .select_expandLabel{display:block;width:100%;height:2rem;position:absolute;top:0;left:0;cursor:pointer;margin-bottom:0}html .select_close{display:none}html .select_closeLabel{position:fixed;top:0;left:0;display:none;margin-bottom:0}html .select_items{width:100%;position:absolute;top:0;left:0;min-height:2rem;border-width:1px;border-style:solid}html .select_input{display:none}html .select_label{transition:all 250ms cubic-bezier(0.4, 0.25, 0.3, 1);display:block;height:0;line-height:2rem;overflow:hidden;cursor:pointer;margin-bottom:0;padding-left:.875rem}html .select_label-placeholder{height:2rem;vertical-align:middle;position:absolute;top:0;left:0;background-color:rgba(0,0,0,0)}html .select_expand:checked+.select_closeLabel{display:block}html .select_expand:checked+.select_closeLabel::before,html .select_expand:checked+.select_closeLabel::after{display:none}html .select_expand:checked+.select_closeLabel+.select_options .select_label{height:2rem}html .select_expand:checked+.select_closeLabel+.select_options+.select_expandLabel{display:none}html .select_input:checked+.select_label{height:2rem}html .select_options{list-style:none;padding-left:0}html .vertical.open-left{transition-property:left, width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical.open-left.has-drawer{left:0}html .vertical.open-left .viewport{order:1}html .vertical.open-left .toggle-content{width:300px;transition-property:width, left;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical.open-left .toggle-content.hide{width:0px}html .vertical.open-left .toggle-content>div,html .vertical.open-left .toggle-content>.nav{width:auto}html .vertical.open-left .toggle-content h3{padding-right:0}html .vertical.open-left .toggle-content .close-drawer{transform:rotate(-90deg)}html .vertical{width:auto;left:300px}html .vertical .viewport{height:100%}html .vertical .viewport>.flex-column{height:100%}html .vertical .menu{max-width:0;opacity:0;transition-property:max-width, opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical .viewport-header{overflow:hidden}html .vertical .viewport-header .logo-wordmark{display:flex;align-items:center;justify-content:center;max-width:0;height:25%;padding-left:0;opacity:0;transition-property:all;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical .viewport-header .menu{max-width:0;opacity:0;pointer-events:none;margin-right:0;transition-property:all;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .vertical .viewport-header .dropdown-menu{right:-0.75em}html .vertical .fav-app-nav{flex-grow:1;overflow:hidden}html .vertical .expand{width:200px}html .vertical .expand .viewport-header{display:flex;align-items:center;justify-content:space-between;overflow:initial}html .vertical .expand .viewport-header .logo-wordmark{max-width:100%;padding-left:.8em;opacity:1}html .vertical .expand .menu{max-width:100%;opacity:1;pointer-events:all;margin-right:.75em}html .vertical .expand .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;opacity:1;transform:translateX(0)}html .vertical .expand .favorite{transition-property:opacity;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:300ms}html .vertical .expand .favorite i{padding:0 .75rem}html .vertical .expand .fav-app-nav{overflow-y:auto}html .vertical .expand .nav-link{max-width:200px}html .vertical .expand .accordion .nav .toggle-content{left:200px;display:list-item;transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:50ms}html .vertical .expand .accordion .nav .hide{width:0;transition-property:width;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:50ms}html .vertical .expand #fav-apps>li:not(.nav-item){opacity:1}html .horizontal.open-top{justify-content:flex-end}html .horizontal.open-top .viewport{order:1;margin-bottom:0;transition-property:margin-bottom;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:50ms}html .horizontal.open-top .viewport .dropdown-menu{top:auto;bottom:100%}html .horizontal.open-top .viewport .layouts-nav .layout-menu-tool{top:calc(-6rem + 2px)}html .horizontal.open-top .viewport .nav-item .chevron{transform:rotate(-90deg)}html .horizontal.open-top .viewport .nav-item.is-active .chevron{transform:rotate(90deg)}html .horizontal.open-top .toggle-content{border-top:1px solid rgba(255,255,255,.075);border-bottom:0}html .horizontal.open-top .toggle-content.hide{border-top:0}html .horizontal.open-top .toggle-content h3{padding-right:.25rem}html .horizontal.open-top .toggle-content .close-drawer{transform:rotate(0);margin:.25rem 0 0 0}html .horizontal{width:100%;max-height:48px;justify-content:flex-start}html .horizontal .viewport{display:flex;width:100%}html .horizontal .viewport>.nav{flex-wrap:nowrap;width:calc(100% - 40px)}html .horizontal .viewport .accordion{overflow-x:hidden;overflow-y:auto}html .horizontal .viewport .logo-wordmark{display:none}html .horizontal .viewport .viewport-header{position:static}html .horizontal .viewport .viewport-header .menu{position:absolute;top:50%;right:.5em;z-index:11;transform:translateY(-50%)}html .horizontal .viewport .viewport-header .dropdown-menu{right:-1em}html .horizontal .viewport .app-active::before{transition-property:width, left, right;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms;width:23px;height:3px;top:unset;right:30%;bottom:0;left:30%}html .horizontal .viewport .app-active:hover::before{top:unset;width:100%;left:0}html .horizontal .viewport .nav-item .chevron{transform:rotate(90deg)}html .horizontal .viewport .nav-item.is-active .chevron{transform:rotate(-90deg)}html .horizontal .viewport .nav .applications-nav::before,html .horizontal .viewport .nav .favorite::after,html .horizontal .viewport .nav .viewport-footer:before{left:0;width:1px;height:calc(100% - 16px);top:8px}html .horizontal .viewport .nav .favorite::after{left:.563rem}html .horizontal .viewport .nav .favorite{height:3rem}html .horizontal .viewport .nav .favorite i{padding:.25rem 0;top:1rem}html .horizontal .viewport .nav .show-actions{overflow:hidden}html .horizontal .viewport .nav .show-actions:hover,html .horizontal .viewport .nav .show-actions.hover,html .horizontal .viewport .nav .show-actions.active{overflow:visible}html .horizontal .viewport .nav .show-actions:hover i,html .horizontal .viewport .nav .show-actions:hover .text-animation,html .horizontal .viewport .nav .show-actions:hover .action-menu-tool,html .horizontal .viewport .nav .show-actions:hover span,html .horizontal .viewport .nav .show-actions.hover i,html .horizontal .viewport .nav .show-actions.hover .text-animation,html .horizontal .viewport .nav .show-actions.hover .action-menu-tool,html .horizontal .viewport .nav .show-actions.hover span,html .horizontal .viewport .nav .show-actions.active i,html .horizontal .viewport .nav .show-actions.active .text-animation,html .horizontal .viewport .nav .show-actions.active .action-menu-tool,html .horizontal .viewport .nav .show-actions.active span{opacity:1;visibility:visible}html .horizontal .viewport .nav .show-actions:hover .layouts-nav .icon-size-16,html .horizontal .viewport .nav .show-actions.hover .layouts-nav .icon-size-16,html .horizontal .viewport .nav .show-actions.active .layouts-nav .icon-size-16{opacity:1;visibility:visible}html .horizontal .viewport .nav .show-actions:hover .layout-menu-tool li:first-of-type,html .horizontal .viewport .nav .show-actions.hover .layout-menu-tool li:first-of-type,html .horizontal .viewport .nav .show-actions.active .layout-menu-tool li:first-of-type{animation:none;border-right:0}html .horizontal .viewport .nav .show-actions:hover .layout-menu-tool li:last-of-type,html .horizontal .viewport .nav .show-actions.hover .layout-menu-tool li:last-of-type,html .horizontal .viewport .nav .show-actions.active .layout-menu-tool li:last-of-type{animation:none}html .horizontal .viewport .fav-app-nav{flex-wrap:nowrap}html .horizontal .viewport .nav-tabs{height:100%}html .horizontal .viewport .nav-tabs li{flex-basis:59px;width:60px}html .horizontal .viewport .nav-tabs li.fav-app-nav{flex-grow:1;display:flex;align-items:center}html .horizontal .viewport .nav-tabs li.fav-app-nav::-webkit-scrollbar{height:1px}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav{flex-wrap:nowrap;width:100%}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav::-webkit-scrollbar{width:0;height:1px}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav::-webkit-scrollbar-button{display:none}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav::-webkit-scrollbar-thumb{background-color:rgba(255,255,255,.3)}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav:hover{overflow-x:auto;overflow-y:scroll}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav:hover .app-active::before{height:2px}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav .nav-item{flex-basis:59px;overflow:hidden}html .horizontal .viewport .nav-tabs li.fav-app-nav .nav .nav-item .text-animation,html .horizontal .viewport .nav-tabs li.fav-app-nav .nav .nav-item .text-animation:hover{display:none}html .horizontal .viewport .nav-tabs .nav-item{transition-property:flex-basis;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .horizontal .viewport .nav-tabs .nav-item.hover,html .horizontal .viewport .nav-tabs .nav-item:hover{flex-basis:11rem}html .horizontal .viewport .nav-tabs .nav-item.hover .nav-link .text-animation,html .horizontal .viewport .nav-tabs .nav-item:hover .nav-link .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:100ms;opacity:1;transform:translateX(0)}html .horizontal .viewport .nav-tabs .nav-item .nav-link.active::before{bottom:0}html .horizontal .viewport .nav-tabs .nav-item .nav-link.active .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:100ms;opacity:0;transform:translateX(0)}html .horizontal .viewport .nav-tabs .nav-item .nav-link.active:hover .text-animation{transition-property:opacity, transform;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:100ms;opacity:1;transform:translateX(0)}html .horizontal .viewport .nav-tabs .layout-menu-tool{top:100%;flex-direction:column;height:6rem}html .horizontal .viewport .nav-tabs .layout-menu-tool li{width:100%;flex:0 1 auto}html .horizontal .viewport .nav-tabs .layout-menu-tool li:hover,html .horizontal .viewport .nav-tabs .layout-menu-tool li.hover,html .horizontal .viewport .nav-tabs .layout-menu-tool li.active{flex:0 1 auto}html .horizontal .viewport .nav-tabs.expand .menu{display:flex}html .horizontal .viewport .nav-tabs .viewport-footer{margin-top:initial;margin-left:auto;overflow-x:clip}html .horizontal .toggle-content{width:100%;max-height:1000px;border-top:0 solid rgba(0,0,0,0);border-left-width:1px;border-left-style:solid;transition-property:max-height;transition-duration:300ms;transition-timing-function:cubic-bezier(0.34, 0.03, 0.13, 0.93);transition-delay:0ms}html .horizontal .toggle-content>.nav,html .horizontal .toggle-content>div{width:100%}html .horizontal .toggle-content:not(#app-content){height:auto}html .horizontal .toggle-content.hide{width:100%;max-height:0;border-bottom:0 solid rgba(0,0,0,0)}html .horizontal .close-drawer{transform:rotate(180deg);margin-left:0;margin-bottom:.375rem}.app-active{position:relative;background-color:rgba(255,255,255,.025)}.app-active::before{content:"";width:3px;position:absolute;top:30%;bottom:30%;left:0;background-color:#2080d3;transition:top .3s cubic-bezier(0.34, 0.03, 0.13, 0.93),bottom .3s cubic-bezier(0.34, 0.03, 0.13, 0.93)}.app-active:hover::before{top:0;bottom:0}/*# sourceMappingURL=app.css.map */ diff --git a/scss/app.css.map b/scss/app.css.map index d995cd5..c903c32 100644 --- a/scss/app.css.map +++ b/scss/app.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["mixin.scss","color.scss","folders.scss","app.scss","select.scss","left.scss","vertical.scss","top.scss","horizontal.scss"],"names":[],"mappings":"AAgFE,mBACE,GACE,UACA,2BAGF,KACE,UACA,yBAIJ,oBACE,GACE,UACA,4BAGF,KACE,UACA,yBClGJ,oBACE,wCAGF,0BACE,iCACA,4CACA,+CACA,8CACA,yCAEA,wCACE,WAEA,8CACE,WDPJ,mCAEI,wCAKF,WACA,WACA,SACA,kBACA,wBAIA,yCACE,+BAhBJ,kCAEI,wCAKF,WACA,WACA,SACA,kBACA,wBAIA,wCACE,+BCKJ,2BACE,wCAGF,sBACE,mBAKF,iCACE,iDAGE,kDACE,6CAGF,+HAGE,uCACA,WAMJ,6BDpBF,2BACA,0BACA,gEACA,qBCmBI,qCAKA,uEACE,YAON,wBACE,yBAGF,wBACE,oCAEA,8BACE,qBAIJ,yBACE,yBAIA,gCACE,WAIA,wFACE,yBAMN,wCACE,wCAEA,uDACE,6CAMN,0BACE,6FASF,qBACE,sCAGF,2BACE,yBACA,0CACA,6CACA,4CACA,uCAEA,yCACE,cAEA,+CACE,cDhIJ,oCAII,sCAGF,WACA,WACA,SACA,kBACA,wBAIA,0CACE,+BAhBJ,mCAII,sCAGF,WACA,WACA,SACA,kBACA,wBAIA,yCACE,+BC8HJ,4BACE,sCAGF,uBACE,mBAKF,kCACE,gBAIA,+CACE,4CAGF,sHAGE,sCACA,WAKF,8BACE,iBAKA,yEACE,iCAON,yBACE,sBAIA,+BACE,qBAIJ,0BACE,yBAEA,gCACE,cAKF,iCACE,cAIA,yFACE,yBACA,cAON,yCACE,sCAEA,wDACE,yCAMN,2BACE,iFC9OJ,eACE,YACA,gBAGE,0CACE,WAGF,+DACE,qBAEA,uEACE,qBACA,yBAIJ,oDACE,aAIA,oDACE,gBAKN,qCACE,gBACA,gBAGF,+BACE,gBAGF,2BACE,YACA,gBAGE,gEACE,cAGF,2DACE,aAIA,mFACE,oBCjDV,MACE,6BAGF,MACE,2BAGF,OACE,2BAGF,KACE,YAEA,UACE,YACA,gBACA,aACA,2BACA,+BAIA,kBACE,UAIJ,UACE,kBACA,YACA,UAEA,mBACE,oBAGF,qBACE,aACA,sBAGF,kCACE,2BAEA,mFAEE,2BAIJ,kBACE,aAIJ,gBAEE,iBACA,uBACA,yBAGF,gBACE,wBAGF,qBHjCE,0BACA,0BACA,gEACA,qBGgCA,YACA,YACA,gBACA,mBACA,aACA,sBAGA,kCACE,iBAGF,0BACE,QACA,mCAEA,4CACE,UAIJ,0BACE,cAGF,wBACE,mBACA,kBAGF,mCHjEA,0BACA,0BACA,gEACA,qBGgEE,kBACA,oBACA,sBACA,eACA,wBAIJ,qBH3EE,uCACA,0BACA,gEACA,qBAME,UAMA,4BG8DF,gBACA,uBACA,eAMI,+BACE,yCACA,4BACA,0CAKN,mBACE,mBAEA,sBACE,mBACA,gBACA,cAGF,6BACE,iBACA,kBACA,aACA,sBAGE,gDACE,yBAKN,6BACE,YACA,SACA,kBACA,YACA,eAEA,+JAIE,eAGF,iCHjIJ,2BACA,0BACA,gEACA,qBGoIA,sBACE,iBAEA,gCACE,2BAIJ,4BACE,kBACA,gBAEA,8BHnJF,uCACA,0BACA,gEACA,qBGsJI,uGACE,UAKN,oBACE,mBACA,8BACA,iBACA,gBACA,kBAEA,sBACE,kBACA,WACA,iBAGF,2BACE,WACA,WACA,SACA,kBACA,wBACA,YAKF,sCHvLF,4BACA,0BACA,gEACA,qBGsLI,UACA,mBAIJ,uGAEE,QACA,SAGF,4BHpMA,4BACA,0BACA,gEACA,qBGmME,YACA,iBAEA,2CACE,UACA,QACA,WAIJ,uBACE,eACA,gBAEA,sCACE,eAGF,yBH7PF,qBAEA,+BACE,qBG8PA,yCACE,uBACA,gBH9NJ,4BACA,0BACA,gEACA,qBG+NE,qCACE,UACA,YACA,WAIA,+CACE,UAKN,4BH/OA,0BACA,0BACA,gEACA,qBG8OE,aACA,YACA,UACA,UACA,kBACA,kBACA,WACA,MACA,UAEA,+BACE,aACA,mBACA,uBACA,cACA,WACA,YACA,eAIJ,wBACE,kBACA,cAKE,ueAIE,UACA,kBAGF,iJACE,UACA,mBAGE,oMACE,6DAGF,iMACE,8DAUV,kFACE,eAGF,wGACE,eAIJ,eACE,kBACA,WACA,wCACA,iCACA,WACA,iBHxTA,0BACA,0BACA,gEACA,qBGwTA,qBACE,aAEA,2CACE,gBAGF,oCACE,iDAIJ,gCACE,kBAEA,kCH/WF,qBAEA,wCACE,qBGgXA,sCACE,kBAEA,gDACE,aACA,mBAIJ,+CACE,SACA,QACA,UAGF,sCACE,aACA,mBACA,WACA,YACA,iBACA,gBAEA,0CACE,WACA,YAGF,2CACE,cACA,aACA,WAMJ,sCACE,kBACA,UAIJ,gCACE,kBACA,gBAGE,wDHnaJ,qBAEA,8DACE,qBGqaA,8CHnYF,8BACA,0BACA,gEACA,qBGkYI,mBACA,yBACA,kBACA,aACA,gBACA,eACA,uBACA,oBACA,qBACA,kBACA,mBACA,cAEA,oDACE,mBAMR,2BACE,cAGF,iBACE,cACA,YACA,kBAEA,6BACE,aACA,gBACA,cAGF,gCACE,2BAEA,qDACE,kBACA,WACA,SAIJ,sBACE,mBAIJ,iBACE,kBAKE,qDACE,aAKF,wDACE,aC3eR,aACE,gBACA,aACA,uBACA,mBACA,WACA,YACA,eACA,kBAEA,+BACE,UAGF,oBACE,QACA,YACA,kBACA,MACA,QAEA,iCACE,UAGF,mCACE,gDAIJ,yBACE,cACA,WACA,YACA,kBACA,MACA,OACA,eACA,gBAGF,mBACE,aAGF,wBACE,eACA,MACA,OACA,aACA,gBAGF,mBACE,WACA,kBACA,MACA,OACA,gBACA,iBACA,mBAGF,mBACE,aAGF,mBACE,qDACA,cACA,SACA,iBACA,gBACA,eACA,gBACA,qBAEA,+BACE,YACA,sBACA,kBACA,MACA,OACA,+BAKF,+CACE,cAEA,6GAEE,aAIA,6EACE,YAGF,mFACE,aAMR,yCACE,YAGF,qBACE,gBACA,eCjHF,yBLsCE,gCACA,0BACA,gEACA,qBKtCA,oCACE,OAGF,mCACE,QAGF,yCACE,YL0BF,gCACA,0BACA,gEACA,qBK1BE,8CACE,UAGF,2FAEE,WAGF,4CACE,gBAGF,uDACE,yBC5BR,eACE,WACA,WAEA,yBACE,YAEA,sCACE,YAIJ,qBACE,YACA,UNuBA,uCACA,0BACA,gEACA,qBMtBF,gCACE,gBAEA,+CACE,aACA,mBACA,uBACA,YACA,WACA,eACA,UNSF,wBACA,0BACA,gEACA,qBMRA,sCACE,YACA,UACA,oBACA,eNCF,wBACA,0BACA,gEACA,oEMCE,cAIJ,4BACE,YACA,gBAGF,uBACE,YAEA,wCACE,aACA,mBACA,8BACA,iBAEA,uDACE,eACA,kBACA,UAIJ,6BACE,eACA,UACA,mBACA,mBAGF,uCNpCA,uCACA,0BACA,gEACA,qBAQE,UAQA,wBMqBF,iCNxCA,4BACA,0BACA,gEACA,uBMuCE,mCACE,iBAIJ,oCACE,gBAGF,iCACE,gBAKE,uDACE,WACA,kBN3DN,0BACA,0BACA,gEACA,sBM4DI,6CACE,QNhEN,0BACA,0BACA,gEACA,sBMoEE,mDACE,UC9GN,0BACE,yBAEA,oCACE,QACA,gBPiCF,kCACA,0BACA,gEACA,sBOjCE,mDACE,SACA,YAIA,mEACE,sBAKF,uDACE,yBAIA,iEACE,wBAMR,0CACE,4CACA,gBAEA,+CACE,aAGF,6CACE,qBAGF,wDACE,oBACA,oBC7CR,iBACE,WACA,gBACA,2BAEA,2BACE,aACA,WAEA,gCACE,iBACA,wBAGF,sCACE,kBACA,gBAGF,0CACE,aAGF,4CACE,gBAEA,kDACE,kBACA,QACA,WACA,WACA,2BAGF,2DACE,WAKF,+CRHF,uCACA,0BACA,gEACA,qBQEI,WACA,WACA,UACA,UACA,SACA,SAIA,qDACE,UACA,WACA,OAOF,8CACE,wBAIA,wDACE,yBAKN,mKR1CF,OACA,UACA,yBACA,QQ6CE,iDACE,aAGF,0CACE,YAEA,4CACE,iBACA,SAIJ,8CACE,gBAEA,6JAGE,iBAEA,+uBAIE,UACA,mBAIA,8OACE,UACA,mBAKF,sQACE,eACA,eAGF,mQACE,eAOV,wCACE,iBAGF,qCACE,YAEA,wCACE,gBACA,WAEA,oDACE,YACA,aACA,mBAEA,uEACE,WAGF,yDACE,iBACA,WAEA,4EACE,QACA,WAGF,mFACE,aAGF,kFACE,sCAGF,+DACE,gBACA,kBAEA,mFACE,WAIJ,mEACE,gBACA,gBAEA,4KAEE,aAOV,+CRtJF,+BACA,0BACA,gEACA,qBQsJI,0GAEE,iBAGE,8JR9JR,uCACA,0BACA,gEACA,uBAQE,UAQA,wBQmJM,wEACE,SAGF,gFR1KR,uCACA,0BACA,gEACA,uBAME,UAUA,wBQ4JQ,sFR/KV,uCACA,0BACA,gEACA,uBAQE,UAQA,wBQoKA,uDACE,SACA,sBACA,YAEA,0DACE,WACA,cAEA,iMAGE,cAMJ,kDACE,aAIJ,sDACE,mBACA,iBACA,gBAKN,iCACE,WACA,kBACA,iCACA,sBACA,wBR3NA,+BACA,0BACA,gEACA,qBQ2NA,2EAEE,WAGF,mDACE,YAGF,sCACE,WACA,aACA,oCAIJ,+BACE,yBACA,cACA,sBL6NJ,YACE,kBACA,wCAEA,oBACE,WACA,UACA,kBACA,QACA,WACA,OACA,yBACA,wGAKA,0BACE,MACA","file":"app.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["mixin.scss","color.scss","folders.scss","app.scss","select.scss","left.scss","vertical.scss","top.scss","horizontal.scss"],"names":[],"mappings":"AAgFE,mBACE,GACE,UACA,2BAGF,KACE,UACA,yBAIJ,oBACE,GACE,UACA,4BAGF,KACE,UACA,yBClGJ,oBACE,wCAGF,0BACE,iCACA,4CACA,+CACA,8CACA,yCAEA,wCACE,WAEA,8CACE,WDPJ,mCAEI,wCAKF,WACA,WACA,SACA,kBACA,wBAIA,yCACE,+BAhBJ,kCAEI,wCAKF,WACA,WACA,SACA,kBACA,wBAIA,wCACE,+BCKJ,2BACE,wCAGF,sBACE,mBAKF,iCACE,iDAGE,kDACE,6CAGF,+HAGE,uCACA,WAMJ,6BDpBF,2BACA,0BACA,gEACA,qBCmBI,qCAKA,uEACE,YAON,wBACE,yBAGF,wBACE,oCAEA,8BACE,qBAIJ,yBACE,yBAIA,gCACE,WAIA,wFACE,yBAMN,wCACE,wCAEA,uDACE,6CAMN,0BACE,6FASF,qBACE,sCAGF,2BACE,yBACA,0CACA,6CACA,4CACA,uCAEA,yCACE,cAEA,+CACE,cDhIJ,oCAII,sCAGF,WACA,WACA,SACA,kBACA,wBAIA,0CACE,+BAhBJ,mCAII,sCAGF,WACA,WACA,SACA,kBACA,wBAIA,yCACE,+BC8HJ,4BACE,sCAGF,uBACE,mBAKF,kCACE,gBAIA,+CACE,4CAGF,sHAGE,sCACA,WAKF,8BACE,iBAKA,yEACE,iCAON,yBACE,sBAIA,+BACE,qBAIJ,0BACE,yBAEA,gCACE,cAKF,iCACE,cAIA,yFACE,yBACA,cAON,yCACE,sCAEA,wDACE,yCAMN,2BACE,iFC9OJ,eACE,YACA,gBAGE,0CACE,WAGF,+DACE,qBAEA,uEACE,qBACA,yBAIJ,oDACE,aAIA,oDACE,gBAKN,qCACE,gBACA,gBAGF,+BACE,gBAGF,2BACE,YACA,gBAGE,gEACE,cAGF,2DACE,aAIA,mFACE,oBCjDV,MACE,6BAGF,MACE,2BAGF,OACE,2BAGF,KACE,YAEA,UACE,YACA,gBACA,aACA,2BACA,+BAIA,kBACE,UAIJ,UACE,kBACA,YACA,UAEA,mBACE,oBAGF,qBACE,aACA,sBAGF,kCACE,2BAEA,mFAEE,2BAIJ,kBACE,aAIJ,gBAEE,iBACA,uBACA,yBAGF,gBACE,wBAGF,qBHjCE,0BACA,0BACA,gEACA,qBGgCA,YACA,YACA,gBACA,mBACA,aACA,sBAGA,kCACE,iBAGF,0BACE,QACA,mCAEA,4CACE,UAIJ,0BACE,cAGF,wBACE,mBACA,kBAGF,mCHjEA,0BACA,0BACA,gEACA,qBGgEE,kBACA,oBACA,sBACA,eACA,wBAIJ,uBACE,aACA,sBAGF,2BACE,aACA,sBACA,UACA,cAGF,+BACE,aACA,8BACA,mBAIA,qBACE,sCACA,oBACA,uEAEA,6BACE,kBAKN,qBHzGE,uCACA,0BACA,gEACA,qBAME,UAMA,4BG4FF,gBACA,uBACA,eAMI,+BACE,yCACA,4BACA,0CAKN,mBACE,mBAEA,sBACE,mBACA,gBACA,cAGF,6BACE,iBACA,kBACA,aACA,sBAGE,gDACE,yBAKN,6BACE,YACA,SACA,kBACA,YACA,eAEA,+JAIE,eAGF,iCH/JJ,2BACA,0BACA,gEACA,qBGkKA,sBACE,iBAEA,gCACE,2BAIJ,4BACE,kBACA,gBAEA,8BHjLF,uCACA,0BACA,gEACA,qBGoLI,uGACE,UAKN,oBACE,mBACA,8BACA,iBACA,gBACA,kBAEA,sBACE,kBACA,WACA,iBAGF,2BACE,WACA,WACA,SACA,kBACA,wBACA,YAKF,sCHrNF,4BACA,0BACA,gEACA,qBGoNI,UACA,mBAIJ,uGAEE,QACA,SAGF,4BHlOA,4BACA,0BACA,gEACA,qBGiOE,YACA,iBAEA,2CACE,UACA,QACA,WAIJ,uBACE,eACA,gBAEA,sCACE,eAGF,yBH3RF,qBAEA,+BACE,qBG4RA,yCACE,uBACA,gBH5PJ,4BACA,0BACA,gEACA,qBG6PE,qCACE,UACA,YACA,WAIA,+CACE,UAKN,4BH7QA,0BACA,0BACA,gEACA,qBG4QE,aACA,YACA,UACA,UACA,kBACA,kBACA,WACA,MACA,UAEA,+BACE,aACA,mBACA,uBACA,cACA,WACA,YACA,eAIJ,wBACE,kBACA,cAKE,ueAIE,UACA,kBAGF,iJACE,UACA,mBAGE,oMACE,6DAGF,iMACE,8DAUV,kFACE,eAGF,wGACE,eAIJ,eACE,kBACA,WACA,wCACA,iCACA,WACA,iBHtVA,0BACA,0BACA,gEACA,qBGsVA,qBACE,aAEA,2CACE,gBAGF,oCACE,iDAIJ,gCACE,kBAEA,kCH7YF,qBAEA,wCACE,qBG8YA,sCACE,kBAEA,gDACE,aACA,mBAIJ,+CACE,SACA,QACA,UAGF,sCACE,aACA,mBACA,WACA,YACA,iBACA,gBAEA,0CACE,WACA,YAGF,2CACE,cACA,aACA,WAMJ,sCACE,kBACA,UAIJ,gCACE,kBACA,gBAGE,wDHjcJ,qBAEA,8DACE,qBGmcA,8CHjaF,8BACA,0BACA,gEACA,qBGgaI,mBACA,yBACA,kBACA,aACA,gBACA,eACA,uBACA,oBACA,qBACA,kBACA,mBACA,cAEA,oDACE,mBAMR,2BACE,cAGF,iBACE,cACA,YACA,kBAEA,6BACE,aACA,gBACA,cAGF,gCACE,2BAEA,qDACE,kBACA,WACA,SAIJ,sBACE,mBAIJ,iBACE,kBAKE,qDACE,aAKF,wDACE,aCzgBR,aACE,gBACA,aACA,uBACA,mBACA,WACA,YACA,eACA,kBAEA,+BACE,UAGF,oBACE,QACA,YACA,kBACA,MACA,QAEA,iCACE,UAGF,mCACE,gDAIJ,yBACE,cACA,WACA,YACA,kBACA,MACA,OACA,eACA,gBAGF,mBACE,aAGF,wBACE,eACA,MACA,OACA,aACA,gBAGF,mBACE,WACA,kBACA,MACA,OACA,gBACA,iBACA,mBAGF,mBACE,aAGF,mBACE,qDACA,cACA,SACA,iBACA,gBACA,eACA,gBACA,qBAEA,+BACE,YACA,sBACA,kBACA,MACA,OACA,+BAKF,+CACE,cAEA,6GAEE,aAIA,6EACE,YAGF,mFACE,aAMR,yCACE,YAGF,qBACE,gBACA,eCjHF,yBLsCE,gCACA,0BACA,gEACA,qBKtCA,oCACE,OAGF,mCACE,QAGF,yCACE,YL0BF,gCACA,0BACA,gEACA,qBK1BE,8CACE,UAGF,2FAEE,WAGF,4CACE,gBAGF,uDACE,yBC5BR,eACE,WACA,WAEA,yBACE,YAEA,sCACE,YAIJ,qBACE,YACA,UNuBA,uCACA,0BACA,gEACA,qBMtBF,gCACE,gBAEA,+CACE,aACA,mBACA,uBACA,YACA,WACA,eACA,UNSF,wBACA,0BACA,gEACA,qBMRA,sCACE,YACA,UACA,oBACA,eNCF,wBACA,0BACA,gEACA,oEMCE,cAIJ,4BACE,YACA,gBAGF,uBACE,YAEA,wCACE,aACA,mBACA,8BACA,iBAEA,uDACE,eACA,kBACA,UAIJ,6BACE,eACA,UACA,mBACA,mBAGF,uCNpCA,uCACA,0BACA,gEACA,qBAQE,UAQA,wBMqBF,iCNxCA,4BACA,0BACA,gEACA,uBMuCE,mCACE,iBAIJ,oCACE,gBAGF,iCACE,gBAKE,uDACE,WACA,kBN3DN,0BACA,0BACA,gEACA,sBM4DI,6CACE,QNhEN,0BACA,0BACA,gEACA,sBMoEE,mDACE,UC9GN,0BACE,yBAEA,oCACE,QACA,gBPiCF,kCACA,0BACA,gEACA,sBOjCE,mDACE,SACA,YAIA,mEACE,sBAKF,uDACE,yBAIA,iEACE,wBAMR,0CACE,4CACA,gBAEA,+CACE,aAGF,6CACE,qBAGF,wDACE,oBACA,oBC7CR,iBACE,WACA,gBACA,2BAEA,2BACE,aACA,WAEA,gCACE,iBACA,wBAGF,sCACE,kBACA,gBAGF,0CACE,aAGF,4CACE,gBAEA,kDACE,kBACA,QACA,WACA,WACA,2BAGF,2DACE,WAKF,+CRHF,uCACA,0BACA,gEACA,qBQEI,WACA,WACA,UACA,UACA,SACA,SAIA,qDACE,UACA,WACA,OAOF,8CACE,wBAIA,wDACE,yBAKN,mKR1CF,OACA,UACA,yBACA,QQ6CE,iDACE,aAGF,0CACE,YAEA,4CACE,iBACA,SAIJ,8CACE,gBAEA,6JAGE,iBAEA,+uBAIE,UACA,mBAIA,8OACE,UACA,mBAKF,sQACE,eACA,eAGF,mQACE,eAOV,wCACE,iBAGF,qCACE,YAEA,wCACE,gBACA,WAEA,oDACE,YACA,aACA,mBAEA,uEACE,WAGF,yDACE,iBACA,WAEA,4EACE,QACA,WAGF,mFACE,aAGF,kFACE,sCAGF,+DACE,gBACA,kBAEA,mFACE,WAIJ,mEACE,gBACA,gBAEA,4KAEE,aAOV,+CRtJF,+BACA,0BACA,gEACA,qBQsJI,0GAEE,iBAGE,8JR9JR,uCACA,0BACA,gEACA,uBAQE,UAQA,wBQmJM,wEACE,SAGF,gFR1KR,uCACA,0BACA,gEACA,uBAME,UAUA,wBQ4JQ,sFR/KV,uCACA,0BACA,gEACA,uBAQE,UAQA,wBQoKA,uDACE,SACA,sBACA,YAEA,0DACE,WACA,cAEA,iMAGE,cAMJ,kDACE,aAIJ,sDACE,mBACA,iBACA,gBAKN,iCACE,WACA,kBACA,iCACA,sBACA,wBR3NA,+BACA,0BACA,gEACA,qBQ2NA,2EAEE,WAGF,mDACE,YAGF,sCACE,WACA,aACA,oCAIJ,+BACE,yBACA,cACA,sBL2PJ,YACE,kBACA,wCAEA,oBACE,WACA,UACA,kBACA,QACA,WACA,OACA,yBACA,wGAKA,0BACE,MACA","file":"app.css"} \ No newline at end of file diff --git a/scss/app.scss b/scss/app.scss index 609589e..62a5cba 100644 --- a/scss/app.scss +++ b/scss/app.scss @@ -112,6 +112,36 @@ html { } } + .settings-content { + display: flex; + flex-direction: column; + } + + .settings-content > div { + display: flex; + flex-direction: column; + gap: 0.5rem; + padding: 0.5rem; + } + + .settings-content > div > div { + display: flex; + justify-content: space-between; + align-items: center; + } + + .switch { + .slider { + border-color: transparent !important; + border-radius: 0.5rem; + background-color: color-mix(in srgb, var(--secondary), transparent 50%); + + &::before { + border-radius: 50%; + } + } + } + .text-animation { @include text-animation("off", "left", 0); overflow: hidden; From 6ee25c3a35c4c3f835129587a4d8dbc22ed26c23 Mon Sep 17 00:00:00 2001 From: Galin Iliev Date: Wed, 29 May 2024 15:18:04 +0300 Subject: [PATCH 02/12] G4E-5814 - Update settings panel with the new system section. --- index.html | 49 +++++++++++++++++++++++++++++++++++++++++------- scss/app.css | 2 +- scss/app.css.map | 2 +- scss/app.scss | 12 ++++++++++++ 4 files changed, 56 insertions(+), 9 deletions(-) diff --git a/index.html b/index.html index 718267d..cd067f8 100644 --- a/index.html +++ b/index.html @@ -262,11 +262,16 @@
Save Layouts
id="settings-content" menu-id="settings" > -
+
-
General Settings
+
Settings
+
+
+
+
General Settings
+