@posiwise/shared-components 0.0.38 → 0.0.40

package/assets/scss/dashboard/_helper.scss

@@ -1,736 +0,0 @@
-// ================================================================================================
-// 	File Name: helper
-// 	Description: Helper classes provides color, width, position & background etc..
-// 				 related customiztion.
-// ================================================================================================
-
-// Content helpers
-// -------------------------
-// Display
-
-.display-inline {
-    display: inline !important;
-}
-
-.display-block {
-    display: block !important;
-}
-
-.display-inline-block {
-    display: inline-block !important;
-}
-
-.display-hidden {
-    display: none !important;
-}
-
-.display-table-cell {
-    display: table-cell !important;
-}
-
-// Position
-
-.position-fixed {
-    position: fixed !important;
-}
-
-.position-relative {
-    position: relative !important;
-}
-
-.position-absolute {
-    position: absolute !important;
-}
-
-.position-static {
-    position: static !important;
-}
-
-.position-top-0 {
-    top: 0;
-}
-
-.position-right-0 {
-    right: 0;
-}
-
-.position-bottom-0 {
-    bottom: 0;
-}
-
-.position-left-0 {
-    left: 0;
-}
-
-// Edges
-.no-edge-top {
-    top: 0 !important;
-}
-
-.no-edge-bottom {
-    bottom: 0 !important;
-}
-
-.no-edge-left {
-    left: 0 !important;
-}
-
-.no-edge-right {
-    right: 0 !important;
-}
-
-// Cursors
-.cursor-pointer {
-    cursor: pointer;
-}
-
-.cursor-move {
-    cursor: move;
-}
-
-.cursor-default {
-    cursor: default;
-}
-
-.cursor-progress {
-    cursor: progress;
-}
-
-.cursor-not-allowed {
-    cursor: not-allowed;
-}
-
-// Vertical alignment
-.valign-top {
-    vertical-align: top !important;
-}
-
-.valign-middle {
-    vertical-align: middle !important;
-}
-
-.valign-bottom {
-    vertical-align: bottom !important;
-}
-
-.valign-baseline {
-    vertical-align: baseline !important;
-}
-
-.valign-text-top {
-    vertical-align: top !important;
-}
-
-.valign-text-bottom {
-    vertical-align: text-bottom !important;
-}
-
-// Overflow
-.overflow-hidden {
-    overflow: hidden;
-}
-
-.overflow-visible {
-    overflow: visible;
-}
-
-.overflow-auto {
-    overflow: auto;
-}
-
-.overflow-scroll {
-    overflow: scroll;
-}
-
-.overflow-x-scroll {
-    overflow: scroll;
-}
-
-.overflow-y-scroll {
-    overflow: scroll;
-}
-
-// Lists
-.bullets-inside {
-    list-style: inside;
-}
-
-.list-style-circle {
-    list-style: circle;
-}
-
-.list-style-square {
-    list-style: square;
-}
-
-.list-style-icons {
-    list-style: none;
-    margin-left: 0;
-    padding-left: 10px;
-
-    > li i {
-        float: left;
-        margin: 5px 12px 0 0;
-        width: 1em;
-    }
-}
-
-// Borders
-// -------------------------
-
-// Add borders
-.border {
-    border: 1px solid;
-}
-
-.border-top {
-    border-top: 1px solid;
-}
-
-.border-bottom {
-    border-bottom: 1px solid;
-}
-
-.border-left {
-    border-left: 1px solid;
-}
-
-.border-right {
-    border-right: 1px solid;
-}
-
-// Border widths
-
-// Med - 2px
-.border-2 {
-    border-width: 2px !important;
-}
-
-.border-top-2 {
-    border-top-width: 2px !important;
-}
-
-.border-bottom-2 {
-    border-bottom-width: 2px !important;
-}
-
-.border-left-2 {
-    border-left-width: 2px !important;
-}
-
-.border-right-2 {
-    border-right-width: 2px !important;
-}
-
-// Large - 3px
-.border-3 {
-    border-width: 3px !important;
-}
-
-.border-top-3 {
-    border-top-width: 3px !important;
-}
-
-.border-bottom-3 {
-    border-bottom-width: 3px !important;
-}
-
-.border-left-3 {
-    border-left-width: 3px !important;
-}
-
-.border-right-3 {
-    border-right-width: 3px !important;
-}
-
-// Remove borders
-.no-border {
-    border: 0 !important;
-}
-
-.no-border-top {
-    border-top: 0 !important;
-}
-
-.no-border-bottom {
-    border-bottom: 0 !important;
-}
-
-.no-border-left {
-    border-left: 0 !important;
-}
-
-.no-border-right {
-    border-right: 0 !important;
-}
-
-// No border radious
-.no-radius {
-    border-radius: unset !important;
-}
-
-.no-border-top-radius {
-    border-top-left-radius: 0 !important;
-    border-top-right-radius: 0 !important;
-}
-
-.no-border-bottom-radius {
-    border-bottom-left-radius: 0 !important;
-    border-bottom-right-radius: 0 !important;
-}
-
-.no-border-top-left-radius {
-    border-top-left-radius: 0 !important;
-}
-
-.no-border-top-right-radius {
-    border-top-right-radius: 0 !important;
-}
-
-.no-border-bottom-left-radius {
-    border-bottom-left-radius: 0 !important;
-}
-
-.no-border-bottom-right-radius {
-    border-bottom-right-radius: 0 !important;
-}
-
-// Box Shadow
-
-.box-shadow-0 {
-    box-shadow: none !important;
-}
-
-.box-shadow-1 {
-    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
-}
-
-.box-shadow-2 {
-    box-shadow: 0 8px 17px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
-}
-
-.box-shadow-3 {
-    box-shadow: 0 12px 15px 0 rgb(0 0 0 / 24%), 0 17px 50px 0 rgb(0 0 0 / 19%);
-}
-
-.box-shadow-4 {
-    box-shadow: 0 16px 28px 0 rgb(0 0 0 / 22%), 0 25px 55px 0 rgb(0 0 0 / 21%);
-}
-
-.box-shadow-5 {
-    box-shadow: 0 27px 24px 0 rgb(0 0 0 / 20%), 0 40px 77px 0 rgb(0 0 0 / 22%);
-}
-
-// Sizing
-// -------------------------
-
-// Width && Height
-
-.fit {
-    max-width: 100% !important;
-}
-
-.half-width {
-    width: 50% !important;
-}
-
-.full-width {
-    width: 100% !important;
-}
-
-.full-height {
-    height: 100% !important;
-}
-
-.full-height-vh {
-    height: 100vh !important;
-}
-
-// Fixed widths
-.width-50 {
-    width: 50px !important;
-}
-
-.width-100 {
-    width: 100px !important;
-}
-
-.width-150 {
-    width: 150px !important;
-}
-
-.width-200 {
-    width: 200px !important;
-}
-
-.width-250 {
-    width: 250px !important;
-}
-
-.width-300 {
-    width: 300px !important;
-}
-
-.width-350 {
-    width: 350px !important;
-}
-
-.width-400 {
-    width: 400px !important;
-}
-
-.width-450 {
-    width: 450px !important;
-}
-
-.width-500 {
-    width: 500px !important;
-}
-
-.width-550 {
-    width: 550px !important;
-}
-
-.width-600 {
-    width: 600px !important;
-}
-
-.width-650 {
-    width: 650px !important;
-}
-
-.width-700 {
-    width: 700px !important;
-}
-
-.width-750 {
-    width: 750px !important;
-}
-
-.width-800 {
-    width: 800px !important;
-}
-
-// Width in %
-.width-5-per {
-    width: 5% !important;
-}
-
-.width-10-per {
-    width: 10% !important;
-}
-
-.width-15-per {
-    width: 15% !important;
-}
-
-.width-20-per {
-    width: 20% !important;
-}
-
-.width-25-per {
-    width: 25% !important;
-}
-
-.width-30-per {
-    width: 30% !important;
-}
-
-.width-35-per {
-    width: 35% !important;
-}
-
-.width-40-per {
-    width: 40% !important;
-}
-
-.width-45-per {
-    width: 45% !important;
-}
-
-.width-50-per {
-    width: 50% !important;
-}
-
-.width-55-per {
-    width: 55% !important;
-}
-
-.width-60-per {
-    width: 60% !important;
-}
-
-.width-65-per {
-    width: 65% !important;
-}
-
-.width-70-per {
-    width: 70% !important;
-}
-
-.width-75-per {
-    width: 75% !important;
-}
-
-.width-80-per {
-    width: 80% !important;
-}
-
-.width-90-per {
-    width: 90% !important;
-}
-
-.width-95-per {
-    width: 95% !important;
-}
-
-// Fixed Height in px
-.height-0 {
-    height: 0 !important;
-}
-
-.height-50 {
-    height: 50px !important;
-}
-
-.height-75 {
-    height: 75px !important;
-}
-
-.height-100 {
-    height: 100px !important;
-}
-
-.height-150 {
-    height: 150px !important;
-}
-
-.height-200 {
-    height: 200px !important;
-}
-
-.height-250 {
-    height: 250px !important;
-}
-
-.height-300 {
-    height: 300px !important;
-}
-
-.height-350 {
-    height: 350px !important;
-}
-
-.height-400 {
-    height: 400px !important;
-}
-
-.height-450 {
-    height: 450px !important;
-}
-
-.height-500 {
-    height: 500px !important;
-}
-
-.height-550 {
-    height: 550px !important;
-}
-
-.height-600 {
-    height: 600px !important;
-}
-
-.height-650 {
-    height: 650px !important;
-}
-
-.height-700 {
-    height: 700px !important;
-}
-
-.height-750 {
-    height: 750px !important;
-}
-
-.height-800 {
-    height: 800px !important;
-}
-
-// Fixed Height in %
-
-.height-5-per {
-    height: 5% !important;
-}
-
-.height-10-per {
-    height: 10% !important;
-}
-
-.height-15-per {
-    height: 15% !important;
-}
-
-.height-20-per {
-    height: 20% !important;
-}
-
-.height-25-per {
-    height: 25% !important;
-}
-
-.height-30-per {
-    height: 30% !important;
-}
-
-.height-35-per {
-    height: 35% !important;
-}
-
-.height-40-per {
-    height: 40% !important;
-}
-
-.height-45-per {
-    height: 45% !important;
-}
-
-.height-50-per {
-    height: 50% !important;
-}
-
-.height-55-per {
-    height: 55% !important;
-}
-
-.height-60-per {
-    height: 60% !important;
-}
-
-.height-65-per {
-    height: 65% !important;
-}
-
-.height-70-per {
-    height: 70% !important;
-}
-
-.height-75-per {
-    height: 75% !important;
-}
-
-.height-80-per {
-    height: 80% !important;
-}
-
-// Line height
-.line-height-0 {
-    line-height: 0 !important;
-}
-
-.line-height-1 {
-    line-height: 1 !important;
-}
-
-.line-height-1p5 {
-    line-height: 1.5 !important;
-}
-
-.line-height-2 {
-    line-height: 2 !important;
-}
-
-// Transformations
-
-.rotate-45 {
-    transform: rotate(45deg);
-}
-
-.rotate-45-inverse {
-    transform: rotate(-45deg);
-}
-
-.rotate-90 {
-    transform: rotate(45deg);
-}
-
-.rotate-90-inverse {
-    transform: rotate(-45deg);
-}
-
-.rotate-180 {
-    transform: rotate(45deg);
-}
-
-.rotate-180-inverse {
-    transform: rotate(-45deg);
-}
-
-// Spinner classes
-.spinner {
-    animation: spin 1s linear infinite;
-    display: inline-block;
-}
-
-@keyframes spin {
-    0% {
-        transform: rotate(0deg);
-    }
-
-    100% {
-        transform: rotate(360deg);
-    }
-}
-
-.spinner-reverse {
-    animation: spin-reverse 1s linear infinite;
-    display: inline-block;
-}
-
-@keyframes spin-reverse {
-    0% {
-        transform: rotate(0deg);
-    }
-
-    100% {
-        transform: rotate(-360deg);
-    }
-}
-
-// Image
-// Background Image
-.bg-cover {
-    background-size: cover !important;
-}
-
-.bg-repeat {
-    background-repeat: repeat !important;
-}
-
-.bg-no-repeat {
-    background-repeat: no-repeat !important;
-}
-
-// Extra large
-.img-xl {
-    height: 64px !important;
-    width: 64px !important;
-}
-
-// Large
-.img-lg {
-    height: 44px !important;
-    width: 44px !important;
-}
-
-// Small
-.img-sm {
-    height: 36px !important;
-    width: 36px !important;
-}
-
-// Mini
-.img-xs {
-    height: 32px !important;
-    width: 32px !important;
-}