@gipisistemas/ng-core 1.0.68 → 1.1.0

package/assets/styles/layout-grid.scss

@@ -1,146 +0,0 @@
-@import './variable.scss';
-
-$row-prefix-cls: 'grid-row';
-$col-prefix-cls: 'grid-col';
-$grid-columns: 12;
-$class: '-sm';
-
-// Grid system
-.#{$row-prefix-cls} {
-    display: grid;
-    grid-template-columns: repeat($grid-columns, 1fr);
-    justify-items: stretch;
-    align-content: stretch;
-    justify-content: space-evenly;
-    align-items: stretch;
-    width: 100%;
-
-    &::before,
-    &::after {
-        display: flex;
-    }
-
-    // No wrap of flex
-    &-no-wrap {
-        flex-wrap: nowrap;
-    }
-}
-
-.#{$row-prefix-cls}-start {
-    justify-content: flex-start;
-}
-
-.#{$row-prefix-cls}-center {
-    justify-content: center;
-}
-
-.#{$row-prefix-cls}-end {
-    justify-content: flex-end;
-}
-
-.#{$row-prefix-cls}-space-between {
-    justify-content: space-between;
-}
-
-.#{$row-prefix-cls}-space-around {
-    justify-content: space-around;
-}
-
-.#{$row-prefix-cls}-space-evenly {
-    justify-content: space-evenly;
-}
-
-.#{$row-prefix-cls}-top {
-    align-items: flex-start;
-}
-
-.#{$row-prefix-cls}-middle {
-    align-items: center;
-}
-
-.#{$row-prefix-cls}-bottom {
-    align-items: flex-end;
-}
-
-.#{$col-prefix-cls} {
-    display: block;
-    position: relative;
-    max-width: 100%;
-}
-
-// mixins for grid system
-@mixin loop-grid-columns($index, $class) {
-    @if($index > 0) {
-        .#{$col-prefix-cls}-#{$index} {
-            grid-column: span $index;
-        }
-
-        .#{$col-prefix-cls}#{$class}-#{$index} {
-            grid-column: span $index !important;
-        }
-
-        .#{$col-prefix-cls}#{$class}-push-#{$index} {
-            left: percentage(($index / $grid-columns));
-        }
-
-        .#{$col-prefix-cls}#{$class}-pull-#{$index} {
-            right: percentage(($index / $grid-columns));
-        }
-
-        .#{$col-prefix-cls}#{$class}-offset-#{$index} {
-            margin-left: percentage(($index / $grid-columns));
-        }
-
-        .#{$col-prefix-cls}#{$class}-order-#{$index} {
-            order: $index;
-        }
-
-        @include loop-grid-columns(($index - 1), $class);
-    }
-}
-
-@mixin make-grid($class) {
-    @include loop-grid-columns($grid-columns, $class);
-}
-
-// Small grid
-// Columns, offsets, pushes, and pulls for the small device range, from phones to tablets.
-@media screen and (max-width: ($gipi-screen-xs - 1px)) {
-    $class: '-xs';
-    @include make-grid($class);
-}
-
-// Small grid
-// Columns, offsets, pushes, and pulls for the small device range, from phones to tablets.
-@media screen and (min-width: $gipi-screen-xs) and (max-width: ($gipi-screen-sm - 1px)) {
-    $class: '-sm';
-    @include make-grid($class);
-}
-
-// Medium grid
-// Columns, offsets, pushes, and pulls for the desktop device range.
-@media screen and (min-width: $gipi-screen-sm) and (max-width: ($gipi-screen-md - 1px)) {
-    $class: '-md';
-    @include make-grid($class);
-}
-
-// Large grid
-// Columns, offsets, pushes, and pulls for the large desktop device range.
-@media screen and (min-width: $gipi-screen-md) and (max-width: ($gipi-screen-lg - 1px)) {
-    $class: '-lg';
-    @include make-grid($class);
-}
-
-// Extra Large grid
-// Columns, offsets, pushes, and pulls for the full hd device range.
-@media screen and (min-width: $gipi-screen-lg) and (max-width: ($gipi-screen-xl - 1px)) {
-    $class: '-xl';
-    @include make-grid($class);
-}
-
-// Extra Large grid
-// Columns, offsets, pushes, and pulls for the full hd device range.
-@media screen and (min-width: $gipi-screen-xl) {
-    $class: '-xxl';
-    @include make-grid($class);
-}

package/assets/styles/styles.scss

@@ -1,149 +0,0 @@
-@import url("https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Two+Tone|Material+Icons+Round|Material+Icons+Sharp");
-@import "~@angular/material/theming";
-
-@import './colors.scss';
-@import './variable.scss';
-@import './layout-grid.scss';
-//
-@include mat-core();
-// Colors
-$gipi-primary: mat-palette($gipi-palette-secondary, 500, 500);
-$gipi-accent: mat-palette($gipi-palette-primary, 500, 500);
-$gipi-danger: mat-palette($gipi-palette-danger, 500, 500);
-$gipi-theme: mat-light-theme($gipi-primary, $gipi-accent, $gipi-danger);
-@include angular-material-theme($gipi-theme);
-// Font
-$gipi-typography : mat-typography-config($font-family: "'Nunito', sans-serif");
-@include angular-material-typography($gipi-typography);
-
-:root,
-html {
-    font-size: 62.5%;
-}
-
-*,
-*:before,
-*:after {
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-}
-
-body {
-    height: 100vh;
-    font-weight: 400;
-    font-size: 1.3rem;
-}
-
-input[type="search"]::-webkit-search-cancel-button {
-    display: none !important;
-}
-
-.select-input-search {
-    .mat-form-field-wrapper {
-        margin-left: 10px !important;
-        margin-right: 10px !important;
-    }
-
-    .mat-form-field-infix {
-        margin-bottom: 5px !important;
-    }
-
-    .mat-input-element {
-        margin-bottom: 5px !important;
-    }
-}
-
-.mat-snack-bar-container {
-    background: transparent !important;
-    box-shadow: none !important;
-    padding: 0 !important;
-}
-
-.alert {
-    background: $gipi-common-white-100;
-    border-radius: 3px;
-    padding: 2rem;
-    border-left: 5px solid $gipi-common-gray-500;
-    -webkit-box-shadow: -1px 2px 7px -1px rgba(0, 0, 0, 0.27);
-    -moz-box-shadow: -1px 2px 7px -1px rgba(0, 0, 0, 0.27);
-    box-shadow: -1px 2px 7px -1px rgba(0, 0, 0, 0.27);
-
-    mat-icon {
-        height: 3.5rem !important;
-        width: 3.5rem !important;
-        font-size: 3.5rem;
-        margin-bottom: 1px !important;
-    }
-
-    .title {
-        font-size: 1.6rem;
-        color: #606267;
-        line-height: 1.8rem;
-        letter-spacing: 0;
-        font-weight: 600 !important;
-        letter-spacing: -0.5 !important;
-        margin-bottom: 3px;
-    }
-
-    span {
-        font-size: 1.4rem;
-        color: #9ea0a9;
-        line-height: 1.7rem;
-        letter-spacing: 0;
-        font-weight: 400 !important;
-        letter-spacing: -0.5 !important;
-    }
-}
-
-.alert.success {
-    border-color: $gipi-success-500 !important;
-
-    mat-icon {
-        color: $gipi-success-500 !important;
-    }
-}
-
-.alert.error {
-    border-color: $gipi-danger-500 !important;
-
-    mat-icon {
-        color: $gipi-danger-500 !important;
-    }
-}
-
-.alert.warning {
-    border-color: $gipi-warning-500 !important;
-
-    mat-icon {
-        color: $gipi-warning-500 !important;
-    }
-}
-
-.alert.info {
-    border-color: $gipi-info-500 !important;
-
-    mat-icon {
-        color: $gipi-info-500 !important;
-    }
-}
-
-.select-position {
-    margin-top: 28px !important;
-}
-
-.noselect,
-button,
-ul,
-li,
-a,
-mat-icon {
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-}

package/assets/styles/theme.scss

@@ -1,22 +0,0 @@
-@import '~@angular/material/theming';
-@import "../styles/colors.scss";
-@import "../styles/variable.scss";
-//
-$gipi-primary: mat-palette($gipi-palette-secondary, 500, 500);
-$gipi-accent: mat-palette($gipi-palette-primary, 500, 500);
-$gipi-danger: mat-palette($gipi-palette-danger, 500, 500);
-$gipi-theme: mat-light-theme($gipi-primary, $gipi-accent, $gipi-danger);
-$gipi-typography : mat-typography-config($font-family: "'Nunito', sans-serif");
-//
-@include angular-material-theme($gipi-theme);
-@include angular-material-typography($gipi-typography);
-@include mat-core();
-// @media screen and (max-width: ($gipi-screen-sm - 1px)) {
-//     @include mat-core($gipi-typography-sm);
-// }
-// @media screen and (min-width: $gipi-screen-sm) and (max-width: ($gipi-screen-md - 1px)) {
-//     @include mat-core($gipi-typography-md);
-// }
-// @media screen and (min-width: $gipi-screen-md) {
-//     @include mat-core($gipi-typography-lg);
-// }

package/assets/styles/typography.scss

@@ -1,54 +0,0 @@
-@import '~@angular/material/theming';
-// Usado só por enquanto
-$gipi-typography : mat-typography-config($font-family: "'Nunito', sans-serif");
-// $gipi-typography : mat-typography-config( //Font
-//     $font-family: '"Lato", sans-serif',
-//     $display-4: mat-typography-level(11.2rem, 112px, 300, $letter-spacing: -0.05em),
-//     $display-3: mat-typography-level(5.6rem, 56px, 400, $letter-spacing: -0.02em),
-//     $display-2: mat-typography-level(4.5rem, 48px, 400, $letter-spacing: -0.005em),
-//     $display-1: mat-typography-level(3.4rem, 40px, 400),
-//     $headline: mat-typography-level(2.4rem, 32px, 400),
-//     $title: mat-typography-level(2rem, 32px, 500),
-//     $subheading-2: mat-typography-level(1.6rem, 28px, 400),
-//     $subheading-1: mat-typography-level(1.5rem, 24px, 400),
-//     $body-2: mat-typography-level(1.4rem, 24px, 500),
-//     $body-1: mat-typography-level(1.4rem, 20px, 400),
-//     $caption: mat-typography-level(1.2rem, 20px, 400),
-//     $button: mat-typography-level(1.4rem, 14, 500),
-//     $input: mat-typography-level(inherit, 1.125, 400));
-// $gipi-typography-sm : mat-typography-config( //Font
-//     $font-family: '"Lato", sans-serif',
-//     $display-1: mat-typography-level(5.2rem, 78px, 400),
-//     $headline: mat-typography-level(4rem, 60px, 400), // h1
-//     $title: mat-typography-level(3.2rem, 48px, 400), // h2
-//     $subheading-2: mat-typography-level(2.8rem, 42px, 400), // h3
-//     $subheading-1: mat-typography-level(2.4rem, 36px, 400), // h4
-//     $body-2: mat-typography-level(1.2rem, 18px, 400),
-//     $body-1: mat-typography-level(1.4rem, 21px, 400),
-//     $caption: mat-typography-level(1.2rem, 18px, 400),
-//     $button: mat-typography-level(.8rem, 8px, 400),
-//     $input: mat-typography-level(1.4rem, 1.125, 400));
-// $gipi-typography-md : mat-typography-config( //Font
-//     $font-family: '"Lato", sans-serif',
-//     $display-1: mat-typography-level(5.2rem, 78px, 400),
-//     $headline: mat-typography-level(4rem, 60px, 400), // h1
-//     $title: mat-typography-level(3.2rem, 48px, 400), // h2
-//     $subheading-2: mat-typography-level(2.8rem, 42px, 400), // h3
-//     $subheading-1: mat-typography-level(2.4rem, 36px, 400), // h4
-//     $body-2: mat-typography-level(1.2rem, 18px, 400),
-//     $body-1: mat-typography-level(1.4rem, 21px, 400),
-//     $caption: mat-typography-level(1.2rem, 18px, 400),
-//     $button: mat-typography-level(1.1rem, 11px, 400),
-//     $input: mat-typography-level(1.4rem, 1.125, 400));
-// $gipi-typography-lg : mat-typography-config( //Font
-//     $font-family: '"Lato", sans-serif',
-//     $display-1: mat-typography-level(5.2rem, 78px, 400),
-//     $headline: mat-typography-level(4rem, 60px, 400), // h1
-//     $title: mat-typography-level(3.2rem, 48px, 400), // h2
-//     $subheading-2: mat-typography-level(2.8rem, 42px, 400), // h3
-//     $subheading-1: mat-typography-level(2.4rem, 36px, 400), // h4
-//     $body-2: mat-typography-level(1.2rem, 18px, 400),
-//     $body-1: mat-typography-level(1.4rem, 21px, 400),
-//     $caption: mat-typography-level(1.2rem, 18px, 400),
-//     $button: mat-typography-level(1.4rem, 14px, 400),
-//     $input: mat-typography-level(1.4rem, 1.125, 400));

package/assets/styles/variable.scss

@@ -1,41 +0,0 @@
-// Globals
-$gipi-top-nav-height: 66px;
-$gipi-footer-height: 8px;
-
-// Se alterar o $gipi-top-nav-height e o $gipi-footer-height, tem que alterar aqui tbm.
-// Cálculo é: calc(100vh - $gipi-top-nav-height - $gipi-footer-height);
-$gipi-sidenav-container-height: calc(100vh - 66px - 8px);
-
-$gipi-sidenav-width-large: 248px;
-$gipi-sidenav-width-small: 76px;
-$gipi-sidenav-padding: .8rem 1.2rem;
-
-$gipi-zindex: 1;
-
-// Breakpoints baseados em https://github.com/angular/flex-layout/wiki/Responsive-API
-// Extra small screen / phone
-$gipi-screen-xs: 420px;
-
-// Small screen / tablet
-$gipi-screen-sm: 600px;
-
-// Medium screen / desktop
-$gipi-screen-md: 768px;
-
-// Large screen / wide desktop
-$gipi-screen-lg: 1366px;
-
-// Extra large screen / full hd
-$gipi-screen-xl: 1920px;
-
-// Paddings
-$padding-xs: 8px; // small items
-$padding-sm: 12px; // Form controls and items
-$padding-md: 16px; // small containers and buttons
-$padding-lg: 64px; // containers
-
-// Margins
-$margin-xs: 8px; // small items
-$margin-sm: 12px; // Form controls and items
-$margin-md: 16px; // small containers and buttons
-$margin-lg: 64px; // containers