empower-container 0.1.2 → 0.1.5

package/dist/scss/foundation/_index.scss

@@ -1,5 +0,0 @@
-@forward 'colors';
-@forward 'normalize';
-@forward 'settings';
-@forward 'typography';
-@forward 'mixins';

package/dist/scss/foundation/_mixins.scss

@@ -1,43 +0,0 @@
-@use 'settings' as *;
-
-// Breakpoint: Smaller devices
-@mixin xs {
-    @media (min-width: #{$screen-xs-min}) {
-        @content;
-    }
-  }
-  
-  // Breakpoint: Small devices
-  @mixin sm {
-     @media (min-width: #{$screen-sm-min}) {
-         @content;
-     }
-  }
-  
-  // Breakpoint: Medium devices
-  @mixin md {
-     @media (min-width: #{$screen-md-min}) {
-         @content;
-     }
-  }
-  
-  // Breakpoint: Large devices
-  @mixin lg {
-     @media (min-width: #{$screen-lg-min}) {
-         @content;
-     }
-  }
-  
-  // Breakpoint: Extra large devices
-  @mixin xl {
-     @media (min-width: #{$screen-xl-min}) {
-         @content;
-     }
-  }
-  
-  // Breakpoint: Extra large devices
-  @mixin xxl {
-     @media (min-width: #{$screen-xxl-min}) {
-         @content;
-     }
-  }

package/dist/scss/foundation/_normalize.scss

@@ -1,204 +0,0 @@
-html {
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-    overflow-x: hidden;
-  }
-  
-  *, *:before, *:after {
-    -webkit-box-sizing: inherit;
-    -moz-box-sizing: inherit;
-    box-sizing: inherit;
-  }
-  
-  html {
-    line-height: 1.15; /* 1 */
-    -webkit-text-size-adjust: 100%; /* 2 */
-  }
-  
-  body {
-    margin: 0;
-  }
-  
-  main {
-    display: block;
-  }
-  
-  h1 {
-    font-size: 2em;
-    margin: 0 0 0.67em;
-  }
-  
-  hr {
-    box-sizing: content-box; /* 1 */
-    height: 0; /* 1 */
-    overflow: visible; /* 2 */
-  }
-  
-  pre {
-    font-family: monospace, monospace; /* 1 */
-    font-size: 1em; /* 2 */
-  }
-  
-  a {
-    background-color: transparent;
-  }
-  
-  abbr[title] {
-    border-bottom: none; /* 1 */
-    text-decoration: underline; /* 2 */
-    text-decoration: underline dotted; /* 2 */
-  }
-  
-  b,
-  strong {
-    font-weight: bolder;
-  }
-  
-  code,
-  kbd,
-  samp {
-    font-family: monospace, monospace; /* 1 */
-    font-size: 1em; /* 2 */
-  }
-  
-  small {
-    font-size: 80%;
-  }
-  
-  sub,
-  sup {
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
-  }
-  
-  sub {
-    bottom: -0.25em;
-  }
-  
-  sup {
-    top: -0.5em;
-  }
-  
-  img {
-    border-style: none;
-  }
-  
-  button,
-  input,
-  optgroup,
-  select,
-  textarea {
-    font-family: inherit; /* 1 */
-    font-size: 100%; /* 1 */
-    line-height: 1.15; /* 1 */
-    margin: 0; /* 2 */
-  }
-  
-  button,
-  input { /* 1 */
-    overflow: visible;
-  }
-  
-  button,
-  select { /* 1 */
-    text-transform: none;
-  }
-  
-  button,
-  [type="button"],
-  [type="reset"],
-  [type="submit"] {
-    -webkit-appearance: button;
-  }
-  
-  button::-moz-focus-inner,
-  [type="button"]::-moz-focus-inner,
-  [type="reset"]::-moz-focus-inner,
-  [type="submit"]::-moz-focus-inner {
-    border-style: none;
-    padding: 0;
-  }
-  
-  button:-moz-focusring,
-  [type="button"]:-moz-focusring,
-  [type="reset"]:-moz-focusring,
-  [type="submit"]:-moz-focusring {
-    outline: 1px dotted ButtonText;
-  }
-  
-  fieldset {
-    padding: 0.35em 0.75em 0.625em;
-  }
-  
-  legend {
-    box-sizing: border-box;
-    color: inherit;
-    display: table;
-    max-width: 100%;
-    padding: 0;
-    white-space: normal;
-  }
-  
-  progress {
-    vertical-align: baseline;
-  }
-  
-  textarea {
-    overflow: auto;
-  }
-  
-  [type="checkbox"],
-  [type="radio"] {
-    box-sizing: border-box;
-    padding: 0;
-  }
-  
-  [type="number"]::-webkit-inner-spin-button,
-  [type="number"]::-webkit-outer-spin-button {
-    height: auto;
-  }
-  
-  [type="search"] {
-    -webkit-appearance: textfield;
-    outline-offset: -2px;
-  }
-  
-  [type="search"]::-webkit-search-decoration {
-    -webkit-appearance: none;
-  }
-  
-  ::-webkit-file-upload-button {
-    -webkit-appearance: button; /* 1 */
-    font: inherit; /* 2 */
-  }
-  
-  details {
-    display: block;
-  }
-  
-  summary {
-    display: list-item;
-  }
-  
-  template {
-    display: none;
-  }
-  
-  [hidden] {
-    display: none;
-  }
-  
-  input{
-    &:focus{
-      outline: none;
-    }
-  }
-  
-  li{
-    list-style: none;
-    padding-top: 3px;
-  }
-  

package/dist/scss/foundation/_settings.scss

@@ -1,36 +0,0 @@
-// Breakpoints
-$screen-xs-min: 400px; // Small smartphones
-$screen-sm-min: 576px; // Small tablets and large smartphones (landscape view)
-$screen-md-min: 768px; // Small tablets (portrait view)
-$screen-lg-min: 992px; // Tablets and small desktopsw
-$screen-xl-min: 1200px; // Large tablets and desktops
-$screen-xxl-min: 1500px; // Large tablets and desktops
-
-// Container max width
-$container-width: 1024px;
-
-// Transition easing
-$transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
-
-// Shadow
-$shadow-card: 0px 10px 20px 0px rgba(19, 37, 154, 0.05);
-$shadow-popover: 0px 15px 30px 0px rgba(19, 37, 154, 0.15);
-$shadow-modal: 0 30px 60px rgba(0,0,0,0.2);
-
-// Border Radius
-$border-radius-sm: 5px;
-$border-radius-md: 10px;
-$border-radius-lg: 20px;
-
-// Grid
-$grid-margin: -7.5px;
-$grid-gutter: 7.5px;
-
-// Typography
-$font-body: "Roboto", sans-serif;
-$font-heading: "Quicksand", sans-serif;
-$font-regular: 400;
-$font-bold: 700;
-$text-lg: 2rem;
-$text-base: 1rem;
-$text-sm: 0.875rem;

package/dist/scss/foundation/_typography.scss

@@ -1,99 +0,0 @@
-@use 'colors' as *;
-@use 'mixins' as *;
-@use 'settings' as *;
-
-body {
-    font-family: 'Roboto', sans-serif;
-}
-
-h1, h2, h3, h4, h5, h6{
-    margin: 0 0 1rem;
-    color: $gray-dark;
-    font-family: 'Quicksand', sans-serif;
-
-    &:last-of-type{
-        margin-bottom: 0;
-    }
-}
-
-h1{
-    font-size: 2.25rem;
-
-    @include md{
-        font-size: 2.625rem;
-    }
-}
-
-h2{
-    font-size: 1.875rem;
-
-    @include md{
-        font-size: 2.25rem;
-    }
-}
-
-h3{
-    font-size: 1.5rem;
-
-    @include md{
-        font-size: 1.875rem;
-    }
-}
-
-h4{
-    font-size: 1.25rem;
-
-    @include md{
-        font-size: 1.5rem;
-    }
-}
-
-h5{
-    font-size: 1rem;
-
-    @include md{
-        font-size: 1.25rem;
-    }
-}
-
-h6{
-    font-size: 0.875rem;
-}
-
-label{
-    font-size: 0.875rem;
-    font-weight: 700;
-    color: $gray-light3;
-    text-transform: capitalize;
-    display: inline-block;
-    margin: 0 0 0.25rem;
-}
-
-p{
-    color: $gray-dark;
-    line-height: 1.5;
-    margin: 0 0 1rem;
-
-    &:last-of-type{
-        margin-bottom: 0;
-    }
-}
-
-a{
-    color: $green-dark;
-    font-weight: 700;
-    font-size: 0.875rem;
-    text-decoration: none;
-    transition: $transition;
-
-    &:hover{
-        color: $green-dark1;
-    }
-}
-
-.sub-text{
-    font-size: $text-sm;
-    color: $gray-light4;
-    display: block;
-    line-height: 20px;
-}

package/dist/scss/library/_index.scss

@@ -1,3 +0,0 @@
-@forward 'input';
-@forward 'menubar';
-@forward 'select';

package/dist/scss/style.scss

@@ -1,8 +0,0 @@
-
-@use 'components';
-@use 'foundation';
-@use 'elements';
-@use 'library';
-
-@import url("https://fonts.googleapis.com/css?family=Quicksand:400,700|Roboto:400,400i,700&display=swap");
-

package/src/scss/components/_index.scss

@@ -1 +0,0 @@
-@forward 'modal';

package/src/scss/foundation/_index.scss

@@ -1,5 +0,0 @@
-@forward 'colors';
-@forward 'normalize';
-@forward 'settings';
-@forward 'typography';
-@forward 'mixins';

package/src/scss/library/_index.scss

@@ -1,3 +0,0 @@
-@forward 'input';
-@forward 'menubar';
-@forward 'select';

package/src/scss/library/input.scss

@@ -1,39 +0,0 @@
-@use '../foundation' as *;
-
-.em-input {
-    position: relative;
-    width: 100%;
-
-    .em-input-field {
-        min-height: 50px;
-        width: 100%;
-        background-color: $blue-light;
-        border-top-left-radius: 10px;
-        border-top-right-radius: 10px;
-        border-bottom-right-radius: 0;
-        border-bottom-left-radius: 0;
-        box-shadow: inset 0 -2px 0 0 $blue-light1;
-        border: none;
-        font-size: 0.875rem;
-        color: $gray-dark;
-        padding: 10px 15px;
-        margin-bottom: 15px;
-        transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
-
-        &:focus {
-            background-color: $blue-light;
-            color: $gray-dark;
-            border: none;
-            outline: none;
-            box-shadow: inset 0 -2px 0 0 $blue-light4;
-        }
-    }
-
-    .em-noresult {
-        padding: 20px;
-    }
-}
-
-.is-invalid .em-input .em-input-field {
-    box-shadow: 0 2px 0 0 $red;
-}

package/src/scss/library/menubar.scss

@@ -1,227 +0,0 @@
-@use '../foundation' as *;
-
-.em-card-belt {
-    display: flex;
-    justify-content: space-between;
-    width: 100%;
-    min-height: 40px;
-    padding: 20px 15px;
-
-    .em-belt-left {
-        display: flex;
-        align-items: center;
-        flex-wrap: wrap;
-
-        .belt-info {
-            margin-left: 10px;
-        }
-    }
-
-    .em-beltleft-container {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        margin-right: 20px;
-
-        > .belt-icon {
-            margin-right: 10px;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-
-            svg {
-                path, rect {
-                    fill: $blue-light4;
-                }
-            }
-        }
-
-        .icon-back {
-            height: 40px;
-            width: 40px;
-            min-width: 40px;
-            margin-right: 10px;
-            border-radius: 10px;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            transition: all .5s cubic-bezier(.19,1,.22,1);
-            box-shadow: none;
-
-            &:hover {
-                svg {
-                    transition: all .5s cubic-bezier(.19,1,.22,1);
-                    transform: translateX(-2px);
-                }
-            }
-        }
-
-        .belt-icon-check {
-            margin-right: 10px;
-
-            > div {
-                display: flex;
-            }
-        }
-
-        .belt-title {
-            margin-block: 10px;
-            flex: none;
-
-            h6 {
-                text-transform: uppercase;
-                font-size: .875rem;
-                color: $gray-dark;
-                margin: 0;
-            }
-        }
-    }
-
-    .em-beltleft-cta {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        margin-right: 20px;
-
-        a {
-            margin-right: 10px;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            max-height: 40px;
-            padding: 10px 20px;
-        }  
-    }
-
-    .em-belt-right {
-        display: flex;
-        align-items: center;
-        justify-content: flex-end;
-        flex-wrap: wrap;
-
-        > a, > div {
-            margin-left: 10px;
-        }
-
-        .em-dropdown {
-            position: relative;
-        }
-
-        .pagination-summary, .belt-dropdown {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            height: 40px;
-            padding: 10px 20px;
-            border: none;
-            border-radius: 10px;
-            box-shadow: inset 0 0 0 1px $blue-light2;
-            color: $gray-dark;
-            text-decoration: none;
-            font-size: .875rem;
-            transition: all .5s cubic-bezier(.19,1,.22,1);
-
-            &:hover {
-                box-shadow: inset 0 0 0 1px $blue-light4;
-            }
-        }
-
-        .pagination-summary {
-            font-weight: $font-regular;
-        }
-
-        .belt-dropdown {
-            span {
-                font-size: .875rem;
-                font-weight: 700;
-                color: $gray-light4;
-            }
-
-            .icon-arrowdown {
-                height: 20px;
-                width: 20px;
-                margin-left: 15px;
-                transition: all .5s cubic-bezier(.19,1,.22,1);
-            }
-
-            .icon-add  {
-                display: flex;
-                align-items: center;
-                margin-right: 10px;
-
-                svg path  {
-                    fill: $gray-light4;
-                } 
-            }
-
-            &:hover{
-                span {
-                    color: $gray-dark;
-                }
-
-                .icon-arrowdown {
-                    transform: translateY(2px);
-
-                    svg path {
-                        fill: $gray-light4;
-                    }
-                }
-            }
-        }
-
-        .belt-prev, .belt-next {
-            padding: 10px;
-            height: 40px;
-            width: 40px;
-            min-width: 40px;
-            box-shadow: inset 0 0 0 1px $blue-light2;
-            border-radius: 10px;
-            transition: all .5s cubic-bezier(.19,1,.22,1);
-
-            .belt-icon {
-                height: 20px;
-                width: 20px;
-                background: 50% no-repeat;
-                transition: all .5s cubic-bezier(.19,1,.22,1);
-            }
-
-            &:hover {
-                box-shadow: inset 0 0 0 1px $blue-light4;
-
-                .belt-icon {
-                    svg path {
-                        fill: $gray-light4;
-                    }
-                }
-            }
-        }
-
-        .belt-prev {
-            &:hover .belt-icon {
-                transform: translateX(-2px);
-            }
-        }
-
-        .belt-next {
-            &:hover .belt-icon {
-                transform: translateX(2px);
-            }
-        }
-
-        .modal-close {
-            height: 40px;
-            width: 40px;
-            min-width: 40px;
-            padding: 10px;
-            box-shadow: none;
-            border-radius: 10px;
-            transition: all .5s cubic-bezier(.19,1,.22,1);
-
-            &:hover {
-                background-color: $blue-light1;
-                box-shadow: inset 0 0 0 5px $blue-light1;
-            }
-        }
-    }
-} 
-