screen size optimizations

This commit is contained in:
booploops 2022-05-26 22:42:20 -07:00
parent def6ee6c8a
commit ada1360578
2 changed files with 33 additions and 1 deletions

View file

@ -291,4 +291,36 @@
bottom: 96px; bottom: 96px;
} }
} }
}
// screen width is less than 768px
@media (max-width: 1100px) {
#app.twopanel .app-chrome:not(.chrome-bottom) .app-chrome--center {
flex: unset;
}
#app.twopanel .app-chrome:not(.chrome-bottom) .app-chrome--center .top-nav-group .app-sidebar-item {
min-width: 110px;
font-size: 0em;
.sidebar-icon {
margin: 0px;
}
}
}
@media (max-width: 1000px) {
#app.twopanel .app-chrome:not(.chrome-bottom) .app-chrome--center {
flex: unset;
}
#app.twopanel .app-chrome:not(.chrome-bottom) .app-chrome--center .top-nav-group .app-sidebar-item {
min-width: 60px;
font-size: 0em;
.sidebar-icon {
margin: 0px;
}
}
} }

View file

@ -29,7 +29,7 @@
</div> </div>
<template v-if="getThemeDirective('appNavigation') != 'seperate'"> <template v-if="getThemeDirective('appNavigation') != 'seperate'">
<div <div
class="vdiv display--large" class="vdiv"
v-if="getThemeDirective('windowLayout') == 'twopanel'" v-if="getThemeDirective('windowLayout') == 'twopanel'"
></div> ></div>
<div class="app-chrome-item"> <div class="app-chrome-item">