ode-csslib 4.0.0 → 4.0.2

package/scss/specifics/incidents/components/incidents/_lightbox.scss

@@ -0,0 +1,179 @@
+/* lightbox */
+.incident-lightbox {
+  &.editMode {
+    .content {
+      width: 740px;
+    }
+  }
+
+  // body part
+  &-body {
+    background: $whitesmoke;
+
+    &-title {
+      color: $black;
+      margin-top: 0;
+    }
+
+    &-dateAndPlace {
+      display: flex;
+
+      &.row:after {
+        width: unset;
+      }
+
+      &-date {
+        display: flex;
+        flex-direction: column;
+        flex: 0.6;
+
+        &-content {
+          display: flex;
+          justify-content: space-between;
+
+          &-timePicker {
+            background-color: $white;
+            display: inline-block;
+
+            input {
+              font-family: Roboto;
+            }
+          }
+        }
+      }
+
+      &-place {
+        padding-left: $spacing-L;
+        flex: 1;
+        align-self: flex-end;
+
+        select {
+          margin-top: $spacing-XLXS;
+        }
+      }
+    }
+
+
+    &-parameter {
+      display: flex;
+
+      &.row:after {
+        width: unset;
+      }
+
+      select {
+        margin-top: $spacing-XLXS;
+        width: $select-size;
+      }
+    }
+
+    &-responsible {
+      label {
+        overflow: inherit;
+      }
+    }
+
+    &-descriptionTreated {
+      &-content {
+        margin-top: $spacing-XLXS;
+        display: flex;
+
+        &.row:after {
+          width: unset;
+        }
+
+        &-description {
+          background: $white;
+          flex: 5;
+
+          textarea {
+            height: 50px;
+            resize: none;
+            border: none;
+            font-family: Roboto;
+          }
+        }
+
+        &-treated {
+          align-self: flex-end;
+          flex: 2;
+
+          switch {
+            .switch {
+              float: none;
+
+              input[type=checkbox]:checked + .tick {
+                background: $green;
+              }
+
+              input[type=checkbox]:checked + .tick:before {
+                background: $deep-green;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  // footer part
+  &-footer {
+    &-protagonist {
+      &-search {
+        align-items: center;
+        display: flex;
+        padding-bottom: $spacing-LXS;
+
+        &-title {
+          color: $black;
+          flex: 2;
+        }
+
+        &-input {
+          flex: 3;
+        }
+
+        &-space {
+          flex: 2;
+          visibility: collapse;
+        }
+      }
+
+      &-list {
+        &.search-input-ul {
+          display: flex;
+          flex-direction: column;
+          max-height: 140px;
+          overflow-y: auto;
+        }
+
+        &-item {
+          display: block !important;
+
+          &-content {
+            display: flex;
+            align-items: baseline;
+            padding-bottom: $spacing-LXS;
+
+            select {
+              width: $select-size;
+              margin: 0 $spacing-L;
+            }
+
+            i {
+              float: right;
+            }
+          }
+        }
+      }
+    }
+
+    &-submit {
+      padding-right: $spacing-S;
+    }
+  }
+}
+
+.lightbox-form .row.spacing .cell.twelve {
+  padding: 5px 10px !important;
+}

package/scss/specifics/incidents/components/incidents/_sniplets.scss

@@ -0,0 +1,30 @@
+&.incidents {
+ .incident-sniplet {
+    &-form {
+      display: flex;
+      align-items: center;
+      button {
+        background-color: $orange;
+        margin: 0 ($spacing-M + $spacing-M);
+        &:disabled{
+          background: $disabled-color;
+        }
+      }
+
+      &-alert {
+        flex-direction: row !important;
+        input[type=checkbox]:checked+span::before {
+          background-color: unset !important;
+          border-color: $orange !important;
+          content: "" !important;
+        }
+        input[type=checkbox]+span::before {
+          border-color: $orange !important;
+          background-color: $orange !important;
+          transform: rotate(0deg);
+          content: "\e871";
+        }
+      }
+    }
+  }
+}

package/scss/specifics/incidents/components/punishments/_board.scss

@@ -0,0 +1,23 @@
+.punishment-board {
+  background: $whitesmoke;
+
+  &-title {
+    background: $white;
+  }
+
+  .student {
+    justify-content: flex-start !important;
+  }
+
+  switch {
+    .switch {
+      input[type=checkbox]:checked + .tick {
+        background: $green;
+      }
+
+      input[type=checkbox]:checked + .tick:before {
+        background: $deep-green;
+      }
+    }
+  }
+}

package/scss/specifics/incidents/components/punishments/_index.scss

@@ -0,0 +1,4 @@
+@import "board";
+@import "punishment-form";
+@import "type";
+@import "form/index";

package/scss/specifics/incidents/components/punishments/_punishment-form.scss

@@ -0,0 +1,87 @@
+.punishment-form-lightbox {
+  /* Body part */
+  &-body {
+    padding: $spacing-M;
+    background: $incident-light-grey;
+
+    &-student {
+      font-size: $spacing-M;
+      font-weight: bold;
+    }
+
+    &-type {
+      display: flex;
+      padding-top: $spacing-S;
+
+      &-select {
+        display: flex;
+        flex-direction: column;
+      }
+    }
+
+    &-form {
+      padding: $spacing-M 0;
+
+      &-custom-fields {
+        display: flex;
+        flex-direction: column;
+
+        label {
+          overflow: inherit;
+        }
+      }
+    }
+  }
+
+  /* Footer part */
+  &-footer {
+    padding: $spacing-LXS $spacing-LXS 0 $spacing-LXS;
+
+    &-body {
+      margin: $spacing-M $spacing-M 0 $spacing-LXS;
+
+      &-search {
+        display: flex;
+        align-items: center;
+
+        &-title {
+          margin-top: 0;
+          color: $black;
+        }
+      }
+    }
+
+    &-submit {
+      display: flex;
+      align-items: center;
+      flex-wrap: wrap;
+      justify-content: space-between;
+      padding-top: $spacing-M;
+
+      &-right {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+
+      &.create {
+        justify-content: flex-end;
+      }
+
+      .button {
+        padding: $spacing-LXS;
+      }
+    }
+  }
+
+  textarea {
+    border: none;
+    border-bottom: 1px dotted $grey-light;
+    padding: 0;
+    height: $spacing-L;
+
+    &:focus {
+      border: none;
+    }
+  }
+}

package/scss/specifics/incidents/components/punishments/_type.scss

@@ -0,0 +1,14 @@
+.punishment-type {
+  &-punishment, &-sanction {
+    text-align: center !important;
+    color: $white;
+  }
+
+  &-punishment {
+    background-color: $yellow-main;
+  }
+
+  &-sanction {
+    background-color: $yellow-sand;
+  }
+}

package/scss/specifics/incidents/components/punishments/form/_index.scss

@@ -0,0 +1,3 @@
+@import "punishment-duty-form";
+@import "punishment-exclude-form";
+@import "punishment-detention-form";

package/scss/specifics/incidents/components/punishments/form/_punishment-detention-form.scss

@@ -0,0 +1,38 @@
+.punishment-detention-form {
+  &-dates {
+    margin: $spacing-LXS 0;
+
+    &-date {
+      padding-bottom: $spacing-LXS;
+
+      .timeslot-select {
+        margin-right: $spacing-M;
+      }
+    }
+
+    &-place {
+      input {
+        border: none;
+        background: none;
+        border-bottom: 1px dotted $grey-light;
+
+        &:focus {
+          outline: none;
+        }
+      }
+    }
+  }
+
+  &-createSlot {
+    margin-bottom: $spacing-L;
+
+    &:hover {
+      color: $yellow-main;
+    }
+
+    &-icon {
+      font-size: 2em;
+      margin-right: $spacing-LXS;
+    }
+  }
+}

package/scss/specifics/incidents/components/punishments/form/_punishment-duty-form.scss

@@ -0,0 +1,14 @@
+.punishment-duty-form {
+  &-date {
+    padding-bottom: $spacing-M;
+  }
+
+  &-instruction {
+    padding: $spacing-LXS 0 $spacing-M 0;
+
+    textarea {
+      background: none;
+      margin: $spacing-M 0
+    }
+  }
+}

package/scss/specifics/incidents/components/punishments/form/_punishment-exclude-form.scss

@@ -0,0 +1,55 @@
+.punishment-exclude-form {
+  &-date {
+    padding-bottom: $spacing-M;
+
+    date-picker {
+      margin-right: $spacing-L;
+    }
+  }
+
+  &-mandatory {
+    padding: $spacing-LXS 0 $spacing-L 0;
+    display: inline-flex;
+    align-items: center;
+  }
+
+  &-absence {
+    display: inline-flex;
+    align-items: center;
+    margin-bottom: $spacing-L;
+
+    &.add-absence {
+      margin-bottom: $spacing-XXS;
+    }
+
+  }
+
+  &-absence-anomaly {
+    color: $deep-red;
+    span {
+      font-weight: bold;
+      color: $dark-red;
+    }
+  }
+
+  &-absence-reason {
+    margin-top: $spacing-LXS;
+    margin-bottom: $spacing-L;
+
+    &-follow {
+      padding-left: $spacing-M;
+    }
+  }
+
+  switch {
+    .switch {
+      input[type=checkbox]:checked + .tick {
+        background: $green;
+      }
+
+      input[type=checkbox]:checked + .tick:before {
+        background: $deep-green;
+      }
+    }
+  }
+}

package/scss/specifics/incidents/memento/_incidents.scss

@@ -0,0 +1,77 @@
+#memento-incidents-sniplet {
+  position: relative;
+
+  .disabled {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: rgba(255, 255, 255, 0.8);
+    z-index: 1;
+  }
+
+  .text-align-center {
+    text-align: center;
+  }
+
+  .background-yellow {
+    background-color: $yellow-main;
+  }
+
+  .text-white {
+    color: $white;
+  }
+
+  .min-height-45 {
+    min-height: 45px !important;
+  }
+
+  .max-height-80 {
+    max-height: 80px !important;
+  }
+
+  .overflow-y {
+    overflow: auto;
+    max-height: 200px;
+  }
+
+  .pagination-sniplet {
+    > ul {
+      float: none !important;
+      text-align: right;
+    }
+  }
+
+  .open-in-new::before {
+    font-size: 25px;
+    margin-right: 0;
+  }
+
+  .incident-flex {
+    display: flex;
+    justify-content: space-between;
+  }
+
+  .incident-filters {
+    font-size: 14px;
+  }
+
+  .checkbox {
+    margin-left: 20px;
+  }
+
+  .check-circle::before {
+    font-size: 25px;
+    color: $incident-light-green;
+  }
+
+  .absences::before {
+    font-size: 25px;
+    color: $incidents-grey-average;
+  }
+
+}

package/scss/specifics/lool-connector/_sniplet.scss

@@ -58,13 +58,13 @@
             }
           }
 
-          &.odp {
+          &.pptx, &.odp {
             &::before {
               content: '\e85f'
             }
           }
 
-          &.ods {
+          &.xlsx, &.ods {
             &::before {
               content: '\e881'
             }

package/scss/specifics/magneto/_magneto.scss

@@ -0,0 +1,41 @@
+@import url("https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&display=swap");
+
+@font-face {
+  font-family: 'magneto-mdi';
+  src: url('/magneto/public/mdi/materialdesignicons-webfont.eot');
+  src: url('/magneto/public/mdi/materialdesignicons-webfont.eot') format('embedded-opentype'),
+  url('/magneto/public/mdi/materialdesignicons-webfont.woff2') format('woff2'),
+  url('/magneto/public/mdi/materialdesignicons-webfont.woff2') format('woff'),
+  url('/magneto/public/mdi/materialdesignicons-webfont.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+
+body.magneto,.sniplet.magneto {
+  @import "mixins";
+  @import "generics/index";
+  @import "components/index";
+
+  section.main {
+    top: 56px !important;
+
+    #directory + div.cell {
+      box-shadow: 0 5px 5px rgba(0, 0, 0, 0.21);
+    }
+  }
+
+  h1 {
+    font-size: 28px;
+    line-height: 40px;
+    color: $magneto-blue;
+    font-weight: bold;
+  }
+
+  h2 {
+    font-size: 20px;
+    line-height: 40px;
+    font-weight: bold;
+  }
+}
+
+

package/scss/specifics/magneto/_mixins.scss

@@ -0,0 +1,95 @@
+$magneto-yellow: #ffb600;
+$magneto-yellow-ochre: #ecbe30;
+$magneto-white: #ffffff;
+$magneto-lighter-grey: #ebebeb;
+$magneto-light-grey: #d6d6d6;
+$magneto-grey-blue: #f4fAfd;
+$magneto-white-blue: #e3f1f7;
+$magneto-black: #000000;
+$magneto-grey: #aaaaaa;
+$magneto-black-light: #555555;
+$magneto-dark-blue: #368daf;
+$magneto-blue: #67add1;
+$magneto-sky-blue: #2a9cc8;
+$magneto-light-sky-blue: #4bafd5;
+$magneto-light-blue: #78c5e2;
+$magneto-lighter-blue: #bde4f9;
+$magneto-orange: #ff8500;
+$magneto-red: #e61610;
+
+$magneto-font-secondary: 'Comfortaa', cursive;
+
+$magneto-screen-mobile: 768px;
+
+
+
+@mixin mobile {
+  @media (max-width: $magneto-screen-mobile) {
+    @content;
+  }
+}
+
+@mixin desktop {
+  @media (min-width: 769px) {
+    @content;
+  }
+}
+
+@mixin paddingX($size) {
+  padding-left: $size;
+  padding-right: $size;
+}
+
+@mixin paddingY($size) {
+  padding-bottom: $size;
+  padding-top: $size;
+}
+
+@mixin marginX($size) {
+  margin-left: $size;
+  margin-right: $size;
+}
+
+@mixin marginY($size) {
+  margin-bottom: $size;
+  margin-top: $size;
+}
+
+@mixin lightboxWidth($width) {
+  section.lightbox {
+    .content {
+      width: $width !important;
+    }
+  }
+}
+
+@mixin noTextOverflow($nbLines) {
+  display: -webkit-box;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -webkit-line-clamp: $nbLines !important;
+  /*! autoprefixer: off */
+  -webkit-box-orient: vertical;
+  /*! autoprefixer: on */
+}
+
+@mixin navbarBorderBottom($size) {
+  padding-top: $size;
+  border-bottom: solid $size;
+  box-sizing: border-box;
+}
+
+/* ----------------------------
+    Spacing
+---------------------------- */
+$spacing-XXL: 68px;
+$spacing-XML: 60px;
+$spacing-XM: 48px;
+$spacing-XL: 42px;
+$spacing-L: 24px;
+$spacing-M: 16px;
+$spacing-S: 12px;
+$spacing-XLXS: 10px;
+$spacing-LXS: 8px;
+$spacing-6: 6px;
+$spacing-XXS: 4px;

package/scss/specifics/magneto/components/_buttons.scss

@@ -0,0 +1,12 @@
+button, a.button {
+  color: $magneto-white;
+
+  &:disabled {
+    background: $magneto-black-light;
+  }
+
+  &.cancel {
+    background: $magneto-grey;
+    color: $magneto-white;
+  }
+}