ngwr 0.0.6 → 0.0.9

package/styles/grid.scss

@@ -1,177 +0,0 @@
-$breakpoints: (
-  xs: 0,
-  sm: 576px,
-  md: 768px,
-  lg: 992px,
-  xl: 1200px,
-  xxl: 1400px,
-  xga: 1600px,
-  fhd: 1920px,
-  rt: 2560px
-);
-
-$displays: (
-  sm: 540px,
-  md: 720px,
-  lg: 960px,
-  xl: 1140px,
-  xxl: 1320px,
-  xga: 1530px,
-  fhd: 1830px,
-  rt: 2470px
-);
-
-$columns: 12 !default;
-$gutter: 1.5rem !default;
-$container-padding-x: $gutter * .5 !default;
-
-@function breakpoint-min($name) {
-  $min: map-get($breakpoints, $name);
-  @return if($min != 0, $min, null);
-}
-
-@function breakpoint-infix($name) {
-  @return if(breakpoint-min($name) == null, "", "-#{$name}");
-}
-
-@mixin media-breakpoint-up($name) {
-  $min: breakpoint-min($name);
-  @if $min {
-    @media (min-width: $min) {
-      @content;
-    }
-  } @else {
-    @content;
-  }
-}
-
-.container,
-.container-fluid {
-  width: 100%;
-  padding-right: $container-padding-x;
-  padding-left: $container-padding-x;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-@each $breakpoint, $container-max-width in $displays {
-  .container-#{$breakpoint} {
-    @extend .container-fluid;
-  }
-
-  @include media-breakpoint-up($breakpoint) {
-    %responsive-container-#{$breakpoint} {
-      max-width: $container-max-width;
-    }
-
-    $extend-breakpoint: true;
-
-    @each $name, $width in $breakpoints {
-      @if ($extend-breakpoint) {
-        .container#{breakpoint-infix($name)} {
-          @extend %responsive-container-#{$breakpoint};
-        }
-
-        @if ($breakpoint == $name) {
-          $extend-breakpoint: false;
-        }
-      }
-    }
-  }
-}
-
-@mixin make-row() {
-  display: flex;
-  flex-wrap: wrap;
-  margin-right: calc(-.5 * #{$gutter});
-  margin-left: calc(-.5 * #{$gutter});
-}
-
-.row {
-  @include make-row();
-}
-
-@function divide($dividend, $divisor, $precision: 10) {
-  $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);
-  $dividend: abs($dividend);
-  $divisor: abs($divisor);
-  @if $dividend == 0 {
-    @return 0;
-  }
-  @if $divisor == 0 {
-    @error 'Cannot divide by 0';
-  }
-  $remainder: $dividend;
-  $result: 0;
-  $factor: 10;
-  @while ($remainder > 0 and $precision >= 0) {
-    $quotient: 0;
-    @while ($remainder >= $divisor) {
-      $remainder: $remainder - $divisor;
-      $quotient: $quotient + 1;
-    }
-    $result: $result * 10 + $quotient;
-    $factor: $factor * .1;
-    $remainder: $remainder * 10;
-    $precision: $precision - 1;
-    @if ($precision < 0 and $remainder >= $divisor * 5) {
-      $result: $result + 1;
-    }
-  }
-  $result: $result * $factor * $sign;
-  $dividend-unit: unit($dividend);
-  $divisor-unit: unit($divisor);
-  $unit-map: (
-    "px": 1px,
-    "rem": 1rem,
-    "em": 1em,
-    "%": 1%
-  );
-  @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {
-    $result: $result * map-get($unit-map, $dividend-unit);
-  }
-  @return $result;
-}
-
-@mixin make-col($size) {
-  box-sizing: border-box;
-  max-width: 100%;
-  padding-right: calc(#{$gutter} * .5);
-  padding-left: calc(#{$gutter} * .5);
-  flex: 0 0 auto;
-  width: percentage(divide($size, $columns));
-}
-
-@mixin row-cols($count) {
-  > * {
-    flex: 0 0 auto;
-    width: divide(100%, $count);
-  }
-}
-
-.col {
-  box-sizing: border-box;
-  max-width: 100%;
-  padding-right: calc(#{$gutter} * .5);
-  padding-left: calc(#{$gutter} * .5);
-  flex: 0 0 auto;
-}
-
-@each $breakpoint in map-keys($breakpoints) {
-  $infix: breakpoint-infix($breakpoint);
-
-  @include media-breakpoint-up($breakpoint) {
-    .col#{$infix} {
-      flex: 1 0 0;
-    }
-
-    @if $columns > 0 {
-      @for $i from 1 through $columns {
-        .col#{$infix}-#{$i} {
-          @include make-col($i);
-        }
-      }
-    }
-  }
-}
-

package/styles/index.scss

@@ -1,164 +0,0 @@
-/*!
- * Copyright 2022 Garuna LLP
- * Licensed under MIT
- */
-
-@import 'functions';
-@import 'vars';
-
-@import 'root';
-@import 'reset';
-@import 'components';
-@import 'grid';
-
-// cdk overlay
-.cdk-overlay-container {
-  pointer-events: none;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-  position: fixed;
-  z-index: 1000;
-}
-
-.cdk-visually-hidden {
-  border: 0;
-  clip: rect(0 0 0 0);
-  height: 1px;
-  margin: -1px;
-  overflow: hidden;
-  padding: 0;
-  position: absolute;
-  width: 1px;
-  outline: 0;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-}
-
-.cdk-overlay-backdrop {
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  -webkit-tap-highlight-color: transparent;
-  transition: opacity .4s cubic-bezier(.25, .8, .25, 1);
-  opacity: 0;
-  position: absolute;
-  pointer-events: auto;
-  z-index: 1000;
-
-  &.wr-modal-mask {
-    opacity: 1;
-  }
-}
-
-.cdk-overlay-pane {
-  position: absolute;
-  pointer-events: auto;
-  z-index: 1000; // Give an opportunity to the content own to manage their z-index such as Modal
-}
-
-.cdk-overlay-connected-position-bounding-box {
-  position: absolute;
-  z-index: 1000;
-  display: flex;
-  flex-direction: column;
-  min-width: 1px;
-  min-height: 1px;
-}
-
-// Used when disabling global scrolling.
-.cdk-global-scrollblock {
-  position: fixed;
-
-  // Necessary for the content not to lose its width. Note that we're using 100%, instead of
-  // 100vw, because 100vw includes the width plus the scrollbar, whereas 100% is the width
-  // that the element had before we made it `fixed`.
-  width: 100%;
-
-  // Note: this will always add a scrollbar to whatever element it is on, which can
-  // potentially result in double scrollbars. It shouldn't be an issue, because we won't
-  // block scrolling on a page that doesn't have a scrollbar in the first place.
-  overflow-y: scroll;
-
-  // https://github.com/angular/material2/issues/15051
-  body {
-    overflow-x: visible;
-  }
-}
-
-.wr-overlay-transparent-backdrop {
-  &, &.cdk-overlay-backdrop-showing {
-    opacity: 0;
-  }
-}
-
-.wr-animate-disabled {
-  // badge
-  &.wr-scroll-number-only {
-    animation: none;
-    transition: none;
-  }
-
-  // drawer
-  &.wr-drawer {
-    &.wr-drawer-open .wr-drawer-mask {
-      animation: none;
-      transition: none;
-    }
-
-    & > * {
-      transition: none;
-    }
-  }
-
-  // modal
-  .wr-modal-mask, .wr-modal {
-    animation: none;
-    transition: none;
-
-    &.zoom-enter, &.zoom-leave,
-    &.zoom-enter-active, &.zoom-leave-active {
-      animation: none;
-      transition: none;
-    }
-  }
-
-  // menu
-  &.wr-menu {
-    transition: none;
-
-    .wr-menu-item, .wr-menu-submenu-title {
-      transition: none;
-    }
-
-    .wr-menu-item .wricon, .wr-menu-submenu-title .wricon {
-      transition: none;
-
-      & + span {
-        transition: none;
-      }
-    }
-  }
-
-  // tabs
-  &.wr-tabs {
-    .wr-tabs-top-content.wr-tabs-content-animated,
-    .wr-tabs-bottom-content.wr-tabs-content-animated,
-    .wr-tabs-top-content > .wr-tabs-tabpane,
-    .wr-tabs-bottom-content > .wr-tabs-tabpane,
-    &.wr-tabs-left .wr-tabs-ink-bar-animated,
-    &.wr-tabs-right .wr-tabs-ink-bar-animated,
-    &.wr-tabs-top .wr-tabs-ink-bar-animated,
-    &.wr-tabs-bottom .wr-tabs-ink-bar-animated {
-      transition: none;
-    }
-  }
-
-  // collapse
-  &.wr-collapse > .wr-collapse-item > .wr-collapse-header .wr-collapse-arrow svg {
-    transition: none;
-  }
-}
-

package/styles/mixins/_index.scss

@@ -1,22 +0,0 @@
-@import 'alert';
-@import 'button';
-@import 'tag';
-
-@import 'reset-component';
-
-@mixin column {
-  display: flex;
-  flex-direction: column;
-  align-items: baseline;
-  width: 100%;
-}
-
-@mixin row {
-  display: flex;
-  align-items: center;
-}
-
-@mixin no-select {
-  user-select: none;
-  pointer-events: none;
-}

package/styles/mixins/alert.scss

@@ -1,7 +0,0 @@
-@import '../functions';
-
-@mixin alert-colors-generate($color) {
-  color: mix(#000, $color);
-  box-shadow: inset 0 0 0 1px rgba($color, 0.25);
-  background-color: rgba($color, 0.125);
-}

package/styles/mixins/button.scss

@@ -1,56 +0,0 @@
-@import '../functions';
-
-@mixin button-outline-variant($color) {
-  color: $color;
-  background-color: transparent;
-  box-shadow: inset 0 0 0 1.25px rgba($color, 0.3);
-
-  & > wr-spin {
-    color: $color;
-  }
-
-  &:hover {
-    color: color-contrast($color);
-    background-color: $color;
-    box-shadow: none;
-
-    & > wr-spin {
-      color: color-contrast($color);
-    }
-  }
-
-  .btn-check:checked + &,
-  .btn-check:active + &,
-  &:active,
-  &.active,
-  &.dropdown-toggle.show {
-    color: mix(color-contrast($color), darken($color, 20%), 70%);
-    background-color: darken($color, 20%);
-    box-shadow: none;
-  }
-}
-
-@mixin button-variant($color) {
-  color: color-contrast($color);
-  background-color: $color;
-  box-shadow: rgba($color, 0.2) 0 3px 5px -1px, rgba($color, 0.14) 0 6px 10px 0,rgba($color, 0.12) 0 1px 18px 0;
-
-  &:hover {
-    color: color-contrast($color);
-    background-color: saturate(lighten($color, 15%), 20%);
-    box-shadow: rgba($color, 0.2) 0 3px 5px -1px, rgba($color, 0.14) 0 6px 10px 0,rgba($color, 0.12) 0 1px 18px 0;
-  }
-
-  .btn-check:checked + &,
-  .btn-check:active + &,
-  &:active,
-  &.active,{
-    color: mix(color-contrast($color), darken($color, 20%), 70%);
-    background-color: darken($color, 20%);
-    box-shadow: none;
-  }
-
-  & > wr-spin {
-    color: color-contrast($color);
-  }
-}

package/styles/mixins/reset-component.scss

@@ -1,13 +0,0 @@
-@import '../vars';
-
-@mixin reset-component() {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-  color: $text-color;
-  font-size: $font-size-base;
-  font-variant: $font-variant-base;
-  line-height: $line-height-base;
-  list-style: none;
-  font-feature-settings: $font-feature-settings-base;
-}

package/styles/mixins/tag.scss

@@ -1,68 +0,0 @@
-@import '../functions';
-
-@mixin tag-colors-generate($color) {
-  color: color-contrast($color);
-  background-color: $color;
-
-  &:hover {
-    color: color-contrast($color);
-    background-color: saturate(lighten($color, 15%), 20%);
-  }
-
-  &:active,
-  &.active,{
-    color: mix(color-contrast($color), darken($color, 20%), 70%);
-    background-color: darken($color, 20%);
-  }
-
-  & > wr-icon {
-    color: mix(color-contrast($color), $color);
-  }
-}
-
-@mixin tag-transparent-colors-generate($color) {
-  color: $color;
-  background-color: rgba($color, 0.125);
-  box-shadow: inset 0 0 0 1px rgba($color, 0.125);
-
-  &:hover {
-    color: color-contrast($color);
-    background-color: $color;
-
-    & > wr-icon {
-      color: rgba(color-contrast($color), 0.5);
-    }
-  }
-
-  &:active,
-  &.active,{
-    color: mix(color-contrast($color), darken($color, 20%), 70%);
-    background-color: darken($color, 20%);
-  }
-
-  & > wr-icon {
-    color: $color;
-  }
-}
-
-@mixin tag-outline-colors-generate($color) {
-  color: $color;
-  background-color: transparent;
-  box-shadow: inset 0 0 0 1px lighten($color, 30%);
-
-  &:hover {
-    color: lighten($color, 20%);
-    box-shadow: inset 0 0 0 1px lighten($color, 35%);
-  }
-
-  &:active,
-  &.active {
-    color: mix(color-contrast($color), darken($color, 20%), 70%);
-    background-color: darken($color, 20%);
-    box-shadow: none;
-  }
-
-  & > wr-icon {
-    color: lighten($color, 10%);
-  }
-}

package/styles/reset.scss

@@ -1,104 +0,0 @@
-@import './vars';
-
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-  border: 0;
-  font-size: 100%;
-  vertical-align: baseline;
-}
-
-:root {
-  font-size: 1rem;
-  scroll-behavior: smooth;
-}
-
-html,
-body {
-  background-color: $body-background;
-  height: 100%;
-  width: 100%;
-  font-family: $font-family;
-  font-size: $font-size-base;
-  font-weight: $font-weight-base;
-  line-height: $line-height-base;
-  letter-spacing: $letter-spacing-base;
-  color: $color-dark;
-  text-align: left;
-  direction: ltr;
-  -webkit-text-size-adjust: 100%;
-  -webkit-tap-highlight-color: rgba(0,0,0,0);
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  -ms-text-size-adjust: 100%;
-}
-
-:focus {
-  outline: 0;
-}
-
-article, aside, details, figcaption, figure,
-footer, header, hgroup, menu, nav, section {
-  display: block;
-}
-
-a {
-  text-decoration: none;
-}
-
-ol, ul {
-  list-style: none;
-}
-
-blockquote, q {
-  quotes: none;
-
-  &:before,
-  &:after {
-    content: '';
-    content: none;
-  }
-}
-
-table {
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-
-input[type=search]::-webkit-search-cancel-button,
-input[type=search]::-webkit-search-decoration,
-input[type=search]::-webkit-search-results-button,
-input[type=search]::-webkit-search-results-decoration {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-}
-
-input[type=search] {
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  -webkit-box-sizing: content-box;
-  -moz-box-sizing: content-box;
-  box-sizing: content-box;
-}
-
-textarea {
-  overflow: auto;
-  vertical-align: top;
-  resize: vertical;
-}
-
-audio:not([controls]) {
-  display: none;
-  height: 0;
-}
-
-[hidden] {
-  display: none;
-}
-
-img {
-  border: none;
-}

package/styles/root.scss

@@ -1,31 +0,0 @@
-@import 'vars';
-
-:root {
-  @each $color, $value in $theme-colors {
-    --color-#{$color}: #{$value};
-  }
-
-  @each $color, $value in $theme-colors-rgb {
-    --color-#{$color}-rgb: #{$value};
-  }
-
-  --color-white: #{$color-white};
-  --color-black: #{$color-black};
-
-  --color-white-rgb: #{to-rgb($color-white)};
-  --color-black-rgb: #{to-rgb($color-black)};
-
-  --font-family-base: #{$font-family};
-  --font-family-code: #{$code-family};
-  --font-size-base: #{$font-size-base};
-  --font-weight-base: #{$font-size-base};
-
-  --transition-base: #{$transition-base};
-
-  --radius-base: 0.625rem;
-
-  --shadow-base: inset 0 0 0 1px rgba(var(--color-dark-rgb), 0.125);
-//, 0px 2px 4px -2px rgba(var(--color-dark-rgb), 0.125
-  --shadow-base-hover: inset 0 0 0 1px rgba(var(--color-dark-rgb), 0.125), 0px 25px 50px -12px rgba(var(--color-dark-rgb), 0.125);
-
-}