@hitsoft/e-donusum 1.0.8 → 1.0.10

package/assets/sass/core/components/_tree.scss

@@ -0,0 +1,92 @@
+//
+//  Tree
+//
+
+.tree {
+	// Css variables
+	--#{$prefix}tree-icon-size: #{$tree-icon-size};
+	--#{$prefix}tree-icon-gap: #{$tree-icon-gap};
+	--#{$prefix}tree-icon-color-open: var(--#{$prefix}success);
+	--#{$prefix}tree-icon-color-default: var(--#{$prefix}gray-500);
+	--#{$prefix}tree-icon-color-close: var(--#{$prefix}gray-500);	 	
+	--#{$prefix}tree-line-color: var(--#{$prefix}gray-200);	
+
+	.tree-node {
+		padding-left: $tree-node-padding-x;
+		display: flex;
+		flex-direction: column;
+		align-items: start;
+	}
+
+	.tree-sub {
+		padding: $tree-node-padding-y 0;		 	 
+	}
+
+	.tree-content {
+		display: flex;
+		align-items: center;
+		padding: $tree-node-padding-y 0;
+	}
+
+	.tree-wrapper {
+		padding-left: calc(var(--#{$prefix}tree-icon-size) + var(--#{$prefix}tree-icon-size));
+	}
+
+	.tree-section {
+		display: flex;
+		align-items: baseline;
+		padding-left: var(--#{$prefix}tree-icon-gap);
+	}
+
+	.tree-toggle {
+		display: flex;
+		align-items: center;
+		width: var(--#{$prefix}tree-icon-size);
+		
+		.tree-icon-default {
+			font-size: 1.5rem;
+			color: var(--#{$prefix}tree-icon-color-default);	
+		}
+
+		.tree-icon-open {
+			font-size: 1.5rem;			 
+			color: var(--#{$prefix}tree-icon-color-open);	
+		}	
+
+		.tree-icon-close {
+			font-size: 1.5rem;
+			color: var(--#{$prefix}tree-icon-color-close);			 
+		}
+		
+		&.collapsed {
+			.tree-icon-close {
+				display: flex;
+			}	
+	
+			.tree-icon-open {
+				display: none;
+			}
+		}			
+
+		&:not(.collapsed) {
+			.tree-icon-close {
+				display: none;
+			}	
+	
+			.tree-icon-open {
+				display: flex;
+			}
+		} 		
+	}	
+
+	& > .tree-node {
+		padding-left: 0 !important;
+	} 
+
+	&.tree-line {
+		.tree-sub {	
+			border-left: 1px solid var(--#{$prefix}tree-line-color);	
+			margin-left: calc(var(--#{$prefix}tree-icon-size) / 2);	
+		}
+	}
+} 

package/assets/sass/core/components/_type.scss

@@ -0,0 +1,9 @@
+
+
+.blockquote-footer {
+	color: var(--#{$prefix}blockquote-footer-color);
+}
+
+.list-style-none {
+	list-style: none;
+}

package/assets/sass/core/components/_utilities.scss

@@ -0,0 +1,134 @@
+//
+// Custom utilities
+//
+
+$utilities: map-merge(
+    $utilities,
+    (
+        "cursor": (
+            property: cursor,
+            values: help wait crosshair not-allowed zoom-in grab pointer
+        ),
+        "position": (
+            property: position,
+            responsive: true,
+            values: static relative absolute fixed sticky
+        ),
+        "overflow": (
+            property: overflow,
+            responsive: true,
+            values: auto hidden visible scroll,
+        ),
+        "opacity": (
+            property: opacity,
+            class: opacity,
+            values: $opacity-values
+        ),
+        "opacity-hover": (
+            property: opacity,
+            state: hover,
+            class: opacity,
+            values: $opacity-values
+        ),
+        "font-size": (
+            rfs: true,
+            responsive: true,
+            property: font-size,
+            class: fs,
+            values: $font-sizes
+        ),
+        "width": (
+            responsive: true,
+            property: width,
+            class: w,
+            values: $custom-sizes
+        ),
+        "max-width": (
+            responsive: true,
+            property: max-width,
+            class: mw,
+            values: $custom-sizes
+        ),
+        "min-width": (
+            responsive: true,
+            property: min-width,
+            class: min-w,
+            values: $custom-sizes
+        ),
+        "height": (
+            responsive: true,
+            property: height,
+            class: h,
+            values: $custom-sizes
+        ),
+        "max-height": (
+            responsive: true,
+            property: max-height,
+            class: mh,
+            values: $custom-sizes
+        ),
+        "min-height": (
+            responsive: true,
+            property: min-height,
+            class: min-h,
+            values: $custom-sizes
+        ),
+        "z-index": (
+            property: z-index,
+            class: z-index,
+            values: $zindex-values
+        ),
+        "border-top-width": (
+            property: border-top-width,
+            class: border-top,
+            values: $border-widths
+        ),
+        "border-bottom-width": (
+            property: border-bottom-width,
+            class: border-bottom,
+            values: $border-widths
+        ),
+        "border-right-width": (
+            property: border-right-width,
+            class: border-right,
+            values: $border-widths
+        ),
+        "border-left-width": (
+            property: border-left-width,
+            class: border-left,
+            values: $border-widths
+        ),
+        "line-height": (
+            property: line-height,
+            class: lh,
+            values: (
+                0: 0,
+                1: 1,
+                sm: $line-height-sm,
+                base: $line-height-base,
+                lg: $line-height-lg,
+                xl: $line-height-xl,
+                xxl: $line-height-xxl
+            )
+        ),
+        "letter-spacing": (
+            property: letter-spacing,
+            class: ls,
+            values: $letter-spacing-values
+        ),
+        "rounded": (
+            property: border-radius,
+            class: rounded,
+            values: (
+                null: $border-radius,
+                0: 0,
+                1: $border-radius-sm,
+                2: $border-radius,
+                3: $border-radius-lg,
+                4: $border-radius-xl,
+                circle: 50%,
+                pill: $border-radius-pill
+            )
+        )
+    )
+);

package/assets/sass/core/components/_variables-dark.scss

@@ -0,0 +1,333 @@
+// Bootstrap color system
+
+//
+// Bootstrap & Custom Variables
+// Safely override any variable in _variables.custom.scss
+//
+
+$gray-100-dark:  #1B1C22 !default;
+$gray-200-dark:  #26272F !default;
+$gray-300-dark:  #363843 !default;
+$gray-400-dark:  #464852 !default;
+$gray-500-dark:  #636674 !default;
+$gray-600-dark:  #808290 !default;
+$gray-700-dark:  #9A9CAE !default;
+$gray-800-dark:  #B5B7C8 !default;
+$gray-900-dark:  #F5F5F5 !default;
+
+$grays-dark: (
+	"100": $gray-100-dark,
+	"200": $gray-200-dark,
+	"300": $gray-300-dark,
+	"400": $gray-400-dark,
+	"500": $gray-500-dark,
+	"600": $gray-600-dark,
+	"700": $gray-700-dark,
+	"800": $gray-800-dark,
+	"900": $gray-900-dark
+) !default;
+
+// Bootstrap muted color
+$text-muted-dark: $gray-500-dark !default;
+
+// Bootstrap contextual colors
+// Primary colors
+$primary-dark:						#006AE6 !default;
+$primary-active-dark:				#107EFF !default;
+$primary-light-dark: 				#172331 !default;
+$primary-clarity-dark: 				rgba(#006AE6, 0.2) !default;
+$primary-inverse-dark: 				$white !default;
+
+// Secondary colors
+$secondary-dark: 					$gray-300-dark !default;
+$secondary-active-dark: 			$gray-400-dark !default;
+$secondary-light-dark: 				$gray-300-dark !default;
+$secondary-clarity-dark:			rgba($gray-300-dark, 0.2) !default; 
+$secondary-inverse-dark:			$white !default; 
+
+// Light colors
+$light-dark: 						$gray-100-dark !default;
+$light-active-dark: 				#1F212A !default;
+$light-light-dark: 					#1F212A !default;
+$light-clarity-dark: 				rgba(31, 33, 42, 0.20) !default;
+$light-inverse-dark:				$gray-600-dark !default;
+
+// Success colors
+$success-dark: 						#00A261 !default; 
+$success-active-dark: 				#01BF73 !default;
+$success-light-dark: 				#1F212A !default;
+$success-clarity-dark: 				rgba(#00A261, 0.2) !default;
+$success-inverse-dark: 				$white !default;
+
+// Info colors
+$info-dark: 						#883FFF !default; 
+$info-active-dark: 					#9E63FF !default;
+$info-light-dark: 					#272134 !default;
+$info-clarity-dark: 				rgba(#883FFF, 0.2) !default;
+$info-inverse-dark: 				$white !default;
+
+// Warning colors
+$warning-dark: 						#C59A00 !default; 
+$warning-active-dark: 				#D9AA00 !default;
+$warning-light-dark: 				#242320 !default;
+$warning-clarity-dark: 				rgba(#C59A00, 0.2) !default;
+$warning-inverse-dark: 				$white !default;
+
+// Danger colors
+$danger-dark: 						#E42855 !default; 
+$danger-active-dark: 				#FF3767 !default;
+$danger-light-dark: 				#302024 !default;
+$danger-clarity-dark: 				rgba(#E42855, 0.2) !default;
+$danger-inverse-dark: 				$white !default;
+
+// Dark colors
+$dark-dark: 						#272A34 !default;
+$dark-active-dark: 					#2D2F39 !default;
+$dark-light-dark: 					#1E2027 !default;
+$dark-clarity-dark: 				rgba(#272A34, 0.2) !default;
+$dark-inverse-dark: 				$white !default;
+
+// Contextual colors
+$theme-colors-dark: (
+	"light": $light-dark,
+	"primary": $primary-dark,
+	"secondary": $secondary-dark,
+	"success": $success-dark,
+	"info": $info-dark,
+	"warning": $warning-dark,
+	"danger": $danger-dark,
+	"dark": $dark-dark
+) !default;
+	
+// Contextual active state colors
+$theme-active-colors-dark: (
+	"primary": $primary-active-dark,
+	"secondary":  $secondary-active-dark,
+	"light":   $light-active-dark,
+	"success": $success-active-dark,
+	"info":    $info-active-dark,
+	"warning": $warning-active-dark,
+	"danger":  $danger-active-dark,
+	"dark":    $dark-active-dark
+) !default; 
+
+// Contextual inverse state colors
+$theme-inverse-colors-dark: (
+	"primary": $primary-inverse-dark,
+	"secondary":  $secondary-inverse-dark,
+	"light":   $light-inverse-dark,
+	"success": $success-inverse-dark,
+	"info":    $info-inverse-dark,
+	"warning": $warning-inverse-dark,
+	"danger":  $danger-inverse-dark,
+	"dark":    $dark-inverse-dark
+) !default; 
+
+// Contextual light state colors
+$theme-light-colors-dark: (
+	"primary": $primary-light-dark,
+	"secondary": $secondary-light-dark,
+	"success": $success-light-dark,
+	"info":    $info-light-dark,
+	"warning": $warning-light-dark,
+	"danger":  $danger-light-dark,
+	"dark":    $dark-light-dark,
+	"light":   $light-light-dark
+) !default; 
+
+// Contextual light state colors
+$theme-clarity-colors-dark: (
+	"primary": $primary-clarity-dark,
+	"secondary": $secondary-clarity-dark,
+	"success": $success-clarity-dark,
+	"info":    $info-clarity-dark,
+	"warning": $warning-clarity-dark,
+	"danger":  $danger-clarity-dark,
+	"dark":    $dark-clarity-dark,
+	"light":   $light-clarity-dark,
+) !default; 
+
+// Text colors
+$theme-text-colors-dark: (
+	"white":   $white,
+	"primary": $primary-dark,
+	"secondary":  $secondary-dark,
+	"light":   $light-dark,
+	"success": $success-dark,
+	"info":    $info-dark,
+	"warning": $warning-dark,
+	"danger":  $danger-dark,
+	"dark":    $dark-dark,
+	"muted":   $text-muted-dark,
+	"gray-100":   $gray-100-dark,
+	"gray-200":   $gray-200-dark,
+	"gray-300":   $gray-300-dark,
+	"gray-400":   $gray-400-dark,
+	"gray-500":   $gray-500-dark,
+	"gray-600":   $gray-600-dark,
+	"gray-700":   $gray-700-dark,
+	"gray-800":   $gray-800-dark,
+	"gray-900":   $gray-900-dark
+) !default; 
+
+
+// Body
+//
+// Settings for the `<body>` element.
+$body-bg-dark:              #1C1D22 !default;
+$body-bg-rgb-dark:          to-rgb($body-bg-dark) !default;
+$body-color-dark:           $gray-900-dark !default;
+
+
+// Links
+//
+// Style anchor elements.
+$link-color-dark:           $primary-dark !default;
+
+
+// Components
+//
+// Define common padding and border radius sizes and more.
+$border-color-dark:             $gray-200-dark !default;
+$border-dashed-color-dark:      $gray-300-dark !default; 
+
+// Keenthemes hover states
+$component-hover-color-dark: 	$primary-dark !default;
+$component-hover-bg-dark: 		$gray-100-dark !default;
+
+// Keenthemes active states
+$component-active-color-dark:   $primary-inverse !default;
+$component-active-bg-dark:      $primary-dark !default;
+
+// Keenthemes checked states
+$component-checked-color-dark:   $primary-inverse !default;
+$component-checked-bg-dark:      $primary-dark !default;
+
+$headings-color-dark: 			 $gray-900-dark !default;
+$blockquote-footer-color-dark:   $gray-600-dark !default;
+
+
+// Box shadow
+$box-shadow-xs-dark: 			0 .1rem 0.75rem 0.25rem rgba($black, 0.05) !default;
+$box-shadow-sm-dark: 			0 .1rem 1rem 0.25rem rgba($black, .05) !default;
+$box-shadow-dark: 				0 .5rem 1.5rem 0.5rem rgba($black, .075) !default;
+$box-shadow-lg-dark: 			0 1rem 2rem 1rem rgba($black, .1) !default;
+$box-shadow-inset-dark: 		inset 0 1px 2px rgba($black, .075) !default;
+
+
+// Card
+$card-box-shadow-dark:                   			null !default;
+$card-border-color-dark:     						$border-color-dark !default;
+
+// Tables
+$table-striped-bg-dark:         					rgba($gray-100-dark, 0.75) !default;
+$table-loading-message-box-shadow-dark:        		0px 0px 30px rgba(0, 0, 0, 0.3) !default;
+	
+// Forms
+$form-select-indicator-color-dark:                  $gray-600-dark !default;
+$form-select-indicator-dark:                        url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='#{$form-select-indicator-color-dark}' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/></svg>") !default;
+$form-switch-color-dark:                            rgba($white, .25) !default;
+$form-switch-color-solid-dark:                      $gray-500-dark !default;
+$form-switch-bg-image-dark:                         url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-color-dark}'/></svg>") !default;
+$form-switch-bg-image-solid-dark:                   url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-color-solid-dark}'/></svg>") !default;
+
+
+// Accordion
+$accordion-icon-color-dark:                         $body-color-dark!default;
+$accordion-icon-active-color-dark:                  $primary-dark !default;
+$accordion-button-icon-dark:         				url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-color-dark}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !default;
+$accordion-button-active-icon-dark:  				url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-active-color-dark}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !default;
+
+
+// Dropdowns
+$dropdown-bg-dark:                                  $body-bg-dark !default;
+$dropdown-box-shadow-dark:							0px 0px 30px rgba(0, 0, 0, 0.3) !default;
+
+// Popover
+$popover-bg-dark:                            		$gray-200-dark !default;
+$popover-border-color-dark:                         $gray-200-dark !default;
+$popover-box-shadow-dark:    						$dropdown-box-shadow-dark !default;
+$popover-header-border-color-dark:           		$gray-300-dark !default;
+
+// Toasts
+$toast-background-color-dark:                		$gray-200-dark !default;
+$toast-header-background-color-dark:         		$gray-200-dark !default;
+$toast-header-border-color-dark:             		$gray-300-dark !default;
+
+// Tooltip
+$tooltip-bg-dark:                            		$gray-200-dark !default;
+$tooltip-box-shadow-dark:    						0px 0px 30px rgba(0, 0, 0, 0.15) !default;
+
+// Code
+$code-bg-dark:                   #2b2b40 !default;
+$code-shadow-dark:               rgba(0, 0, 0, 0.08) 0px 3px 9px 0px !default;
+$code-color-dark:                #b93993 !default;
+$code-border-color-dark:         transparent  !default;
+
+// Symbol
+$symbol-border-color-dark: rgba($body-bg, 0.5);
+$symbol-label-color-dark: $gray-800-dark;
+$symbol-label-bg-dark: $gray-100-dark;
+
+
+// Keenthemes bullet component
+$bullet-bg-color-dark: $gray-400-dark !default;
+
+// Keenthemes scrolltop component
+$scrolltop-opacity-dark: 0 !default;
+$scrolltop-opacity-on-dark: 0.3 !default;
+$scrolltop-opacity-hover-dark: 1 !default;
+$scrolltop-box-shadow-dark: $box-shadow !default;
+$scrolltop-bg-color-dark: $primary !default;
+$scrolltop-bg-color-hover-dark: $primary !default;
+$scrolltop-icon-color-dark: $primary-inverse !default;
+$scrolltop-icon-color-hover-dark: $primary-inverse !default;
+
+
+// Keenthemes drawer component
+$drawer-box-shadow-dark: 0px 0px 30px rgba(0, 0, 0, 0.1) !default;
+$drawer-bg-color-dark: $body-bg-dark !default;
+$drawer-overlay-bg-color-dark: rgba($black, 0.4) !default;
+
+// Keenthemes menu component   
+$menu-dropdown-box-shadow-dark: $dropdown-box-shadow-dark !default;
+$menu-dropdown-bg-color-dark: $dropdown-bg-dark !default;
+$menu-link-color-hover-dark: $component-hover-color-dark !default;
+$menu-link-color-show-dark: $component-hover-color-dark !default;
+$menu-link-color-here-dark: $component-hover-color-dark !default;
+$menu-link-color-active-dark: $component-hover-color-dark !default;
+$menu-link-bg-color-hover-dark: $component-hover-bg-dark !default;
+$menu-link-bg-color-show-dark: $component-hover-bg-dark !default;
+$menu-link-bg-color-here-dark: $component-hover-bg-dark !default;
+$menu-link-bg-color-active-dark: $component-hover-bg-dark !default;
+$menu-heading-color-dark: $text-muted-dark !default;
+	
+// Keenthemes scrollbar component 
+$scrollbar-color-dark: $gray-200-dark !default;
+$scrollbar-hover-color-dark: $gray-300-dark !default;
+
+// Keenthemes overlay component 
+$overlay-bg-dark: rgba($white, 0.05) !default;
+
+// Keenthemes blockui component 
+$blockui-overlay-bg-dark: rgba($white, 0.05) !default;
+$blockui-message-bg-dark: $tooltip-bg-dark !default;
+$blockui-message-box-shadow-dark: $tooltip-box-shadow-dark !default;
+
+// Keenthemes rating component 
+$rating-color-default-dark: $gray-400-dark !default;
+$rating-color-active-dark: #FFAD0F !default;
+
+// Keenthemes ribbon component 
+$ribbon-label-box-shadow-dark: 0px -1px 5px 0px rgba($white, 0.1) !default;
+$ribbon-label-bg-dark: $primary !default;
+$ribbon-label-border-color-dark: darken($primary, 20%) !default;
+$ribbon-clip-bg-dark: $light !default;
+
+// Engage panel
+$engage-btn-bg-dark: $gray-200-dark;
+$engage-btn-box-shadow-dark: 0px 0px 30px rgba(0, 0, 0, 0.3);
+$engage-btn-border-color-dark: $border-color-dark;
+$engage-btn-color-dark: $gray-800-dark;
+$engage-btn-icon-color-dark: $gray-600-dark;
+$engage-btn-color-active-dark: $gray-800-dark;