local-it/vikunja-frontend
0
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Fix kanban height on mobile

Browse source
This commit is contained in:
kolaente 2021-01-24 12:31:30 +01:00
parent 2ee2dffaa7
commit e0d120da5d
No known key found for this signature in database
GPG key ID: F40E70337AB24C9B
1 changed files with 11 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/styles/components/kanban.scss
View file

@ -4,6 +4,8 @@ $ease-out: all .3s cubic-bezier(0.23, 1, 0.32, 1);
$bucket-width: 300px; $bucket-width: 300px;
$crazy-height-calculation: '100vh - 4.5rem - 1.5rem - 1rem - 1.5rem - 11px'; $crazy-height-calculation: '100vh - 4.5rem - 1.5rem - 1rem - 1.5rem - 11px';
$crazy-height-calculation-tasks: '#{$crazy-height-calculation} - 1rem - 2.5rem - 2rem - #{$button-height} - 1rem';
$filter-container-height: '1rem - #{$switch-view-height}';
.app-content.list\.kanban { .app-content.list\.kanban {
padding-bottom: 0; padding-bottom: 0;
@ -19,6 +21,10 @@ $crazy-height-calculation: '100vh - 4.5rem - 1.5rem - 1rem - 1.5rem - 11px';
margin: 0 -1.5rem; margin: 0 -1.5rem;
padding: 0 1.5rem; padding: 0 1.5rem;
@media screen and (max-width: $tablet) {
height: calc(#{$crazy-height-calculation} - #{$filter-container-height});
}
.bucket { .bucket {
background-color: $bucket-background; background-color: $bucket-background;
border-radius: $radius; border-radius: $radius;
@ -31,9 +37,13 @@ $crazy-height-calculation: '100vh - 4.5rem - 1.5rem - 1rem - 1.5rem - 11px';
max-width: $bucket-width; max-width: $bucket-width;
.tasks { .tasks {
max-height: calc(#{$crazy-height-calculation} - 1rem - 2.5rem - 2rem - #{$button-height} - 1rem); max-height: calc(#{$crazy-height-calculation-tasks});
overflow: auto; overflow: auto;
@media screen and (max-width: $tablet) {
max-height: calc(#{$crazy-height-calculation-tasks} - #{$filter-container-height});
}
.task { .task {
&:first-child { &:first-child {