Commit aaf84ca1 authored by arturo's avatar arturo

[sidebar] sidebar visibility issues

* Issue #293
* Issue #313
* Issue #316
parent fbd967ad
Pipeline #1665 canceled with stage
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<style> * {margin: 0; padding: 0; list-style: none;} </style> <style> * {margin: 0; padding: 0; list-style: none;} </style>
</head> </head>
<body> <body>
<div id="app" class ="container-fluid"></div> <div id="app"></div>
<div id="portal"></div> <div id="portal"></div>
<script src="bundle.js"></script> <script src="bundle.js"></script>
</body> </body>
......
...@@ -9993,6 +9993,28 @@ h3 { ...@@ -9993,6 +9993,28 @@ h3 {
border-color: rgba(255, 255, 255, 0.3); border-color: rgba(255, 255, 255, 0.3);
} }
} }
.with-icon-font {
font-family: ForkAwesome, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.right-handed .forest-layout {
border-right: 1px solid #000;
}
.right-handed .forest-layout:hover {
border-right: 1px solid #dee2e6;
}
.left-handed .forest-layout {
border-left: 1px solid #000;
}
.left-handed .forest-layout:hover {
border-left: 1px solid #dee2e6;
}
.forest-layout-teaser {
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, black 45%);
}
.navbar-dark.bg-primary { .navbar-dark.bg-primary {
background-color: #111111 !important; background-color: #111111 !important;
} }
......
...@@ -9949,4 +9949,22 @@ h3 { ...@@ -9949,4 +9949,22 @@ h3 {
font-family: ForkAwesome, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-family: ForkAwesome, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
} }
.right-handed .forest-layout {
border-right: 1px solid #fff;
}
.right-handed .forest-layout:hover {
border-right: 1px solid #dee2e6;
}
.left-handed .forest-layout {
border-left: 1px solid #fff;
}
.left-handed .forest-layout:hover {
border-left: 1px solid #dee2e6;
}
.forest-layout-teaser {
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 45%);
}
/*# sourceMappingURL=bootstrap-default.css.map */ /*# sourceMappingURL=bootstrap-default.css.map */
...@@ -9701,5 +9701,26 @@ h3 { ...@@ -9701,5 +9701,26 @@ h3 {
border-color: #dee2e6; border-color: #dee2e6;
} }
} }
.with-icon-font {
font-family: ForkAwesome, Muli;
}
.right-handed .forest-layout {
border-right: 1px solid #fff;
}
.right-handed .forest-layout:hover {
border-right: 1px solid #dee2e6;
}
.left-handed .forest-layout {
border-left: 1px solid #fff;
}
.left-handed .forest-layout:hover {
border-left: 1px solid #dee2e6;
}
.forest-layout-teaser {
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 45%);
}
/*# sourceMappingURL=bootstrap-greyson.css.map */ /*# sourceMappingURL=bootstrap-greyson.css.map */
...@@ -9933,5 +9933,26 @@ h3 { ...@@ -9933,5 +9933,26 @@ h3 {
border-color: #dee2e6; border-color: #dee2e6;
} }
} }
.with-icon-font {
font-family: ForkAwesome, Nunito;
}
.right-handed .forest-layout {
border-right: 1px solid #fff;
}
.right-handed .forest-layout:hover {
border-right: 1px solid #dee2e6;
}
.left-handed .forest-layout {
border-left: 1px solid #fff;
}
.left-handed .forest-layout:hover {
border-left: 1px solid #dee2e6;
}
.forest-layout-teaser {
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 45%);
}
/*# sourceMappingURL=bootstrap-herbie.css.map */ /*# sourceMappingURL=bootstrap-herbie.css.map */
...@@ -9950,5 +9950,26 @@ h3 { ...@@ -9950,5 +9950,26 @@ h3 {
border-color: #dee2e6; border-color: #dee2e6;
} }
} }
.with-icon-font {
font-family: ForkAwesome, Montserrat;
}
.right-handed .forest-layout {
border-right: 1px solid #fff;
}
.right-handed .forest-layout:hover {
border-right: 1px solid #dee2e6;
}
.left-handed .forest-layout {
border-left: 1px solid #fff;
}
.left-handed .forest-layout:hover {
border-left: 1px solid #dee2e6;
}
.forest-layout-teaser {
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 45%);
}
/*# sourceMappingURL=bootstrap-monotony.css.map */ /*# sourceMappingURL=bootstrap-monotony.css.map */
...@@ -4,6 +4,14 @@ ...@@ -4,6 +4,14 @@
/* padding-top: 15px */ /* padding-top: 15px */
/* padding-bottom: 15px */ /* padding-bottom: 15px */
/* float: none */ /* float: none */
#dafixedtop {
position: sticky;
top: 0;
left: 0;
right: 0;
z-index: 910;
}
#corporatop.nav-tabs > li { #corporatop.nav-tabs > li {
padding-left: 1; padding-left: 1;
padding-right: 1; padding-right: 1;
...@@ -170,10 +178,6 @@ ...@@ -170,10 +178,6 @@
top: 50px; top: 50px;
} }
#dafixedtop {
z-index: 910;
}
#logo-designed { #logo-designed {
border: 15px; border: 15px;
} }
...@@ -183,7 +187,10 @@ ...@@ -183,7 +187,10 @@
} }
#page-wrapper { #page-wrapper {
margin-top: 96px; padding-top: 40px;
padding-left: 16px;
padding-right: 16px;
width: 100%;
} }
#user-page-header { #user-page-header {
...@@ -385,7 +392,7 @@ li .leaf:hover a.settings { ...@@ -385,7 +392,7 @@ li .leaf:hover a.settings {
visibility: visible; visibility: visible;
} }
.forest > .tree { .forest-layout-content > .tree {
margin-top: 20px; margin-top: 20px;
} }
...@@ -518,6 +525,9 @@ li .leaf:hover a.settings { ...@@ -518,6 +525,9 @@ li .leaf:hover a.settings {
opacity: var(--over50, 0); opacity: var(--over50, 0);
} }
#node-popup-tooltip {
position: fixed;
}
#node-popup-tooltip .tree .node { #node-popup-tooltip .tree .node {
margin-top: 5px; margin-top: 5px;
} }
...@@ -525,6 +535,18 @@ li .leaf:hover a.settings { ...@@ -525,6 +535,18 @@ li .leaf:hover a.settings {
padding-left: 15px; padding-left: 15px;
} }
.right-handed #node-popup-tooltip {
top: 50%;
left: 16.6666666667%;
transform: translateY(-50%);
}
.left-handed #node-popup-tooltip {
top: 50%;
right: 16.6666666667%;
transform: translateY(-50%);
}
.panel-actions .almost-useable { .panel-actions .almost-useable {
color: orange; color: orange;
} }
...@@ -540,20 +562,51 @@ li .leaf:hover a.settings { ...@@ -540,20 +562,51 @@ li .leaf:hover a.settings {
overflow-y: scroll; overflow-y: scroll;
} }
.forest-layout-wrapper {
padding-left: 0;
padding-right: 0;
}
.forest-layout { .forest-layout {
background-color: #fff; padding-top: 8px;
position: fixed;
top: 3.7em;
width: 15%;
z-index: 909; z-index: 909;
position: fixed;
height: calc(100vh - 56px);
width: 100%;
max-width: inherit;
scrollbar-width: none;
overflow-y: scroll;
overflow-x: visible;
transition: border 150ms;
}
.forest-layout::-webkit-scrollbar {
display: none;
}
.forest-layout-teaser {
pointer-events: none;
position: fixed;
bottom: 0;
height: 24px;
width: calc(16.6666666667% - 1px);
}
.right-handed .forest-layout-teaser {
left: 0;
}
.left-handed .forest-layout-teaser {
right: 0;
} }
.left-handed .forest-layout { .left-handed .forest-layout {
left: 80%; padding-left: 8px;
padding-right: 16px;
} }
.right-handed .forest-layout { .right-handed .forest-layout {
left: 2%; padding-left: 16px;
padding-right: 8px;
} }
.code-editor .editor .code-area { .code-editor .editor .code-area {
...@@ -777,6 +830,20 @@ ul li { ...@@ -777,6 +830,20 @@ ul li {
padding-top: 100px; padding-top: 100px;
} }
#app {
width: 100%;
}
.router-inner {
display: flex;
}
.router-inner.left-handed {
flex-direction: row;
}
.router-inner.right-handed {
flex-direction: row;
}
.range { .range {
width: 400px; width: 400px;
/* some space for the right knob */ /* some space for the right knob */
......
{"version":3,"sourceRoot":"","sources":["../../src/sass/_menu.sass","../../src/sass/_context_menu.sass","../../src/sass/_graph.sass","../../src/sass/_login.sass","../../src/sass/_tree.sass","../../src/sass/_code_editor.sass","../../src/sass/_styles.sass","../../src/sass/_range_slider.sass","../../src/sass/_annotation.sass","../../src/sass/_folder_view.sass"],"names":[],"mappings":"AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;AACI;EACA;;;AAEJ;AACI;EACA;;;AAGJ;AACA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;EACA;;;AAEF;EACE;;;AC7CF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AClBF;EACE;EACA;EACA;;;AAEF;AAkCE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAxCA;EAZA;EACA;EAEA;EAWE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AAGA;EACE;EACA;;AACN;EACE;;AACF;EACE;;AAEF;EApCA;EACA;EAEA;EAmCE;EACA;;AACF;EACE;;AACF;EACE;;AAWF;EAEE;EAEA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AAEJ;EACE;;AAEA;EACE;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACtFJ;EAEE;;;AAQF;EACE;;AACA;EACE;EACA;;;AAEJ;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;AAEE;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;;AACA;EACE;;AACN;EACE;EACA;EACA;EACA;;;AAGN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAGF;EACE;;;AAEJ;EACI;EACA;;;AAGF;EACE;;;AAEJ;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;ACzKF;EACE;;;AAGA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGA;EACE;;AACF;EACE;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAGN;EACE;;;AAIA;EACE;;AACA;EACE;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;EACA;EACA;;AACF;EACE;;AACF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AACF;EACE;;AAGN;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AAIR;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAEV;EACE;;AACF;EACE;;AAEE;EACE;;AACF;EACE;;AACN;EACE;;AAEE;EACE;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;;AAIF;EACE;;AAEA;EACE;;;AAGN;EACE;;AACF;EACE;;AACF;EACE;;;AAEJ;EAEE;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEA;EACE;;;AAEF;EACE;;;ACnKA;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EApCR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AA0CM;EACE;EACA;EACA;EACA;EACA;EA5CR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAkDE;EACE;EACA;EACA;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAGE;EACE;;AAEF;EACE;;;ACtFZ;EACE;;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAER;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAEV;EACE;;AACA;EACE;;AACF;EACE;EACA;EACA;;;AAIA;EACE;;AACA;EACE;EACA;;AACF;EACE;;AACA;EACE;;AACJ;EACE;;;AAER;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;AAGI;EACE;;AACF;EACE;;;AAEN;EACE;EACA;EACA;;;AAIA;EACE;;AACF;EACE;;;AAEJ;EACE;;AACA;EACE;;;AAEJ;EACE;EACA;;;ACtGF;EACE;AACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EACE;EAEA;EACA;EACA;;;AAGN;EACE;;;ACxBJ;EACE;;AAEA;EANE;EACA;;AAQF;EAbE;EACA;;AAeF;EAhBE;EACA;;AAkBF;EAnBE;EACA;;AAqBF;EA1BE;EACA,kBANyB;;AAkC3B;EA7BE;EACA,kBAPqB;;AAsCvB;EAhCE;EACA,kBAJoB;;;AAuCtB;EApCE;EACA,kBANyB;;AA4C3B;EAvCE;EACA,kBAPqB;;AAgDvB;EA1CE;EACA,kBAJoB;;;ACRxB;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA","file":"sass.css"} {"version":3,"sourceRoot":"","sources":["../../src/sass/_menu.sass","../../src/sass/_context_menu.sass","../../src/sass/_graph.sass","../../src/sass/_login.sass","../../src/sass/_tree.sass","../../src/sass/_code_editor.sass","../../src/sass/_styles.sass","../../src/sass/_range_slider.sass","../../src/sass/_annotation.sass","../../src/sass/_folder_view.sass"],"names":[],"mappings":"AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;EACE;EACA;EACA;EACA;EAEA;;;AAEF;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;AACI;EACA;;;AAEJ;AACI;EACA;;;AAGJ;AACA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;EACA;;;AAEF;EACE;;;ACrDF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AClBF;EACE;EACA;EACA;;;AAEF;AAkCE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAxCA;EAZA;EACA;EAEA;EAWE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AAGA;EACE;EACA;;AACN;EACE;;AACF;EACE;;AAEF;EApCA;EACA;EAEA;EAmCE;EACA;;AACF;EACE;;AACF;EACE;;AAWF;EAEE;EAEA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AAEJ;EACE;;AAEA;EACE;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACjFJ;EACE;;AACA;EACE;EACA;;;AAEJ;EACE;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;AAEE;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;;AACA;EACE;;AACN;EACE;EACA;EACA;EACA;;;AAGN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAGF;EACE;;;AAEJ;EACI;EACA;;;AAGF;EACE;;;AAEJ;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;ACvKF;EACE;;;AAGA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGA;EACE;;AACF;EACE;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAGN;EACE;;;AAIA;EACE;;AACA;EACE;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;EACA;EACA;;AACF;EACE;;AACF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AACF;EACE;;AAGN;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AAIR;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAEV;EACE;;AACF;EACE;;AAEE;EACE;;AACF;EACE;;AACN;EACE;;AAEE;EACE;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;;AAEN;EAWE;;AAGE;EACE;;AAEA;EACE;;;AAUR;EAEE;EACA,MAFW;EAGX;;;AAEF;EAEE;EACA,OAFW;EAGX;;;AAGA;EACE;;AACF;EACE;;AACF;EACE;;;AAEJ;EAEE;EACA;;;AACF;EAEE;EACA;;;AAEF;EAGE;EACA;EAKA;EACA;EACA;EACA;EAGA;EACA;EACA;EAKA;;AAHA;EACE;;;AASJ;EAKE;EACA;EACA;EACA,QAPS;EAQT;;;AAGF;EACE;;;AAEF;EACE;;;AAEF;EACI;EACA;;;AACJ;EACI;EACA;;;AChPA;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EApCR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AA0CM;EACE;EACA;EACA;EACA;EACA;EA5CR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAkDE;EACE;EACA;EACA;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAGE;EACE;;AAEF;EACE;;;ACtFZ;EACE;;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAER;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAEV;EACE;;AACA;EACE;;AACF;EACE;EACA;EACA;;;AAIA;EACE;;AACA;EACE;EACA;;AACF;EACE;;AACA;EACE;;AACJ;EACE;;;AAER;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;AAGI;EACE;;AACF;EACE;;;AAEN;EACE;EACA;EACA;;;AAIA;EACE;;AACF;EACE;;;AAEJ;EACE;;AACA;EACE;;;AAEJ;EACE;EACA;;;AAGF;EACE;;;AAEF;EACE;;AAEA;EACE;;AAEF;EACE;;;ACnHJ;EACE;AACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EACE;EAEA;EACA;EACA;;;AAGN;EACE;;;ACxBJ;EACE;;AAEA;EANE;EACA;;AAQF;EAbE;EACA;;AAeF;EAhBE;EACA;;AAkBF;EAnBE;EACA;;AAqBF;EA1BE;EACA,kBANyB;;AAkC3B;EA7BE;EACA,kBAPqB;;AAsCvB;EAhCE;EACA,kBAJoB;;;AAuCtB;EApCE;EACA,kBANyB;;AA4C3B;EAvCE;EACA,kBAPqB;;AAgDvB;EA1CE;EACA,kBAJoB;;;ACRxB;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA","file":"sass.css"}
\ No newline at end of file \ No newline at end of file
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<style> * {margin: 0; padding: 0; list-style: none;} </style> <style> * {margin: 0; padding: 0; list-style: none;} </style>
</head> </head>
<body> <body>
<div id="app" class ="container-fluid"></div> <div id="app"></div>
<div id="portal"></div> <div id="portal"></div>
<script src="bundle.js"></script> <script src="bundle.js"></script>
</body> </body>
......
...@@ -26,7 +26,7 @@ here :: R2.Here ...@@ -26,7 +26,7 @@ here :: R2.Here
here = R2.here "Gargantext.Components.Forest" here = R2.here "Gargantext.Components.Forest"
-- Shared by components here with Tree -- Shared by components here with Tree
type Common = type Common =
( frontends :: Frontends ( frontends :: Frontends
, handed :: T.Box Handed , handed :: T.Box Handed
, reloadMainPage :: T2.ReloadS , reloadMainPage :: T2.ReloadS
...@@ -40,9 +40,8 @@ type Props = ...@@ -40,9 +40,8 @@ type Props =
, reloadForest :: T2.ReloadS , reloadForest :: T2.ReloadS
, sessions :: T.Box Sessions , sessions :: T.Box Sessions
, showLogin :: T.Box Boolean , showLogin :: T.Box Boolean
, showTree :: T.Box Boolean
, tasks :: T.Box GAT.Storage , tasks :: T.Box GAT.Storage
| Common | Common
) )
type TreeExtra = ( type TreeExtra = (
...@@ -63,7 +62,6 @@ forestCpt = here.component "forest" cpt where ...@@ -63,7 +62,6 @@ forestCpt = here.component "forest" cpt where
, route , route
, sessions , sessions
, showLogin , showLogin
, showTree
, tasks } _ = do , tasks } _ = do
-- TODO Fix this. I think tasks shouldn't be a Box but only a Reductor -- TODO Fix this. I think tasks shouldn't be a Box but only a Reductor
-- tasks' <- GAT.useTasks reloadRoot reloadForest -- tasks' <- GAT.useTasks reloadRoot reloadForest
...@@ -75,11 +73,9 @@ forestCpt = here.component "forest" cpt where ...@@ -75,11 +73,9 @@ forestCpt = here.component "forest" cpt where
-- reloadRoot' <- T.useLive T.unequal reloadRoot -- reloadRoot' <- T.useLive T.unequal reloadRoot
-- route' <- T.useLive T.unequal route -- route' <- T.useLive T.unequal route
showTree' <- T.useLive T.unequal showTree
-- TODO If `reloadForest` is set, `reload` state should be updated -- TODO If `reloadForest` is set, `reload` state should be updated
-- TODO fix tasks ref -- TODO fix tasks ref
pure $ H.div { className: "forest " <> if showTree' then "" else "d-none" } pure $ H.div { className: "forest-layout-content" }
(A.cons (plus { backend, handed, showLogin }) (trees handed' sessions')) (A.cons (plus { backend, handed, showLogin }) (trees handed' sessions'))
where where
common = RX.pick props :: Record Common common = RX.pick props :: Record Common
...@@ -108,7 +104,7 @@ plusCpt = here.component "plus" cpt where ...@@ -108,7 +104,7 @@ plusCpt = here.component "plus" cpt where
cpt { backend, handed, showLogin } _ = do cpt { backend, handed, showLogin } _ = do
handed' <- T.useLive T.unequal handed handed' <- T.useLive T.unequal handed
pure $ H.div { className: "row" } pure $ H.div {}
[ H.button { className: buttonClass handed' [ H.button { className: buttonClass handed'
, on: { click } , on: { click }
, title } , title }
...@@ -128,12 +124,20 @@ plusCpt = here.component "plus" cpt where ...@@ -128,12 +124,20 @@ plusCpt = here.component "plus" cpt where
title = "Add or remove connections to the server(s)." title = "Add or remove connections to the server(s)."
divClass = "fa fa-universal-access" divClass = "fa fa-universal-access"
buttonClass handed' = buttonClass handed' =
"btn btn-primary col-5 " <> switchHanded "mr-1 ml-auto" "ml-1 mr-auto" handed' "btn btn-primary d-block " <> switchHanded "mr-1 ml-auto" "ml-1 mr-auto" handed'
forestLayout :: R2.Component Props forestLayout :: R2.Component Props
forestLayout = R.createElement forestLayoutCpt forestLayout = R.createElement forestLayoutCpt
forestLayoutCpt :: R.Component Props forestLayoutCpt :: R.Component Props
forestLayoutCpt = here.component "forestLayout" cpt where forestLayoutCpt = here.component "forestLayout" cpt where
cpt p _ = do cpt p _ = pure $
pure $ H.div { className: "forest-layout" }
[ forest p [] ] H.div { className: "forest-layout-wrapper col-md-2" }
[
H.div { className: "forest-layout" }
[
forest p []
,
H.div { className: "forest-layout-teaser" } []
]
]
...@@ -2,15 +2,11 @@ module Gargantext.Components.MainPage where ...@@ -2,15 +2,11 @@ module Gargantext.Components.MainPage where
import Gargantext.Prelude import Gargantext.Prelude
import Data.Tuple.Nested ((/\))
import Reactix as R import Reactix as R
import Reactix.DOM.HTML as H import Reactix.DOM.HTML as H
import Toestand as T import Toestand as T
import Web.HTML.Event.EventTypes (offline)
import Gargantext.Components.App.Data (Boxes) import Gargantext.Components.App.Data (Boxes)
import Gargantext.Routes as GR
import Gargantext.Types as GT
import Gargantext.Utils.Reactix as R2 import Gargantext.Utils.Reactix as R2
here :: R2.Here here :: R2.Here
...@@ -31,17 +27,9 @@ mainPageCpt = here.component "mainPage" cpt ...@@ -31,17 +27,9 @@ mainPageCpt = here.component "mainPage" cpt
handed' <- T.useLive T.unequal handed handed' <- T.useLive T.unequal handed
route' <- T.useLive T.unequal route route' <- T.useLive T.unequal route
let classNameOffsetPre /\ className /\ classNameOffsetPost = case route' of pure $
GR.PGraphExplorer _ _ -> "" /\ "col-md-12" /\ ""
_ -> case handed' of H.div { id: "page-wrapper" }
GT.LeftHanded -> "" /\ "col-md-10" /\ "col-md-2" [
GT.RightHanded -> "col-md-2" /\ "col-md-10" /\ "" H.div { className: "container-fluid" } children
pure $ H.div { className: "row" }
[ H.div { className: classNameOffsetPre } []
, H.div { className }
[ H.div { id: "page-wrapper" }
[ H.div { className: "container-fluid" } children ]
]
, H.div { className: classNameOffsetPost } []
] ]
...@@ -5,12 +5,6 @@ import Gargantext.Prelude ...@@ -5,12 +5,6 @@ import Gargantext.Prelude
import Data.Array as A import Data.Array as A
import Data.Maybe (Maybe(..)) import Data.Maybe (Maybe(..))
import Data.Tuple.Nested ((/\)) import Data.Tuple.Nested ((/\))
import Reactix as R
import Reactix.DOM.HTML as H
import Record as Record
import Record.Extra as RE
import Toestand as T
import Gargantext.Components.App.Data (Boxes) import Gargantext.Components.App.Data (Boxes)
import Gargantext.Components.Footer (footer) import Gargantext.Components.Footer (footer)
import Gargantext.Components.Forest as Forest import Gargantext.Components.Forest as Forest
...@@ -26,8 +20,8 @@ import Gargantext.Components.Nodes.Annuaire.User (userLayout) ...@@ -26,8 +20,8 @@ import Gargantext.Components.Nodes.Annuaire.User (userLayout)
import Gargantext.Components.Nodes.Annuaire.User.Contact (contactLayout) import Gargantext.Components.Nodes.Annuaire.User.Contact (contactLayout)
import Gargantext.Components.Nodes.Corpus (corpusLayout) import Gargantext.Components.Nodes.Corpus (corpusLayout)
import Gargantext.Components.Nodes.Corpus.Dashboard (dashboardLayout) import Gargantext.Components.Nodes.Corpus.Dashboard (dashboardLayout)
import Gargantext.Components.Nodes.Corpus.Phylo (phyloLayout)
import Gargantext.Components.Nodes.Corpus.Document (documentMainLayout) import Gargantext.Components.Nodes.Corpus.Document (documentMainLayout)
import Gargantext.Components.Nodes.Corpus.Phylo (phyloLayout)
import Gargantext.Components.Nodes.File (fileLayout) import Gargantext.Components.Nodes.File (fileLayout)
import Gargantext.Components.Nodes.Frame (frameLayout) import Gargantext.Components.Nodes.Frame (frameLayout)
import Gargantext.Components.Nodes.Home (homeLayout) import Gargantext.Components.Nodes.Home (homeLayout)
...@@ -42,6 +36,11 @@ import Gargantext.Sessions (Session, WithSession) ...@@ -42,6 +36,11 @@ import Gargantext.Sessions (Session, WithSession)
import Gargantext.Sessions as Sessions import Gargantext.Sessions as Sessions
import Gargantext.Types (CorpusId, Handed(..), ListId, NodeID, NodeType(..), SessionId, SidePanelState(..), reverseHanded) import Gargantext.Types (CorpusId, Handed(..), ListId, NodeID, NodeType(..), SessionId, SidePanelState(..), reverseHanded)
import Gargantext.Utils.Reactix as R2 import Gargantext.Utils.Reactix as R2
import Reactix as R
import Reactix.DOM.HTML as H
import Record as Record
import Record.Extra as RE
import Toestand as T
here :: R2.Here here :: R2.Here
...@@ -58,7 +57,7 @@ router :: R2.Leaf Props ...@@ -58,7 +57,7 @@ router :: R2.Leaf Props
router props = R.createElement routerCpt props [] router props = R.createElement routerCpt props []
routerCpt :: R.Component Props routerCpt :: R.Component Props
routerCpt = here.component "router" cpt where routerCpt = here.component "router" cpt where
cpt { boxes: boxes@{ handed } } _ = do cpt { boxes: boxes@{ handed, showTree } } _ = do
handed' <- T.useLive T.unequal handed handed' <- T.useLive T.unequal handed
let handedClassName = case handed' of let handedClassName = case handed' of
...@@ -68,7 +67,7 @@ routerCpt = here.component "router" cpt where ...@@ -68,7 +67,7 @@ routerCpt = here.component "router" cpt where
pure $ R.fragment pure $ R.fragment
([ loginModal { boxes } ([ loginModal { boxes }
, topBar { boxes } ] <> , topBar { boxes } ] <>
[ H.div { className: handedClassName } $ reverseHanded handed' $ [ H.div { className: handedClassName <> " router-inner" } $ reverseHanded handed' $
[ forest { boxes } [ forest { boxes }
, mainPage { boxes } , mainPage { boxes }
, sidePanel { boxes } , sidePanel { boxes }
...@@ -123,18 +122,25 @@ forestCpt = here.component "forest" cpt where ...@@ -123,18 +122,25 @@ forestCpt = here.component "forest" cpt where
, showLogin , showLogin
, showTree , showTree
, tasks } } _ = do , tasks } } _ = do
pure $ Forest.forestLayout { backend
, forestOpen showTree' <- T.useLive T.unequal showTree
, frontends: defaultFrontends
, handed pure $
, reloadForest
, reloadMainPage if not showTree'
, reloadRoot then mempty
, route else Forest.forestLayout
, sessions { backend
, showLogin , forestOpen
, showTree , frontends: defaultFrontends
, tasks } [] , handed
, reloadForest
, reloadMainPage
, reloadRoot
, route
, sessions
, showLogin
, tasks } []
sidePanel :: R2.Leaf Props sidePanel :: R2.Leaf Props
sidePanel p = R.createElement sidePanelCpt p [] sidePanel p = R.createElement sidePanelCpt p []
......
module Gargantext.Components.TopBar where module Gargantext.Components.TopBar where
import Data.Foldable (intercalate) import Data.Foldable (intercalate)
import Data.Tuple.Nested ((/\))
import Reactix as R import Reactix as R
import Reactix.DOM.HTML as H import Reactix.DOM.HTML as H
import Toestand as T import Toestand as T
...@@ -27,7 +26,7 @@ topBarCpt = here.component "topBar" cpt ...@@ -27,7 +26,7 @@ topBarCpt = here.component "topBar" cpt
cpt { handed, showTree } children = do cpt { handed, showTree } children = do
handed' <- T.useLive T.unequal handed handed' <- T.useLive T.unequal handed
pure $ H.div { className: "navbar navbar-expand-lg navbar-dark bg-dark fixed-top" pure $ H.div { className: "navbar navbar-expand-lg navbar-dark bg-dark"
, id: "dafixedtop" , id: "dafixedtop"
, role: "navigation" , role: "navigation"
} }
......
#dafixedtop
// correction for the popover
z-index: 910
// height: 60px
//.logoSmall //.logoSmall
// line-height: 15px // line-height: 15px
// height: 10px // height: 10px
...@@ -15,7 +10,10 @@ ...@@ -15,7 +10,10 @@
border: 3px solid white border: 3px solid white
#page-wrapper #page-wrapper
margin-top : 96px padding-top: 40px
padding-left: 16px
padding-right: 16px
width: 100%
#user-page-header #user-page-header
border-bottom : 1px solid black border-bottom : 1px solid black
......
...@@ -6,6 +6,14 @@ ...@@ -6,6 +6,14 @@
/* padding-bottom: 15px /* padding-bottom: 15px
/* float: none /* float: none
#dafixedtop
position: sticky
top: 0
left: 0
right: 0
// correction for the popover
z-index: 910
#corporatop.nav-tabs > li #corporatop.nav-tabs > li
padding-left: 1 padding-left: 1
padding-right: 1 padding-right: 1
......
...@@ -101,3 +101,16 @@ ul ...@@ -101,3 +101,16 @@ ul
.join-button .join-button
padding-bottom: 100px padding-bottom: 100px
padding-top: 100px padding-top: 100px
#app
width: 100%
.router-inner
display: flex
&.left-handed
flex-direction: row
&.right-handed
flex-direction: row
...@@ -28,7 +28,7 @@ li ...@@ -28,7 +28,7 @@ li
a.settings a.settings
visibility: visible visibility: visible