mirrors/mostlymatter
1
0
Форкнуть 0
Код Задачи Запросы на слияние Действия Пакеты Проекты Релизы Вики Активность

[MM-60215] Webapp resize with announcement banner enabled will cause screen to blank out (#28065)

Просмотр исходного кода
Этот коммит содержится в:
M-ZubairAhmed
2024-08-29 13:39:00 +00:00
коммит произвёл GitHub
родитель 6235f6cb77
Коммит 9f8bc4b171
1 изменённых файлов: 25 добавлений и 21 удалений
Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

46
webapp/channels/src/sass/base/_structure.scss
Просмотреть файл

@@ -18,7 +18,7 @@ body {
} }
&.admin-onboarding { &.admin-onboarding {
background-image: url('images/admin-onboarding-background.jpg'); background-image: url("images/admin-onboarding-background.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
} }
@@ -31,7 +31,7 @@ body {
.sticky { .sticky {
background: $white; background: $white;
>.channel-view { > .channel-view {
overflow: auto; overflow: auto;
height: 100vh; height: 100vh;
padding: 0 15px; padding: 0 15px;
@@ -40,7 +40,7 @@ body {
.inner-wrap { .inner-wrap {
width: 100%; width: 100%;
>.row { > .row {
&.content { &.content {
min-height: calc(100vh - 89px); min-height: calc(100vh - 89px);
@@ -64,7 +64,7 @@ body {
overflow: auto; overflow: auto;
} }
>.row { > .row {
&.main { &.main {
position: relative; position: relative;
height: 100%; height: 100%;
@@ -115,8 +115,11 @@ body.app__body #root {
--columns: min-content minmax(385px, 1fr) min-content; --columns: min-content minmax(385px, 1fr) min-content;
grid-template: grid-template:
"announcement announcement announcement"min-content "admin-announcement admin-announcement admin-announcement"min-content "header header header"min-content "team-sidebar main app-sidebar" "announcement announcement announcement" min-content
"footer footer footer"min-content / var(--columns); "admin-announcement admin-announcement admin-announcement" min-content
"header header header" min-content
"team-sidebar main app-sidebar"
"footer footer footer" min-content / var(--columns);
> :only-child { > :only-child {
grid-area: main; grid-area: main;
@@ -128,10 +131,12 @@ body.app__body #root {
padding-bottom: 0; padding-bottom: 0;
padding-right: 0; padding-right: 0;
grid-template: grid-template:
'announcement announcement'min-content 'admin-announcement admin-announcement'min-content 'header header'min-content 'lhs center' "announcement announcement" min-content
'footer footer'min-content; "admin-announcement admin-announcement" min-content
grid-template-columns: auto 1fr; "header header" min-content
/* lhs takes its content width, center takes remaining space */ "lhs center"
"footer footer" min-content;
grid-template-columns: auto 1fr; /* lhs takes its content width, center takes remaining space */
} }
&.container-fluid { &.container-fluid {
@@ -164,9 +169,7 @@ body.app__body #root {
margin: 0 4px 4px 4px; margin: 0 4px 4px 4px;
border-radius: var(--radius-l); border-radius: var(--radius-l);
grid-area: main; grid-area: main;
grid-template: grid-template: "lhs center rhs";
'lhs center rhs'
;
grid-template-columns: min-content minmax(385px, 1fr) min-content; grid-template-columns: min-content minmax(385px, 1fr) min-content;
&:has(.backstage-body) { &:has(.backstage-body) {
@@ -175,8 +178,8 @@ body.app__body #root {
margin: 0; margin: 0;
border-radius: 0; border-radius: 0;
grid-template: grid-template:
'header'min-content 'main' "header" min-content
; "main";
} }
&:has(#playbooks-backstageRoot) { &:has(#playbooks-backstageRoot) {
@@ -234,8 +237,11 @@ body.app__body #root {
padding-right: 0; padding-right: 0;
z-index: 17; z-index: 17;
grid-template: grid-template:
'announcement'min-content 'header'min-content 'main'auto 'footer'min-content / auto; "announcement" min-content
"admin-announcement" min-content
"header" min-content
"main" auto
"footer" min-content / auto;
.team-sidebar, .team-sidebar,
.app-bar { .app-bar {
grid-area: main; grid-area: main;
@@ -247,9 +253,7 @@ body.app__body #root {
.main-wrapper { .main-wrapper {
margin: 0; margin: 0;
grid-template: grid-template: "main";
'main'
;
padding: 0; padding: 0;
border-radius: 0; border-radius: 0;
@@ -280,7 +284,7 @@ body.app__body #root {
position: absolute; position: absolute;
width: 100%; width: 100%;
grid-area: center; grid-area: center;
transition: width .25s ease-in-out; transition: width 0.25s ease-in-out;
border-radius: var(--radius-l); border-radius: var(--radius-l);
} }