ode-csslib 4.0.7-feat-explorer.202302211128 → 4.0.8-dev.202303031539

package/dist/version.txt

@@ -1 +1 @@
-entcore-css-lib=4.0-SNAPSHOT 21/02/2023 11:28:28
+entcore-css-lib=4.0-SNAPSHOT 03/03/2023 15:39:50

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ode-csslib",
-  "version": "4.0.7-feat-explorer.202302211128",
+  "version": "4.0.8-dev.202303031539",
   "description": "Open Digital Education Legacy CSS framework",
   "scripts": {
     "copy-fonts": "cpr node_modules/entcore-generic-icons/fonts/ assets/fonts/generic-icons/ -o",

package/scss/_crisscross-mobile.scss

@@ -156,9 +156,9 @@
       @include grid-cell-left(12);
     }
 
-    /* .zero-mobile {
+    .zero-mobile {
       display: none !important;
-    } */
+    }
 
     .one-mobile {
       @include grid-cell-width(1);

package/scss/icons/_pictos.scss

@@ -128,23 +128,8 @@ i.help-large::before,
 i.type.help::before,
 i.help::before,
 i.navbar-help::before {
-  content: "";
-  display: block;
-  width: 24px;
-  height: 24px;
-  background-size: cover;
-  background-position: center;
-  background-repeat: no-repeat;
-  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg' aria-hidden='true' color='%23fff'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 24c6.627 0 12-5.373 12-12S18.627 0 12 0 0 5.373 0 12s5.373 12 12 12ZM7.123 7.667C8.276 5.958 9.745 5 12.013 5 14.425 5 17 6.941 17 9.5c0 2.113-1.377 2.932-2.418 3.552-.633.376-1.142.68-1.142 1.154v.169a.693.693 0 0 1-.682.703h-2.06a.693.693 0 0 1-.681-.703v-.287c0-1.768 1.269-2.5 2.266-3.075l.073-.042c.863-.499 1.392-.838 1.392-1.499 0-.874-1.082-1.454-1.956-1.454-1.112 0-1.64.53-2.351 1.449a.668.668 0 0 1-.945.121L7.27 8.63a.718.718 0 0 1-.147-.963ZM9.76 17.97c0-1.12.883-2.03 1.969-2.03 1.085 0 1.968.91 1.968 2.03 0 1.119-.883 2.029-1.968 2.029-1.086 0-1.969-.91-1.969-2.03Z' fill='currentColor'%3E%3C/path%3E%3C/svg%3E");
-}
-@media only screen and (min-width: 768px) {
-  i.help-large::before,
-  i.type.help::before,
-  i.help::before,
-  i.navbar-help::before {
-    width: 32px;
-    height: 32px;
-  }
+  content: "\e835";
+  cursor: pointer;
 }
 i.others,
 i.share {

package/scss/mobile/_tablette.scss

@@ -50,9 +50,9 @@
       }
     }
 
-    /* .navbar .welcome-message {
+    .navbar .welcome-message {
       display: none;
-    } */
+    }
 
     .cards-list .card {
       max-width: 250px;
@@ -93,10 +93,9 @@
       display: none;
     }
     .application-title {
-      margin-bottom: 0;
       position: fixed;
       color: #fff;
-      top: -4px;
+      top: 0;
       left: 10px;
       z-index: 10001;
       line-height: 50px;

package/scss/modules/_navigations.scss

@@ -1,4 +1,4 @@
-/* .navbar {
+.navbar {
   height: 40px;
   .cell {
     height: 100%;
@@ -26,7 +26,7 @@
       margin-top: 3px;
     }
   }
-} */
+}
 
 nav.horizontal {
   text-align: right;

package/scss/specifics/calendar/components/toasts.scss

@@ -41,7 +41,7 @@
       background-color: lighten($green, 30%);
 
       .content:before {
-        content: "\e871";
+        content: '\e871';
       }
 
       .timer {
@@ -54,7 +54,7 @@
       background-color: lighten($cyan, 30%);
 
       .content:before {
-        content: "\e84b";
+        content: '\e84b';
       }
 
       .timer {
@@ -67,7 +67,7 @@
       background-color: lighten($warning-color, 30%);
 
       .content:before {
-        content: "\e903";
+        content: '\e903';
       }
 
       .timer {
@@ -75,8 +75,7 @@
       }
     }
 
-    &.info,
-    &.warning {
+    &.info, &.warning {
       .content:before {
         font-size: 20px !important;
       }
@@ -100,4 +99,4 @@
       }
     }
   }
-}
+}

package/scss/specifics/crre/fragments/_status-circle.scss

@@ -35,7 +35,7 @@
     }
   }
 
-  &.PROGRESS, &.PARTIALLYVALIDED, &.PARTIALLYREJECTED, &.RESUBMIT, &.PARTIALLYRESUBMIT {
+  &.IN_PROGRESS, &.PARTIALLYVALIDED, &.PARTIALLYREJECTED, &.RESUBMIT, &.PARTIALLYRESUBMIT {
     background: $yellow;
 
     > i {

package/scss/specifics/formulaire/components/containers/cursor/_question-type-cursor.scss

@@ -46,6 +46,10 @@
       justify-content: space-between;
       margin-bottom: 2%;
     }
+    
+    &-label {
+      max-width: 200px;
+    }
 
     &-range {
       display: flex;
@@ -99,9 +103,7 @@
       input[type="range"]::-webkit-slider-thumb,  {
         -webkit-appearance: none; /* Override default look */
         appearance: none;
-        margin-top: -4px; /* Centers thumb on the track with formula (track height in pixels / 2) - (thumb height in pixels /2) - border size*/
         background-color: $formulaire-grey-very-light;
-        border: $formulaire-grey-dark 1px solid;
         border-radius: 100px;
         height: 16px;
         width: 16px;
@@ -112,7 +114,6 @@
       /* Firefox */
       input[type="range"]::-moz-range-thumb {
         background-color: $formulaire-grey-very-light;
-        border: $formulaire-grey-dark 1px solid;
         border-radius: 100px;
         height: 16px;
         width: 16px;
@@ -141,7 +142,7 @@
         position: absolute;
         left: calc((((var(--value) - var(--min)) / (var(--max) - var(--min))) * 100%) - 10px);
         bottom: 35px;
-        width: 20px;
+        width: 23px;
         height: 20px;
         background-color: $formulaire-blue;
 
@@ -157,9 +158,9 @@
           top: 20px;
           width: 0;
           height: 0;
-          border-left: 10px solid transparent;
-          border-right: 10px solid transparent;
-          border-top: 10px solid $formulaire-blue;
+          border-left: 12px solid transparent;
+          border-right: 11px solid transparent;
+          border-top: 11px solid $formulaire-blue;
           content: '';
         }
       }
@@ -170,7 +171,7 @@
           position: absolute;
           height: 10px;
           width: calc(((var(--value) - var(--min)) / (var(--max) - var(--min))) * 100%);
-          bottom: 9px;
+          bottom: 8px;
           left: 3px;
           background-color: $formulaire-blue;
           border-radius: 5px;
@@ -186,7 +187,6 @@
           left: 3px;
           background-color: #efefef;
           border-radius: 5px;
-          border: #4a4a4a 1px solid;
           content: '';
           z-index: 1;
         }

package/scss/specifics/lystore/_lystore.scss

@@ -1,6 +1,6 @@
 
 @font-face {
-  font-family: 'material-icons';
+  font-family: 'lystore-material-icons';
   src: url('/lystore/public/font/material-design/fonts/materialdesignicons-webfont.eot');
   src: url('/lystore/public/font/material-design/fonts/materialdesignicons-webfont.eot') format('embedded-opentype'),
   url('/lystore/public/font/material-design/fonts/materialdesignicons-webfont.woff2') format('woff2'),
@@ -9,6 +9,7 @@
   font-weight: normal;
   font-style: normal;
 }
+$lystore-light-grey: #7f8080;
 
 body.lystore {
   @import './components/index';

package/scss/specifics/lystore/components/_icons.scss

@@ -0,0 +1,22 @@
+i {
+  &.lystore-download::before {
+    font-family: 'lystore-material-icons';
+    content: "\F1DA";
+  }
+  &.trash::before{
+    font-family: 'lystore-material-icons';
+    content: "\FA79";
+  }
+  &.pencil::before{
+    font-family: 'lystore-material-icons';
+    content: "\F3EB";
+  }
+  &.tune::before{
+    font-family: 'lystore-material-icons';
+    content: "\F62E";
+  }
+  &.clipboard::before{
+    font-family: 'lystore-material-icons';
+    content: "\F14E";
+  }
+}

package/scss/specifics/lystore/components/_index.scss

@@ -4,6 +4,9 @@
 @import './async-autocomplete';
 @import './upload-files';
 @import './cloud-loader';
-@import './parameter-table';
+@import './parameter/parameter-active-structure';
 @import './search-and-select';
-@import "./tabs";
+@import "./tabs";
+@import "./parameter/parameter";
+@import "./icons";
+@import "./directives/order-preview";

package/scss/specifics/lystore/components/directives/_order-preview.scss

@@ -0,0 +1,162 @@
+.pdf-generation-preview .prev-next {
+  margin-top: 50px;
+}
+
+.order-preview {
+  margin-top: 50px;
+  font-family: "Calibri", sans-serif !important;
+  align-content: center !important;
+  color: #000000 !important;
+
+  & h1,
+  & h2,
+  & h3,
+  & h4,
+  & h5 {
+    color: #000000 !important;
+  }
+
+  & .logo-region{
+    height: auto;
+    width: 300px;
+    border-bottom: 1px #f6f6f6 solid ;
+    margin-bottom: 5px;
+  }
+
+  &  .left {
+    position: relative;
+    width: 45%;
+    margin-right: 5%;
+    display: inline-block;
+  }
+
+  &  .left::before {
+    content: none !important;
+  }
+  &  .right {
+    position: relative;
+    margin-left: 5%;
+    width: 44%;
+    display: inline-block;
+  }
+
+  & .order-info {
+    margin-top: 25px;
+    margin-bottom: 25px;
+  }
+
+  &  .right > input {
+    width: 90%;
+  }
+  &  .right > h1{
+    font-size: 20px ;
+  }
+  &  .header {
+    width: 100%;
+  }
+  &  .foot {
+    width: 100%;
+    margin-top: 35px;
+  }
+
+  &  .fright {
+    float: right;
+  }
+
+  &  .signature {
+    height: 60px;
+  }
+  & .equipments-table  {
+    width: 100%;
+    margin-top: 15px;
+    border-collapse: collapse;
+  }
+  &  .equipments-table tfoot tr td:first-child  {
+    font-weight: bold;
+  }
+  &  .equipments-table tr  td {
+    padding-top:10px;
+    padding-left: 10px ;
+    padding-bottom:10px;
+    border: 1px solid #ddd;
+  }
+
+  &  table.equipments-table > tbody tr:nth-child(odd) td {
+    background-color: #efefef;
+  }
+  &  table.equipments-table > tbody tr:nth-child(even) td {
+    background-color: #f2f4f6;
+  }
+
+  &  table > thead {
+    font-size: 14px ;
+    font-weight: bold;
+    text-align: center;
+  }
+  &  input {
+    min-width: 150px ;
+    width: 150px;
+    max-width: 100%;
+    margin-left: 5px;
+    padding-left: 5px ;
+  }
+
+  &  table > tfoot > tr {
+    margin-top: 20px;
+  }
+  &  div.service-fait > table.header {
+    margin-bottom: 10px ;
+  }
+  &  div.service-fait > table.equipments-table {
+    margin-top: 5px;
+    margin-bottom: 10px;
+  }
+  &  div.service-fait > div.signature {
+    width: 100%;
+    height: 400px;
+  }
+  &  div.block {
+    border: 0.5px #aaaaaa solid;
+    margin-bottom: 5px ;
+    margin-top: 5px ;
+    padding: 5px;
+    page-break-after: avoid;
+  }
+  &  .center-text {
+    text-align: center;
+  }
+
+  &  .right-text {
+    text-align: right;
+    padding-right: 5px;
+  }
+
+  & .bigger {
+    width: 70%;
+  }
+
+  &  .smaller {
+    width: 25%;
+  }
+
+  &  .uppercase {
+    text-transform: uppercase;
+  }
+
+  & .orders {
+    margin-bottom: 50px;
+  }
+
+  & .header h4, &  .header h5 {
+    margin: 5px;
+  }
+
+  & .signature:not(:empty) {
+    border-top: 0 !important;
+  }
+
+  & table thead td {
+    background-color: #fff;
+    color: #000;
+  }
+}

package/scss/specifics/lystore/components/{_parameter-table.scss → parameter/_parameter-active-structure.scss}

@@ -1,6 +1,5 @@
-parameter-table
-{
-  .parameter-table{
+.parameter{
+  &-table{
     position: fixed;
     display: block;
     right: -250px;
@@ -14,6 +13,14 @@ parameter-table
       right: -250px;
       transition: right 250ms ease;
     }
+    &-body{
+      &-th{
+        &-left{
+          text-align: left;
+          padding-left: 2em;
+        }
+      }
+    }
   }
 
   .button-puce{
@@ -33,11 +40,11 @@ parameter-table
     }
   }
 
-  .parameter-table::-webkit-scrollbar{
+  &-table::-webkit-scrollbar{
     width: 9px;
     background-color: #F5F5F5;
   }
-  .parameter-table::-webkit-scrollbar-thumb
+  &-table::-webkit-scrollbar-thumb
   {
     border-radius: 10px;
     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
@@ -49,5 +56,5 @@ parameter-table
     overflow-y: auto;
     height: 60vh;
   }
+}
 
-}

package/scss/specifics/lystore/components/parameter/_parameter.scss

@@ -0,0 +1,113 @@
+.parameter{
+  &-subtitle{
+    text-transform: uppercase;
+    font-weight: bold;
+    color: $lystore-light-grey;
+    margin-top: 2em;
+    & > *{
+      vertical-align: middle;
+    }
+    & > i {
+      font-size: 1.5em;
+    }
+  }
+  &-valid-command{
+    color: $lystore-light-grey;
+    margin-bottom: 1em;
+    &-title{
+      margin-bottom: 1em;
+    }
+    &-label{
+      margin-left: 2em;
+      padding-left: 5px;
+      margin-bottom: 1em;
+      font-style: italic;
+      &-switch{
+        margin-left: 2em;
+      }
+    }
+  }
+  &-bc-setting{
+    &-title{
+      font-weight: bold;
+      color: $lystore-light-grey;
+      margin-bottom: 1em;
+      margin-top: 1em;
+    }
+    &-form-input{
+      &-line{
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-right: 2em;
+        margin-bottom: 1em;
+        & > input{
+          width: 75%;
+          margin-bottom: 0;
+          background-color: white;
+        }
+      }
+    }
+    &-img-render{
+      &-img{
+        position: relative;
+        clear: both;
+        box-sizing: border-box;
+        margin-left: 15%;
+        width: 50%;
+      }
+    }
+    &-buttons{
+      padding-left: 1em;
+      display: flex;
+      column-gap: 1em;
+    }
+  }
+  &-bc-preview{
+    &-address {
+      border: 1px black solid;
+      height: 250px;
+
+      &-text {
+        text-align: center;
+        padding-bottom: 1em;
+        padding-top: 1em;
+      }
+    }
+    &-signature{
+      border: 1px black solid;
+      height: 100px;
+      &-text {
+        text-align: center;
+        padding-bottom: 1em;
+        padding-top: 1em;
+      }
+    }
+    &-elem {
+      padding-left: 1em;
+      padding-right: 1em;
+    }
+  }
+  &-export-options{
+    &-instruction{
+      &-switches{
+        display: flex;
+        flex-flow: row wrap;
+        row-gap : 5px;
+        & > * {
+          flex: 0 0 50%;
+        }
+      }
+    }
+    &-bc{
+      &-switches{
+        display: flex;
+        flex-flow: row wrap;
+        row-gap : 5px;
+        & > * {
+          flex: 0 0 50%;
+        }
+      }
+    }
+  }
+}

package/scss/specifics/minibadge/components/_icon.scss

@@ -107,4 +107,14 @@ i {
     font-family: 'minibadge-icons';
     content: "\F0987";
   }
+
+  &.icon-eye::before {
+    font-family: 'minibadge-icons';
+    content: "\F06D0";
+  }
+
+  &.eye-off::before {
+    font-family: 'minibadge-icons';
+    content: "\F06D1";
+  }
 }

package/scss/specifics/minibadge/containers/_statistics.scss

@@ -87,6 +87,16 @@
   &-top-most-refused {
     flex: 4;
 
+    .minibadge-card {
+      width: 100%;
+      background: $minibadge-white;
+      border: none;
+
+      container-body {
+        font-weight: bold;
+      }
+    }
+
     .close-circle {
       color: $minibadge-red;
     }

package/scss/specifics/statistics-presences/indicators/_global.scss

@@ -30,6 +30,7 @@
     font-size: 18px;
     font-weight: bold;
     background-color: $white;
+    z-index: 1;
 
     .student-count {
       flex: 2;