Главная Обзор Помощь
Вход
wiki
/
weseek__growi
зеркало из https://github.com/weseek/growi
2
0
Ответвить 0
Файлы Задачи 0 Вики
Просмотр исходного кода

fix layout for nested {children} make expanded

Yuki Takei 2 лет назад
Родитель
db006fed66
Сommit
76eedfce6c
6 измененных файлов с 33 добавлено и 13 удалено
Единый вид Показать статистику Diff
  1. 4 2
      apps/app/src/components/Layout/BasicLayout.tsx
  2. 1 1
      apps/app/src/pages/[[...path]].page.tsx
  3. 1 1
      apps/app/src/pages/share/[[...path]].page.tsx
  4. 10 1
      apps/app/src/styles/_layout.scss
  5. 4 8
      packages/core/scss/_flex-expand.scss
  6. 13 0
      packages/core/scss/placeholders/_flex-expand.scss

+ 4 - 2
apps/app/src/components/Layout/BasicLayout.tsx
Просмотреть файл 

@@ -38,9 +38,11 @@ export const BasicLayout = ({ children, className }: Props): JSX.Element => {
 
         <div className="page-wrapper flex-row">
 
         <div className="page-wrapper flex-row">
 
           <Sidebar />
 
           <Sidebar />
 
 
 
-          <div className="flex-expand-vert">
 
+          <div className="flex-expand-vert">{/* neccessary for nested {children} make expanded */}
 
             <AlertSiteUrlUndefined />
 
             <AlertSiteUrlUndefined />
 
-            {children}
 
+            <div className="flex-expand-horiz h-100">{/* neccessary for nested {children} make expanded */}
 
+              {children}
 
+            </div>
 
           </div>
 
           </div>
 
         </div>
 
         </div>

+ 1 - 1
apps/app/src/pages/[[...path]].page.tsx
Просмотреть файл 

@@ -329,7 +329,7 @@ const Page: NextPageWithLayout<Props> = (props: Props) => {
 
       <Head>
 
       <Head>
 
         <title>{title}</title>
 
         <title>{title}</title>
 
       </Head>
 
       </Head>
 
-      <div className={`dynamic-layout-root ${growiLayoutFluidClass} h-100 d-flex flex-column justify-content-between`}>
 
+      <div className={`dynamic-layout-root ${growiLayoutFluidClass} justify-content-between`}>
 
         <header className="py-0 position-relative">
 
         <header className="py-0 position-relative">
 
           <div id="grw-subnav-container">
 
           <div id="grw-subnav-container">
 
             <GrowiContextualSubNavigation isLinkSharingDisabled={props.disableLinkSharing} />
 
             <GrowiContextualSubNavigation isLinkSharingDisabled={props.disableLinkSharing} />

+ 1 - 1
apps/app/src/pages/share/[[...path]].page.tsx
Просмотреть файл 

@@ -119,7 +119,7 @@ const SharedPage: NextPageWithLayout<Props> = (props: Props) => {
 
         <title>{title}</title>
 
         <title>{title}</title>
 
       </Head>
 
       </Head>
 
 
 
-      <div className={`dynamic-layout-root ${growiLayoutFluidClass} h-100 d-flex flex-column justify-content-between`}>
 
+      <div className={`dynamic-layout-root ${growiLayoutFluidClass} justify-content-between`}>
 
         <header className="py-0 position-relative">
 
         <header className="py-0 position-relative">
 
           <GrowiContextualSubNavigationForSharedPage page={currentPage ?? props.shareLinkRelatedPage} isLinkSharingDisabled={props.disableLinkSharing} />
 
           <GrowiContextualSubNavigationForSharedPage page={currentPage ?? props.shareLinkRelatedPage} isLinkSharingDisabled={props.disableLinkSharing} />
 
         </header>
 
         </header>

+ 10 - 1
apps/app/src/styles/_layout.scss
Просмотреть файл 

@@ -1,9 +1,18 @@
 
 @use '@growi/core/scss/bootstrap/init' as bs;
 
 @use '@growi/core/scss/bootstrap/init' as bs;
 
+@use '@growi/core/scss/flex-expand';
 
 
 
 @use './variables' as var;
 
 @use './variables' as var;
 
 
 
+.flex-expand-horiz {
 
+  @extend %flex-expand-horiz;
 
+}
 
+
 
+.flex-expand-vert {
 
+  @extend %flex-expand-vert;
 
+}
 
+
 
 .dynamic-layout-root {
 
 .dynamic-layout-root {
 
-  flex-grow: 1;
 
+  @extend %flex-expand-vert;
 
 }
 
 }
 
 
 
 .dynamic-layout-root.growi-layout-fluid .grw-container-convertible {
 
 .dynamic-layout-root.growi-layout-fluid .grw-container-convertible {

+ 4 - 8
packages/core/scss/_flex-expand.scss
Просмотреть файл 

@@ -1,13 +1,9 @@
 
-// ref: https://discuss.codemirror.net/t/how-to-fit-the-codemirror-6-widget-into-a-flex-div/4207/4
 
+@use './placeholders/flex-expand';
 
+
 
 .flex-expand-horiz {
 
 .flex-expand-horiz {
 
-  display: flex;
 
-  flex: 1;
 
-  flex-direction: row;
 
+  @extend %flex-expand-horiz;
 
 }
 
 }
 
 
 
-// ref: https://discuss.codemirror.net/t/how-to-fit-the-codemirror-6-widget-into-a-flex-div/4207/4
 
 .flex-expand-vert {
 
 .flex-expand-vert {
 
-  display: flex;
 
-  flex: 1;
 
-  flex-direction: column;
 
+  @extend %flex-expand-vert;
 
 }
 
 }

+ 13 - 0
packages/core/scss/placeholders/_flex-expand.scss
Просмотреть файл 

@@ -0,0 +1,13 @@
 
+// ref: https://discuss.codemirror.net/t/how-to-fit-the-codemirror-6-widget-into-a-flex-div/4207/4
 
+%flex-expand-horiz {
 
+  display: flex;
 
+  flex: 1;
 
+  flex-direction: row;
 
+}
 
+
 
+// ref: https://discuss.codemirror.net/t/how-to-fit-the-codemirror-6-widget-into-a-flex-div/4207/4
 
+%flex-expand-vert {
 
+  display: flex;
 
+  flex: 1;
 
+  flex-direction: column;
 
+}