Fix file page layout shift (#1150)

This commit is contained in:
saltrafael 2022-03-18 11:25:14 -03:00 committed by GitHub
parent 496c90db0e
commit 341bd1341d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 0 deletions

View file

@ -133,6 +133,7 @@ function Page(props: Props) {
'main--full-width hide-ribbon': fullWidthPage,
'main--auth-page': authPage,
'main--file-page': filePage,
'main--video-page': filePage && !videoTheaterMode && !livestream && !isMarkdown,
'main--settings-page': settingsPage,
'main--markdown': isMarkdown,
'main--theater-mode': isOnFilePage && videoTheaterMode && !livestream && !isMarkdown && !isMobile,

View file

@ -510,6 +510,24 @@ body {
}
}
.main--video-page {
@media (min-width: $breakpoint-medium) {
$recommended-width: calc(var(--recommended-content-width) - var(--spacing-l) * 3 - var(--spacing-m) * 2);
display: grid;
grid-template-columns: 1fr $recommended-width;
justify-content: space-between;
gap: var(--spacing-l);
.file-page__recommended {
margin: 0 !important;
height: 100% !important;
width: 100% !important;
overflow: hidden;
}
}
}
.card__title-section--body-list {
display: unset !important;
// width: 100%;

View file

@ -53,6 +53,7 @@
--mobile: 600px;
--side-nav-width: 230px;
--side-nav-width--micro: 93px;
--recommended-content-width: 32rem;
--spacing-main-padding: var(--spacing-xl);
--floating-viewer-width: 32rem;