@leapdev/gui 0.2.265 → 1.0.0

package/dist/scss/x3/components/button/_button-variants.scss

@@ -1,179 +0,0 @@
-// Future-proof disabling of clicks on `<a>` elements
-a.btn.disabled,
-fieldset:disabled a.btn {
-  pointer-events: none;
-}
-
-
-//
-// Link buttons
-//
-
-%btn-link,
-.btn-link {
-  font-weight: $font-weight-normal;
-  color: $link-color;
-  text-decoration: $link-decoration;
-
-  @include hover {
-    color: $link-hover-color;
-    text-decoration: $link-hover-decoration;
-  }
-
-  &:focus,
-  &.focus {
-    text-decoration: $link-hover-decoration;
-    box-shadow: none;
-  }
-
-  &:disabled,
-  &.disabled {
-    color: $btn-link-disabled-color;
-    pointer-events: none;
-  }
-
-  &:active,
-  &:focus,
-  &:active:focus {
-    outline: none;
-    box-shadow: none;
-  }
-
-  .active{
-    text-decoration: underline;
-  }
-}
-
-//
-// Block
-//
-%btn-block,
-.btn-block {
-  display: block;
-  width: 100%;
-
-  // Vertically space out multiple block buttons
-  + .btn-block {
-    margin-top: $btn-block-spacing-y;
-  }
-}
-
-
-//
-// Input buttons
-//
-input[type="submit"],
-input[type="reset"],
-input[type="button"] {
-  &.btn-block {
-    width: 100%;
-  }
-}
-
-
-//
-// Loading
-//
-.x-btn-loading {
-  position: relative;
-
-  .x-btn-label {
-    @extend .fade; // Hide Label but maintain btn width
-  }
-
-  .x-loader {
-    @extend %text-reset;
-    position: absolute;
-    height: 100%;
-
-    .x-icon {
-      font-size: 1.6em; // Loader size based on btn size
-    }
-  }
-}
-@each $color, $value in $theme-colors {
-  .btn-#{$color} {
-    .x-loader {
-      @if not ($color == "light" or $color == "light-secondary" or $color == "light-transparent") {
-        color: theme-color("white");
-      }
-    }
-  }
-}
-
-//
-// Rounded Btn
-//
-.x-btn-rounded {
-  @extend %btn,
-          %text-uppercase;
-  border-radius: $border-radius;
-}
-
-
-//
-// Button Utility
-//
-.x-btn-input-utility {
-  @extend %btn,
-          %btn-link,
-          %btn-sm;
-  right: 1rem;
-  bottom: 0.55rem;
-  position: absolute;
-  padding: 0;
-  color: theme-color("primary-lighter");
-}
-
-
-//
-// Remove focus outline styles
-//
-%x-no-focus,
-.x-no-focus {
-  &:focus {
-    outline: none !important;
-    box-shadow: none !important;
-  }
-}
-
-
-//
-// Matters document list custom button for hover state
-//
-.x-btn-icon-action {
-  @extend %x-btn-icon-only-md,
-          %x-btn-default,
-          %btn-sm;
-  margin-left: 0 !important;
-  margin-right: 0 !important;
-  border-radius: $border-radius;
-
-  .x-avatar-group &,
-  .x-file-complex & {
-    color: theme-color("info");
-    background-color: transparent;
-    border-color: transparent;
-  }
-  .x-avatar-group:hover &
-  .x-file-complex:hover & {
-    color: theme-color("info");
-    background-color: $white;
-    border-color: $border-color;
-  }
-}
-
-
-.x-btn-card-action {
-  @extend %w-100,
-          %x-btn-primary,
-          %btn-sm,
-          %x-no-focus;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  border-top-right-radius: 0;
-  border-top-left-radius: 0;
-  border-color: transparent !important;
-  background-color: var(--custom-theme-primary-darker, theme-color('primary-darker')) !important;
-}

package/dist/scss/x3/components/button/_button.scss

@@ -1,57 +0,0 @@
-// stylelint-disable selector-no-qualifying-type
-
-//
-// Base styles
-//
-
-%btn,
-.btn {
-  display: inline-block;
-  font-family: $btn-font-family;
-  font-weight: $btn-font-weight;
-  color: $body-color;
-  text-align: center;
-  vertical-align: middle;
-  user-select: none;
-  background-color: transparent;
-  border: $btn-border-width solid transparent;
-  @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius);
-  @include transition($btn-transition);
-
-  @include hover {
-    color: $body-color;
-    text-decoration: none;
-  }
-
-  &:focus,
-  &.focus {
-    outline: 0;
-    box-shadow: $btn-focus-box-shadow;
-  }
-
-  // Disabled comes first so active can properly restyle
-  &.disabled,
-  &:disabled {
-    opacity: $btn-disabled-opacity;
-    @include box-shadow(none);
-  }
-
-  &:not(:disabled):not(.disabled):active,
-  &:not(:disabled):not(.disabled).active {
-    @include box-shadow($btn-active-box-shadow);
-
-    &:focus {
-      @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow);
-    }
-  }
-}
-
-
-//
-// Label
-//
-
-.x-btn-label {
-  @extend %text-nowrap;
-}
-

package/dist/scss/x3/components/card/_card-balance.scss

@@ -1,140 +0,0 @@
-
-
-
-.x-billing-list {
-  @include media-breakpoint-up(lg) {
-    @include transition(all 300ms ease-in-out);
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    border-radius: $card-border-radius;
-    position: relative;
-    overflow: visible;
-    width: 100%;
-
-    .cdk-virtual-scroll-content-wrapper {
-      padding: 0 1rem 1rem;
-      // box-shadow: $box-shadow;
-      // background-color: theme-color("white");
-      // border-radius: $card-border-radius;
-    }
-
-    .x-files {
-      border-bottom-left-radius: 0.5rem;
-      border-bottom-right-radius: 0.5rem;
-      border-top-left-radius: 0 !important;
-      border-top-right-radius: 0 !important;
-      overflow: hidden;
-      display: block;
-      margin-top: 0 !important;
-      margin-bottom: 0 !important;
-    }
-
-    .x-file-complex-header {
-      border-top-left-radius: 0.5rem;
-      border-top-right-radius: 0.5rem;
-      overflow: hidden;
-    }
-  }
-}
-
-
-
-%x-shadow,
-.x-shadow {
-  @extend %border-0;
-  box-shadow: $box-shadow !important;
-}
-
-.x-billing {
-  background-color: $white;
-  border-radius: $card-border-radius;
-  display: flex;
-  flex-direction: column;
-  margin-bottom: 2rem;
-  padding: 1.5rem;
-  position: relative;
-  width: 100%;
-  overflow: hidden;
-
-  sc-btn-icon {
-    z-index: 99;
-  }
-  .chartjs-render-monitor {
-    height: 100% !important;
-  }
-
-  &-chart {
-    @extend %position-absolute,
-            %w-100,
-            %h-100;
-    top: 0;
-    left: 0;
-  }
-
-  &-dark {
-    @include custom-theme-color(primary, background-color);
-    color: $white;
-    @extend %x-shadow;
-  }
-
-  &-row {
-    flex-direction: row;
-  }
-
-  &-body {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-  }
-
-  &-details {
-    align-items: flex-end;
-    display: flex;
-    justify-content: space-between;
-    width: 100%;
-
-    .u-right {
-      align-items: flex-end;
-    }
-
-    > * {
-      display: flex;
-      flex-direction: column;
-
-      > *:last-child {
-        margin-bottom: 0;
-      }
-    }
-
-  }
-
-  &-label {
-    @extend %font-weight-medium;
-    color: theme-color("info");
-    opacity: 0.7;
-    font-size: 1rem;
-
-    .x-billing-dark & {
-      color: $white;
-    }
-  }
-
-  &-h4 {
-    font-size: $h4-font-size;
-
-    .x-billing-details & {
-      line-height: 1;
-      margin-bottom: 0;
-    }
-  }
-
-  &-h6 {
-    @extend %font-weight-medium;
-    color: theme-color("default");
-    font-size: $h6-font-size;
-    margin-bottom: 0;
-  }
-
-}
-

package/dist/scss/x3/components/card/_card-comment.scss

@@ -1,89 +0,0 @@
-
-.x-card-comment {
-  @extend %x-card-inline,
-          %x-card-hover-border;
-  cursor: $cursor-default;
-
-  .x-card-footer {
-    @extend %pt-0;
-  }
-  .x-divider-horizontal {
-    @extend %my-3;
-  }
-
-  .btn-link {
-    @extend %pb-0,
-            %pl-0;
-  }
-}
-
-
-.x-card-footer-reply  {
-  @extend %w-100;
-}
-
-.x-card-comments {
-  @extend %mt-2;
-
-  &-item {
-    @extend %d-flex,
-            %flex-row;
-
-    .x-card-prepend {
-      @extend %align-items-start,
-              %position-relative,
-              %mr-3;
-    }
-
-    &:not(:last-child) {
-
-      .x-card-content {
-        @extend %mb-3;
-      }
-      .x-card-prepend:before {
-        @extend %position-absolute,
-                %h-100,
-                %d-block;
-        content: '';
-        width: 1px;
-        left: 50%;
-        top: 0;
-        background-color: $border-color;
-      }
-    }
-  }
-}
-
-.x-card-annotation {
-  @extend %x-flex-a-center,
-          %mb-2,
-          %w-100,
-          %overflow-hidden,
-          %cursor-pointer;
-
-  .x-note {
-    max-width: calc(100% - 3rem);
-    .x-text {
-       @extend %text-truncate;
-       max-width: 15.750rem;
-
-      @media (min-width: 1367px) {
-        max-width: 22rem;
-      }
-    }
-  }
-}
-
-.x-comment-date {
-  @extend %text-info,
-          %font-size-xs;
-}
-
-.x-comment-name {
-  @extend %text-default;
-}
-
-.x-comment-reply {
-  @extend %h6;
-}
-

package/dist/scss/x3/components/card/_card-default.scss

@@ -1,248 +0,0 @@
-// Set default customise component variables here,
-// Override it in theme variables files
-
-$card-box-shadow:             $box-shadow-sm !default;
-$x-card-border-hover-color:   var(--custom-theme-primary-hover, $border-active) !default;
-$box-highlight-border-shadow: 0 0 0 2px $x-card-border-hover-color !default;
-
-%x-card-hover-active-state {
-  // Use box-shadow instead of border to prevent expanding element's dimension
-  @include box-shadow($box-shadow-md, $box-highlight-border-shadow);
-}
-
-%x-card-inline,
-.x-card-inline {
-  &.current {
-    @extend %border,
-            %border-success;
-  }
-  @extend %x-shadow;
-}
-
-
-// Utilities
-%x-card-hover-border,
-.x-card-hover-border {
-  @extend %cursor-pointer;
-  @include transition(box-shadow 0.08s ease-out);
-
-  &:hover,
-  &:active {
-    @extend %x-card-hover-active-state;
-  }
-}
-
-%x-card-hover,
-.x-card-hover {
-  @include transition(all 0.18s ease-in-out);
-  transform: scale(1);
-
-  @include x-hover-focus-active {
-    @include transition(all 0.18s ease-in-out);
-    @include box-shadow($box-shadow-md);
-    transform: scale(1.01);
-  }
-}
-
-// Card List
-%x-card-list,
-.x-card-list {
-  @extend %d-flex,
-          %flex-wrap,
-          %justify-content-center,
-          %pb-2,
-          %mb-4;
-
-  .x-aside-footer & {
-    @extend %mb-0,
-            %justify-content-start;
-    max-width: 32rem;
-  }
-
-  > * {
-    @extend %mb-3;
-
-    .x-aside-footer &,
-    &:last-child {
-      @extend %mb-0;
-    }
-  }
-}
-
-%x-card-list-item,
-.x-card-list-item {
-  @extend %px-2,
-          %mb-3,
-          %w-100;
-
-  @include media-breakpoint-up(md) {
-    max-width: 18.750rem;
-  }
-}
-
-%x-card-wrap,
-.x-card-wrap {
-  @extend %position-relative;
-  z-index: 1;
-}
-
-// Card
-%x-card,
-.x-card {
-  @extend %card,
-          %w-100,
-          %p-3,
-          %border-0,
-          %overflow-hidden;
-
-  .x-overlay-panel & {
-    @extend  %p-2,
-             %p-lg-3;
-  }
-
-  @include box-shadow($card-box-shadow);
-
-  .card-title {
-    @extend %font-size-base,
-            %mb-1;
-  }
-
-
-  &.is-selected:before {
-    @extend %d-block,
-            %position-absolute;
-    background-color: theme-color("primary-transparent");
-    z-index: 0;
-    width: 100%;
-    height:100%;
-    top: 0;
-    left: 0;
-    content: "";
-  }
-
-  .is-centered {
-    @extend %text-center,
-            %x-flex-center,
-            %flex-column;
-  }
-
-  &.active {
-    @extend %x-card-hover-active-state;
-  }
-
-  &-inline {
-    @extend %x-card,
-            %d-inline-flex,
-            %flex-row,
-            %mb-3,
-            %align-items-stretch;
-  }
-}
-
-// Prepend icon/image/avatar
-%x-card-prepend,
-.x-card-prepend {
-  @extend %d-flex;
-
-  .x-card-default & {
-    @extend %x-flex-center;
-  }
-
-  .x-card-inline & {
-    @extend %mr-3;
-  }
-
-  &.is-thumbnail {
-    @extend %x-flex-center;
-
-    figure {
-      @extend %x-flex-center,
-              %mb-0,
-              %mt-2;
-      max-width: 6rem;
-
-      @include media-breakpoint-up(md) {
-        max-width: 8rem;
-      }
-
-      img {
-        @extend %h-auto,
-                %w-100;
-        border-style: none;
-      }
-    }
-
-    .x-card-inline & {
-      @extend %mr-3,
-              %border-right;
-      max-width: 9em;
-    }
-  }
-}
-
-// Card Body
-%x-card-body,
-.x-card-body {
-  @extend %font-size-sm,
-          %p-0,
-          %w-100,
-          %align-items-start,
-          %overflow-hidden,
-          %d-flex;
-
-
-    .x-card-content & {
-      .x-title {
-        @extend %w-100;
-      }
-    }
-
-  .x-card-default & {
-    @extend %p-3;
-    h6 {
-      @extend %font-weight-medium;
-    }
-  }
-}
-
-// Card Footer
-%x-card-footer,
-.x-card-footer {
-  @extend %x-flex-a-center,
-          %justify-content-between,
-          %mt-auto,
-          %pt-2,
-          %w-100;
-}
-
-%x-card-header,
-.x-card-header {
-  @extend %d-flex,
-          %w-100,
-          %position-relative,
-          %align-items-start,
-          %overflow-hidden;
-  a {
-    @extend %text-default;
-    @include x-hover-focus-active {
-      @extend %text-decoration-none;
-    }
-  }
-}
-
-// Card Content
-
-%x-card-content,
-.x-card-content {
-  @extend %w-100,
-          %align-items-start;
-
-          .x-card-comments-item & {
-            @extend %overflow-hidden;
-          }
-
-  .x-card-inline & {
-    @extend %x-flex-j-center,
-            %flex-column;
-  }
-}