sempli-website-lib 5.0.1 → 5.0.2

package/styles/partials/app/_my-account.scss

@@ -1,203 +1,203 @@
-/*#############################################################################
-# MY ACCOUNT
-#############################################################################*/
-
-
-body#app, .app-layout {
-  .my-account {
-    section.app-body {
-      grid-template-columns: 260px 1fr !important;
-    }
-  }
-}
-
-nav.account {
-  a {
-    display: block;
-    color: $color-text;
-    font-size: rem-calc(14px);
-    margin: 0 0 20px;
-
-    &.active {
-      font-weight: 900;
-    }
-  }
-}
-
-header.transaction-history {
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr 2fr 1fr;
-    grid-column-gap: 30px;
-    align-items: center;
-    border-bottom: 1px solid $color-secondary-light;
-    padding: 10px 0;
-
-    .history-header {
-      font-size: rem-calc(12px);
-      font-weight: 900;
-
-      &.last {
-        text-align: right;
-        padding-right: 12px;
-      }
-    }
-}
-
-ul.transaction-history {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-
-  li {
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr 2fr 1fr;
-    grid-column-gap: 30px;
-    align-items: center;
-    border-bottom: 1px solid $color-secondary-light;
-    padding: 10px 0;
-
-    &:last-child {
-      border-bottom: none;
-    }
-
-    .history-box {
-      span {
-        display: block;
-
-        &.installment {
-          color: $color-secondary;
-          font-size: rem-calc(12px);
-        }
-
-        &.credit-id {
-          font-size: rem-calc(14px);
-        }
-
-        &.date {
-          font-size: rem-calc(12px);
-        }
-
-        &.time {
-          font-size: rem-calc(12px);
-        }
-
-        &.amount {
-          font-size: rem-calc(12px);
-          font-weight: 900;
-        }
-
-        &.paid-by {
-          font-size: rem-calc(12px);
-        }
-
-        &.status {
-          display: inline-block;
-          color: #fff;
-          font-size: rem-calc(12px);
-          font-weight: 900;
-          text-align: right;
-          padding: 3px 12px;
-          @include border-radius(20px);
-
-          &.approved {
-            background-color: $color-success;
-          }
-
-          &.rejected {
-            background-color: $color-alert;
-          }
-
-          &.failed {
-            background-color: $color-warning;
-          }
-
-          &.pending {
-            background-color: $color-secondary;
-          }
-        }
-      }
-
-      &.last {
-        text-align: right;
-      }
-    }
-  }
-}
-
-header.team-members {
-    display: grid;
-    grid-template-columns: 2fr 2fr 1fr 1fr;
-    grid-column-gap: 30px;
-    align-items: center;
-    border-bottom: 1px solid $color-secondary-light;
-    padding: 10px 0;
-
-    .team-header {
-      font-size: rem-calc(12px);
-      font-weight: 900;
-
-      &.last {
-        text-align: right;
-      }
-    }
-}
-
-ul.team-members {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-
-  li {
-    display: grid;
-    grid-template-columns: 2fr 2fr 1fr 1fr;
-    grid-column-gap: 30px;
-    align-items: center;
-    border-bottom: 1px solid $color-secondary-light;
-    padding: 10px 0;
-
-    &:last-child {
-      border-bottom: none;
-    }
-
-    .team-box {
-      span {
-        display: block;
-
-        &.name {
-          font-size: rem-calc(14px);
-          font-weight: 900;
-        }
-
-        &.permissions {
-          font-size: rem-calc(12px);
-        }
-
-        &.alarms {
-          font-size: rem-calc(12px);
-        }
-
-        &.actions {
-          font-size: rem-calc(12px);
-        }
-      }
-
-      &.last {
-        text-align: right;
-      }
-    }
-  }
-}
-
-.modal-box {
-  .permission-wrapper {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    grid-column-gap: 30px;
-
-    .permission-box {
-      border: 1px solid $color-secondary-light;
-      padding: 15px;
-      @include border-radius(4px);
-    }
-  }
-}
+/*#############################################################################
+# MY ACCOUNT
+#############################################################################*/
+
+
+body#app, .app-layout {
+  .my-account {
+    section.app-body {
+      grid-template-columns: 260px 1fr !important;
+    }
+  }
+}
+
+nav.account {
+  a {
+    display: block;
+    color: $color-text;
+    font-size: rem-calc(14px);
+    margin: 0 0 20px;
+
+    &.active {
+      font-weight: 900;
+    }
+  }
+}
+
+header.transaction-history {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr 2fr 1fr;
+    grid-column-gap: 30px;
+    align-items: center;
+    border-bottom: 1px solid $color-secondary-light;
+    padding: 10px 0;
+
+    .history-header {
+      font-size: rem-calc(12px);
+      font-weight: 900;
+
+      &.last {
+        text-align: right;
+        padding-right: 12px;
+      }
+    }
+}
+
+ul.transaction-history {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+
+  li {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr 2fr 1fr;
+    grid-column-gap: 30px;
+    align-items: center;
+    border-bottom: 1px solid $color-secondary-light;
+    padding: 10px 0;
+
+    &:last-child {
+      border-bottom: none;
+    }
+
+    .history-box {
+      span {
+        display: block;
+
+        &.installment {
+          color: $color-secondary;
+          font-size: rem-calc(12px);
+        }
+
+        &.credit-id {
+          font-size: rem-calc(14px);
+        }
+
+        &.date {
+          font-size: rem-calc(12px);
+        }
+
+        &.time {
+          font-size: rem-calc(12px);
+        }
+
+        &.amount {
+          font-size: rem-calc(12px);
+          font-weight: 900;
+        }
+
+        &.paid-by {
+          font-size: rem-calc(12px);
+        }
+
+        &.status {
+          display: inline-block;
+          color: #fff;
+          font-size: rem-calc(12px);
+          font-weight: 900;
+          text-align: right;
+          padding: 3px 12px;
+          @include border-radius(20px);
+
+          &.approved {
+            background-color: $color-success;
+          }
+
+          &.rejected {
+            background-color: $color-alert;
+          }
+
+          &.failed {
+            background-color: $color-warning;
+          }
+
+          &.pending {
+            background-color: $color-secondary;
+          }
+        }
+      }
+
+      &.last {
+        text-align: right;
+      }
+    }
+  }
+}
+
+header.team-members {
+    display: grid;
+    grid-template-columns: 2fr 2fr 1fr 1fr;
+    grid-column-gap: 30px;
+    align-items: center;
+    border-bottom: 1px solid $color-secondary-light;
+    padding: 10px 0;
+
+    .team-header {
+      font-size: rem-calc(12px);
+      font-weight: 900;
+
+      &.last {
+        text-align: right;
+      }
+    }
+}
+
+ul.team-members {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+
+  li {
+    display: grid;
+    grid-template-columns: 2fr 2fr 1fr 1fr;
+    grid-column-gap: 30px;
+    align-items: center;
+    border-bottom: 1px solid $color-secondary-light;
+    padding: 10px 0;
+
+    &:last-child {
+      border-bottom: none;
+    }
+
+    .team-box {
+      span {
+        display: block;
+
+        &.name {
+          font-size: rem-calc(14px);
+          font-weight: 900;
+        }
+
+        &.permissions {
+          font-size: rem-calc(12px);
+        }
+
+        &.alarms {
+          font-size: rem-calc(12px);
+        }
+
+        &.actions {
+          font-size: rem-calc(12px);
+        }
+      }
+
+      &.last {
+        text-align: right;
+      }
+    }
+  }
+}
+
+.modal-box {
+  .permission-wrapper {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-column-gap: 30px;
+
+    .permission-box {
+      border: 1px solid $color-secondary-light;
+      padding: 15px;
+      @include border-radius(4px);
+    }
+  }
+}