Skip to content

P
purescript-gargantext
Commit aaf84ca1 authored by arturo's avatar arturo
Browse files
Options

[sidebar] sidebar visibility issues 

* Issue #293
* Issue #313
* Issue #316
parent fbd967ad
Pipeline #1665 canceled with stage
    Hide whitespace changes
    Inline Side-by-side
    Showing with 390 additions and 86 deletions
    dist/index.html
    View file @ aaf84ca1
    ......@@ -11,7 +11,7 @@
    <style> * {margin: 0; padding: 0; list-style: none;} </style>
    </head>
    <body>
    <div id="app" class ="container-fluid"></div>
    <div id="app"></div>
    <div id="portal"></div>
    <script src="bundle.js"></script>
    </body>
    ......
    dist/styles/bootstrap-darkster.css
    View file @ aaf84ca1
    ......@@ -9993,6 +9993,28 @@ h3 {
    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 {
    background-color: #111111 !important;
    }
    ......
    dist/styles/bootstrap-default.css
    View file @ aaf84ca1
    ......@@ -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";
    }
    .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 */
    dist/styles/bootstrap-greyson.css
    View file @ aaf84ca1
    ......@@ -9701,5 +9701,26 @@ h3 {
    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 */
    dist/styles/bootstrap-herbie.css
    View file @ aaf84ca1
    ......@@ -9933,5 +9933,26 @@ h3 {
    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 */
    dist/styles/bootstrap-monotony.css
    View file @ aaf84ca1
    ......@@ -9950,5 +9950,26 @@ h3 {
    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 */
    dist/styles/sass.css
    View file @ aaf84ca1
    ......@@ -4,6 +4,14 @@
    /* padding-top: 15px */
    /* padding-bottom: 15px */
    /* float: none */
    #dafixedtop {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 910;
    }
    #corporatop.nav-tabs > li {
    padding-left: 1;
    padding-right: 1;
    ......@@ -170,10 +178,6 @@
    top: 50px;
    }
    #dafixedtop {
    z-index: 910;
    }
    #logo-designed {
    border: 15px;
    }
    ......@@ -183,7 +187,10 @@
    }
    #page-wrapper {
    margin-top: 96px;
    padding-top: 40px;
    padding-left: 16px;
    padding-right: 16px;
    width: 100%;
    }
    #user-page-header {
    ......@@ -385,7 +392,7 @@ li .leaf:hover a.settings {
    visibility: visible;
    }
    .forest > .tree {
    .forest-layout-content > .tree {
    margin-top: 20px;
    }
    ......@@ -518,6 +525,9 @@ li .leaf:hover a.settings {
    opacity: var(--over50, 0);
    }
    #node-popup-tooltip {
    position: fixed;
    }
    #node-popup-tooltip .tree .node {
    margin-top: 5px;
    }
    ......@@ -525,6 +535,18 @@ li .leaf:hover a.settings {
    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 {
    color: orange;
    }
    ......@@ -540,20 +562,51 @@ li .leaf:hover a.settings {
    overflow-y: scroll;
    }
    .forest-layout-wrapper {
    padding-left: 0;
    padding-right: 0;
    }
    .forest-layout {
    background-color: #fff;
    position: fixed;
    top: 3.7em;
    width: 15%;
    padding-top: 8px;
    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: 80%;
    padding-left: 8px;
    padding-right: 16px;
    }
    .right-handed .forest-layout {
    left: 2%;
    padding-left: 16px;
    padding-right: 8px;
    }
    .code-editor .editor .code-area {
    ......@@ -777,6 +830,20 @@ ul li {
    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 {
    width: 400px;
    /* some space for the right knob */
    ......
    dist/styles/sass.css.map
    View file @ aaf84ca1
    {"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"}
    \ No newline at end of file
    {"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
    index.html
    View file @ aaf84ca1
    ......@@ -13,7 +13,7 @@
    <style> * {margin: 0; padding: 0; list-style: none;} </style>
    </head>
    <body>
    <div id="app" class ="container-fluid"></div>
    <div id="app"></div>
    <div id="portal"></div>
    <script src="bundle.js"></script>
    </body>
    ......
    src/Gargantext/Components/Forest.purs
    View file @ aaf84ca1
    ......@@ -26,7 +26,7 @@ here :: R2.Here
    here = R2.here "Gargantext.Components.Forest"
    -- Shared by components here with Tree
    type Common =
    type Common =
    ( frontends :: Frontends
    , handed :: T.Box Handed
    , reloadMainPage :: T2.ReloadS
    ......@@ -40,9 +40,8 @@ type Props =
    , reloadForest :: T2.ReloadS
    , sessions :: T.Box Sessions
    , showLogin :: T.Box Boolean
    , showTree :: T.Box Boolean
    , tasks :: T.Box GAT.Storage
    | Common
    | Common
    )
    type TreeExtra = (
    ......@@ -63,7 +62,6 @@ forestCpt = here.component "forest" cpt where
    , route
    , sessions
    , showLogin
    , showTree
    , tasks } _ = do
    -- TODO Fix this. I think tasks shouldn't be a Box but only a Reductor
    -- tasks' <- GAT.useTasks reloadRoot reloadForest
    ......@@ -75,11 +73,9 @@ forestCpt = here.component "forest" cpt where
    -- reloadRoot' <- T.useLive T.unequal reloadRoot
    -- route' <- T.useLive T.unequal route
    showTree' <- T.useLive T.unequal showTree
    -- TODO If `reloadForest` is set, `reload` state should be updated
    -- 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'))
    where
    common = RX.pick props :: Record Common
    ......@@ -108,7 +104,7 @@ plusCpt = here.component "plus" cpt where
    cpt { backend, handed, showLogin } _ = do
    handed' <- T.useLive T.unequal handed
    pure $ H.div { className: "row" }
    pure $ H.div {}
    [ H.button { className: buttonClass handed'
    , on: { click }
    , title }
    ......@@ -128,12 +124,20 @@ plusCpt = here.component "plus" cpt where
    title = "Add or remove connections to the server(s)."
    divClass = "fa fa-universal-access"
    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 = R.createElement forestLayoutCpt
    forestLayoutCpt :: R.Component Props
    forestLayoutCpt = here.component "forestLayout" cpt where
    cpt p _ = do
    pure $ H.div { className: "forest-layout" }
    [ forest p [] ]
    cpt p _ = pure $
    H.div { className: "forest-layout-wrapper col-md-2" }
    [
    H.div { className: "forest-layout" }
    [
    forest p []
    ,
    H.div { className: "forest-layout-teaser" } []
    ]
    ]
    src/Gargantext/Components/MainPage.purs
    View file @ aaf84ca1
    ......@@ -2,15 +2,11 @@ module Gargantext.Components.MainPage where
    import Gargantext.Prelude
    import Data.Tuple.Nested ((/\))
    import Reactix as R
    import Reactix.DOM.HTML as H
    import Toestand as T
    import Web.HTML.Event.EventTypes (offline)
    import Gargantext.Components.App.Data (Boxes)
    import Gargantext.Routes as GR
    import Gargantext.Types as GT
    import Gargantext.Utils.Reactix as R2
    here :: R2.Here
    ......@@ -31,17 +27,9 @@ mainPageCpt = here.component "mainPage" cpt
    handed' <- T.useLive T.unequal handed
    route' <- T.useLive T.unequal route
    let classNameOffsetPre /\ className /\ classNameOffsetPost = case route' of
    GR.PGraphExplorer _ _ -> "" /\ "col-md-12" /\ ""
    _ -> case handed' of
    GT.LeftHanded -> "" /\ "col-md-10" /\ "col-md-2"
    GT.RightHanded -> "col-md-2" /\ "col-md-10" /\ ""
    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 } []
    pure $
    H.div { id: "page-wrapper" }
    [
    H.div { className: "container-fluid" } children
    ]
    src/Gargantext/Components/Router.purs
    View file @ aaf84ca1
    ......@@ -5,12 +5,6 @@ import Gargantext.Prelude
    import Data.Array as A
    import Data.Maybe (Maybe(..))
    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.Footer (footer)
    import Gargantext.Components.Forest as Forest
    ......@@ -26,8 +20,8 @@ import Gargantext.Components.Nodes.Annuaire.User (userLayout)
    import Gargantext.Components.Nodes.Annuaire.User.Contact (contactLayout)
    import Gargantext.Components.Nodes.Corpus (corpusLayout)
    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.Phylo (phyloLayout)
    import Gargantext.Components.Nodes.File (fileLayout)
    import Gargantext.Components.Nodes.Frame (frameLayout)
    import Gargantext.Components.Nodes.Home (homeLayout)
    ......@@ -42,6 +36,11 @@ import Gargantext.Sessions (Session, WithSession)
    import Gargantext.Sessions as Sessions
    import Gargantext.Types (CorpusId, Handed(..), ListId, NodeID, NodeType(..), SessionId, SidePanelState(..), reverseHanded)
    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
    ......@@ -58,7 +57,7 @@ router :: R2.Leaf Props
    router props = R.createElement routerCpt props []
    routerCpt :: R.Component Props
    routerCpt = here.component "router" cpt where
    cpt { boxes: boxes@{ handed } } _ = do
    cpt { boxes: boxes@{ handed, showTree } } _ = do
    handed' <- T.useLive T.unequal handed
    let handedClassName = case handed' of
    ......@@ -68,7 +67,7 @@ routerCpt = here.component "router" cpt where
    pure $ R.fragment
    ([ loginModal { boxes }
    , topBar { boxes } ] <>
    [ H.div { className: handedClassName } $ reverseHanded handed' $
    [ H.div { className: handedClassName <> " router-inner" } $ reverseHanded handed' $
    [ forest { boxes }
    , mainPage { boxes }
    , sidePanel { boxes }
    ......@@ -123,18 +122,25 @@ forestCpt = here.component "forest" cpt where
    , showLogin
    , showTree
    , tasks } } _ = do
    pure $ Forest.forestLayout { backend
    , forestOpen
    , frontends: defaultFrontends
    , handed
    , reloadForest
    , reloadMainPage
    , reloadRoot
    , route
    , sessions
    , showLogin
    , showTree
    , tasks } []
    showTree' <- T.useLive T.unequal showTree
    pure $
    if not showTree'
    then mempty
    else Forest.forestLayout
    { backend
    , forestOpen
    , frontends: defaultFrontends
    , handed
    , reloadForest
    , reloadMainPage
    , reloadRoot
    , route
    , sessions
    , showLogin
    , tasks } []
    sidePanel :: R2.Leaf Props
    sidePanel p = R.createElement sidePanelCpt p []
    ......
    src/Gargantext/Components/TopBar.purs
    View file @ aaf84ca1
    module Gargantext.Components.TopBar where
    import Data.Foldable (intercalate)
    import Data.Tuple.Nested ((/\))
    import Reactix as R
    import Reactix.DOM.HTML as H
    import Toestand as T
    ......@@ -27,7 +26,7 @@ topBarCpt = here.component "topBar" cpt
    cpt { handed, showTree } children = do
    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"
    , role: "navigation"
    }
    ......
    src/sass/_login.sass
    View file @ aaf84ca1
    #dafixedtop
    // correction for the popover
    z-index: 910
    // height: 60px
    //.logoSmall
    // line-height: 15px
    // height: 10px
    ......@@ -15,7 +10,10 @@
    border: 3px solid white
    #page-wrapper
    margin-top : 96px
    padding-top: 40px
    padding-left: 16px
    padding-right: 16px
    width: 100%
    #user-page-header
    border-bottom : 1px solid black
    ......
    src/sass/_menu.sass
    View file @ aaf84ca1
    ......@@ -6,6 +6,14 @@
    /* padding-bottom: 15px
    /* float: none
    #dafixedtop
    position: sticky
    top: 0
    left: 0
    right: 0
    // correction for the popover
    z-index: 910
    #corporatop.nav-tabs > li
    padding-left: 1
    padding-right: 1
    ......
    src/sass/_styles.sass
    View file @ aaf84ca1
    ......@@ -101,3 +101,16 @@ ul
    .join-button
    padding-bottom: 100px
    padding-top: 100px
    #app
    width: 100%
    .router-inner
    display: flex
    &.left-handed
    flex-direction: row
    &.right-handed
    flex-direction: row
    src/sass/_tree.sass
    View file @ aaf84ca1
    ......@@ -28,7 +28,7 @@ li
    a.settings
    visibility: visible
    .forest
    .forest-layout-content
    & > .tree
    margin-top: 20px
    ......@@ -153,6 +153,18 @@ li
    opacity: var(--over50, 0)
    #node-popup-tooltip
    // @XXX "react-awesome-popover" lack of parent host parameter
    //
    // hence, the popover will be added from within the overflow context
    // of component where its CTA lies, causing an issue with the hidden
    // overflow of its parent component
    //
    // to avoid a truncated popover, this position workaround has to be set
    // (so the popover will be hoisted to the overflow context of the window)
    //
    // @link https://gitlab.iscpif.fr/gargantext/purescript-gargantext/issues/302
    position: fixed
    .tree
    .node
    margin-top: 5px
    ......@@ -160,6 +172,26 @@ li
    .node
    padding-left: 15px
    // @XXX "react-awesome-popover" lack of parent host parameter
    //
    // as the container where the popover will be appended is actually a
    // a heighthy sidebar (which a large is hidden with a scrollbar),
    // the library tends to add the tooltip position in the middle of the
    // sidebar height: which can be off screen
    //
    // this workaround appends the tooltip in a static position
    .right-handed #node-popup-tooltip
    $offset-x: 16.6666666667% // simulate "col-2" sidebar attributes
    top: 50%
    left: $offset-x
    transform: translateY(-50%)
    .left-handed #node-popup-tooltip
    $offset-x: 16.6666666667% // simulate "col-2" sidebar attributes
    top: 50%
    right: $offset-x
    transform: translateY(-50%)
    .panel-actions
    .almost-useable
    color: orange
    ......@@ -172,16 +204,61 @@ li
    // empirical value (see issue #308)
    max-height: 50vh
    overflow-y: scroll
    .forest-layout-wrapper
    // removing Bootstrap "col" padding
    padding-left: 0
    padding-right: 0
    .forest-layout
    background-color: #fff
    position: fixed
    top: 3.7em
    width: 15%
    $offset-y: 56px
    padding-top: 8px
    z-index: 909
    .left-handed
    .forest-layout
    left: 80%
    .right-handed
    .forest-layout
    left: 2%
    // make the sidebar a scrollable component
    // `max-width` rule is an addition due to Bootstrap "col-2" applied on its
    // parent
    position: fixed
    height: calc(100vh - #{ $offset-y })
    width: 100%
    max-width: inherit
    // avoiding ugly scrollbar
    scrollbar-width: none
    overflow-y: scroll
    overflow-x: visible
    &::-webkit-scrollbar
    display: none
    transition: border 150ms
    // UX addition: visually delimiting the sidebar on hover
    // -- for now in "_common.scss" file (see @TODO: More SASS structure)
    // UX best pratice: when a lengthy column is overflowy hidden (with a scroll), a teaser
    // UI element shows to the user that a scroll is possible
    .forest-layout-teaser
    $height: 24px // ~line-height to 1.5
    $width: 16.6666666667% // simulate "col-2" sidebar attributes
    $minus-parent-border: 1px // border size of the sidebar on hover
    pointer-events: none
    position: fixed
    bottom: 0
    height: $height
    width: calc(#{ $width } - #{ $minus-parent-border})
    // background -- for now in "_common.scss" file (@TODO: More SASS structure)
    .right-handed .forest-layout-teaser
    left: 0
    .left-handed .forest-layout-teaser
    right: 0
    .left-handed .forest-layout
    padding-left: 8px
    padding-right: 16px
    .right-handed .forest-layout
    padding-left: 16px
    padding-right: 8px
    src/sass/bootstrap/_common.scss 0 → 100644
    View file @ aaf84ca1
    /// Abtstract
    /// Add alpha channel to a color
    /// @access public
    /// @param {Color} $color - color to work with
    /// @param {Number} $percentage - percentage of `$color` opacity
    /// @return {Color}
    @function mixAlpha($color, $percentage) {
    @return rgba($color, $percentage);
    }
    /// Misc
    .with-icon-font {
    font-family: ForkAwesome, $font-family-base;
    }
    /// Tree
    /// (?) @TODO: More SASS structure (eg. exporting variables into component
    /// SASS files)
    /// For now we have cut-copy the rules here
    .right-handed .forest-layout {
    border-right: 1px solid $body-bg;
    &:hover { border-right: 1px solid $border-color; }
    }
    .left-handed .forest-layout {
    border-left: 1px solid $body-bg;
    &:hover { border-left: 1px solid $border-color; }
    }
    .forest-layout-teaser {
    background: linear-gradient(to bottom, mixAlpha($body-bg, 0%) 0%, mixAlpha($body-bg, 100%) 45%);
    }
    src/sass/bootstrap/darkster.scss
    View file @ aaf84ca1
    ......@@ -74,5 +74,7 @@ $breadcrumb-active-color:$gray-500;
    @import "../../../node_modules/bootstrap/scss/bootstrap";
    // Add SASS theme customizations here..
    @import "./common";
    .navbar-dark.bg-primary {background-color:#111111 !important;}
    .table.able {color:#ccccc5}
    src/sass/bootstrap/default.sass
    View file @ aaf84ca1
    ......@@ -10,5 +10,5 @@ $theme-colors: ("primary": $blue, "secondary": $black)
    // Bootstrap and its default variables
    @import ../../../node_modules/bootstrap/scss/bootstrap
    .with-icon-font
    font-family: ForkAwesome, $font-family-base
    // Add SASS theme customizations here..
    @import ./_common
    src/sass/bootstrap/greyson.scss
    View file @ aaf84ca1
    ......@@ -24,3 +24,4 @@ $enable-rounded:false;
    @import "../../../node_modules/bootstrap/scss/bootstrap";
    // Add SASS theme customizations here..
    @import "./common";
    src/sass/bootstrap/herbie.scss
    View file @ aaf84ca1
    ......@@ -16,3 +16,4 @@ $dark:#072247;
    @import "../../../node_modules/bootstrap/scss/bootstrap";
    // Add SASS theme customizations here..
    @import "./common";
    src/sass/bootstrap/monotony.scss
    View file @ aaf84ca1
    ......@@ -22,3 +22,4 @@ $dark:#111111;
    @import "../../../node_modules/bootstrap/scss/bootstrap";
    // Add SASS theme customizations here..
    @import "./common";
    Markdown is supported
    0% or
    You are about to add 0 people to the discussion. Proceed with caution.
    Finish editing this message first!
    Please register or to comment