mirror of
				https://github.com/crater-invoice/crater.git
				synced 2025-10-31 05:31:10 -04:00 
			
		
		
		
	init crater
This commit is contained in:
		
							
								
								
									
										55
									
								
								resources/assets/sass/components/base/base-button.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										55
									
								
								resources/assets/sass/components/base/base-button.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,55 @@ | ||||
| .base-button { | ||||
|  | ||||
|     height: 40px; | ||||
|     padding: 6px 20px; | ||||
|     font-size: 14px; | ||||
|     font-weight: 500; | ||||
|     text-align: center; | ||||
|     display: flex; | ||||
|     align-items: center; | ||||
|     white-space: nowrap; | ||||
|     line-height: 14px; | ||||
|  | ||||
|     &.btn-lg { | ||||
|         height: 45px; | ||||
|         font-size: 15px; | ||||
|         font-weight: 500; | ||||
|         text-align: center | ||||
|     } | ||||
|  | ||||
|     &.btn-sm { | ||||
|         height: 34px; | ||||
|         padding: 5px 15px; | ||||
|         font-size: 12px; | ||||
|         font-weight: 500; | ||||
|         text-align: center | ||||
|     } | ||||
|  | ||||
|     &.btn-danger { | ||||
|         color: #ffffff !important; | ||||
|     } | ||||
|  | ||||
|     &.btn-outline-danger:hover { | ||||
|         color: #ffffff !important; | ||||
|     } | ||||
|  | ||||
|     .icon-button { | ||||
|         text-align: center; | ||||
|     } | ||||
|  | ||||
|     .icon-left { | ||||
|         margin-right: 10px !important; | ||||
|     } | ||||
|  | ||||
|     .icon-right { | ||||
|         margin-left: 10px !important; | ||||
|     } | ||||
|  | ||||
|     &.btn-cursor-not-allowed { | ||||
|         cursor: not-allowed !important; | ||||
|     } | ||||
|  | ||||
|     .icon { | ||||
|         margin-right: 5px; | ||||
|     } | ||||
| } | ||||
							
								
								
									
										46
									
								
								resources/assets/sass/components/base/base-date-picker.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										46
									
								
								resources/assets/sass/components/base/base-date-picker.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,46 @@ | ||||
| .base-date-input { | ||||
|     width: 100%; | ||||
|     position: relative; | ||||
|  | ||||
|     .date-field { | ||||
|         width: 100%; | ||||
|         height: 40px; | ||||
|         background: #FFFFFF; | ||||
|         border: 1px solid $ls-color-gray--light; | ||||
|         box-sizing: border-box; | ||||
|         border-radius: 5px; | ||||
|         display: inline-block; | ||||
|         padding: 0px 6px 0px 40px; | ||||
|         font-size: 1rem; | ||||
|         line-height: 1.4; | ||||
|         cursor: pointer; | ||||
|  | ||||
|         &:focus { | ||||
|             border: 1px solid #817AE3; | ||||
|         } | ||||
|  | ||||
|         &.invalid { | ||||
|             border: 1px solid #FB7178 !important; | ||||
|         } | ||||
|     } | ||||
|  | ||||
|  | ||||
|  | ||||
| } | ||||
|  | ||||
| .vdp-datepicker__calendar-button { | ||||
|     position: absolute; | ||||
|     width: 13px; | ||||
|     height: 18px; | ||||
|     color: $ls-color-gray; | ||||
|     font-style: normal; | ||||
|     font-weight: 900; | ||||
|     font-size: 14px; | ||||
|     line-height: 16px; | ||||
|     top: 50%; | ||||
|     left: 20px; | ||||
|     transform: translate(-50%,-50%); | ||||
|     .icon-fa { | ||||
|         color: $ls-color-gray; | ||||
|     } | ||||
| } | ||||
							
								
								
									
										89
									
								
								resources/assets/sass/components/base/base-input.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										89
									
								
								resources/assets/sass/components/base/base-input.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,89 @@ | ||||
| .base-input { | ||||
|     width: 100%; | ||||
|     position: relative; | ||||
|  | ||||
|     .left-icon { | ||||
|         position: absolute; | ||||
|         width: 13px; | ||||
|         height: 18px; | ||||
|         min-width: 40px; | ||||
|         color: $ls-color-gray; | ||||
|         font-style: normal; | ||||
|         font-weight: 900; | ||||
|         font-size: 14px; | ||||
|         line-height: 16px; | ||||
|         top: 50%; | ||||
|         left: 20px; | ||||
|         z-index: 1; | ||||
|         transform: translate(-50%,-50%); | ||||
|     } | ||||
|  | ||||
|     .right-icon { | ||||
|         position: absolute; | ||||
|         width: 13px; | ||||
|         height: 18px; | ||||
|         min-width: 18px; | ||||
|         color: $ls-color-gray; | ||||
|         font-style: normal; | ||||
|         font-weight: 900; | ||||
|         font-size: 14px; | ||||
|         line-height: 16px; | ||||
|         top: 50%; | ||||
|         right: 0px; | ||||
|         z-index: 1; | ||||
|         transform: translate(-50%, -50%); | ||||
|     } | ||||
|  | ||||
|     .small-input { | ||||
|         max-width: 100px; | ||||
|     } | ||||
|  | ||||
|     .input-field { | ||||
|         width: 100%; | ||||
|         height: 40px; | ||||
|         padding: 8px 13px; | ||||
|         text-align: left; | ||||
|         background: #FFFFFF; | ||||
|         border: 1px solid $ls-color-gray--light; | ||||
|         box-sizing: border-box; | ||||
|         border-radius: 5px; | ||||
|         font-style: normal; | ||||
|         font-weight: 400; | ||||
|         font-size: 14px; | ||||
|         line-height: 21px; | ||||
|  | ||||
|         &.v-money { | ||||
|             font-family: Arial, Helvetica, sans-serif !important; | ||||
|         } | ||||
|  | ||||
|         &::placeholder { | ||||
|             font-family: Poppins; | ||||
|             font-style: normal; | ||||
|             font-weight: 500; | ||||
|             font-size: 14px; | ||||
|             line-height: 21px; | ||||
|             color: $ls-color-gray; | ||||
|         } | ||||
|  | ||||
|         &:focus { | ||||
|             border: 1px solid #817AE3; | ||||
|         } | ||||
|  | ||||
|         &.invalid { | ||||
|             border: 1px solid #FB7178 !important; | ||||
|         } | ||||
|  | ||||
|         &.disabled { | ||||
|             background: $ls-color-gray--light !important; | ||||
|             color: $ls-color-gray--dark !important; | ||||
|         } | ||||
|  | ||||
|         &-left-icon { | ||||
|             padding-left: 35px; | ||||
|         } | ||||
|  | ||||
|         &-right-icon { | ||||
|             padding-right: 35px; | ||||
|         } | ||||
|     } | ||||
| } | ||||
							
								
								
									
										38
									
								
								resources/assets/sass/components/base/base-loader.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										38
									
								
								resources/assets/sass/components/base/base-loader.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,38 @@ | ||||
| .base-loader { | ||||
|     display: flex; | ||||
|     justify-content: center; | ||||
|     align-items: center; | ||||
|     width: 100%; | ||||
|     position: absolute; | ||||
|     height: 100%; | ||||
|  | ||||
|     &.table-loader { | ||||
|         background: rgba(255, 255, 255, 0.5); | ||||
|         height: calc(100% - 80px); | ||||
|         top: 80px; | ||||
|     } | ||||
|  | ||||
|     .spinner { | ||||
|         height: 50px; | ||||
|         width: 50px; | ||||
|         border: 6px solid $ls-color-primary--light; | ||||
|         border-top-color: $ls-color-gray--light; | ||||
|         border-radius: 100%; | ||||
|         animation: rotation 0.6s infinite linear 0.25s; | ||||
|  | ||||
|         /* the opacity is used to lazyload the spinner, see animation delay */ | ||||
|         /* this avoid the spinner to be displayed when visible for a very short period of time */ | ||||
|         opacity: 0; | ||||
|     } | ||||
|  | ||||
|     @keyframes rotation { | ||||
|         from { | ||||
|             opacity: 1; | ||||
|             transform: rotate(0deg); | ||||
|         } | ||||
|         to { | ||||
|             opacity: 1; | ||||
|             transform: rotate(359deg); | ||||
|         } | ||||
|     } | ||||
| } | ||||
							
								
								
									
										3
									
								
								resources/assets/sass/components/base/base-loader/animation/_functions.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										3
									
								
								resources/assets/sass/components/base/base-loader/animation/_functions.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,3 @@ | ||||
| @function delay($interval, $count, $index) { | ||||
|   @return ($index * $interval) - ($interval * $count); | ||||
| } | ||||
							
								
								
									
										25
									
								
								resources/assets/sass/components/base/base-loader/animation/_mixins.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										25
									
								
								resources/assets/sass/components/base/base-loader/animation/_mixins.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,25 @@ | ||||
| @mixin global-bg() { | ||||
|   background-color: $primary-color; | ||||
| } | ||||
|  | ||||
| @mixin global-animation() { | ||||
|   animation-fill-mode: both; | ||||
| } | ||||
|  | ||||
| @mixin balls() { | ||||
|   @include global-bg(); | ||||
|  | ||||
|   width: $ball-size; | ||||
|   height: $ball-size; | ||||
|   border-radius: 100%; | ||||
|   margin: $margin; | ||||
| } | ||||
|  | ||||
| @mixin lines() { | ||||
|   @include global-bg(); | ||||
|  | ||||
|   width: $line-width; | ||||
|   height: $line-height; | ||||
|   border-radius: 2px; | ||||
|   margin: $margin; | ||||
| } | ||||
							
								
								
									
										6
									
								
								resources/assets/sass/components/base/base-loader/animation/_variables.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										6
									
								
								resources/assets/sass/components/base/base-loader/animation/_variables.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,6 @@ | ||||
| $primary-color: $crater-theme--light !default; | ||||
| $ball-size: 15px !default; | ||||
| $margin: 2px !default; | ||||
| $line-height: 35px !default; | ||||
| $line-width: 4px !default; | ||||
|  | ||||
							
								
								
									
										58
									
								
								resources/assets/sass/components/base/base-loader/index.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										58
									
								
								resources/assets/sass/components/base/base-loader/index.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,58 @@ | ||||
| @import './animation/variables'; | ||||
| @import './animation/mixins'; | ||||
| @import './animation/functions'; | ||||
|  | ||||
| $size: 50px; | ||||
|  | ||||
| @keyframes ball-scale-ripple-multiple { | ||||
|   0% { | ||||
|     transform: scale(0.1); | ||||
|     opacity: 1; | ||||
|   } | ||||
|   70% { | ||||
|     transform: scale(1); | ||||
|     opacity: 0.7; | ||||
|   } | ||||
|   100% { | ||||
|     opacity: 0.0; | ||||
|   } | ||||
| } | ||||
|  | ||||
| @mixin ball-scale-ripple-multiple ($n:3, $start:0) { | ||||
|   @for $i from $start through $n { | ||||
|     > div:nth-child(#{$i}) { | ||||
|       animation-delay: delay(0.2s, $n, $i - 1); | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| .loader { | ||||
|     width: 100%; | ||||
|     position: relative; | ||||
|     min-height: 500px; | ||||
| } | ||||
|  | ||||
| .ball-scale-ripple-multiple { | ||||
|     display: flex; | ||||
|     justify-content: center; | ||||
|     align-items: center; | ||||
|     position: absolute; | ||||
|     transform: translateY(-25px); | ||||
|     top: 60%; | ||||
|     left: 40%; | ||||
|     @include ball-scale-ripple-multiple(); | ||||
|     transform: translateY(-$size / 2); | ||||
|  | ||||
|     > div { | ||||
|         @include global-animation(); | ||||
|  | ||||
|         position: absolute; | ||||
|         top: -2px; | ||||
|         left: -26px; | ||||
|         width: $size; | ||||
|         height: $size; | ||||
|         border-radius: 100%; | ||||
|         border: 2px solid $primary-color; | ||||
|         animation: ball-scale-ripple-multiple 1.25s 0s infinite cubic-bezier(.21,.53,.56,.8); | ||||
|     } | ||||
| } | ||||
							
								
								
									
										26
									
								
								resources/assets/sass/components/base/base-popup.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										26
									
								
								resources/assets/sass/components/base/base-popup.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,26 @@ | ||||
| .search-select { | ||||
|     position: relative; | ||||
|     width: 100%; | ||||
|  | ||||
|     .activator { | ||||
|         position: relative; | ||||
|         width: 100%; | ||||
|         cursor: pointer; | ||||
|     } | ||||
|  | ||||
|     .selector-menu { | ||||
|         display: flex; | ||||
|         flex-direction: column; | ||||
|         position: absolute; | ||||
|         z-index: 100; | ||||
|         width: 100%; | ||||
|         top: 0; | ||||
|         background: #FFFFFF; | ||||
|         box-shadow: $shadow-lg; | ||||
|         border-radius: 5px; | ||||
|     } | ||||
|     .selector-menu-above { | ||||
|         top: unset !important; | ||||
|         bottom: 100% !important; | ||||
|     } | ||||
| } | ||||
							
								
								
									
										46
									
								
								resources/assets/sass/components/base/base-switch.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										46
									
								
								resources/assets/sass/components/base/base-switch.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,46 @@ | ||||
| .base-switch { | ||||
|  | ||||
|     input[type=checkbox] { | ||||
|         height: 0; | ||||
|         width: 0; | ||||
|         visibility: hidden; | ||||
|     } | ||||
|  | ||||
|     label { | ||||
|         cursor: pointer; | ||||
|         text-indent: -9999px; | ||||
|         width: 35px; | ||||
|         height: 16px; | ||||
|         background: $white; | ||||
|         border: 1px solid $ls-color-gray; | ||||
|         display: block; | ||||
|         border-radius: 16px; | ||||
|         position: relative; | ||||
|     } | ||||
|  | ||||
|     label:after { | ||||
|         content: ""; | ||||
|         position: absolute; | ||||
|         top: -3px; | ||||
|         left: 0px; | ||||
|         width: 20px; | ||||
|         height: 20px; | ||||
|         background: $ls-color-gray--dark; | ||||
|         border-radius: 15px; | ||||
|         transition: 0.3s; | ||||
|     } | ||||
|  | ||||
|     input:checked+label { | ||||
|         background: $ls-color-primary--very-light; | ||||
|     } | ||||
|  | ||||
|     input:checked+label:after { | ||||
|         left: calc(100% - 0px); | ||||
|         transform: translateX(-100%); | ||||
|         background: $ls-color-primary; | ||||
|     } | ||||
|  | ||||
|     label:active:after { | ||||
|         width: 20px; | ||||
|     } | ||||
| } | ||||
							
								
								
									
										42
									
								
								resources/assets/sass/components/base/base-text-area.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										42
									
								
								resources/assets/sass/components/base/base-text-area.scss
									
									
									
									
										vendored
									
									
										Normal file
									
								
							| @ -0,0 +1,42 @@ | ||||
| .base-text-area { | ||||
|     width: 100%; | ||||
|     &.text-area-field { | ||||
|         width: 100%; | ||||
|         padding: 8px 13px; | ||||
|         text-align: left; | ||||
|         background: #FFFFFF; | ||||
|         border: 1px solid $ls-color-gray--light; | ||||
|         box-sizing: border-box; | ||||
|         border-radius: 5px; | ||||
|         font-style: normal; | ||||
|         font-weight: 500; | ||||
|         font-size: 14px; | ||||
|         line-height: 21px; | ||||
|  | ||||
|         &::placeholder { | ||||
|             font-family: Poppins; | ||||
|             font-style: normal; | ||||
|             font-weight: 500; | ||||
|             font-size: 14px; | ||||
|             line-height: 21px; | ||||
|             color: $ls-color-gray; | ||||
|         } | ||||
|  | ||||
|         &:focus { | ||||
|             border: 1px solid #817AE3; | ||||
|         } | ||||
|  | ||||
|         &.invalid { | ||||
|             border: 1px solid #FB7178 !important; | ||||
|         } | ||||
|  | ||||
|         &.disabled { | ||||
|             background: $ls-color-gray--light !important; | ||||
|             color: $ls-color-gray--dark !important; | ||||
|         } | ||||
|  | ||||
|         &-icon { | ||||
|             padding-left: 35px; | ||||
|         } | ||||
|     } | ||||
| } | ||||
		Reference in New Issue
	
	Block a user