Skip to content

Commit

Permalink
Enable fluid page layout on medium size viewports (#21178)
Browse files Browse the repository at this point in the history
Fomantic has abrupt breakpoints at 991px and 768px which leads to
variable amounts of wasted screen space below those breakpoints.
Instead, enable fluid width for all viewport sizes below 1200px.
  • Loading branch information
silverwind committed Sep 19, 2022
1 parent c5e88fb commit d0e3c53
Showing 1 changed file with 7 additions and 0 deletions.
7 changes: 7 additions & 0 deletions web_src/less/_base.less
Original file line number Diff line number Diff line change
Expand Up @@ -737,6 +737,13 @@ a.ui.card:hover,
padding-bottom: 80px;
}

/* enable fluid page widths for medium size viewports */
@media @mediaMdAndUp and @mediaLgAndDown {
.ui.ui.ui.container:not(.fluid) {
width: calc(100vw - 3em);
}
}

.following.bar {
z-index: 900;
left: 0;
Expand Down

0 comments on commit d0e3c53

Please sign in to comment.