mirror of
https://github.com/crater-invoice/crater.git
synced 2025-10-31 21:51:10 -04:00
build version 400
This commit is contained in:
Mohit Panjwani
128
resources/assets/sass/base.scss
vendored
128
resources/assets/sass/base.scss
vendored
@ -1,128 +0,0 @@
|
||||
// Basic Styles
|
||||
// -------------------------
|
||||
|
||||
html, body , .site-wrapper{
|
||||
height: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: $ls-color-gray--light;
|
||||
font-family: $base-font-family;
|
||||
color: $base-font-color;
|
||||
|
||||
overflow-x: hidden;
|
||||
|
||||
i {
|
||||
font-family: 'Font Awesome 5 Free'!important;
|
||||
}
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: $heading-font-color;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $ls-color-black--light;
|
||||
|
||||
&:hover, &:focus {
|
||||
color: lighten($ls-color-black--light, 10%);
|
||||
text-decoration: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
mark, .mark {
|
||||
background-color: #efefef;
|
||||
border-radius: 5px;
|
||||
color: $ls-color-black;
|
||||
padding: 0.2em 0.4em;
|
||||
margin: 0 1px;
|
||||
}
|
||||
|
||||
code, .code {
|
||||
background-color: $code-bg;
|
||||
color: $ls-color-primary;
|
||||
}
|
||||
|
||||
:active, :focus, :hover {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
[v-cloak] {display: none}
|
||||
|
||||
.text-default {
|
||||
color: $ls-color-black !important;
|
||||
}
|
||||
|
||||
@keyframes spinner {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
.fa-spinner {
|
||||
animation: spinner 1.5s linear infinite;
|
||||
}
|
||||
|
||||
.filter-section {
|
||||
background: $ls-color-gray--light;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
padding: 30px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.clear-filter {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 15px;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
color: $ls-color-black;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.list-add-button {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
padding: 13px 10px;
|
||||
background:$ls-color-gray--light;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
outline: none;
|
||||
align-items: center;
|
||||
|
||||
.icon {
|
||||
color: $ls-color-primary--light;
|
||||
}
|
||||
|
||||
label {
|
||||
font-family: Poppins;
|
||||
font-size: 14px;
|
||||
margin: 0 0 0 10px !important;
|
||||
line-height: 14px;
|
||||
color: $ls-color-primary--light;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.swal-icon--custom {
|
||||
height: 70px !important;
|
||||
}
|
||||
|
||||
.custom-control-input:checked ~ .custom-control-label::before {
|
||||
color: #fff;
|
||||
border-color: $ls-color-primary !important;
|
||||
background-color: $ls-color-primary !important;
|
||||
}
|
||||
|
||||
.avatar-cropper-btn:hover {
|
||||
background-color: $ls-color-primary !important;
|
||||
color: $white;
|
||||
}
|
||||
29
resources/assets/sass/components/animation.scss
vendored
Normal file
29
resources/assets/sass/components/animation.scss
vendored
Normal file
@ -0,0 +1,29 @@
|
||||
.shake {
|
||||
animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
|
||||
transform: translate3d(0, 0, 0);
|
||||
backface-visibility: hidden;
|
||||
perspective: 1000px;
|
||||
}
|
||||
|
||||
@keyframes shake {
|
||||
10%,
|
||||
90% {
|
||||
transform: translate3d(-1px, 0, 0);
|
||||
}
|
||||
|
||||
20%,
|
||||
80% {
|
||||
transform: translate3d(2px, 0, 0);
|
||||
}
|
||||
|
||||
30%,
|
||||
50%,
|
||||
70% {
|
||||
transform: translate3d(-4px, 0, 0);
|
||||
}
|
||||
|
||||
40%,
|
||||
60% {
|
||||
transform: translate3d(4px, 0, 0);
|
||||
}
|
||||
}
|
||||
@ -1,87 +0,0 @@
|
||||
.image-upload-box {
|
||||
height: 110px;
|
||||
padding: 20px;
|
||||
background-color: transparent;
|
||||
border: 2px dashed $ls-color-gray--light;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
|
||||
.preview-logo {
|
||||
max-height: 80%;
|
||||
position: absolute;
|
||||
opacity: 1;
|
||||
animation: fadeIn 2s ease;
|
||||
}
|
||||
|
||||
.upload-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.upload-text {
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
text-align: center;
|
||||
color: $ls-color-gray;
|
||||
}
|
||||
|
||||
.upload-icon {
|
||||
font-size: 20px;
|
||||
line-height: 23px;
|
||||
color: $ls-color-gray;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.white-icon {
|
||||
font-size: 30px;
|
||||
line-height: 23px;
|
||||
color: $white;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.overlay {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 10;
|
||||
transition: .5s ease;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.overlay {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.avatar-upload {
|
||||
height: 130px;
|
||||
width: 130px;
|
||||
.preview-logo {
|
||||
max-width: 80% !important;
|
||||
}
|
||||
|
||||
@keyframes fadeIn{
|
||||
0%{
|
||||
opacity: 0;
|
||||
}
|
||||
100%{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
83
resources/assets/sass/components/base-modal.scss
vendored
83
resources/assets/sass/components/base-modal.scss
vendored
@ -1,83 +0,0 @@
|
||||
|
||||
.base-modal {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(4,4,5,0.1);
|
||||
z-index: 10001;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.modal-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 70px;
|
||||
border-bottom: 1px solid $ls-color-gray--light;
|
||||
padding: 30px 30px 20px 30px !important;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 10px;
|
||||
background: $ls-color-primary;
|
||||
}
|
||||
|
||||
.modal-heading {
|
||||
font-size: 17.5px;
|
||||
font-weight: 500;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
background: white;
|
||||
box-shadow: $shadow-xl;
|
||||
position: relative;
|
||||
max-width: 600px;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
&.size-lg .modal-body {
|
||||
max-width: 800px
|
||||
}
|
||||
|
||||
&.size-sm .modal-body {
|
||||
max-width: 400px
|
||||
}
|
||||
|
||||
.close-icon {
|
||||
position: absolute;
|
||||
padding: 6px;
|
||||
top: 23px;
|
||||
right: 15px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
width: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: $x-small-breakpoint) {
|
||||
.base-modal {
|
||||
|
||||
.modal-body {
|
||||
height: 100%;
|
||||
overflow: scroll;
|
||||
border-radius: 0px;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
77
resources/assets/sass/components/base-tabs.scss
vendored
77
resources/assets/sass/components/base-tabs.scss
vendored
@ -1,77 +0,0 @@
|
||||
|
||||
.tabs {
|
||||
width: 100%;
|
||||
padding-left: 0px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
list-style: none;
|
||||
border-bottom: 2px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
.tab {
|
||||
display: block;
|
||||
padding: 10px 30px;
|
||||
color: $ls-color-gray--dark;
|
||||
font-style: normal;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
|
||||
.tab-link {
|
||||
color: $ls-color-gray--dark
|
||||
}
|
||||
|
||||
&::after {
|
||||
width: 100%;
|
||||
background: $ls-color-gray--dark;
|
||||
position: absolute;
|
||||
content: '';
|
||||
bottom: -2px;
|
||||
left: 0;
|
||||
height: 3px;
|
||||
opacity: 0;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
&:hover::after {
|
||||
display: block;
|
||||
content: '';
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.a-active{
|
||||
font-weight: 500;
|
||||
color: $ls-color-black--light !important;
|
||||
}
|
||||
|
||||
.a-active::after {
|
||||
height: 3px;
|
||||
display: block;
|
||||
width: 100%;
|
||||
background: $ls-color-primary;
|
||||
position: absolute;
|
||||
content: '';
|
||||
bottom: -2px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.router-link-exact-active.active::after {
|
||||
height: 3px;
|
||||
display: block;
|
||||
width: 100%;
|
||||
background: $ls-color-primary;
|
||||
position: absolute;
|
||||
content: '';
|
||||
bottom: -2px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
|
||||
.router-link-exact-active.active {
|
||||
font-weight: 500;
|
||||
color: $ls-color-black--light !important;
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,55 +0,0 @@
|
||||
.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;
|
||||
}
|
||||
}
|
||||
@ -1,45 +0,0 @@
|
||||
.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;
|
||||
}
|
||||
}
|
||||
@ -1,105 +0,0 @@
|
||||
.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-input-group-text {
|
||||
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%);
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,38 +0,0 @@
|
||||
.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);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,3 +0,0 @@
|
||||
@function delay($interval, $count, $index) {
|
||||
@return ($index * $interval) - ($interval * $count);
|
||||
}
|
||||
@ -1,25 +0,0 @@
|
||||
@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;
|
||||
}
|
||||
@ -1,6 +0,0 @@
|
||||
$primary-color: $crater-theme--light !default;
|
||||
$ball-size: 15px !default;
|
||||
$margin: 2px !default;
|
||||
$line-height: 35px !default;
|
||||
$line-width: 4px !default;
|
||||
|
||||
@ -1,58 +0,0 @@
|
||||
@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);
|
||||
}
|
||||
}
|
||||
@ -1,27 +0,0 @@
|
||||
.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;
|
||||
}
|
||||
}
|
||||
@ -1,54 +0,0 @@
|
||||
.base-prefix-input {
|
||||
display: flex;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
padding: 2px 2px;
|
||||
flex-direction: row;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
border-radius: 5px;
|
||||
|
||||
.icon {
|
||||
width: 13px;
|
||||
height: 18px;
|
||||
color: $ls-color-gray;
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
margin-top: 17px;
|
||||
margin-left: 20px;
|
||||
z-index: 1;
|
||||
transform: translate(-50%,-50%);
|
||||
}
|
||||
|
||||
p {
|
||||
padding: 0 0 0 0;
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
|
||||
.prefix-label {
|
||||
display: flex;
|
||||
height: 18px;
|
||||
color: #55547A;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
padding: 9px 2px 9px 10px;
|
||||
}
|
||||
|
||||
.prefix-input-field {
|
||||
width: 100%;
|
||||
padding: 8px 13px;
|
||||
padding-left: 1px;
|
||||
text-align: left;
|
||||
background: #FFFFFF;
|
||||
border: none;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,46 +0,0 @@
|
||||
.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;
|
||||
}
|
||||
}
|
||||
@ -1,45 +0,0 @@
|
||||
.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;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
163
resources/assets/sass/components/buttons.scss
vendored
163
resources/assets/sass/components/buttons.scss
vendored
@ -1,163 +0,0 @@
|
||||
.btn {
|
||||
&.btn-pressable:active {
|
||||
transform: translate(0px, 3px);
|
||||
-webkit-transform: translate(0px, 3px);
|
||||
}
|
||||
|
||||
font-family: $base-font-family;
|
||||
}
|
||||
|
||||
// Disable Outline on focus
|
||||
.btn:focus, .btn.focus, .btn:active:focus, .btn:active.focus, .btn.active:focus, .btn.active.focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.btn-default {
|
||||
border: 1px solid $ls-color-gray;
|
||||
background-color: $white;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
background-color: $ls-color-gray--light;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-outline-default {
|
||||
border: 1px solid $ls-color-gray;
|
||||
background-color: $white;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
background-color: $ls-color-gray--light;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-theme {
|
||||
@include button-variant($ls-color-primary, $ls-color-primary);
|
||||
$color: $ls-color-secondary;
|
||||
}
|
||||
|
||||
.btn-outline-theme {
|
||||
@include button-outline-variant($ls-color-primary);
|
||||
}
|
||||
|
||||
.btn-theme-light {
|
||||
@include button-variant($ls-color-primary--light, $ls-color-primary--light);
|
||||
$color: $white;
|
||||
}
|
||||
|
||||
// Rounded Button
|
||||
.btn-rounded {
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
.btn i {
|
||||
width: 1.2em;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.btn-icon {
|
||||
padding: 0.6rem;
|
||||
line-height: 1em;
|
||||
|
||||
i {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
// Sizes
|
||||
.btn-xs {
|
||||
font-size: 12px;
|
||||
padding: 3px 10px;
|
||||
}
|
||||
|
||||
.btn-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// Extra
|
||||
|
||||
.ladda-button {
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
|
||||
// Color Overrides
|
||||
.btn-success,.btn-warning, .btn-info {
|
||||
color: $white;
|
||||
|
||||
&:hover {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
//dropdown Button
|
||||
.btn-group .btn-group .dropdown-group {
|
||||
|
||||
.btn {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
.btn-group:not(:last-child) > .btn {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
}
|
||||
.btn-group-vertical {
|
||||
> .btn-group:not(:last-child) .dropdown-group .btn{
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
> .btn-group .dropdown-group .btn{
|
||||
border-top-right-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-crater {
|
||||
width: 148px;
|
||||
height: 45px;
|
||||
border-radius: 5px;
|
||||
font-family: poppins;
|
||||
font-weight: 600;
|
||||
font-size: 15px;
|
||||
|
||||
.btn-label {
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-crater:focus {
|
||||
outline: 10px auto #817AE3;
|
||||
}
|
||||
|
||||
.btn-crater:disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.btn-crater-default {
|
||||
color: #FFFFFF;
|
||||
background: $ls-color-primary;
|
||||
border: 1px solid $ls-color-primary;
|
||||
|
||||
.icon-fa-spinner {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-crater-default:hover {
|
||||
background: #635BF2;
|
||||
}
|
||||
|
||||
.btn-crater-hollow {
|
||||
border: 1px solid $ls-color-primary;
|
||||
color: $ls-color-primary;
|
||||
background: #ffffff;
|
||||
|
||||
.icon-fa-spinner {
|
||||
color: $ls-color-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-crater-hollow:hover {
|
||||
opacity: 0.9;
|
||||
color: $ls-color-primary;
|
||||
}
|
||||
111
resources/assets/sass/components/cards.scss
vendored
111
resources/assets/sass/components/cards.scss
vendored
@ -1,111 +0,0 @@
|
||||
// cards.scss - Custom Cards
|
||||
.card {
|
||||
margin-bottom: 1.5rem;
|
||||
border: none;
|
||||
box-shadow: $shadow;
|
||||
|
||||
.card-header {
|
||||
|
||||
@include clearfix;
|
||||
position: relative;
|
||||
border-bottom: 1px solid $ls-color-gray--light;
|
||||
|
||||
i {
|
||||
width: 1.3em;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 1rem;
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
font-size: $font-size-section-title;
|
||||
}
|
||||
|
||||
h5 {
|
||||
margin: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
&.bg-dark {
|
||||
background-color: $ls-color-secondary;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.caption {
|
||||
display: inline-block;
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
.actions {
|
||||
float: right;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.card-body {
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
.section-semi-title {
|
||||
font-size: $font-size-semi-section-title;
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
background-color: $white;
|
||||
}
|
||||
|
||||
&.with-tabs .card-header {
|
||||
padding: 0;
|
||||
|
||||
.caption {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.actions {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
padding: 1em 1.5em;
|
||||
}
|
||||
}
|
||||
|
||||
.bg-primary,
|
||||
.bg-info,
|
||||
.bg-primary,
|
||||
.bg-dark,
|
||||
.bg-success,
|
||||
.bg-danger,
|
||||
.bg-warning {
|
||||
|
||||
h3, h5, h6 {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
||||
.card
|
||||
.card-body {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -1,37 +0,0 @@
|
||||
.category-modal {
|
||||
|
||||
.card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
.col-form-label {
|
||||
text-align: end;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.required {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
color: $ls-color-red;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.base-modal {
|
||||
|
||||
.category-modal {
|
||||
|
||||
.input-label {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
77
resources/assets/sass/components/charts.scss
vendored
77
resources/assets/sass/components/charts.scss
vendored
@ -1,77 +0,0 @@
|
||||
// Gauges
|
||||
// -------------------------
|
||||
|
||||
.gauge {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gauge-lg {
|
||||
|
||||
.basic-gauge, .donut-gauge, .color-gauge {
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
.gauge-label {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.gauge-md {
|
||||
|
||||
.basic-gauge, .donut-gauge, .color-gauge {
|
||||
height: 180px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.gauge-sm {
|
||||
|
||||
.basic-gauge, .donut-gauge, .color-gauge {
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
.gauge-label {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.gauge-label {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
top: 60%;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 28px;
|
||||
font-weight: bold;
|
||||
|
||||
&.middle-label {
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
.gauge {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint) {
|
||||
|
||||
.gauge-lg {
|
||||
|
||||
.basic-gauge, .donut-gauge, .color-gauge {
|
||||
height: 180px !important;
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
.gauge-label {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,58 +0,0 @@
|
||||
.customer-modal {
|
||||
|
||||
.card-body {
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
|
||||
.col-form-label {
|
||||
text-align: end;
|
||||
font-family: poppins, sans-serif;
|
||||
padding-right: 0;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.required {
|
||||
position: absolute;
|
||||
color: $ls-color-red;
|
||||
right: -10px;
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 20px 20px;
|
||||
|
||||
.btn-crater {
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.copy-address-button {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: $x-small-breakpoint) {
|
||||
|
||||
.base-modal {
|
||||
|
||||
.customer-modal {
|
||||
width: 100vw;
|
||||
|
||||
.required {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.input-label {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,100 +0,0 @@
|
||||
|
||||
.customer-select {
|
||||
|
||||
label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
|
||||
.search-bar {
|
||||
display: flex;
|
||||
padding: 15px 15px 5px 15px;
|
||||
|
||||
.search-icon {
|
||||
color: $ls-color-gray;
|
||||
font-size: 14px;
|
||||
font-weight: 900;
|
||||
margin: 4px 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.no-data-label {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
color: $ls-color-gray;
|
||||
padding: 20px 20px;
|
||||
|
||||
label {
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
overflow: auto;
|
||||
max-height: 173px;
|
||||
min-height: 173px;
|
||||
|
||||
.list-item {
|
||||
display: flex;
|
||||
padding: 10px 23px;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
background:$ls-color-gray;
|
||||
border-radius: 50%;
|
||||
margin: 1px 21px 0 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.name {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.title {
|
||||
font-size: 16px;
|
||||
font-family: Poppins;
|
||||
margin: 0 0 0 0;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
font-family: Poppins;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
color: $ls-color-gray--dark;
|
||||
letter-spacing: 0.5px;
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.list-item:last-child {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.list-item:hover {
|
||||
background: $ls-color-gray--very-light;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
6
resources/assets/sass/components/forms.scss
vendored
6
resources/assets/sass/components/forms.scss
vendored
@ -1,6 +0,0 @@
|
||||
.form-control:focus {
|
||||
border-color: #ffde00;
|
||||
outline: 0;
|
||||
-webkit-box-shadow: 0 0 0 0.2rem rgba(0, 125, 204, 0.25);
|
||||
box-shadow: 0 0 0 0.2rem #ffde0029
|
||||
}
|
||||
68
resources/assets/sass/components/hamburgers.scss
vendored
68
resources/assets/sass/components/hamburgers.scss
vendored
@ -1,68 +0,0 @@
|
||||
.hamburger {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
transition-property: opacity, filter;
|
||||
transition-duration: 0.15s;
|
||||
transition-timing-function: linear;
|
||||
font: inherit;
|
||||
color: inherit;
|
||||
text-transform: none;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.hamburger-box {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.hamburger-inner {
|
||||
display: block;
|
||||
top: 50%;
|
||||
left: 4.5px;
|
||||
right: 4.5px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
.hamburger-inner,
|
||||
.hamburger-inner::before,
|
||||
.hamburger-inner::after {
|
||||
height: 2px;
|
||||
background-color: $header-buttons-font-color;
|
||||
border-radius: 2px;
|
||||
position: absolute;
|
||||
transition-property: transform;
|
||||
transition-duration: 0.15s;
|
||||
transition-timing-function: ease;
|
||||
}
|
||||
|
||||
.hamburger-inner::before,
|
||||
.hamburger-inner::after {
|
||||
content: "";
|
||||
display: block;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.hamburger-inner::before {
|
||||
top: -5px;
|
||||
}
|
||||
|
||||
.hamburger-inner::after {
|
||||
bottom: -5px;
|
||||
}
|
||||
|
||||
.hamburger--arrowturn.is-active .hamburger-inner {
|
||||
transform: rotate(-180deg);
|
||||
}
|
||||
|
||||
.hamburger--arrowturn.is-active .hamburger-inner::before {
|
||||
transform: translate3d(3px, 1px, 0) rotate(45deg) scale(0.7, 1);
|
||||
}
|
||||
|
||||
.hamburger--arrowturn.is-active .hamburger-inner::after {
|
||||
transform: translate3d(3px, -1px, 0) rotate(-45deg) scale(0.7, 1);
|
||||
}
|
||||
52
resources/assets/sass/components/item-modal.scss
vendored
52
resources/assets/sass/components/item-modal.scss
vendored
@ -1,52 +0,0 @@
|
||||
.base-modal .modal-body {
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
.item-modal {
|
||||
|
||||
.card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
.col-form-label {
|
||||
text-align: end;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.required {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
color: $ls-color-red;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.base-modal .item-modal .input-label{
|
||||
|
||||
.item-modal {
|
||||
width: 100vw;
|
||||
|
||||
.input-label {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.required {
|
||||
position: absolute;
|
||||
right: auto;
|
||||
margin-left: 5px;
|
||||
color: #FB7178;
|
||||
}
|
||||
|
||||
text-align: left;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,65 +0,0 @@
|
||||
.item-select {
|
||||
|
||||
.main-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
padding: 15px 15px 0 15px;
|
||||
|
||||
.search-bar {
|
||||
display: flex;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.no-data-label {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
color: $ls-color-gray;
|
||||
padding: 20px 20px;
|
||||
|
||||
label {
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
overflow: auto;
|
||||
|
||||
.list-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 16px 23px;
|
||||
max-height: 56px;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
cursor: pointer;
|
||||
|
||||
.title {
|
||||
font-size: 16px;
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 16px;
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.list-item:last-child {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.list-item:hover {
|
||||
background: $ls-color-gray--very-light;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,44 +0,0 @@
|
||||
.item-unit-modal {
|
||||
|
||||
.card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
.input-label {
|
||||
text-align: end;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.required {
|
||||
position: absolute;
|
||||
// left: -10px;
|
||||
color: $ls-color-red;
|
||||
}
|
||||
|
||||
.compound-tax-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.base-modal {
|
||||
|
||||
.item-unit-modal {
|
||||
width: 100vw;
|
||||
|
||||
.input-label {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,44 +0,0 @@
|
||||
.mail-test-modal {
|
||||
|
||||
.card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
.input-label {
|
||||
text-align: end;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.required {
|
||||
position: absolute;
|
||||
margin-left: 4px;
|
||||
color: $ls-color-red;
|
||||
}
|
||||
|
||||
.compound-tax-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.base-modal {
|
||||
|
||||
.mail-test-modal {
|
||||
width: 100vw;
|
||||
|
||||
.input-label {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,3 +1,5 @@
|
||||
$pace-loader-color: #5851d8;
|
||||
|
||||
.pace {
|
||||
-webkit-pointer-events: none;
|
||||
pointer-events: none;
|
||||
@ -11,7 +13,7 @@
|
||||
}
|
||||
|
||||
.pace .pace-progress {
|
||||
background: darken($pace-loader-color,10%);
|
||||
background: darken($pace-loader-color, 10%);
|
||||
position: fixed;
|
||||
z-index: 2000;
|
||||
top: 0;
|
||||
@ -27,7 +29,7 @@
|
||||
width: 100px;
|
||||
height: 100%;
|
||||
box-shadow: 0 0 10px $pace-loader-color, 0 0 5px $pace-loader-color;
|
||||
opacity: 1.0;
|
||||
opacity: 1;
|
||||
-webkit-transform: rotate(3deg) translate(0px, -4px);
|
||||
-moz-transform: rotate(3deg) translate(0px, -4px);
|
||||
-ms-transform: rotate(3deg) translate(0px, -4px);
|
||||
@ -55,26 +57,56 @@
|
||||
}
|
||||
|
||||
@-webkit-keyframes pace-spinner {
|
||||
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
|
||||
100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-keyframes pace-spinner {
|
||||
0% { -moz-transform: rotate(0deg); transform: rotate(0deg); }
|
||||
100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-moz-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-o-keyframes pace-spinner {
|
||||
0% { -o-transform: rotate(0deg); transform: rotate(0deg); }
|
||||
100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
|
||||
0% {
|
||||
-o-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-o-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-ms-keyframes pace-spinner {
|
||||
0% { -ms-transform: rotate(0deg); transform: rotate(0deg); }
|
||||
100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }
|
||||
0% {
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-ms-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes pace-spinner {
|
||||
0% { transform: rotate(0deg); transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); transform: rotate(360deg); }
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,44 +0,0 @@
|
||||
.payment-modes-modal {
|
||||
|
||||
.card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
.input-label {
|
||||
text-align: end;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.required {
|
||||
position: absolute;
|
||||
// left: -10px;
|
||||
color: $ls-color-red;
|
||||
}
|
||||
|
||||
.compound-tax-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.base-modal {
|
||||
|
||||
.payment-modes-modal-modal {
|
||||
width: 100vw;
|
||||
|
||||
.input-label {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
391
resources/assets/sass/components/tables.scss
vendored
391
resources/assets/sass/components/tables.scss
vendored
@ -1,391 +0,0 @@
|
||||
.table {
|
||||
|
||||
th,
|
||||
td {
|
||||
color: $ls-color-black;
|
||||
font-weight: 300;
|
||||
border-top: none;
|
||||
font-size: 15px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
td {
|
||||
border-right: 0;
|
||||
border-left: 0;
|
||||
// cursor: pointer;
|
||||
}
|
||||
|
||||
th {
|
||||
text-transform: uppercase;
|
||||
white-space: nowrap;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
position: relative;
|
||||
color: $ls-color-black--light;
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
|
||||
.table__actions {
|
||||
display: flex;
|
||||
// opacity: 0;
|
||||
|
||||
.btn {
|
||||
padding: 2px 0.5rem;
|
||||
}
|
||||
|
||||
a:not(:last-child) {
|
||||
border-right: 1px solid #d9d9d9;
|
||||
margin-right: 8px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
thead th {
|
||||
border: 0;
|
||||
position: relative;
|
||||
top: 25px;
|
||||
}
|
||||
|
||||
.table-component__table__body {
|
||||
position: relative;
|
||||
tr:first-child td {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
tr {
|
||||
border-radius: 10px;
|
||||
transition: all ease-in-out 0.2s;
|
||||
}
|
||||
|
||||
tr:hover {
|
||||
box-shadow: 0px 5px 15px 2px rgba(0, 0, 0, 0.03);
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 15px;
|
||||
padding: 25px 15px;
|
||||
height: 80px;
|
||||
background: #ffffff;
|
||||
|
||||
&:first-child {
|
||||
border-top-left-radius: 10px;
|
||||
border-bottom-left-radius: 10px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
td.primary {
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.action-dropdown {
|
||||
|
||||
.dropdown-container {
|
||||
margin: 10px 5px 0 0;
|
||||
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
justify-content:space-between;
|
||||
color: #040405;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-body .table {
|
||||
margin-top: -10px;
|
||||
|
||||
th {
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Vue Table
|
||||
|
||||
.table-component {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
margin-top: -25px;
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
.table-component__filter {
|
||||
align-self: flex-end;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.table-component__filter__field {
|
||||
padding: 0.15em 1.25em 0.15em 0.75em;
|
||||
border: solid 1px #e0e0e0;
|
||||
font-size: 15px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.table-component__filter__clear {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 2em;
|
||||
color: #007593;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.table-component__filter__field:focus {
|
||||
outline: 0;
|
||||
border-color: $ls-color-primary;
|
||||
}
|
||||
|
||||
.table-component__table-wrapper {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.table-component__table {
|
||||
min-width: 100%;
|
||||
border-collapse: separate;
|
||||
table-layout: auto;
|
||||
margin-bottom: 0;
|
||||
border-spacing: 0 15px;
|
||||
}
|
||||
|
||||
.table-component__table__caption {
|
||||
position: absolute;
|
||||
top: auto;
|
||||
left: -10000px;
|
||||
overflow: hidden;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
.table-component__table th,
|
||||
.table-component__table td {
|
||||
padding: 0.75em 1.25em;
|
||||
vertical-align: top;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.table-component__message {
|
||||
color: #999;
|
||||
text-align: center;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.table-component__th--sort,
|
||||
.table-component__th--sort-asc,
|
||||
.table-component__th--sort-desc {
|
||||
// text-decoration: underline;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
|
||||
}
|
||||
|
||||
.table-component__th--sort-asc:after,
|
||||
.table-component__th--sort-desc:after {
|
||||
position: absolute;
|
||||
left: 0.25em;
|
||||
display: inline-block;
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.table-component__th--sort-asc:after {
|
||||
content: "↑";
|
||||
}
|
||||
|
||||
.table-component__th--sort-desc:after {
|
||||
content: "↓";
|
||||
}
|
||||
|
||||
|
||||
// Pagination
|
||||
.table-component .pagination {
|
||||
justify-content: flex-end !important;
|
||||
margin-top: 10px;
|
||||
|
||||
.page-item {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.page-item.active .page-link {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
a i {
|
||||
display: block;
|
||||
padding: 0.5rem 0.75rem;
|
||||
margin-left: -1px;
|
||||
line-height: 1.25;
|
||||
background-color: #fff;
|
||||
border: 1px solid #dee2e6;
|
||||
font-style: normal;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
a.disabled i {
|
||||
color: #d9d9d9;
|
||||
pointer-events: none;
|
||||
cursor: auto;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
table.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.table-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
list-style: none;
|
||||
border-bottom: 2px solid $ls-color-gray--light;
|
||||
height: 40px;
|
||||
position: relative;
|
||||
|
||||
.table-actions-button {
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
color: $ls-color-primary--light;
|
||||
user-select: none;
|
||||
|
||||
&::after {
|
||||
vertical-align: 0.1em;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-group.active {
|
||||
|
||||
.dropdown-container {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.table-stats {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.selectall {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 47px;
|
||||
left: 35px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.table-component td > span:first-child {
|
||||
background: $ls-color-gray--light;
|
||||
color: $ls-color-secondary;
|
||||
display: none;
|
||||
font-size: 10px;
|
||||
font-weight: bold;
|
||||
padding: 5px;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
text-transform: uppercase;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.select-all-label {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media(max-width: $small-breakpoint) {
|
||||
.select-all-label {
|
||||
display: inline !important;
|
||||
color: $ls-color-secondary;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.selectall {
|
||||
top: 20px;
|
||||
}
|
||||
|
||||
.table-component {
|
||||
|
||||
.dropdown-group {
|
||||
position: absolute;
|
||||
visibility: visible;
|
||||
top: 15px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
thead {
|
||||
left: -9999px;
|
||||
position: absolute;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
tr {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 50px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
td {
|
||||
margin: 0 -1px -1px 0;
|
||||
padding-top: 40px !important;
|
||||
position: relative;
|
||||
width: 50%;
|
||||
left: 0;
|
||||
border: 1px solid $ls-color-gray--light !important;
|
||||
|
||||
&:not(:first-child) {
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex: 1 100%;
|
||||
height: 50px;
|
||||
padding-top: 25px !important;
|
||||
align-items: center;
|
||||
border-bottom-left-radius: 0px !important;
|
||||
border-top-left-radius: 5px !important;
|
||||
border-top-right-radius: 5px !important;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
position: unset;
|
||||
visibility: hidden;
|
||||
height: 0px !important;
|
||||
padding: 0px !important;
|
||||
}
|
||||
|
||||
&:nth-last-child(3) {
|
||||
border-bottom-left-radius: 5px !important;
|
||||
}
|
||||
&:nth-last-child(2) {
|
||||
border-bottom-right-radius: 5px !important;
|
||||
}
|
||||
}
|
||||
|
||||
td > span:first-child {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropdown-container {
|
||||
right: 0;
|
||||
left: 120px;
|
||||
}
|
||||
}
|
||||
}
|
||||
194
resources/assets/sass/components/tabs.scss
vendored
194
resources/assets/sass/components/tabs.scss
vendored
@ -1,194 +0,0 @@
|
||||
// tabs.scss - Tabs & Accordians
|
||||
|
||||
.tabs .tab-content {
|
||||
margin-top: 1.2rem;
|
||||
}
|
||||
|
||||
.tabs-default {
|
||||
|
||||
.nav-link.active {
|
||||
background-color: $ls-color-secondary;
|
||||
color: $ls-color-primary;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
background-color: $ls-color-secondary;
|
||||
color: $ls-color-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-link:hover {
|
||||
border: 1px solid $ls-color-secondary;
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid $ls-color-secondary;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-primary {
|
||||
|
||||
.nav-link.active {
|
||||
background-color: $brand-primary;
|
||||
color: $white;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
background-color: $brand-primary;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-link:hover {
|
||||
border: 1px solid $brand-primary;
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid $brand-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-simple {
|
||||
|
||||
.nav-link {
|
||||
border: 0;
|
||||
background-color: transparent;
|
||||
border-radius: 0;
|
||||
color: $ls-color-black--light;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
border-bottom: 3px solid $ls-color-primary;
|
||||
border-color: lighten($ls-color-primary, 30%);
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: transparent;
|
||||
border-bottom: 3px solid $ls-color-primary;
|
||||
color: $ls-color-black;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
border-bottom: 3px solid $ls-color-primary;
|
||||
border-color: $ls-color-primary;
|
||||
color: $ls-color-black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.tabs-vertical {
|
||||
|
||||
@include clearfix;
|
||||
|
||||
.nav-tabs {
|
||||
float: left;
|
||||
border-right: 1px solid $ls-color-secondary;
|
||||
border-bottom: none;
|
||||
overflow: hidden;
|
||||
margin-right: 1.2rem;
|
||||
display: block;
|
||||
|
||||
li {
|
||||
float: none;
|
||||
margin-right: -1px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
li a {
|
||||
margin-right: 0;
|
||||
border-radius: 4px 0 0 4px;
|
||||
margin-bottom: .2rem;
|
||||
background-color: $white;
|
||||
border-color: transparent;
|
||||
border-right-color: $ls-color-secondary;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
background-color: $white;
|
||||
border-color: $ls-color-secondary;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: $ls-color-secondary;
|
||||
color: $ls-color-primary;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
background-color: $ls-color-secondary;
|
||||
color: $ls-color-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.tabs-primary .nav-tabs {
|
||||
border-right: 1px solid $brand-primary;
|
||||
|
||||
li a {
|
||||
border-right-color: $brand-primary;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
background-color: $white;
|
||||
border-color: $brand-primary;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: $brand-primary;
|
||||
color: $white;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
background-color: $brand-primary;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.tabs-simple .nav-tabs {
|
||||
border-right: 1px solid #ddd;
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
li a {
|
||||
background: transparent;
|
||||
border-right: 3px solid transparent;
|
||||
border-radius: 0;
|
||||
|
||||
&.active {
|
||||
border-bottom: 0;
|
||||
color: $ls-color-black;
|
||||
border-right: 3px solid $ls-color-primary;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
background-color: transparent;
|
||||
border-right: 3px solid $ls-color-primary;
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.panel {
|
||||
background-color: #fff;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px;
|
||||
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
|
||||
|
||||
.panel-heading a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
display: block;
|
||||
padding: 1rem 1.25rem;
|
||||
}
|
||||
|
||||
.panel-content {
|
||||
padding: 0 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
.panel-group .panel + .panel {
|
||||
margin-top: 10px;
|
||||
}
|
||||
70
resources/assets/sass/components/tax-select.scss
vendored
70
resources/assets/sass/components/tax-select.scss
vendored
@ -1,70 +0,0 @@
|
||||
.tax-select {
|
||||
|
||||
.main-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
padding: 15px 15px 0 15px;
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
display: flex;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.no-data-label {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
color: $ls-color-gray;
|
||||
padding: 20px 20px;
|
||||
|
||||
label {
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
overflow: auto;
|
||||
max-height: 112px;
|
||||
|
||||
.list-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 16px;
|
||||
max-height: 56px;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
cursor: pointer;
|
||||
|
||||
label {
|
||||
font-size: 16px;
|
||||
margin: 0;
|
||||
font-weight: normal;
|
||||
color: #262630;
|
||||
line-height: 1.2;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.list-item:last-child {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.list-item:hover {
|
||||
background: $ls-color-gray--very-light;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.item-disabled {
|
||||
background: $ls-color-gray--very-light;
|
||||
cursor: not-allowed !important;
|
||||
opacity: 0.5;
|
||||
z-index: -10;
|
||||
pointer-events: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,44 +0,0 @@
|
||||
.tax-type-modal {
|
||||
|
||||
.card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
.input-label {
|
||||
text-align: end;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.required {
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
color: $ls-color-red;
|
||||
}
|
||||
|
||||
.compound-tax-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.base-modal {
|
||||
|
||||
.tax-type-modal {
|
||||
width: 100vw;
|
||||
|
||||
.input-label {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,57 +0,0 @@
|
||||
.template-modal {
|
||||
|
||||
.template-container {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
overflow-x: auto;
|
||||
flex-wrap: wrap;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.template-img {
|
||||
margin: 12px;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
.selected-template {
|
||||
border: 1px solid $ls-color-primary;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.check-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
color: $ls-color-primary;
|
||||
top: -6px;
|
||||
right: -5px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 20px 20px;
|
||||
|
||||
.btn-crater {
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $x-small-breakpoint) {
|
||||
|
||||
.base-modal {
|
||||
|
||||
.template-modal {
|
||||
width: 100vw;
|
||||
|
||||
.template-container {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
133
resources/assets/sass/components/tooltips.scss
vendored
133
resources/assets/sass/components/tooltips.scss
vendored
@ -1,133 +0,0 @@
|
||||
.tooltip {
|
||||
|
||||
display: block !important;
|
||||
z-index: 10000;
|
||||
|
||||
&.popover {
|
||||
$color: $ls-color-secondary;
|
||||
|
||||
.popover-inner {
|
||||
background: $color;
|
||||
color: white;
|
||||
padding: 24px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 5px 30px rgba(black, 0.1);
|
||||
}
|
||||
|
||||
.popover-arrow {
|
||||
border-color: $color;
|
||||
}
|
||||
}
|
||||
|
||||
&.tooltip-loading {
|
||||
.tooltip-inner {
|
||||
color: $ls-color-primary;
|
||||
}
|
||||
}
|
||||
|
||||
&.info {
|
||||
$color: rgba($ls-color-light-blue, 0.9);
|
||||
|
||||
.tooltip-inner {
|
||||
background: $color;
|
||||
color: white;
|
||||
padding: 24px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 5px 30px rgba(black, 0.1);
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
.tooltip-arrow {
|
||||
border-color: $color;
|
||||
}
|
||||
}
|
||||
|
||||
.tooltip-inner {
|
||||
background: $ls-color-secondary;
|
||||
color: white;
|
||||
border-radius: 16px;
|
||||
padding: 4px 12px;
|
||||
}
|
||||
|
||||
.tooltip-arrow {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-style: solid;
|
||||
position: absolute;
|
||||
margin: 5px;
|
||||
border-color: $ls-color-secondary;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
&[x-placement^="top"] {
|
||||
margin-bottom: 5px;
|
||||
|
||||
.tooltip-arrow {
|
||||
border-width: 5px 5px 0 5px;
|
||||
border-left-color: transparent !important;
|
||||
border-right-color: transparent !important;
|
||||
border-bottom-color: transparent !important;
|
||||
bottom: -5px;
|
||||
left: calc(50% - 5px);
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&[x-placement^="bottom"] {
|
||||
margin-top: 5px;
|
||||
|
||||
.tooltip-arrow {
|
||||
border-width: 0 5px 5px 5px;
|
||||
border-left-color: transparent !important;
|
||||
border-right-color: transparent !important;
|
||||
border-top-color: transparent !important;
|
||||
top: -5px;
|
||||
left: calc(50% - 5px);
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&[x-placement^="right"] {
|
||||
margin-left: 5px;
|
||||
|
||||
.tooltip-arrow {
|
||||
border-width: 5px 5px 5px 0;
|
||||
border-left-color: transparent !important;
|
||||
border-top-color: transparent !important;
|
||||
border-bottom-color: transparent !important;
|
||||
left: -5px;
|
||||
top: calc(50% - 5px);
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&[x-placement^="left"] {
|
||||
margin-right: 5px;
|
||||
|
||||
.tooltip-arrow {
|
||||
border-width: 5px 0 5px 5px;
|
||||
border-top-color: transparent !important;
|
||||
border-right-color: transparent !important;
|
||||
border-bottom-color: transparent !important;
|
||||
right: -5px;
|
||||
top: calc(50% - 5px);
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&[aria-hidden="true"] {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
transition: opacity 0.15s, visibility 0.15s;
|
||||
}
|
||||
|
||||
&[aria-hidden="false"] {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transition: opacity 0.15s;
|
||||
}
|
||||
}
|
||||
@ -1,7 +0,0 @@
|
||||
.fade-enter-active, .fade-leave-active {
|
||||
transition: opacity .2s
|
||||
}
|
||||
|
||||
.fade-enter, .fade-leave-active {
|
||||
opacity: 0
|
||||
}
|
||||
47
resources/assets/sass/components/vue-color.scss
vendored
47
resources/assets/sass/components/vue-color.scss
vendored
@ -1,47 +0,0 @@
|
||||
// MATERIAL COLOR PICKER
|
||||
.vc-material {
|
||||
width: 150px !important;
|
||||
height: 130px !important;
|
||||
}
|
||||
|
||||
.color-pickers-demo {
|
||||
position: relative;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
// Demo Div
|
||||
.demo-div {
|
||||
position: absolute;
|
||||
height: 15px;
|
||||
width: 190px;
|
||||
text-indent: -999px;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
top: -10px;
|
||||
background: #194D33;
|
||||
color: white;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
// Photosop
|
||||
@media only screen and (max-width: $small-breakpoint ) {
|
||||
.vc-photoshop {
|
||||
width: 100% !important;
|
||||
}
|
||||
.vc-chrome {
|
||||
width: 100% !important;
|
||||
}
|
||||
.vc-compact {
|
||||
width: 100% !important;
|
||||
}
|
||||
.vc-slider {
|
||||
width: 100% !important;
|
||||
}
|
||||
.vc-swatches {
|
||||
width: 100% !important;
|
||||
}
|
||||
.vc-sketch {
|
||||
width: 268px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,19 +0,0 @@
|
||||
.vdp-datepicker__calendar .cell {
|
||||
|
||||
&:not(.blank):not(.disabled)
|
||||
{
|
||||
&.day:hover,
|
||||
&.month:hover,
|
||||
&.year:hover {
|
||||
border: 1px solid $ls-color-primary !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.selected {
|
||||
background: $ls-color-primary !important;
|
||||
}
|
||||
|
||||
&.highlighted {
|
||||
background:lighten($ls-color-primary,25%) !important;
|
||||
}
|
||||
}
|
||||
183
resources/assets/sass/components/vue-dropdown.scss
vendored
183
resources/assets/sass/components/vue-dropdown.scss
vendored
@ -1,183 +0,0 @@
|
||||
.dropdown-group {
|
||||
position: relative;
|
||||
|
||||
&.active .dropdown-container {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropdown-container {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
display: none;
|
||||
float: left;
|
||||
min-width: 10rem;
|
||||
padding: .5rem;
|
||||
margin: .125rem 0 0 .125rem;
|
||||
font-size: 1rem;
|
||||
color: $dropdown-link-color;
|
||||
text-align: left;
|
||||
list-style: none;
|
||||
background-color: $dropdown-bg;
|
||||
background-clip: padding-box;
|
||||
border-radius: .25rem;
|
||||
box-shadow: $shadow !important;
|
||||
border: none;
|
||||
|
||||
&.align-right {
|
||||
right: 0;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
.dropdown-group {
|
||||
display: block;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.dropdown-group-item .dropdown-item {
|
||||
display: block;
|
||||
font-size: 15px;
|
||||
padding: 8px 12px;
|
||||
font-weight: 300;
|
||||
color: $ls-color-black;
|
||||
background-color: transparent;
|
||||
border-radius: 5px;
|
||||
|
||||
&:hover {
|
||||
background-color: $ls-color-gray--light;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: $ls-color-primary;
|
||||
}
|
||||
|
||||
i {
|
||||
color: $ls-color-gray--dark;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-activator {
|
||||
position: relative;
|
||||
|
||||
&::after {
|
||||
content: none !important;
|
||||
}
|
||||
|
||||
&::before {
|
||||
border-color: $dropdown-link-color transparent transparent;
|
||||
border-style: solid;
|
||||
border-width: 5px 4px 0;
|
||||
content: '';
|
||||
display: block;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 18px;
|
||||
transition: all .2s ease-in-out;
|
||||
width: 0;
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-group.active .dropdown-activator {
|
||||
a {
|
||||
color: $dropdown-header-color;
|
||||
}
|
||||
|
||||
&::before {
|
||||
transform: rotate(-90deg);
|
||||
border-color: $ls-color-primary transparent transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-container {
|
||||
display: block;
|
||||
margin: 0;
|
||||
left: 100%;
|
||||
top: 0;
|
||||
position: absolute;
|
||||
margin: .125rem .125rem 0;
|
||||
|
||||
&.align-right {
|
||||
right: 100%;
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdon-group-item {
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-item-divider {
|
||||
border-top: 1px solid $white;
|
||||
height: 1px;
|
||||
margin: .5rem 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-group.dropdown-light {
|
||||
|
||||
.dropdown-container {
|
||||
color: $ls-color-black;
|
||||
background-color: $white;
|
||||
border: 1px solid lighten($ls-color-gray--dark, 10%);
|
||||
|
||||
.dropdown-group-item a {
|
||||
color: $ls-color-black;
|
||||
}
|
||||
|
||||
.dropdown-group-item a.active {
|
||||
color: $ls-color-black;
|
||||
background-color: lighten($ls-color-gray, 7%);
|
||||
}
|
||||
|
||||
.dropdown-group-item a:hover {
|
||||
background-color: lighten($ls-color-gray, 7%);
|
||||
}
|
||||
|
||||
.dropdown-activator::before {
|
||||
border-color: $ls-color-gray--dark transparent transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-container .dropdown-group.active .dropdown-activator {
|
||||
a {
|
||||
color: $ls-color-black;
|
||||
background-color: lighten($ls-color-gray, 7%);
|
||||
}
|
||||
|
||||
&::before {
|
||||
border-color: $ls-color-gray--dark transparent transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-item-divider {
|
||||
border-top: 1px solid $ls-color-black;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
|
||||
.dropdown-item-icon {
|
||||
width: 20px;
|
||||
height: 14px;
|
||||
margin-right: 6px;
|
||||
color: $ls-color-secondary;
|
||||
}
|
||||
}
|
||||
|
||||
.action {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
z-index:1;
|
||||
|
||||
.action-btn {
|
||||
color: $ls-color-primary;
|
||||
background: transparent;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
@ -1,504 +0,0 @@
|
||||
fieldset[disabled] .multiselect {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.in-valid {
|
||||
border: 1px solid $ls-color-red !important;
|
||||
}
|
||||
|
||||
.multiselect {
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
.multiselect__spinner {
|
||||
position: absolute;
|
||||
right: 1px;
|
||||
top: 1px;
|
||||
width: 48px;
|
||||
height: 35px;
|
||||
background: #fff;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.multiselect__spinner:before,
|
||||
.multiselect__spinner:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin: -8px 0 0 -8px;
|
||||
z-index: 5;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 100%;
|
||||
border-color: #41b883 transparent transparent;
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
box-shadow: 0 0 0 1px transparent;
|
||||
}
|
||||
|
||||
.multiselect__spinner:before {
|
||||
animation: spinning 2.4s cubic-bezier(0.41, 0.26, 0.2, 0.62);
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.multiselect__spinner:after {
|
||||
animation: spinning 2.4s cubic-bezier(0.51, 0.09, 0.21, 0.8);
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.multiselect__loading-enter-active,
|
||||
.multiselect__loading-leave-active {
|
||||
transition: opacity 0.4s ease-in-out;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.multiselect__loading-enter,
|
||||
.multiselect__loading-leave-active {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.multiselect,
|
||||
.multiselect__input,
|
||||
.multiselect__single {
|
||||
font-family: inherit;
|
||||
font-size: 14px;
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
.multiselect {
|
||||
box-sizing: content-box;
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
min-height: 40px;
|
||||
text-align: left;
|
||||
color: #35495e;
|
||||
}
|
||||
|
||||
.multiselect * {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.multiselect:focus {
|
||||
border: 1px solid #817ae3 !important;
|
||||
}
|
||||
|
||||
.multiselect--disabled {
|
||||
pointer-events: none;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.multiselect--active {
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
.multiselect--active:not(.multiselect--above) .multiselect__current,
|
||||
.multiselect--active:not(.multiselect--above) .multiselect__input,
|
||||
.multiselect--active:not(.multiselect--above) .multiselect__tags {
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.multiselect--active .multiselect__select {
|
||||
transform: rotateZ(180deg);
|
||||
}
|
||||
.multiselect--above.multiselect--active .multiselect__current,
|
||||
.multiselect--above.multiselect--active .multiselect__input,
|
||||
.multiselect--above.multiselect--active .multiselect__tags {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
|
||||
.multiselect__input,
|
||||
.multiselect__single {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
min-height: 20px;
|
||||
line-height: 20px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
background: #fff;
|
||||
padding: 0 0 0 5px;
|
||||
width: calc(100%);
|
||||
transition: border 0.1s ease;
|
||||
box-sizing: border-box;
|
||||
// margin-bottom: 8px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.multiselect__input::placeholder {
|
||||
color: $ls-color-gray;
|
||||
}
|
||||
|
||||
.multiselect__tag ~ .multiselect__input,
|
||||
.multiselect__tag ~ .multiselect__single {
|
||||
width: auto;
|
||||
}
|
||||
.multiselect__input:hover,
|
||||
.multiselect__single:hover {
|
||||
border-color: #cfcfcf;
|
||||
}
|
||||
.multiselect__input:focus,
|
||||
.multiselect__single:focus {
|
||||
border-color: #a8a8a8;
|
||||
outline: none;
|
||||
}
|
||||
.multiselect__single {
|
||||
padding-left: 5px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.multiselect__tags-wrap {
|
||||
display: inline;
|
||||
}
|
||||
.multiselect__tags {
|
||||
min-height: 40px;
|
||||
display: block;
|
||||
padding: 8px 40px 0 8px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
background: #fff;
|
||||
font-size: 14px;
|
||||
}
|
||||
.multiselect__tag {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
padding: 4px 26px 4px 10px;
|
||||
border-radius: 5px;
|
||||
margin-right: 10px;
|
||||
color: #fff;
|
||||
line-height: 1;
|
||||
background: #41b883;
|
||||
margin-bottom: 5px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
max-width: 100%;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.multiselect__tag-icon {
|
||||
cursor: pointer;
|
||||
margin-left: 7px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
font-weight: 700;
|
||||
font-style: initial;
|
||||
width: 22px;
|
||||
text-align: center;
|
||||
line-height: 22px;
|
||||
transition: all 0.2s ease;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.multiselect__tag-icon:after {
|
||||
content: "×";
|
||||
color: #266d4d;
|
||||
font-size: 14px;
|
||||
}
|
||||
.multiselect__tag-icon:focus,
|
||||
.multiselect__tag-icon:hover {
|
||||
background: #369a6e;
|
||||
}
|
||||
.multiselect__tag-icon:focus:after,
|
||||
.multiselect__tag-icon:hover:after {
|
||||
color: white;
|
||||
}
|
||||
.multiselect__current {
|
||||
line-height: 16px;
|
||||
min-height: 40px;
|
||||
box-sizing: border-box;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
padding: 8px 12px 0;
|
||||
padding-right: 30px;
|
||||
white-space: nowrap;
|
||||
margin: 0;
|
||||
text-decoration: none;
|
||||
border-radius: 5px;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
cursor: pointer;
|
||||
}
|
||||
.multiselect__select {
|
||||
line-height: 20px;
|
||||
display: block;
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
width: 30px;
|
||||
height: 40px;
|
||||
right: 1px;
|
||||
top: 1px;
|
||||
padding: 4px 8px;
|
||||
margin: 0;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
.multiselect__select:before {
|
||||
position: relative;
|
||||
right: 0;
|
||||
top: 65%;
|
||||
color: $ls-color-gray--dark;
|
||||
margin-top: 4px;
|
||||
border-style: solid;
|
||||
border-width: 5px 5px 0 5px;
|
||||
border-color: $ls-color-gray--dark transparent transparent transparent;
|
||||
content: "";
|
||||
}
|
||||
.multiselect__placeholder {
|
||||
color: $ls-color-gray;
|
||||
display: inline-block;
|
||||
margin-bottom: 10px;
|
||||
padding-top: 2px;
|
||||
}
|
||||
.multiselect--active .multiselect__placeholder {
|
||||
display: none;
|
||||
}
|
||||
.multiselect__content-wrapper {
|
||||
position: absolute;
|
||||
display: block;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
max-height: 240px;
|
||||
overflow: auto;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
border-top: none;
|
||||
border-bottom-left-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
z-index: 50;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
.multiselect__content {
|
||||
list-style: none;
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
min-width: 100%;
|
||||
vertical-align: top;
|
||||
}
|
||||
.multiselect--above .multiselect__content-wrapper {
|
||||
bottom: 100%;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom: none;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
}
|
||||
.multiselect__content::webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
.multiselect__element {
|
||||
display: block;
|
||||
}
|
||||
.multiselect__option {
|
||||
display: block;
|
||||
padding: 12px;
|
||||
min-height: 40px;
|
||||
line-height: 16px;
|
||||
text-decoration: none;
|
||||
text-transform: none;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.multiselect__option:after {
|
||||
top: 0;
|
||||
right: 0;
|
||||
position: absolute;
|
||||
line-height: 40px;
|
||||
padding-right: 12px;
|
||||
padding-left: 20px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.multiselect__option--highlight {
|
||||
background: #41b883;
|
||||
outline: none;
|
||||
color: white;
|
||||
}
|
||||
.multiselect__option--highlight:after {
|
||||
content: attr(data-select);
|
||||
background: #41b883;
|
||||
color: white;
|
||||
}
|
||||
.multiselect__option--selected {
|
||||
background: #f3f3f3;
|
||||
color: #35495e;
|
||||
font-weight: bold;
|
||||
}
|
||||
.multiselect__option--selected:after {
|
||||
content: attr(data-selected);
|
||||
color: silver;
|
||||
}
|
||||
.multiselect__option--selected.multiselect__option--highlight {
|
||||
background: #ff6a6a;
|
||||
color: #fff;
|
||||
}
|
||||
.multiselect__option--selected.multiselect__option--highlight:after {
|
||||
background: #ff6a6a;
|
||||
content: attr(data-deselect);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.multiselect--disabled .multiselect__current,
|
||||
.multiselect--disabled .multiselect__select {
|
||||
background: $ls-color-gray--light;
|
||||
color: $ls-color-gray;
|
||||
}
|
||||
|
||||
.multiselect--disabled .multiselect__tags {
|
||||
background: $ls-color-gray--light;
|
||||
color: $ls-color-gray;
|
||||
}
|
||||
|
||||
.multiselect--disabled .multiselect__input,
|
||||
.multiselect--disabled .multiselect__single {
|
||||
background: $ls-color-gray--light;
|
||||
color: $ls-color-gray;
|
||||
}
|
||||
|
||||
.multiselect__option--disabled {
|
||||
background: transparent !important;
|
||||
color: #dddddd !important;
|
||||
cursor: text;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.multiselect__option--group {
|
||||
background: #ededed;
|
||||
color: #35495e;
|
||||
}
|
||||
|
||||
.multiselect__option--group.multiselect__option--highlight {
|
||||
background: #35495e;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.multiselect__option--group.multiselect__option--highlight:after {
|
||||
background: #35495e;
|
||||
}
|
||||
|
||||
.multiselect__option--disabled.multiselect__option--highlight {
|
||||
background: #dedede;
|
||||
}
|
||||
|
||||
.multiselect__option--group-selected.multiselect__option--highlight {
|
||||
background: #ff6a6a;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.multiselect__option--group-selected.multiselect__option--highlight:after {
|
||||
background: #ff6a6a;
|
||||
content: attr(data-deselect);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.multiselect-enter-active,
|
||||
.multiselect-leave-active {
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.multiselect-enter,
|
||||
.multiselect-leave-active {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.multiselect__strong {
|
||||
margin-bottom: 8px;
|
||||
line-height: 20px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
*[dir="rtl"] .multiselect {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
*[dir="rtl"] .multiselect__select {
|
||||
right: auto;
|
||||
left: 1px;
|
||||
}
|
||||
|
||||
*[dir="rtl"] .multiselect__tags {
|
||||
padding: 8px 8px 0px 40px;
|
||||
}
|
||||
|
||||
*[dir="rtl"] .multiselect__content {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
*[dir="rtl"] .multiselect__option:after {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
*[dir="rtl"] .multiselect__clear {
|
||||
right: auto;
|
||||
left: 12px;
|
||||
}
|
||||
|
||||
*[dir="rtl"] .multiselect__spinner {
|
||||
right: auto;
|
||||
left: 1px;
|
||||
}
|
||||
|
||||
@keyframes spinning {
|
||||
from {
|
||||
transform: rotate(0);
|
||||
}
|
||||
to {
|
||||
transform: rotate(2turn);
|
||||
}
|
||||
}
|
||||
|
||||
.multiselect {
|
||||
|
||||
.multiselect__option--highlight {
|
||||
background: $ls-color-primary;
|
||||
color: $ls-color-black;
|
||||
font-weight: normal !important;
|
||||
|
||||
&.multiselect__option--selected {
|
||||
background: $ls-color-gray--light;
|
||||
color: $ls-color-black;
|
||||
font-size: 1rem;
|
||||
font-weight: normal !important;
|
||||
|
||||
&::after {
|
||||
background: $ls-color-black;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
&::after {
|
||||
background: $ls-color-black;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.multiselect__option--selected {
|
||||
font-weight: normal !important;
|
||||
background: $ls-color-gray--light;
|
||||
}
|
||||
|
||||
.multiselect__tags-wrap .multiselect__tag {
|
||||
background: $ls-color-primary;
|
||||
color: $ls-color-black;
|
||||
|
||||
.multiselect__tag-icon {
|
||||
&:hover {
|
||||
background: $ls-color-primary;
|
||||
}
|
||||
|
||||
&::after {
|
||||
color: $ls-color-black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.error {
|
||||
border: 1px solid $ls-color-red;
|
||||
border-radius: 5px;
|
||||
}
|
||||
}
|
||||
339
resources/assets/sass/components/vue-tabs.scss
vendored
339
resources/assets/sass/components/vue-tabs.scss
vendored
@ -1,339 +0,0 @@
|
||||
.vue-tabs-demo .card-body .default {
|
||||
|
||||
.tabs-component .tabs-component-tabs {
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
.suffix {
|
||||
background-color: #c03;
|
||||
color: #fff;
|
||||
margin-left: 0.35em;
|
||||
}
|
||||
|
||||
.prefix {
|
||||
background-color: #d1e8eb;
|
||||
color: #0c5174;
|
||||
margin-right: 0.35em;
|
||||
}
|
||||
|
||||
.prefix,
|
||||
.suffix {
|
||||
align-items: center;
|
||||
border-radius: 1.25rem;
|
||||
display: flex;
|
||||
font-size: 0.75rem;
|
||||
flex-shrink: 0;
|
||||
height: 1.25rem;
|
||||
justify-content: center;
|
||||
line-height: 1.25rem;
|
||||
min-width: 1.25rem;
|
||||
padding: 0 0.1em;
|
||||
}
|
||||
|
||||
.tabs-component {
|
||||
margin: 2em 0;
|
||||
}
|
||||
|
||||
.page-subtitle {
|
||||
font-size: 1.25rem;
|
||||
margin-bottom: 1em;
|
||||
padding-top: 0.25em;
|
||||
}
|
||||
}
|
||||
|
||||
.suffix {
|
||||
position: absolute;
|
||||
right: -0.725em;
|
||||
top: -0.725em;
|
||||
}
|
||||
|
||||
.tabs-component {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
|
||||
// Tabs Default
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-default {
|
||||
|
||||
.tabs-component-tabs {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.tabs-component-tab {
|
||||
border: none;
|
||||
background-color: none;
|
||||
border-radius: none;
|
||||
margin-right: 0.1rem !important;
|
||||
transform: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.tabs-component-tab {
|
||||
margin: 0px;
|
||||
border: 1px solid transparent;
|
||||
|
||||
a {
|
||||
padding: 0.75em 2rem !important;
|
||||
color: #333333;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #333333;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
a {
|
||||
color: #ffde00;
|
||||
}
|
||||
border: 1px solid #333;
|
||||
background: #333;
|
||||
color: #ffde00;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-tab:hover {
|
||||
border: 1px solid #333;
|
||||
}
|
||||
|
||||
.tabs-component-panels {
|
||||
border-top: 1px solid #333333 !important;
|
||||
border: none;
|
||||
position: relative;
|
||||
border-radius: 0;
|
||||
padding: 1em 0em !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Tabs Default Primary
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-default.primary {
|
||||
|
||||
.tabs-component-tab {
|
||||
|
||||
a {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
border: 1px solid #007dcc;
|
||||
background: #007dcc;
|
||||
color: #fff;
|
||||
}
|
||||
&.is-active a {
|
||||
color: #fff;
|
||||
}
|
||||
&:hover {
|
||||
border: 1px solid #007dcc;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-panels {
|
||||
border-top: 1px solid #007dcc !important;
|
||||
}
|
||||
}
|
||||
|
||||
// Tabs Vertical
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-vertical {
|
||||
display: flex !important;
|
||||
|
||||
.tabs-component-tabs {
|
||||
display: inline-block !important;
|
||||
border-right: 1px solid #333333 !important;
|
||||
border-radius: 0;
|
||||
padding: 0px;
|
||||
|
||||
.tabs-component-tab {
|
||||
border: none;
|
||||
background-color: none;
|
||||
border-radius: 4px 0 0 4px;
|
||||
margin-bottom: 0.2rem !important;
|
||||
transform: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.tabs-component-tab {
|
||||
margin: 0px;
|
||||
border: 1px solid transparent;
|
||||
border-right: 0;
|
||||
|
||||
a {
|
||||
padding: 0.75em 2rem !important;
|
||||
color: #333333;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #333333;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
border: 1px solid transparent;
|
||||
border-right: 0;
|
||||
background: #333333;
|
||||
}
|
||||
|
||||
&.is-active a {
|
||||
color: #ffde00;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-tab:hover {
|
||||
border: 1px solid #333333;
|
||||
border-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-panels {
|
||||
border: none;
|
||||
position: relative;
|
||||
border-radius: 0;
|
||||
padding: 0em 0em !important;
|
||||
padding-left: 2em !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Tabs Vertical Primary
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-vertical.primary .tabs-component-tabs {
|
||||
border-right: 1px solid #007dcc !important;
|
||||
|
||||
.tabs-component-tab {
|
||||
|
||||
&.is-active {
|
||||
a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
background: #007dcc;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-tab:hover {
|
||||
border: 1px solid #007dcc;
|
||||
border-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Tabs Simple
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-simple {
|
||||
|
||||
.tabs-component-tabs {
|
||||
padding: 0px;
|
||||
|
||||
.tabs-component-tab {
|
||||
border: none;
|
||||
background-color: none;
|
||||
border-radius: none;
|
||||
|
||||
transform: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.tabs-component-tab {
|
||||
margin: 0px;
|
||||
a {
|
||||
padding: 0.75em 2rem !important;
|
||||
color: #333333;
|
||||
}
|
||||
a:hover {
|
||||
color: #333333;
|
||||
outline: none;
|
||||
border-bottom: 3px solid #fff299;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
border-bottom: 3px solid #ffde00;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
&.is-active a:hover {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-panels {
|
||||
border-top: 1px solid #ddd !important;
|
||||
border: none;
|
||||
position: relative;
|
||||
border-radius: 0;
|
||||
padding: 1em 0em !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Tabs Simple Vertical
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-simple-vertical {
|
||||
display: flex !important;
|
||||
|
||||
.tabs-component-tabs {
|
||||
padding: 0px;
|
||||
display: inline-block !important;
|
||||
border-bottom: none;
|
||||
border-right: 1px solid #ddd !important;
|
||||
border-radius: 0;
|
||||
|
||||
.tabs-component-tab {
|
||||
border: none;
|
||||
background-color: none;
|
||||
border-radius: none;
|
||||
transform: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.tabs-component-tab {
|
||||
margin: 0px;
|
||||
|
||||
a {
|
||||
padding: 0.75em 2rem !important;
|
||||
color: #333333;
|
||||
border-right: 3px solid transparent;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
background-color: transparent;
|
||||
border-right: 3px solid #fff299;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
border-right: 3px solid #ffde00;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
&.is-active a:hover {
|
||||
border-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-panels {
|
||||
border: none;
|
||||
position: relative;
|
||||
border-radius: 0;
|
||||
padding: 0em 0em !important;
|
||||
padding-left: 2em !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
.tabs-component-tabs {
|
||||
border: none !important;
|
||||
}
|
||||
120
resources/assets/sass/crater.scss
vendored
120
resources/assets/sass/crater.scss
vendored
@ -1,116 +1,38 @@
|
||||
// Variables & Functions
|
||||
// Tailwind
|
||||
//----------------------------------
|
||||
|
||||
@import "../../../node_modules/bootstrap/scss/functions";
|
||||
@import "../../../node_modules/bootstrap/scss/variables";
|
||||
@import 'variables';
|
||||
@import 'tailwindcss/base';
|
||||
|
||||
@import 'tailwindcss/components';
|
||||
|
||||
@import 'tailwindcss/utilities';
|
||||
|
||||
// Plugins
|
||||
//----------------------------------
|
||||
|
||||
@import "../../../node_modules/bootstrap/scss/bootstrap";
|
||||
@import "../../../node_modules/toastr/toastr";
|
||||
|
||||
|
||||
// Skins
|
||||
//----------------------------------
|
||||
|
||||
@import 'skins/skin-crater';
|
||||
|
||||
|
||||
// Site Base
|
||||
//----------------------------------
|
||||
|
||||
@import 'base';
|
||||
|
||||
|
||||
// Layouts
|
||||
//----------------------------------
|
||||
|
||||
@import 'layouts/layout';
|
||||
@import 'layouts/crater-sidebar';
|
||||
|
||||
|
||||
// Partials
|
||||
//----------------------------------
|
||||
|
||||
@import 'partials/header';
|
||||
@import 'partials/sidebar';
|
||||
|
||||
@import '../../../node_modules/toastr/toastr';
|
||||
|
||||
// Base Components
|
||||
//----------------------------------
|
||||
|
||||
@import 'components/base/base-date-picker';
|
||||
@import 'components/base/base-input';
|
||||
@import 'components/base/base-button';
|
||||
@import 'components/base/base-popup';
|
||||
@import 'components/base/base-text-area';
|
||||
@import "components/base/base-switch";
|
||||
@import 'components/base/base-loader/index';
|
||||
@import 'components/base/base-prefix-input';
|
||||
@import 'components/v-tooltips.scss';
|
||||
|
||||
|
||||
// Components
|
||||
//----------------------------------
|
||||
|
||||
@import 'components/buttons';
|
||||
@import 'components/forms';
|
||||
@import 'components/cards';
|
||||
@import 'components/tabs';
|
||||
@import 'components/base-tabs';
|
||||
@import 'components/tables';
|
||||
@import 'components/hamburgers';
|
||||
@import 'components/transitions';
|
||||
@import 'components/charts';
|
||||
@import "components/pace-loader";
|
||||
@import "components/vue-tabs";
|
||||
@import "components/vue-dropdown";
|
||||
@import "components/vue-date-picker";
|
||||
@import "components/vue-multi-select";
|
||||
@import "components/customer-select";
|
||||
@import "components/item-select";
|
||||
@import "components/tax-select";
|
||||
@import "components/avatar-cropper";
|
||||
@import "components/payment-modes-modal";
|
||||
@import "components/item-unit-modal.scss";
|
||||
@import "components/mail-test-modal.scss";
|
||||
@import 'components/pace-loader';
|
||||
@import 'components/animation';
|
||||
|
||||
.swal-icon--custom {
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
// Modals
|
||||
//----------------------------------
|
||||
|
||||
@import "components/base-modal";
|
||||
@import "components/item-modal";
|
||||
@import "components/template-modal";
|
||||
@import "components/customer-modal";
|
||||
@import "components/tax-type-modal";
|
||||
@import "components/category-modal";
|
||||
|
||||
|
||||
// Pages
|
||||
//----------------------------------
|
||||
|
||||
@import 'pages/dashboard';
|
||||
@import 'pages/login';
|
||||
@import 'pages/login-3';
|
||||
@import 'pages/404';
|
||||
@import 'pages/customization';
|
||||
@import 'pages/settings';
|
||||
@import 'pages/invoices/create';
|
||||
@import 'pages/invoices/view';
|
||||
@import 'pages/invoices/index';
|
||||
@import 'pages/estimates/create';
|
||||
@import 'pages/estimates/index';
|
||||
@import 'pages/estimates/view.scss';
|
||||
@import 'pages/expenses';
|
||||
@import 'pages/payments';
|
||||
@import 'pages/settings.scss';
|
||||
@import 'pages/wizard';
|
||||
@import 'pages/reports.scss';
|
||||
@import 'pages/customers';
|
||||
@import 'pages/payments.scss';
|
||||
@import 'pages/payment-view.scss';
|
||||
@import 'pages/items.scss';
|
||||
@import 'pages/statuses.scss';
|
||||
@media (max-width: 768px) {
|
||||
.table-component .sw-dropdown {
|
||||
position: absolute;
|
||||
visibility: visible;
|
||||
top: 15px;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,63 +0,0 @@
|
||||
.sidebar-left {
|
||||
|
||||
.menu-group {
|
||||
margin-bottom: 40px;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 29px;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
cursor: pointer;
|
||||
padding: 10px 0px 11px 0px;
|
||||
display: block;
|
||||
|
||||
.menu-text {
|
||||
font-family: Poppins;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
color: $ls-color-black;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
margin-left: 25px;
|
||||
color: $ls-color-gray--dark;
|
||||
width: 30px;
|
||||
margin-left: 25px;
|
||||
display: inline-block;
|
||||
font-size: inherit;
|
||||
height: 1em;
|
||||
overflow: visible;
|
||||
vertical-align: -0.125em;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: $ls-color-gray--very-light;
|
||||
position: relative;
|
||||
|
||||
&::after {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
content: '';
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 3px;
|
||||
background-color: $ls-color-primary;
|
||||
}
|
||||
|
||||
.menu-text {
|
||||
color: $ls-color-primary !important;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
color: $ls-color-primary !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,33 +0,0 @@
|
||||
.layout-icon-sidebar .sidebar-left {
|
||||
width: 200px;
|
||||
|
||||
.side-nav {
|
||||
|
||||
.collapse-group .collapse-group-item .collapse-item-title {
|
||||
text-align: center;
|
||||
|
||||
a {
|
||||
padding: 15px;
|
||||
}
|
||||
a i {
|
||||
display: block;
|
||||
width: 100%;
|
||||
margin-bottom: 0.5em;
|
||||
font-size: 30px;
|
||||
}
|
||||
.arrow{
|
||||
position: absolute;
|
||||
right: 21px;
|
||||
top: 50%;
|
||||
margin-top: -8px;
|
||||
}
|
||||
}
|
||||
.collapse-group .collapse-group-item {
|
||||
text-align: center;
|
||||
|
||||
a {
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
146
resources/assets/sass/layouts/layout.scss
vendored
146
resources/assets/sass/layouts/layout.scss
vendored
@ -1,146 +0,0 @@
|
||||
.site-header {
|
||||
background-color: $ls-color-primary;
|
||||
height: 60px;
|
||||
left: 0;
|
||||
padding: 12px 30px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.sidebar-left {
|
||||
background: $ls-color-secondary;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
padding: 60px 0 10px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 240px;
|
||||
z-index: 30;
|
||||
}
|
||||
|
||||
.sidebar-body {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar:vertical {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar:horizontal {
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
border-radius: 8px;
|
||||
border: 2px solid rgba(255, 255, 255, 0.0);
|
||||
background-color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background-color: rgba(0,0,0,0);
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.mobile-menu-overlay {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 29;
|
||||
background: rgba(48, 75, 88, .5);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.layout-default .main-content,
|
||||
.layout-icon-sidebar .main-content {
|
||||
padding: 90px 30px 10px 270px;
|
||||
min-height: calc(100% - 39px);
|
||||
}
|
||||
|
||||
.site-footer {
|
||||
background-color: $white;
|
||||
color: #818a91;
|
||||
font-size: 13px;
|
||||
font-weight: normal;
|
||||
padding: 10px 30px 10px 255px;
|
||||
|
||||
a {
|
||||
color: $ls-color-black--light;
|
||||
}
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-bottom: 30px;
|
||||
position: relative;
|
||||
|
||||
p {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
select {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
background: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.page-actions {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
-ms-transform: translateY(-50%);
|
||||
-o-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.template-container {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
//Layout Horizontal
|
||||
|
||||
@media(max-width: $small-breakpoint-below) {
|
||||
|
||||
.site-header {
|
||||
padding: 12px 15px;
|
||||
}
|
||||
|
||||
.sidebar-left {
|
||||
left: -240px;
|
||||
transition: left .3s ease;
|
||||
}
|
||||
|
||||
.sidebar-open .sidebar-left {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.sidebar-open .mobile-menu-overlay {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.layout-default .main-content,
|
||||
.layout-icon-sidebar .main-content {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.site-footer {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
40
resources/assets/sass/pages/404.scss
vendored
40
resources/assets/sass/pages/404.scss
vendored
@ -1,40 +0,0 @@
|
||||
|
||||
.page-error-404 {
|
||||
|
||||
background: $ls-color-secondary;
|
||||
|
||||
.error-box {
|
||||
border-radius: 4px;
|
||||
left: 50%;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 45px;
|
||||
padding: 20px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
color: $white;
|
||||
transform: translate(-50%, -60%);
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 10rem;
|
||||
color: $ls-color-primary;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 2rem;
|
||||
color: $white;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.bg-yellow {
|
||||
background-color: $ls-color-primary;
|
||||
color: $ls-color-secondary;
|
||||
|
||||
&:hover {
|
||||
background-color: darken($ls-color-primary, 5%);
|
||||
}
|
||||
}
|
||||
120
resources/assets/sass/pages/customers.scss
vendored
120
resources/assets/sass/pages/customers.scss
vendored
@ -1,120 +0,0 @@
|
||||
// Dashboard - Create & Index
|
||||
// -------------------------
|
||||
|
||||
.customer-create {
|
||||
|
||||
.section-title {
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 17.5px;
|
||||
line-height: 21px;
|
||||
letter-spacing: 0.1px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
color: $ls-color-secondary;
|
||||
}
|
||||
|
||||
.customer-card {
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.same-address-checkbox-container {
|
||||
display: flex;
|
||||
margin-bottom: 1.5rem;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin-bottom: 1.8rem;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
.header-button-container {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.collapse-button-container {
|
||||
display: none;
|
||||
|
||||
.collapse-button {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.customer-index {
|
||||
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.customer-create {
|
||||
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.same-address-checkbox-container {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
margin-bottom: 0rem;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin-bottom: 1.2rem;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.collapse-button-container {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.header-button-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
39
resources/assets/sass/pages/customization.scss
vendored
39
resources/assets/sass/pages/customization.scss
vendored
@ -1,39 +0,0 @@
|
||||
.customization {
|
||||
|
||||
.prefix-input {
|
||||
max-width: 30%;
|
||||
}
|
||||
|
||||
.form-section {
|
||||
padding: 8px 15px;
|
||||
}
|
||||
|
||||
.invoice-customization-card {
|
||||
border: 1px solid #EBF1FA;border-radius: 5px;
|
||||
}
|
||||
|
||||
@media (max-width: $x-small-breakpoint) {
|
||||
.address-customization-card {
|
||||
|
||||
.address-fields-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.fields-list {
|
||||
border-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.tabs {
|
||||
|
||||
.tab {
|
||||
padding: 10px 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
387
resources/assets/sass/pages/dashboard.scss
vendored
387
resources/assets/sass/pages/dashboard.scss
vendored
@ -1,387 +0,0 @@
|
||||
// Dashboard
|
||||
// -------------------------
|
||||
|
||||
.dashboard {
|
||||
|
||||
.dashboard-table
|
||||
.table-component {
|
||||
|
||||
.dashboard-recent-invoice-options {
|
||||
|
||||
.dropdown-container {
|
||||
margin: 10px 5px 0 -75px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.dashbox {
|
||||
background-color: $white;
|
||||
box-shadow: $shadow;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 30px;
|
||||
padding: 20px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
i {
|
||||
font-size: 30px;
|
||||
left: 40px;
|
||||
position: absolute;
|
||||
top: 53px;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: $ls-color-gray--dark;
|
||||
display: block;
|
||||
font-size: 17.5px;
|
||||
line-height: 21px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.amount {
|
||||
color: $ls-color-black;
|
||||
font-weight: 600;
|
||||
font-size: 28px;
|
||||
line-height: 34px;
|
||||
}
|
||||
|
||||
&:active,
|
||||
&:focus,
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
background-color: $ls-color-gray--very-light;
|
||||
}
|
||||
}
|
||||
|
||||
.dash-item {
|
||||
flex: 3;
|
||||
padding: 0 15px 0 15px;
|
||||
}
|
||||
.dash-item:first-child {
|
||||
flex: 5
|
||||
}
|
||||
|
||||
.dashboard-card .card-header {
|
||||
border: none !important;
|
||||
margin-bottom: 30px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0;
|
||||
padding-left: 10px;
|
||||
|
||||
h6 {
|
||||
font-weight: 500;
|
||||
font-size: 17.5px;
|
||||
line-height: 21px;
|
||||
letter-spacing: 0.1px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.year-selector {
|
||||
height: 50px;
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
.graph-body {
|
||||
display: flex !important;
|
||||
|
||||
.chart-desc {
|
||||
border-left: 1px solid $ls-color-gray--light;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.stats {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
|
||||
.description {
|
||||
padding-top: 30px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.description:last-child {
|
||||
border-top: 1px solid $ls-color-gray--light;
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
letter-spacing: 0.01em;
|
||||
padding-right: 25px
|
||||
}
|
||||
|
||||
.total {
|
||||
display: block;
|
||||
margin-top: 6px;
|
||||
font-weight: 600;
|
||||
font-size: 24.5px;
|
||||
line-height: 29px;
|
||||
padding-right: 25px
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-row {
|
||||
margin-top: 20px;
|
||||
|
||||
.table-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
z-index: 1;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.table-title {
|
||||
font-weight: 600;
|
||||
font-size: 21px;
|
||||
line-height: 25px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Ecommerce
|
||||
|
||||
.dashbox-line-progress {
|
||||
padding: 30px;
|
||||
text-align: left;
|
||||
|
||||
i {
|
||||
right: 30px;
|
||||
left: auto;
|
||||
top: 30px;
|
||||
}
|
||||
|
||||
.progress {
|
||||
height: 0.5rem;
|
||||
margin-bottom: 0;
|
||||
background-color: $ls-color-gray--light;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 15px;
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
.dashbox-circle-progress {
|
||||
text-align: left;
|
||||
padding: 30px;
|
||||
|
||||
.easy-pie-chart {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: 50%;
|
||||
transform: translate(0, -50%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) and (max-width: 1400px) {
|
||||
.dashbox {
|
||||
padding: 15px;
|
||||
|
||||
i {
|
||||
left: 30px;
|
||||
top: 25px;
|
||||
}
|
||||
|
||||
&.dashbox-line-progress i {
|
||||
right: 15px;
|
||||
left: auto;
|
||||
top: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.dashbox-circle-progress {
|
||||
padding: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.dashbox {
|
||||
padding: 12px;
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.amount {
|
||||
font-weight: 500;
|
||||
font-size: 24px;
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.graph-body {
|
||||
display: block !important;
|
||||
|
||||
.stats {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
text-align: center;
|
||||
border-top: 1px solid $ls-color-gray--light;
|
||||
|
||||
.total {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.description {
|
||||
padding:30px 25px;
|
||||
}
|
||||
.description:last-child {
|
||||
border-top: none;
|
||||
padding-top: 30px;
|
||||
border-left: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
||||
.dashbox
|
||||
.icon
|
||||
.card-icon {
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
.dashboard-card
|
||||
.card-header {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.year-selector {
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.dashboard-card
|
||||
.card-header {
|
||||
padding-left: 0;
|
||||
|
||||
h6 {
|
||||
font-size: 16px;
|
||||
line-height: 19px;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.dash-item {
|
||||
flex: 3px;
|
||||
padding: 0 15px 0 15px;
|
||||
}
|
||||
|
||||
.dash-item:nth-child(odd) {
|
||||
padding: 0 15px 0 15px;
|
||||
flex: 100%
|
||||
}
|
||||
.dash-item:nth-child(even) {
|
||||
padding: 0 15px 0 15px;
|
||||
flex: 100%
|
||||
}
|
||||
|
||||
.graph-body {
|
||||
|
||||
.stats {
|
||||
|
||||
.title {
|
||||
font-size: 12px;
|
||||
line-height: 12px;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.total {
|
||||
display: block;
|
||||
margin-top: 3px;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.description {
|
||||
padding: 10px;
|
||||
}
|
||||
.description:last-child {
|
||||
padding: 10px;
|
||||
flex: 100%;
|
||||
border-top: 1px solid #EBF1FA;
|
||||
|
||||
.title {
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-row
|
||||
.mob-table {
|
||||
margin-top: 25px !important;
|
||||
}
|
||||
}
|
||||
|
||||
//Finanace
|
||||
.card.with-tabs .tabs-component {
|
||||
|
||||
.tabs-component-tabs {
|
||||
position: absolute;
|
||||
right: 1.25rem;
|
||||
top: 14px;
|
||||
}
|
||||
|
||||
.tabs-component-panels {
|
||||
border: 0 !important;
|
||||
}
|
||||
}
|
||||
@media(max-width: $small-breakpoint) {
|
||||
.card.with-tabs .tabs-component {
|
||||
|
||||
.tabs-component-tabs {
|
||||
position: relative;
|
||||
display: block;
|
||||
margin-right: -41px;
|
||||
border-radius: 0;
|
||||
top: -21px;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.tabs-component-panels {
|
||||
// border: 0 !important;
|
||||
}
|
||||
.tabs-component-tab:not(:last-child) {
|
||||
border-bottom: dotted 1px $ls-color-gray;
|
||||
}
|
||||
}
|
||||
|
||||
.dashboard-table
|
||||
.table-component {
|
||||
|
||||
tr {
|
||||
&:first-child {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
td {
|
||||
&:first-child {
|
||||
padding-top: 40px !important;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
614
resources/assets/sass/pages/estimates/create.scss
vendored
614
resources/assets/sass/pages/estimates/create.scss
vendored
@ -1,614 +0,0 @@
|
||||
// Estimates - Create
|
||||
// -------------------------
|
||||
|
||||
.estimate-create-page {
|
||||
position: relative;
|
||||
|
||||
.page-header {
|
||||
margin: 0 0 40px 0;
|
||||
|
||||
.page-title {
|
||||
font-size: 24.5px;
|
||||
margin: 0 0 15px 0;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
|
||||
.breadcrumb-item {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.page-actions {
|
||||
|
||||
.btn-crater {
|
||||
margin: 0 0 0 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.estimate-input {
|
||||
padding-left: 40px;
|
||||
}
|
||||
|
||||
.show-customer {
|
||||
background: #FFFFFF;
|
||||
padding: 0 10px 0 10px;
|
||||
min-height: 170px;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
|
||||
label {
|
||||
font-size: 14px;
|
||||
margin: 0 0 0 0;
|
||||
padding: 0 0 0 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.address-menu {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.title {
|
||||
font-size: 15px;
|
||||
white-space: nowrap;
|
||||
color: $ls-color-gray;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
flex:1;
|
||||
flex-direction: column;
|
||||
|
||||
label {
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
width: 90%;
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.customer-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.email {
|
||||
flex: 8;
|
||||
}
|
||||
|
||||
.action {
|
||||
cursor: pointer;
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: $ls-color-primary;
|
||||
margin: 0 0 0 0;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
.add-customer {
|
||||
padding: 0 0 0 0;
|
||||
|
||||
.add-customer-action {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background: #ffffff;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
min-height: 170px;
|
||||
border-radius: 5px;
|
||||
padding: 64px 0;
|
||||
|
||||
.customer-icon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background: $ls-color-gray--light;
|
||||
width: 40px;
|
||||
color: white;
|
||||
height: 40px;
|
||||
font-size: 14px;
|
||||
font-family: Poppins;
|
||||
padding: 11px 14px 11px 13px;
|
||||
border-radius: 50%;
|
||||
margin: 0 15px 0 0;
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: 17.5px;
|
||||
margin: 7px 0 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.customer-required {
|
||||
border: 1px solid $ls-color-red;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.offset-md-1 {
|
||||
margin-left: 5%;
|
||||
}
|
||||
|
||||
.estimate-input-group {
|
||||
margin-bottom: 41px;
|
||||
margin-right: 0;
|
||||
|
||||
.estimate-input {
|
||||
padding-right: 0;
|
||||
|
||||
label {
|
||||
font-family: Poppins;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
color: $ls-color-black--light;
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-table {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
|
||||
.item-table-header {
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
background: white;
|
||||
|
||||
th {
|
||||
padding: 10px 20px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
line-height: 21px;
|
||||
color: #55547A;
|
||||
border-top: 1px solid $ls-color-gray--light;
|
||||
border-bottom: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
|
||||
.item-heading {
|
||||
padding-left: 50px;
|
||||
}
|
||||
|
||||
.amount-heading {
|
||||
padding-right: 50px;
|
||||
}
|
||||
|
||||
th:first-child {
|
||||
padding-left: 0 !important;
|
||||
border-left: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
th:last-child {
|
||||
padding-right: 0 !important;
|
||||
border-right: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
}
|
||||
|
||||
.item-body {
|
||||
|
||||
td:first-child {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
td:last-child {
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
|
||||
.item-row {
|
||||
background: #FFFFFF;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
box-sizing: border-box;
|
||||
border-radius: 0px 0px 5px 5px;
|
||||
|
||||
td {
|
||||
padding: 15px 20px;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
> td {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.item-select {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: $ls-color-gray--dark;
|
||||
overflow: auto !important;
|
||||
max-height: 250px !important;
|
||||
}
|
||||
|
||||
.search-select .selector-menu {
|
||||
top: 45px !important;
|
||||
}
|
||||
|
||||
.main {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.item-amount {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.item-select-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.item-selector {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.selected-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
padding-left: 10px;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
background: $ls-color-gray--very-light;
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.deselect-icon {
|
||||
color: $ls-color-gray;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sort-icon-wrapper,
|
||||
.remove-icon-wrapper {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 15px;
|
||||
height: 40px;
|
||||
width: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sort-icon-wrapper {
|
||||
color: $ls-color-gray;
|
||||
height: 20px;
|
||||
margin-top: 8px;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.remove-icon {
|
||||
color: $ls-color-secondary;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tax-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.tax-amount {
|
||||
flex: 3;
|
||||
}
|
||||
|
||||
.tax-select {
|
||||
flex: 4;
|
||||
}
|
||||
}
|
||||
|
||||
.tax-tr td {
|
||||
padding: 0 21px;
|
||||
}
|
||||
|
||||
.multi-select-item {
|
||||
.multiselect,
|
||||
.multiselect__input,
|
||||
.multiselect__single {
|
||||
border: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.multiselect:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.multiselect__input,
|
||||
.multiselect__single {
|
||||
min-height: 40px;
|
||||
padding-left: 10px;
|
||||
border: 1px solid rgb(234, 241, 251);
|
||||
}
|
||||
|
||||
.multiselect__tags {
|
||||
// margin-bottom: 8px;
|
||||
min-height: 30px;
|
||||
padding: 0;
|
||||
border: 0px ;
|
||||
}
|
||||
.multiselect__select {
|
||||
line-height: 16px;
|
||||
width: 40px;
|
||||
height: 38px;
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
.multiselect__content-wrapper {
|
||||
overflow: hidden;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
box-shadow: $shadow-md;
|
||||
border-radius: 0px 0px 5px 5px;
|
||||
}
|
||||
|
||||
.multiselect__content {
|
||||
max-height: 240px;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.add-item-action {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: $ls-color-primary--light;
|
||||
padding: 13px 23px;
|
||||
width: 100%;
|
||||
font-size: 15px;
|
||||
border-bottom: 1px solid $ls-color-gray--light;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: $ls-color-gray--light;
|
||||
}
|
||||
.icon-fa {
|
||||
margin: 2px 11px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.estimate-foot {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 35px 0;
|
||||
|
||||
.btn-template {
|
||||
background: $ls-color-gray--light;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
color: $ls-color-black;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.icon-button {
|
||||
color: $ls-color-gray--dark;
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: 14px;
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
|
||||
.estimate-notes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 5px 0 0 0;
|
||||
|
||||
textarea {
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
border-radius: 5px;
|
||||
width: 100%;
|
||||
min-height: 100px;
|
||||
padding: 0 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.estimate-total {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #ffffff;
|
||||
min-width: 390px;
|
||||
padding: 15px 20px;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
border-radius: 5px;
|
||||
|
||||
&> label {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.section {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin: 0 0 7px 0;
|
||||
|
||||
.estimate-label {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
line-height: 21px;
|
||||
color:$ls-color-gray--dark;
|
||||
}
|
||||
|
||||
.estimate-amount {
|
||||
font-size: 18px;
|
||||
color: #55547A;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.total {
|
||||
color: $ls-color-primary--light;
|
||||
}
|
||||
|
||||
.discount-drop-down {
|
||||
width: 105px;
|
||||
}
|
||||
|
||||
.item-dropdown {
|
||||
font-family: Arial, Helvetica, sans-serif !important;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.border-top {
|
||||
margin: 0;
|
||||
padding-top: 7px;
|
||||
border-top: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
.tax-selector {
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
margin-top: 12px;
|
||||
line-height: 21px;
|
||||
color: $ls-color-primary--light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-row {
|
||||
|
||||
.item-name {
|
||||
font-weight: 500;
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.item-description {
|
||||
width: 100%;
|
||||
font-weight: 300;
|
||||
font-size: 12px;
|
||||
padding-top: 2px;
|
||||
|
||||
textarea {
|
||||
|
||||
&::placeholder {
|
||||
font-family: Poppins;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: $ls-color-gray;
|
||||
}
|
||||
|
||||
border: none;
|
||||
resize: none;
|
||||
width: 100%;
|
||||
color: $ls-color-gray--very-dark;
|
||||
}
|
||||
}
|
||||
|
||||
.action {
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
color: $ls-color-primary;
|
||||
cursor: pointer;
|
||||
}
|
||||
.activator {
|
||||
label {
|
||||
color: $ls-color-gray--dark;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-dropdown {
|
||||
display: flex;
|
||||
border: 1px solid $ls-color-gray--light !important;
|
||||
background-color: #fff !important;
|
||||
border-radius: 0px 5px 5px 0px !important;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
&:focus {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
}
|
||||
.item-discount {
|
||||
border-radius: 5px 0px 0px 5px !important;
|
||||
height: 40px;
|
||||
// border-right: 0px !important;
|
||||
}
|
||||
|
||||
@media (max-width: $x-small-breakpoint) {
|
||||
.page-header {
|
||||
margin-bottom: 13px;
|
||||
|
||||
.invoice-action-btn {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 15px;
|
||||
margin-right: 0px !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.estimate-customer-container {
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.collapse-input {
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.estimate-input-group {
|
||||
|
||||
.estimate-input {
|
||||
padding-right: 15px;
|
||||
padding-left: 20px;
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.estimate-foot {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.btn-template {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.estimate-total {
|
||||
min-width: 384px;
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
98
resources/assets/sass/pages/estimates/index.scss
vendored
98
resources/assets/sass/pages/estimates/index.scss
vendored
@ -1,98 +0,0 @@
|
||||
// Estimates - Index
|
||||
// -------------------------
|
||||
|
||||
.estimate-index-page {
|
||||
|
||||
.table-actions {
|
||||
|
||||
position: relative;
|
||||
border: none;
|
||||
|
||||
.table-actions-button {
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: -15px;
|
||||
}
|
||||
|
||||
.table-stats {
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.filter-customer {
|
||||
margin-right: 40px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.filter-status {
|
||||
margin-right: 40px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.filter-date {
|
||||
flex: 2;
|
||||
display: flex;
|
||||
margin-right: 40px;
|
||||
align-items: center;
|
||||
.from {
|
||||
flex: 1;
|
||||
}
|
||||
.to {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-estimate {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.dashed {
|
||||
border: 1px solid #B9C1D1;
|
||||
width: 10px;
|
||||
margin-top: 28px;
|
||||
}
|
||||
|
||||
@media(max-width: $large-breakpoint ) {
|
||||
.filter-container {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.filter-estimate {
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.filter-customer,
|
||||
.filter-status,
|
||||
.filter-date,
|
||||
.filter-estimate {
|
||||
margin-bottom: 10px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint) {
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
272
resources/assets/sass/pages/estimates/view.scss
vendored
272
resources/assets/sass/pages/estimates/view.scss
vendored
@ -1,272 +0,0 @@
|
||||
// Estimates - View
|
||||
// -------------------------
|
||||
|
||||
.estimate-view-page {
|
||||
padding-left: 570px !important;
|
||||
|
||||
.estimate-sidebar {
|
||||
width: 300px;
|
||||
height: 100vh;
|
||||
height: 100%;
|
||||
left: 240px;
|
||||
padding: 60px 0 10px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 300px;
|
||||
z-index: 30;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.inv-search {
|
||||
background: $ls-color-gray--very-light !important;
|
||||
}
|
||||
|
||||
.side-estimate {
|
||||
cursor: pointer;
|
||||
padding: 12px 16px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
border-left: 3px solid transparent;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 98px;
|
||||
}
|
||||
|
||||
&.router-link-exact-active {
|
||||
border-left: 3px solid $ls-color-primary;
|
||||
background-color: $ls-color-gray--very-light;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $ls-color-gray--very-light;
|
||||
}
|
||||
|
||||
.left {
|
||||
|
||||
.status-expired {
|
||||
background: #FED7D7;
|
||||
font-size: 13px;
|
||||
color: #9B2C2C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.status-accepted {
|
||||
background: #D5EED0;
|
||||
font-size: 13px;
|
||||
color: #354930;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.status-sent {
|
||||
background: rgba(246, 208, 154, 0.4);
|
||||
font-size: 13px;
|
||||
color: #A96E1A;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.status-viewed {
|
||||
background: #C9E3EC;
|
||||
font-size: 13px;
|
||||
color: #1E576C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.status-pending {
|
||||
background: #FED7D7;
|
||||
font-size: 13px;
|
||||
color: #9B2C2C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.status-rejected {
|
||||
background: #E1E0EA;
|
||||
font-size: 13px;
|
||||
color: #312F57;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.status-draft {
|
||||
background: #F8EDCB;
|
||||
font-size: 13px;
|
||||
color: #6C432E;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.inv-name {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
text-transform: capitalize;
|
||||
color: $ls-color-black;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.inv-number {
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
color: $ls-color-gray--very-dark;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.inv-status {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 10px;
|
||||
line-height: 15px;
|
||||
padding: 2px 10px;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
|
||||
.inv-amount {
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
line-height: 30px;
|
||||
text-align: right;
|
||||
color: $ls-color-black--light;
|
||||
}
|
||||
|
||||
.inv-date {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
text-align: right;
|
||||
color: $ls-color-gray--very-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.no-result {
|
||||
color: $ls-color-gray;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.side-header {
|
||||
height: 100px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30px 15px;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
|
||||
.inv-button {
|
||||
background: $ls-color-gray--very-light;
|
||||
border: 1px solid #eaf1fb;
|
||||
box-sizing: border-box;
|
||||
color: $ls-color-gray--dark;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.side-content {
|
||||
overflow-y: scroll;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.estimate-view-page-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 75vh;
|
||||
min-height: 0;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.frame-style {
|
||||
flex: 1 1 auto;
|
||||
border: 1px solid $ls-color-gray;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.inv-filter-fields-btn,
|
||||
.inv-filter-sorting-btn {
|
||||
&:focus {
|
||||
outline: none !important;
|
||||
box-shadow: 0 0 0 0.09rem rgba(111, 110, 142, 0.5) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-container {
|
||||
margin-left: 12px;
|
||||
|
||||
.filter-title {
|
||||
padding: 5px 10px;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.filter-items {
|
||||
display: flex;
|
||||
padding: 4px 9px;
|
||||
cursor: pointer;
|
||||
|
||||
&:first-child {
|
||||
margin-top: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.inv-label {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 12px;
|
||||
text-transform: capitalize;
|
||||
color: $ls-color-black;
|
||||
margin-bottom: 6px;
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.base-input {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.dropdown-container {
|
||||
padding: 0px !important;
|
||||
left: auto;
|
||||
right: 0px;
|
||||
width: 166px;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-estimate-date {
|
||||
.vdp-datepicker {
|
||||
div {
|
||||
.vdp-datepicker__clear-button {
|
||||
margin-left: -21px;
|
||||
margin-top: 2px;
|
||||
font-size: 20px;
|
||||
font-weight: 800;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.date-group {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.to-text {
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $small-breakpoint) {
|
||||
.estimate-view-page {
|
||||
padding-left: 310px !important;
|
||||
}
|
||||
|
||||
.estimate-sidebar {
|
||||
transition: 0.2s all;
|
||||
left: 0px !important;
|
||||
}
|
||||
}
|
||||
72
resources/assets/sass/pages/expenses.scss
vendored
72
resources/assets/sass/pages/expenses.scss
vendored
@ -1,72 +0,0 @@
|
||||
// Expenses
|
||||
// -------------------------
|
||||
|
||||
.expenses {
|
||||
|
||||
.header-button-container {
|
||||
// display: block;
|
||||
}
|
||||
|
||||
.collapse-button-container {
|
||||
display: none;
|
||||
|
||||
.collapse-button {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.notes {
|
||||
overflow: hidden;
|
||||
width: 200px;
|
||||
|
||||
.note {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.expenses {
|
||||
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.table-actions {
|
||||
margin-top: 0px !important;
|
||||
}
|
||||
|
||||
.header-button-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.collapse-button-container {
|
||||
margin-top: 8px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
620
resources/assets/sass/pages/invoices/create.scss
vendored
620
resources/assets/sass/pages/invoices/create.scss
vendored
@ -1,620 +0,0 @@
|
||||
// Invoices - Create
|
||||
// -------------------------
|
||||
|
||||
.invoice-create-page {
|
||||
position: relative;
|
||||
|
||||
.page-header {
|
||||
margin: 0 0 40px 0;
|
||||
|
||||
.page-title {
|
||||
font-size: 24.5px;
|
||||
margin: 0 0 15px 0;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
|
||||
.breadcrumb-item {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.page-actions {
|
||||
|
||||
.btn-crater {
|
||||
margin: 0 0 0 14px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.invoice-input {
|
||||
padding-left: 40px;
|
||||
}
|
||||
|
||||
.show-customer {
|
||||
background: #FFFFFF;
|
||||
padding: 0 10px 0 10px;
|
||||
min-height: 170px;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
|
||||
label {
|
||||
font-size: 14px;
|
||||
margin: 0 0 0 0;
|
||||
padding: 0 0 0 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.address-menu {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.title {
|
||||
font-size: 15px;
|
||||
white-space: nowrap;
|
||||
color: $ls-color-gray;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
|
||||
label {
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
width: 90%;
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.customer-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.email {
|
||||
flex: 8;
|
||||
}
|
||||
|
||||
.action {
|
||||
cursor: pointer;
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: $ls-color-primary;
|
||||
margin: 0 9px 0 0;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
.add-customer {
|
||||
padding: 0 0 0 0;
|
||||
|
||||
.add-customer-action {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background: #ffffff;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
min-height: 170px;
|
||||
border-radius: 5px;
|
||||
padding: 64px 0;
|
||||
|
||||
.customer-icon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background: $ls-color-gray--light;
|
||||
width: 40px;
|
||||
color: white;
|
||||
height: 40px;
|
||||
font-size: 14px;
|
||||
font-family: Poppins;
|
||||
padding: 11px 14px 11px 13px;
|
||||
border-radius: 50%;
|
||||
margin: 0 15px 0 0;
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: 17.5px;
|
||||
margin: 7px 0 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.customer-required {
|
||||
border: 1px solid $ls-color-red;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.offset-md-1 {
|
||||
margin-left: 5%;
|
||||
}
|
||||
|
||||
.invoice-input-group {
|
||||
margin-bottom: 41px;
|
||||
margin-right: 0;
|
||||
|
||||
.invoice-input {
|
||||
padding-right: 0;
|
||||
|
||||
label {
|
||||
font-family: Poppins;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
color: $ls-color-black--light;
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-table {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
|
||||
.item-table-header {
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
background: white;
|
||||
|
||||
th {
|
||||
padding: 10px 20px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
line-height: 21px;
|
||||
color: #55547A;
|
||||
border-top: 1px solid $ls-color-gray--light;
|
||||
border-bottom: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
|
||||
.item-heading {
|
||||
padding-left: 50px;
|
||||
}
|
||||
|
||||
.amount-heading {
|
||||
padding-right: 50px;
|
||||
}
|
||||
|
||||
th:first-child {
|
||||
padding-left: 0 !important;
|
||||
border-left: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
th:last-child {
|
||||
padding-right: 0 !important;
|
||||
border-right: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
}
|
||||
|
||||
.item-body {
|
||||
|
||||
td:first-child {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
td:last-child {
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
|
||||
.item-row {
|
||||
background: #FFFFFF;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
box-sizing: border-box;
|
||||
border-radius: 0px 0px 5px 5px;
|
||||
|
||||
td {
|
||||
padding: 15px 20px;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
> td {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.item-select {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: $ls-color-gray--dark;
|
||||
overflow: auto !important;
|
||||
max-height: 250px !important;
|
||||
}
|
||||
|
||||
.search-select .selector-menu {
|
||||
top: 45px !important;
|
||||
}
|
||||
|
||||
.main {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.item-amount {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.item-select-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.item-selector {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.selected-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
padding-left: 10px;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
background: $ls-color-gray--very-light;
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.deselect-icon {
|
||||
color: $ls-color-gray;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sort-icon-wrapper,
|
||||
.remove-icon-wrapper {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 15px;
|
||||
height: 40px;
|
||||
width: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sort-icon-wrapper {
|
||||
color: $ls-color-gray;
|
||||
height: 20px;
|
||||
margin-top: 8px;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.remove-icon {
|
||||
color: $ls-color-secondary;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tax-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.tax-amount {
|
||||
flex: 3;
|
||||
}
|
||||
|
||||
.tax-select {
|
||||
flex: 4;
|
||||
}
|
||||
}
|
||||
|
||||
.tax-tr td {
|
||||
padding: 0 21px;
|
||||
}
|
||||
|
||||
.multi-select-item {
|
||||
.multiselect,
|
||||
.multiselect__input,
|
||||
.multiselect__single {
|
||||
border: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.multiselect:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.multiselect__input,
|
||||
.multiselect__single {
|
||||
min-height: 40px;
|
||||
padding-left: 10px;
|
||||
border: 1px solid rgb(234, 241, 251);
|
||||
}
|
||||
|
||||
.multiselect__tags {
|
||||
// margin-bottom: 8px;
|
||||
min-height: 30px;
|
||||
padding: 0;
|
||||
border: 0px ;
|
||||
}
|
||||
.multiselect__select {
|
||||
line-height: 16px;
|
||||
width: 40px;
|
||||
height: 38px;
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
.multiselect__content-wrapper {
|
||||
overflow: hidden;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
box-shadow: $shadow-md;
|
||||
border-radius: 0px 0px 5px 5px;
|
||||
}
|
||||
|
||||
.multiselect__content {
|
||||
max-height: 240px;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.add-item-action {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: $ls-color-primary--light;
|
||||
padding: 13px 23px;
|
||||
width: 100%;
|
||||
font-size: 15px;
|
||||
border-bottom: 1px solid $ls-color-gray--light;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: $ls-color-gray--light;
|
||||
}
|
||||
.icon-fa {
|
||||
margin: 2px 11px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.invoice-foot {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 35px 0;
|
||||
|
||||
.btn-template {
|
||||
background: $ls-color-gray--light;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
color: $ls-color-black;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.icon-button {
|
||||
color: $ls-color-gray--dark;
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: 14px;
|
||||
margin: 0 0 0 0;
|
||||
}
|
||||
|
||||
.invoice-notes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 5px 0 0 0;
|
||||
|
||||
textarea {
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
border-radius: 5px;
|
||||
width: 100%;
|
||||
min-height: 100px;
|
||||
padding: 0 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.invoice-total {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #ffffff;
|
||||
min-width: 390px;
|
||||
padding: 15px 20px;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
border-radius: 5px;
|
||||
|
||||
&> label {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.section {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin: 0 0 7px 0;
|
||||
|
||||
.invoice-label {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
line-height: 21px;
|
||||
color:$ls-color-gray--dark;
|
||||
}
|
||||
|
||||
.invoice-amount {
|
||||
font-size: 18px;
|
||||
color: #55547A;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.total {
|
||||
color: $ls-color-primary--light;
|
||||
}
|
||||
|
||||
.discount-drop-down {
|
||||
width: 105px;
|
||||
}
|
||||
|
||||
.item-dropdown {
|
||||
font-family: Arial, Helvetica, sans-serif !important;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.border-top {
|
||||
margin: 0;
|
||||
padding-top: 7px;
|
||||
border-top: 1px solid $ls-color-gray--light;
|
||||
}
|
||||
|
||||
.tax-selector {
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
margin-top: 12px;
|
||||
line-height: 21px;
|
||||
color: $ls-color-primary--light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-row {
|
||||
|
||||
.item-name {
|
||||
font-weight: 500;
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.item-description {
|
||||
width: 100%;
|
||||
font-weight: 300;
|
||||
font-size: 12px;
|
||||
padding-top: 2px;
|
||||
// padding-left: 10px;
|
||||
|
||||
textarea {
|
||||
|
||||
&::placeholder {
|
||||
font-family: Poppins;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
color: $ls-color-gray;
|
||||
}
|
||||
|
||||
border: none;
|
||||
resize: none;
|
||||
width: 100%;
|
||||
padding-left: 11px;
|
||||
color: $ls-color-gray--very-dark;
|
||||
}
|
||||
}
|
||||
|
||||
.action {
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
color: $ls-color-primary;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.activator {
|
||||
label {
|
||||
color: $ls-color-gray--dark;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-dropdown {
|
||||
display: flex;
|
||||
border: 1px solid $ls-color-gray--light !important;
|
||||
background-color: #fff !important;
|
||||
border-radius: 0px 5px 5px 0px !important;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
|
||||
&:focus {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.item-discount {
|
||||
border-radius: 5px 0px 0px 5px !important;
|
||||
height: 40px;
|
||||
// border-right: 0px !important;
|
||||
}
|
||||
|
||||
@media (max-width: $x-small-breakpoint) {
|
||||
|
||||
.page-header {
|
||||
margin-bottom: 13px;
|
||||
|
||||
.invoice-action-btn {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 15px;
|
||||
margin-right: 0px !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.invoice-customer-container {
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.collapse-input {
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.invoice-input-group {
|
||||
|
||||
.invoice-input {
|
||||
padding-right: 15px;
|
||||
padding-left: 20px;
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.invoice-foot {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.btn-template {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.invoice-total {
|
||||
min-width: 384px;
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
93
resources/assets/sass/pages/invoices/index.scss
vendored
93
resources/assets/sass/pages/invoices/index.scss
vendored
@ -1,93 +0,0 @@
|
||||
// Invoices - Index
|
||||
// -------------------------
|
||||
|
||||
.invoice-index-page {
|
||||
|
||||
.table-actions {
|
||||
|
||||
position: relative;
|
||||
border: none;
|
||||
|
||||
.table-actions-button {
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: -15px;
|
||||
}
|
||||
|
||||
.table-stats {
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.filter-customer, .filter-status {
|
||||
margin-right: 40px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.filter-date {
|
||||
flex: 2;
|
||||
display: flex;
|
||||
margin-right: 40px;
|
||||
align-items: center;
|
||||
.from {
|
||||
flex: 1;
|
||||
}
|
||||
.to {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-invoice {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.dashed {
|
||||
border: 1px solid #B9C1D1;
|
||||
width: 10px;
|
||||
margin-top: 28px;
|
||||
}
|
||||
|
||||
@media(max-width: $large-breakpoint ) {
|
||||
.filter-container {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.filter-invoice {
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.filter-customer,
|
||||
.filter-status,
|
||||
.filter-date,
|
||||
.filter-invoice {
|
||||
margin-bottom: 10px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint) {
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
244
resources/assets/sass/pages/invoices/view.scss
vendored
244
resources/assets/sass/pages/invoices/view.scss
vendored
@ -1,244 +0,0 @@
|
||||
// Invoices - View
|
||||
// -------------------------
|
||||
|
||||
.invoice-view-page {
|
||||
padding-left: 570px !important;
|
||||
|
||||
.invoice-sidebar {
|
||||
width: 300px;
|
||||
height: 100vh;
|
||||
height: 100%;
|
||||
left: 240px;
|
||||
padding: 60px 0 10px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 300px;
|
||||
z-index: 25;
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.inv-search {
|
||||
background: $ls-color-gray--very-light !important;
|
||||
}
|
||||
|
||||
.side-invoice {
|
||||
cursor: pointer;
|
||||
padding: 12px 16px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
border-left: 3px solid transparent;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 98px;
|
||||
}
|
||||
|
||||
&.router-link-exact-active {
|
||||
border-left: 3px solid $ls-color-primary;
|
||||
background-color: $ls-color-gray--very-light;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $ls-color-gray--very-light;
|
||||
}
|
||||
|
||||
.left {
|
||||
|
||||
.inv-name {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
text-transform: capitalize;
|
||||
color: $ls-color-black;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.inv-number {
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
color: $ls-color-gray--dark;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.inv-status {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 10px;
|
||||
line-height: 15px;
|
||||
padding: 2px 10px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.right {
|
||||
|
||||
.inv-amount {
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
line-height: 30px;
|
||||
text-align: right;
|
||||
color: $ls-color-black--light;
|
||||
}
|
||||
|
||||
.inv-date {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
text-align: right;
|
||||
color: $ls-color-gray--dark;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.no-result {
|
||||
color: $ls-color-gray;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.side-header {
|
||||
|
||||
height: 100px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30px 15px;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
|
||||
.inv-button {
|
||||
background: $ls-color-gray--very-light;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
box-sizing: border-box;
|
||||
color: $ls-color-gray;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.side-content {
|
||||
overflow-y: scroll;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.invoice-view-page-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 75vh;
|
||||
min-height: 0;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.frame-style {
|
||||
flex: 1 1 auto;
|
||||
border: 1px solid $ls-color-gray;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.inv-filter-fields-btn, .inv-filter-sorting-btn {
|
||||
|
||||
&:focus {
|
||||
border-color: inherit;
|
||||
box-shadow: none;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.filter-container {
|
||||
margin-left: 12px;
|
||||
|
||||
.filter-title {
|
||||
padding: 5px 10px;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.filter-items {
|
||||
// margin-top: 10px;
|
||||
display: flex;
|
||||
padding: 4px 9px;
|
||||
cursor: pointer;
|
||||
|
||||
&:first-child {
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.inv-label {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 12px;
|
||||
text-transform: capitalize;
|
||||
color: $ls-color-black;
|
||||
margin-bottom: 6px;
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.base-input {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.dropdown-container {
|
||||
padding: 0px !important;
|
||||
left: auto;
|
||||
right: 0px;
|
||||
width: 155px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.filter-invoice-date {
|
||||
|
||||
.vdp-datepicker {
|
||||
|
||||
div {
|
||||
|
||||
.vdp-datepicker__clear-button {
|
||||
margin-left: -21px;
|
||||
margin-top: 2px;
|
||||
font-size: 20px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.date-group {
|
||||
display: flex
|
||||
}
|
||||
|
||||
.to-text {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: $small-breakpoint) {
|
||||
|
||||
.invoice-view-page {
|
||||
padding-left: 310px !important;
|
||||
}
|
||||
|
||||
.invoice-sidebar {
|
||||
transition: .2s all;
|
||||
left: 0px !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
63
resources/assets/sass/pages/items.scss
vendored
63
resources/assets/sass/pages/items.scss
vendored
@ -1,63 +0,0 @@
|
||||
// Items
|
||||
// -------------------------
|
||||
|
||||
.items {
|
||||
|
||||
.table-loader {
|
||||
padding: 25px 0px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.items {
|
||||
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.table-actions {
|
||||
margin-top: 0px !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.item-create {
|
||||
|
||||
.collapse-button {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
.item-create {
|
||||
|
||||
.collapse-button {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
192
resources/assets/sass/pages/login-3.scss
vendored
192
resources/assets/sass/pages/login-3.scss
vendored
@ -1,192 +0,0 @@
|
||||
// Login - Style 3
|
||||
// -------------------------
|
||||
|
||||
.login-page.login-3 {
|
||||
|
||||
.site-wrapper {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.login-box {
|
||||
color: #333;
|
||||
flex: 2;
|
||||
padding: 150px 60px 180px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
max-width: 500px;
|
||||
min-width: 450px;
|
||||
|
||||
.box-wrapper {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.content-box {
|
||||
background-image: url('/images/login-vector1.svg');
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
flex: 5;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
|
||||
h1 {
|
||||
color: #fff;
|
||||
font-size: 50px;
|
||||
}
|
||||
|
||||
p {
|
||||
color: $ls-color-gray--very-light;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 16px;
|
||||
line-height: 24px
|
||||
}
|
||||
}
|
||||
|
||||
.content-bottom {
|
||||
background-image: url('/images/login-vector3.svg');
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
bottom: 0;
|
||||
right: 32%;
|
||||
}
|
||||
|
||||
.content-box::before {
|
||||
background-image: url('/images/frame.svg');
|
||||
content: "";
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
height: 300px;
|
||||
right: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 420px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.content-box::after {
|
||||
background-image: url('/images/login-vector2.svg');
|
||||
content: "";
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
right: 7.5%;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.c-input {
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.login-box a {
|
||||
color: #817AE3;
|
||||
|
||||
&:hover {
|
||||
color : lighten(#333, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.other-options h6 {
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.page-copyright {
|
||||
margin-top: 0;
|
||||
padding-top: 150px;
|
||||
color: $ls-color-gray--dark;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
line-height: 17px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.page-copyright a {
|
||||
color: $ls-color-primary;
|
||||
|
||||
&:hover {
|
||||
color : darken($ls-color-primary, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.logo-main img{
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
@media (max-width: $large-breakpoint) {
|
||||
|
||||
.content-box h1 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.content-box p {
|
||||
|
||||
display: none;
|
||||
}
|
||||
|
||||
.content-box::before {
|
||||
height: 250px;
|
||||
width: 350px;
|
||||
}
|
||||
|
||||
.content-box::after {
|
||||
right: 13%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: $medium-breakpoint) {
|
||||
|
||||
.content-box h1 {
|
||||
font-size: 15px;
|
||||
margin-left: 50px;
|
||||
}
|
||||
|
||||
.content-box p {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.content-bottom {
|
||||
width: 600px;
|
||||
height: 0px;
|
||||
}
|
||||
|
||||
.content-box::before {
|
||||
height: 150px;
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
@media(max-width: $small-breakpoint) {
|
||||
|
||||
.page-copyright {
|
||||
padding-top: 110px
|
||||
}
|
||||
|
||||
.login-box {
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
min-width: 0;
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
.content-box {
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
166
resources/assets/sass/pages/login.scss
vendored
166
resources/assets/sass/pages/login.scss
vendored
@ -1,166 +0,0 @@
|
||||
// Login - Base
|
||||
// -------------------------
|
||||
|
||||
.login-page {
|
||||
height: 100%;
|
||||
background-color: $ls-color-gray--very-light;
|
||||
|
||||
.login-wrapper {
|
||||
height: 100%;
|
||||
padding-top: 0;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.login-box {
|
||||
color: $white;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
max-width: 400px;
|
||||
|
||||
.form-control {
|
||||
// margin-top: 20px;
|
||||
}
|
||||
|
||||
.input-label {
|
||||
padding-bottom: 5px;
|
||||
margin: 0;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
color: #55547A
|
||||
}
|
||||
|
||||
.other-actions {
|
||||
margin-bottom: 10px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.page-copyright {
|
||||
font-size: 14px;
|
||||
margin-top: 50px;
|
||||
text-align: center;
|
||||
p {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: $ls-color-primary;
|
||||
|
||||
&:hover {
|
||||
color: darken($ls-color-primary, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-login {
|
||||
background-color: $ls-color-primary;
|
||||
color: white;
|
||||
|
||||
&:hover {
|
||||
background-color: darken($ls-color-primary, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.login-box .c-input {
|
||||
color: #fff;
|
||||
|
||||
.c-indicator {
|
||||
top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.login-wrapper .c-input {
|
||||
> input {
|
||||
&:checked ~ .c-indicator {
|
||||
background-color: #333;
|
||||
@include box-shadow(none);
|
||||
}
|
||||
|
||||
&:focus ~ .c-indicator {
|
||||
// the mixin is not used here to make sure there is feedback
|
||||
box-shadow: 0 0 0 0.075rem #fff, 0 0 0 0.2rem darken(#333, 5%);
|
||||
}
|
||||
|
||||
&:active ~ .c-indicator {
|
||||
background-color: darken(#333, 5%);
|
||||
@include box-shadow(none);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.logo-main {
|
||||
margin-bottom: 127px;
|
||||
text-align: left;
|
||||
|
||||
img {
|
||||
height: auto;
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
.other-options {
|
||||
border-top: 1px solid #fff;
|
||||
padding: 1rem 0;
|
||||
padding-top: 2rem;
|
||||
|
||||
h6 {
|
||||
color: #c7cbd1;
|
||||
font-size: 15px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
a,
|
||||
a:hover {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
margin-top: 30px;
|
||||
.btn-theme {
|
||||
margin-right: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $small-breakpoint) {
|
||||
.other-actions {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.logo-main {
|
||||
img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.social-links {
|
||||
margin-top: 40px;
|
||||
|
||||
.link-text {
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
line-height: 17px;
|
||||
color: $ls-color-gray
|
||||
}
|
||||
|
||||
.social-logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-top: 25px;
|
||||
|
||||
.icon {
|
||||
display: block;
|
||||
margin-right: 30px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
243
resources/assets/sass/pages/payment-view.scss
vendored
243
resources/assets/sass/pages/payment-view.scss
vendored
@ -1,243 +0,0 @@
|
||||
// Payments - View
|
||||
// -------------------------
|
||||
|
||||
.payment-view-page {
|
||||
padding-left: 570px !important;
|
||||
|
||||
.payment-sidebar {
|
||||
width: 300px;
|
||||
height: 100vh;
|
||||
height: 100%;
|
||||
left: 240px;
|
||||
padding: 60px 0 10px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 300px;
|
||||
z-index: 25;
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.inv-search {
|
||||
background: $ls-color-gray--very-light !important;
|
||||
}
|
||||
|
||||
.side-payment {
|
||||
padding: 12px 16px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
cursor: pointer;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 98px;
|
||||
}
|
||||
|
||||
&.router-link-exact-active {
|
||||
border-left: 3px solid $ls-color-primary;
|
||||
background-color: $ls-color-gray--very-light;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $ls-color-gray--very-light;
|
||||
}
|
||||
|
||||
.left {
|
||||
|
||||
.inv-name {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
text-transform: capitalize;
|
||||
color: $ls-color-black;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.inv-number {
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
color: $ls-color-gray--dark;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.inv-status {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 10px;
|
||||
line-height: 15px;
|
||||
padding: 2px 10px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.right {
|
||||
|
||||
.inv-amount {
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
line-height: 30px;
|
||||
text-align: right;
|
||||
color: $ls-color-black--light;
|
||||
}
|
||||
|
||||
.inv-date {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
text-align: right;
|
||||
color: $ls-color-gray--dark;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.no-result {
|
||||
color: $ls-color-gray;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.side-header {
|
||||
|
||||
height: 100px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30px 15px;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
|
||||
.inv-button {
|
||||
background: $ls-color-gray--very-light;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
box-sizing: border-box;
|
||||
color: $ls-color-gray;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.side-content {
|
||||
overflow-y: scroll;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.payment-view-page-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 75vh;
|
||||
min-height: 0;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.frame-style {
|
||||
flex: 1 1 auto;
|
||||
border: 1px solid $ls-color-gray;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.inv-filter-fields-btn, .inv-filter-sorting-btn {
|
||||
|
||||
&:focus {
|
||||
border-color: inherit;
|
||||
box-shadow: none;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.filter-container {
|
||||
margin-left: 12px;
|
||||
|
||||
.filter-title {
|
||||
padding: 5px 10px;
|
||||
border-bottom: 1px solid rgba(185, 193, 209, 0.41);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.filter-items {
|
||||
// margin-top: 10px;
|
||||
display: flex;
|
||||
padding: 4px 9px;
|
||||
cursor: pointer;
|
||||
|
||||
&:first-child {
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.inv-label {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 12px;
|
||||
text-transform: capitalize;
|
||||
color: $ls-color-black;
|
||||
margin-bottom: 6px;
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.base-input {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.dropdown-container {
|
||||
padding: 0px !important;
|
||||
left: auto;
|
||||
right: 0px;
|
||||
width: 167px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.filter-payment-date {
|
||||
|
||||
.vdp-datepicker {
|
||||
|
||||
div {
|
||||
|
||||
.vdp-datepicker__clear-button {
|
||||
margin-left: -21px;
|
||||
margin-top: 2px;
|
||||
font-size: 20px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.date-group {
|
||||
display: flex
|
||||
}
|
||||
|
||||
.to-text {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: $small-breakpoint) {
|
||||
|
||||
.payment-view-page {
|
||||
padding-left: 310px !important;
|
||||
}
|
||||
|
||||
.payment-sidebar {
|
||||
transition: .2s all;
|
||||
left: 0px !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
80
resources/assets/sass/pages/payments.scss
vendored
80
resources/assets/sass/pages/payments.scss
vendored
@ -1,80 +0,0 @@
|
||||
// Payments
|
||||
// -------------------------
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.payments {
|
||||
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.table-actions {
|
||||
margin-top: 0px !important;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.payment-create {
|
||||
.header-button-container {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.collapse-button-container {
|
||||
display: none;
|
||||
|
||||
.collapse-button {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.payment-create, .payment-index {
|
||||
|
||||
.page-actions {
|
||||
position: relative;
|
||||
-webkit-transform: none;
|
||||
-ms-transform: none;
|
||||
-o-transform: none;
|
||||
transform: none;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
button {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.header-button-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.collapse-button-container {
|
||||
display: block;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
102
resources/assets/sass/pages/reports.scss
vendored
102
resources/assets/sass/pages/reports.scss
vendored
@ -1,102 +0,0 @@
|
||||
// Reports
|
||||
// -------------------------
|
||||
|
||||
.reports {
|
||||
|
||||
.reports-tab-container {
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
|
||||
.reports-frame-style {
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
border: 1px solid $ls-color-gray;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.report-button {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.report-view-button {
|
||||
display: none;
|
||||
color: $btn-secondary-color;
|
||||
}
|
||||
|
||||
.report-fields-container {
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
.report-field-container {
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
.report-submit-button-container {
|
||||
margin-top: 32px;
|
||||
}
|
||||
|
||||
.report-label {
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
color: $ls-color-secondary;
|
||||
}
|
||||
|
||||
.report-label {
|
||||
font-weight: 500;
|
||||
color: #55547A;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media(max-width: $x-small-breakpoint ) {
|
||||
|
||||
.reports {
|
||||
|
||||
.reports-tab {
|
||||
padding: 10px 19px;
|
||||
}
|
||||
|
||||
.reports-frame-style {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.report-submit-button-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.report-view-button {
|
||||
display: flex;
|
||||
color: $btn-secondary-color !important;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
.report-button {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.report-fields-container {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.report-field-container {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
|
||||
.tab {
|
||||
padding: 10px 15px;
|
||||
|
||||
.tab-link {
|
||||
padding: 10px 17px !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
311
resources/assets/sass/pages/settings.scss
vendored
311
resources/assets/sass/pages/settings.scss
vendored
@ -1,311 +0,0 @@
|
||||
// Settings
|
||||
// -------------------------
|
||||
|
||||
.settings-container {
|
||||
margin-top: 40px;
|
||||
|
||||
.settings-sidebar {
|
||||
list-style-type: none;
|
||||
padding: 0px;
|
||||
|
||||
.settings-menu-item {
|
||||
padding: 10px 0px;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 18px;
|
||||
color: $ls-color-black;
|
||||
|
||||
.setting-icon {
|
||||
width: 25px;
|
||||
color: $ls-color-gray;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.link-color {
|
||||
color: $ls-color-gray--dark;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.active-setting {
|
||||
color: $ls-color-primary !important;
|
||||
cursor: pointer;
|
||||
|
||||
.setting-icon {
|
||||
color: $ls-color-primary !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.setting-main-container {
|
||||
.setting-card {
|
||||
padding: 30px;
|
||||
min-height: 620px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin: 0px;
|
||||
|
||||
.page-title {
|
||||
margin: 0;
|
||||
padding-bottom: 10px;
|
||||
font-weight: 500;
|
||||
font-size: 17.5px;
|
||||
line-height: 21px;
|
||||
letter-spacing: 0.1px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.page-sub-title {
|
||||
max-width: 480px;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
color: $ls-color-gray--dark;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.input-label {
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
color: #55547a;
|
||||
}
|
||||
}
|
||||
|
||||
.expense-category {
|
||||
td {
|
||||
background-color: $ls-color-gray--very-light !important;
|
||||
}
|
||||
}
|
||||
|
||||
.tax-table {
|
||||
td {
|
||||
background-color: $ls-color-gray--very-light !important;
|
||||
}
|
||||
|
||||
.tax-name {
|
||||
}
|
||||
|
||||
.compound-tax {
|
||||
display: inline;
|
||||
padding: 2px 8px;
|
||||
font-size: 10px;
|
||||
line-height: 15px;
|
||||
background: $red--very-light;
|
||||
color: $red--dark;
|
||||
}
|
||||
}
|
||||
|
||||
.payment-tab {
|
||||
.dropdown-container {
|
||||
right: 0;
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.item-tab {
|
||||
.dropdown-container {
|
||||
right: 0;
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.update-container {
|
||||
.verified,
|
||||
.not-verified {
|
||||
height: 15px;
|
||||
width: 15px;
|
||||
background-color: $brand-success;
|
||||
display: inline-block;
|
||||
margin: 0 10px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.not-verified {
|
||||
background-color: $brand-danger;
|
||||
}
|
||||
|
||||
.update-spinner {
|
||||
font-size: 30px;
|
||||
color: $ls-color-gray--dark;
|
||||
}
|
||||
|
||||
.update-steps-container {
|
||||
list-style-type: none;
|
||||
width: 100%;
|
||||
padding: 0px;
|
||||
|
||||
.update-step {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
padding: 10px 0px;
|
||||
border-bottom: 1px solid $ls-color-gray--light;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: 0px solid;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.update-step-text {
|
||||
font-size: $font-size-base;
|
||||
margin: 0px;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
.update-status-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.update-time {
|
||||
font-size: 10px;
|
||||
color: $ls-color-gray--dark;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.update-status {
|
||||
font-size: 13px;
|
||||
width: 88px;
|
||||
height: 28px;
|
||||
display: block;
|
||||
text-align: center;
|
||||
border-radius: 30px;
|
||||
text-transform: uppercase;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
.status-pending {
|
||||
background-color: #eaf1fb;
|
||||
color: $ls-color-secondary;
|
||||
}
|
||||
|
||||
.status-running {
|
||||
background-color: rgba(21, 178, 236, 0.15);
|
||||
color: $ls-color-light-blue;
|
||||
}
|
||||
|
||||
.status-finished {
|
||||
background-color: #d4f6ee;
|
||||
color: $ls-color-green;
|
||||
}
|
||||
|
||||
.status-error {
|
||||
background-color: rgba(251, 113, 120, 0.22);
|
||||
color: $ls-color-red;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.add-new-tax {
|
||||
height: 45px;
|
||||
white-space: nowrap;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.flex-box {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.left {
|
||||
position: relative;
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.btn-switch {
|
||||
position: absolute;
|
||||
top: -18px;
|
||||
}
|
||||
|
||||
.box-title {
|
||||
margin-bottom: 5px;
|
||||
padding: 0;
|
||||
font-size: 16px;
|
||||
line-height: 21px;
|
||||
color: #55547a;
|
||||
}
|
||||
|
||||
.box-desc {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
max-width: 480px;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
color: $ls-color-gray--dark;
|
||||
}
|
||||
|
||||
.notes {
|
||||
overflow: hidden;
|
||||
width: 200px;
|
||||
|
||||
.note {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.version {
|
||||
background: #eaf1fb;
|
||||
color: #a5acc1;
|
||||
border: 1px solid #eaf1fb;
|
||||
box-sizing: border-box;
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $x-small-breakpoint) {
|
||||
.settings-container {
|
||||
.setting-main-container {
|
||||
.setting-card {
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
& .ml-15 {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
.table-component {
|
||||
td:first-child {
|
||||
height: auto;
|
||||
min-height: 10px;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.tax-table {
|
||||
.tax-name {
|
||||
margin-top: 21px;
|
||||
width: 76%;
|
||||
}
|
||||
}
|
||||
|
||||
.expense-category {
|
||||
.table-component__table__body {
|
||||
tr:first-child {
|
||||
td:nth-child(2) {
|
||||
height: auto;
|
||||
width: 101%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.add-new-tax {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
116
resources/assets/sass/pages/statuses.scss
vendored
116
resources/assets/sass/pages/statuses.scss
vendored
@ -1,116 +0,0 @@
|
||||
// Invoice statuses
|
||||
|
||||
.inv-status-overdue {
|
||||
background: #FED7D7;
|
||||
font-size: 13px;
|
||||
color: #9B2C2C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.inv-status-paid {
|
||||
background: #D5EED0;
|
||||
font-size: 13px;
|
||||
color: #354930;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.inv-status-unpaid {
|
||||
background: #F8EDCB;
|
||||
font-size: 13px;
|
||||
color: #6C432E;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.inv-status-sent {
|
||||
background: rgba(246, 208, 154, 0.4);
|
||||
font-size: 13px;
|
||||
color: #A96E1A;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.inv-status-viewed {
|
||||
background: #C9E3EC;
|
||||
font-size: 13px;
|
||||
color: #1E576C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.inv-status-completed {
|
||||
background: #D5EED0;
|
||||
font-size: 13px;
|
||||
color: #354930;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.inv-status-pending {
|
||||
background: #FED7D7;
|
||||
font-size: 13px;
|
||||
color: #9B2C2C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.inv-status-partially_paid {
|
||||
background: #C9E3EC;
|
||||
font-size: 13px;
|
||||
color: #1E576C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.inv-status-draft {
|
||||
background: #F8EDCB;
|
||||
font-size: 13px;
|
||||
color: #6C432E;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
|
||||
// Estimate Statuses
|
||||
|
||||
.est-status-expired {
|
||||
background: #FED7D7;
|
||||
font-size: 13px;
|
||||
color: #9B2C2C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.est-status-accepted {
|
||||
background: #D5EED0;
|
||||
font-size: 13px;
|
||||
color: #354930;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.est-status-sent {
|
||||
background: rgba(246, 208, 154, 0.4);
|
||||
font-size: 13px;
|
||||
color: #A96E1A;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.est-status-viewed {
|
||||
background: #C9E3EC;
|
||||
font-size: 13px;
|
||||
color: #1E576C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.est-status-pending {
|
||||
background: #FED7D7;
|
||||
font-size: 13px;
|
||||
color: #9B2C2C;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.est-status-rejected {
|
||||
background: #E1E0EA;
|
||||
font-size: 13px;
|
||||
color: #312F57;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.est-status-draft {
|
||||
background: #F8EDCB;
|
||||
font-size: 13px;
|
||||
color: #6C432E;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
166
resources/assets/sass/pages/wizard.scss
vendored
166
resources/assets/sass/pages/wizard.scss
vendored
@ -1,166 +0,0 @@
|
||||
// Wizard
|
||||
// -------------------------
|
||||
|
||||
.wizard {
|
||||
|
||||
.logo-main {
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.wizard-card {
|
||||
padding: 30px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.row {
|
||||
margin-bottom: 27px;
|
||||
}
|
||||
|
||||
.form-content {
|
||||
margin-top: 70px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.form-title {
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 24.5px;
|
||||
line-height: 29px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.form-desc {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
color: $ls-color-gray--dark;
|
||||
width: 55%;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
}
|
||||
|
||||
.step-indicator {
|
||||
padding-top: 40px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
.indicator-line {
|
||||
border: 5px solid $ls-color-gray--light;
|
||||
border-radius: 5px;
|
||||
box-sizing: border-box;
|
||||
width: 520px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
margin-top: 60px;
|
||||
|
||||
.center {
|
||||
position: absolute;
|
||||
top: -11px;
|
||||
width: 105%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.steps {
|
||||
border-radius: 50%;
|
||||
float: left;
|
||||
border: 5px solid $ls-color-gray--light;
|
||||
padding: 0px 5px;
|
||||
height: 21px;
|
||||
width: 21px;
|
||||
background: $ls-color-gray--light;
|
||||
|
||||
&.active {
|
||||
border: 5px solid #5851d8;
|
||||
background: #ffffff;
|
||||
border-radius: 50%;
|
||||
height: 21px;
|
||||
width: 21px;
|
||||
}
|
||||
|
||||
&.completed {
|
||||
padding: 0px;
|
||||
background: #5851d8;
|
||||
border: 5px solid #5851d8;
|
||||
border-radius: 50%;
|
||||
height: 21px;
|
||||
width: 21px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.icon-check {
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-size: 12px;
|
||||
/* line-height: 21px; */
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.upload-logo {
|
||||
position: absolute;
|
||||
right: 60px;
|
||||
|
||||
.preview-logo {
|
||||
height: 50px;
|
||||
max-width: 300px;
|
||||
padding: 10px;
|
||||
border: 4px solid $ls-color-gray--light;
|
||||
}
|
||||
}
|
||||
|
||||
.list-items {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 0;
|
||||
border: 1px solid $ls-color-gray--light;
|
||||
|
||||
.left-item,
|
||||
.right-item {
|
||||
padding: 12px 10px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.right-item {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.verified,
|
||||
.not-verified {
|
||||
height: 15px;
|
||||
width: 15px;
|
||||
background-color: $brand-success;
|
||||
display: inline-block;
|
||||
margin: 0 10px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.not-verified {
|
||||
background-color: $brand-danger;
|
||||
}
|
||||
|
||||
}
|
||||
112
resources/assets/sass/partials/header.scss
vendored
112
resources/assets/sass/partials/header.scss
vendored
@ -1,112 +0,0 @@
|
||||
.brand-main img {
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.nav-toggle {
|
||||
background-color: $header-buttons-bg-color;
|
||||
border-radius: 2px;
|
||||
color: $header-buttons-font-color;
|
||||
display: none;
|
||||
font-size: 14px;
|
||||
line-height: 9px;
|
||||
padding: 6px;
|
||||
|
||||
&:active,
|
||||
&:focus,
|
||||
&:visited {
|
||||
color: $header-font-color;
|
||||
}
|
||||
}
|
||||
|
||||
.action-list {
|
||||
float: right;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
display: block;
|
||||
float: left;
|
||||
position: relative;
|
||||
height: 36px;
|
||||
margin: 0;
|
||||
padding: 0 4px;
|
||||
|
||||
&.action-item a {
|
||||
padding: 11px;
|
||||
}
|
||||
.icon {
|
||||
color: $sidebar-icon-color;
|
||||
}
|
||||
|
||||
a {
|
||||
background-color: $header-buttons-bg-color;
|
||||
border-radius: 2px;
|
||||
color: $header-buttons-font-color;
|
||||
display: inline-block;
|
||||
font-size: 14px !important;
|
||||
line-height: 14px !important;
|
||||
padding: 11px !important;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
background-color: $header-buttons-bg-color--hover;
|
||||
color: $header-font-color;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.avatar {
|
||||
padding: 0 !important;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.avatar img {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.dropdown-group {
|
||||
background-color: $header-buttons-bg-color;
|
||||
|
||||
i {
|
||||
text-align: center;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
&.has-child > .dropdown-activator::after {
|
||||
content: none;
|
||||
}
|
||||
.dropdown-group-item i {
|
||||
width: 25px;
|
||||
}
|
||||
|
||||
}
|
||||
.notification-dropdown {
|
||||
padding: 5px !important;
|
||||
|
||||
.dropdown-header {
|
||||
border-bottom: 1px solid $ls-color-gray--dark;
|
||||
color: $ls-color-primary;
|
||||
padding: 3px 10px 8px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: $small-breakpoint-below) {
|
||||
|
||||
.nav-toggle {
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.brand-main {
|
||||
float: left;
|
||||
|
||||
img {
|
||||
height: 36px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
66
resources/assets/sass/partials/sidebar.scss
vendored
66
resources/assets/sass/partials/sidebar.scss
vendored
@ -1,66 +0,0 @@
|
||||
.side-nav {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
.collapse-group .collapse-group-item {
|
||||
|
||||
.collapse-item-title {
|
||||
display: block;
|
||||
|
||||
& > a > .icon-fa.arrow {
|
||||
float: right;
|
||||
line-height: 1.42857;
|
||||
|
||||
&:before {
|
||||
content: "\f104";
|
||||
}
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: $sidebar-font-color;
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
padding: 12px 12px 12px 30px;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
background-color: $sidemenu-item-bg-color--hover;
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
width: 30px;
|
||||
color: $sidebar-icon-color;
|
||||
}
|
||||
|
||||
&.active {
|
||||
|
||||
& > .collapse-item-title {
|
||||
|
||||
& > a .icon {
|
||||
color: $ls-color-primary;
|
||||
|
||||
& > .icon-fa.arrow:before {
|
||||
content: "\f107";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.collapse-group-items {
|
||||
background-color: $sidemenu-submenu-bg;
|
||||
padding: 0;
|
||||
.collapse-group-items {
|
||||
background-color: lighten($sidemenu-submenu-bg, 5%);
|
||||
|
||||
.collapse-group-items {
|
||||
background-color: lighten($sidemenu-submenu-bg, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
a.active{
|
||||
color: $ls-color-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
606
resources/assets/sass/skins/skin-crater.scss
vendored
606
resources/assets/sass/skins/skin-crater.scss
vendored
@ -1,606 +0,0 @@
|
||||
.skin-crater {
|
||||
// Theme Colors :
|
||||
$ls-color-theme: $ls-color-primary;
|
||||
|
||||
//HEADER SECTION
|
||||
$header-bg-color: $primary-to-primary-light-gradient;
|
||||
$header-font-color: $ls-color-black;
|
||||
$header-brand-font-color: $white;
|
||||
$header-buttons-bg-color: $white;
|
||||
$header-buttons-bg-color--hover: darken($white, 5%);
|
||||
$header-buttons-font-color: $ls-color-black;
|
||||
|
||||
//SIDEBAR SECTION
|
||||
$sidebar-bg-color: $white;
|
||||
$side-bar-border-right: $ls-color-gray--light;
|
||||
$sidebar-font-color: $ls-color-black;
|
||||
$sidemenu-item-bg-color--hover: darken($ls-color-gray--light, 5%);
|
||||
$sidemenu-item-bg-color--active: transparent;
|
||||
$sidemenu-item-font-color: $ls-color-black;
|
||||
$sidemenu-item-font-color--active: $ls-color-theme;
|
||||
$sidemenu-item-icon-color: $ls-color-gray--dark;
|
||||
$sidemenu-item-icon-color--active: $ls-color-primary;
|
||||
$sidemenu-arrow-color: $ls-color-gray--dark;
|
||||
$sidemenu-submenu-bg: $ls-color-gray--light;
|
||||
|
||||
//Horizontal Menu
|
||||
$header-bottom-bg: $white;
|
||||
$header-menu-item-font-color: $ls-color-black;
|
||||
$header-menu-item-font-color--active: $ls-color-theme;
|
||||
$header-menu-item-bg-color--hover: darken($ls-color-gray--light, 5%);
|
||||
$header-menu-item-bg-color--active: transparent;
|
||||
|
||||
//DROPDOWN
|
||||
$dropdown-bg: $white;
|
||||
$dropdown-bg--hover: $ls-color-gray--light;
|
||||
$dropdown-border-color: $ls-color-gray--dark;
|
||||
$dropdown-divider-bg: $ls-color-gray--dark;
|
||||
$dropdown-activator-color: $ls-color-black;
|
||||
$dropdown-activator-color--hover: $ls-color-theme;
|
||||
$dropdown-header-color: $ls-color-theme;
|
||||
$dropdown-header-border-color: $ls-color-gray--light;
|
||||
|
||||
//MISC
|
||||
$code-bg: $ls-color-gray--light;
|
||||
$code-color: $ls-color-theme;
|
||||
|
||||
//MAILBOX
|
||||
$mailbox-sidebar-menu-item: $ls-color-theme;
|
||||
$mailbox-font-color:$ls-color-black;
|
||||
$mailbox-page-link: $white;
|
||||
$mailbox-page-link-bg: $ls-color-theme;
|
||||
|
||||
.main-content {
|
||||
background: $ls-color-gray--very-light;
|
||||
}
|
||||
|
||||
.no-data-info {
|
||||
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 17.5px;
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 15px;
|
||||
color: $ls-color-gray--very-dark;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//HEADER
|
||||
.site-header {
|
||||
background: $header-bg-color !important;
|
||||
border-bottom: 1px solid rgba(230, 230, 230, 0.7);
|
||||
|
||||
.brand-main {
|
||||
color: $header-brand-font-color;
|
||||
font-size: 20px;
|
||||
font-family: poppins, sans-serif;
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.nav-toggle {
|
||||
background-color: $header-buttons-bg-color;
|
||||
color: $header-buttons-font-color;
|
||||
}
|
||||
|
||||
.hamburger span {
|
||||
background: $header-buttons-font-color;
|
||||
}
|
||||
|
||||
.hamburger-inner,
|
||||
.hamburger-inner::before,
|
||||
.hamburger-inner::after {
|
||||
background-color: $header-font-color;
|
||||
}
|
||||
|
||||
.hamburger span::before,
|
||||
.hamburger span::after {
|
||||
background-color: $header-buttons-font-color;
|
||||
}
|
||||
|
||||
.action-list li {
|
||||
a {
|
||||
background-color: $header-buttons-bg-color;
|
||||
color: $header-buttons-font-color;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
background-color: $header-buttons-bg-color--hover;
|
||||
color: $header-buttons-font-color;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background-color: $white;
|
||||
}
|
||||
|
||||
.notification-dropdown .dropdown-header {
|
||||
border-bottom: 1px solid $dropdown-header-border-color;
|
||||
color: $dropdown-header-color;
|
||||
}
|
||||
|
||||
.dropdown-divider {
|
||||
background-color: $dropdown-divider-bg;
|
||||
}
|
||||
}
|
||||
|
||||
//HEDER BOTTOM
|
||||
.header-nav {
|
||||
|
||||
.dropdown-group.dropdown-group.active > .dropdown-activator > a {
|
||||
color: $dropdown-header-color;
|
||||
}
|
||||
.dropdown-group.has-child.toggle-arrow.active > .dropdown-activator::after {
|
||||
border-color: $dropdown-header-color transparent transparent;
|
||||
}
|
||||
}
|
||||
|
||||
//SIDEBAR/NAV
|
||||
|
||||
.sidebar-left {
|
||||
background-color: $sidebar-bg-color;
|
||||
border-right: 1px solid $side-bar-border-right;
|
||||
}
|
||||
|
||||
.side-nav {
|
||||
margin: 20px 0 0 0;
|
||||
|
||||
.side-nav-division {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.collapse-group .collapse-group-item {
|
||||
a {
|
||||
color: $ls-color-black;
|
||||
font-family: poppins, sans-serif;
|
||||
font-size: 14px;
|
||||
|
||||
&:hover {
|
||||
background-color: $sidemenu-item-bg-color--hover;
|
||||
}
|
||||
}
|
||||
|
||||
&.active > .collapse-item-title > a {
|
||||
color: $sidemenu-item-font-color--active;
|
||||
}
|
||||
|
||||
.collapse-item-title i {
|
||||
color: $sidemenu-item-icon-color;
|
||||
}
|
||||
|
||||
&.active i {
|
||||
color: $sidemenu-item-icon-color--active
|
||||
}
|
||||
|
||||
.collapse-group-items {
|
||||
background-color: $sidemenu-submenu-bg;
|
||||
|
||||
.collapse-group-items {
|
||||
background-color: darken($sidemenu-submenu-bg, 5%);
|
||||
|
||||
.collapse-group-items {
|
||||
background-color: darken($sidemenu-submenu-bg, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
a.active {
|
||||
color: $sidemenu-item-font-color--active;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Horizontal Layout
|
||||
.header-bottom {
|
||||
background-color: $header-bottom-bg;
|
||||
border-bottom: 1px solid $ls-color-gray;
|
||||
}
|
||||
|
||||
.header-nav {
|
||||
li a {
|
||||
color: $header-menu-item-font-color;
|
||||
|
||||
&:hover {
|
||||
background-color: $header-menu-item-bg-color--hover;
|
||||
color: $header-menu-item-font-color;
|
||||
}
|
||||
}
|
||||
|
||||
li.active > a {
|
||||
color: $header-menu-item-font-color--active;
|
||||
background-color: $header-menu-item-bg-color--active;
|
||||
|
||||
&:hover {
|
||||
color: $header-menu-item-font-color--active;
|
||||
background-color: $header-menu-item-bg-color--active;
|
||||
}
|
||||
}
|
||||
|
||||
li .dropdown-item.active {
|
||||
color: $header-menu-item-font-color--active;
|
||||
background-color: $header-menu-item-bg-color--active;
|
||||
|
||||
&:hover, &:focus, &:active {
|
||||
color: $header-menu-item-font-color--active;
|
||||
background-color: $header-menu-item-bg-color--hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Tabs
|
||||
|
||||
// Tabs Default
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-default {
|
||||
.tabs-component-tab {
|
||||
a {
|
||||
color: $ls-color-black;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: $ls-color-black;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
a {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
border: 1px solid $ls-color-theme;
|
||||
background: $ls-color-theme;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-tab:hover {
|
||||
border: 1px solid $ls-color-theme;
|
||||
}
|
||||
|
||||
.tabs-component-panels {
|
||||
border-top: 1px solid $ls-color-theme !important;
|
||||
}
|
||||
}
|
||||
|
||||
// Tabs Vertical
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-vertical {
|
||||
.tabs-component-tabs {
|
||||
border-right: 1px solid $ls-color-theme !important;
|
||||
|
||||
.tabs-component-tab {
|
||||
a, a:hover {
|
||||
color: $ls-color-black;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
a {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
background: $ls-color-theme;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-tab:hover {
|
||||
border: 1px solid $ls-color-theme;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Tabs Simple
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-simple {
|
||||
.tabs-component-tabs .tabs-component-tab {
|
||||
a {
|
||||
color: $ls-color-gray--dark;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: $ls-color-gray--dark;
|
||||
border-bottom: 3px solid $ls-color-gray--dark;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
border-bottom: 3px solid $ls-color-theme;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
&.is-active a {
|
||||
color: $ls-color-black;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-component-panels {
|
||||
border-top: 1px solid $ls-color-gray--light !important;
|
||||
}
|
||||
}
|
||||
|
||||
// Tabs Simple Vertical
|
||||
//----------------------------------
|
||||
|
||||
.tabs-component.tabs-simple-vertical .tabs-component-tabs {
|
||||
border-right: 1px solid #ddd;
|
||||
|
||||
.tabs-component-tab {
|
||||
a {
|
||||
color: $ls-color-gray--dark;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
border-right: 3px solid lighten($ls-color-theme, 30%);
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
border-right: 3px solid $ls-color-theme;
|
||||
color: $ls-color-theme;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//MISC
|
||||
code, .code {
|
||||
background-color: $code-bg;
|
||||
color: $code-color;
|
||||
}
|
||||
|
||||
mark, .mark {
|
||||
background-color: $ls-color-theme;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.todo-container {
|
||||
h5 {
|
||||
color: $white !important;
|
||||
}
|
||||
|
||||
background-color: $ls-color-theme !important;
|
||||
color: $white !important;
|
||||
}
|
||||
|
||||
// Dropzone
|
||||
|
||||
.vue-dropzone .dz-preview {
|
||||
.dz-details {
|
||||
background-color: $ls-color-theme !important;
|
||||
color: $white !important;
|
||||
}
|
||||
|
||||
.dz-upload {
|
||||
background: $white !important;
|
||||
}
|
||||
|
||||
.dz-error-mark svg #Page-1 g {
|
||||
fill: $white !important;
|
||||
}
|
||||
|
||||
.dz-success-mark svg g path {
|
||||
fill: white !important;
|
||||
}
|
||||
|
||||
.dz-remove {
|
||||
color: $white !important;
|
||||
border: 2px $white solid !important;
|
||||
}
|
||||
}
|
||||
|
||||
//Dropdown
|
||||
.dropdown-group {
|
||||
|
||||
&.active > .dropdown-activator > a {
|
||||
color: $dropdown-activator-color--hover;
|
||||
}
|
||||
|
||||
.dropdown-activator a {
|
||||
color: $dropdown-activator-color;
|
||||
}
|
||||
|
||||
.dropdown-activator a:hover {
|
||||
background-color: $dropdown-bg--hover;
|
||||
}
|
||||
|
||||
&.has-child.toggle-arrow.active > .dropdown-activator::after {
|
||||
border-color: $dropdown-activator-color--hover transparent transparent;
|
||||
}
|
||||
|
||||
.dropdown-container {
|
||||
color: $dropdown-activator-color;
|
||||
background-color: $dropdown-bg;
|
||||
|
||||
.dropdown-group-item .dropdown-item {
|
||||
color: $dropdown-activator-color;
|
||||
background-color: transparent;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.dropdown-group-item .dropdown-item.active {
|
||||
color: $dropdown-activator-color--hover;
|
||||
}
|
||||
|
||||
.dropdown-group-item .dropdown-item:hover {
|
||||
background-color: $dropdown-bg--hover;
|
||||
|
||||
}
|
||||
|
||||
.dropdown-activator::before {
|
||||
border-color: $dropdown-activator-color transparent transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-container .dropdown-group.active .dropdown-activator {
|
||||
|
||||
a {
|
||||
color: $dropdown-activator-color--hover;
|
||||
}
|
||||
|
||||
&::before {
|
||||
border-color: $dropdown-activator-color--hover transparent transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-item-divider {
|
||||
border-top: 1px solid $dropdown-divider-bg;
|
||||
}
|
||||
}
|
||||
|
||||
//Buttons
|
||||
.btn-theme {
|
||||
// @include button-variant($ls-color-theme, $ls-color-theme);
|
||||
background: $ls-color-theme;
|
||||
color: $white;
|
||||
|
||||
&:hover {
|
||||
color: $white;
|
||||
background: lighten($ls-color-theme, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.btn-theme-outline {
|
||||
@include button-outline-variant($ls-color-theme);
|
||||
}
|
||||
|
||||
//Forms
|
||||
.form-control:focus {
|
||||
border: 1px solid $ls-color-theme;
|
||||
}
|
||||
|
||||
//Vue Select
|
||||
.multiselect {
|
||||
color: $ls-color-black;
|
||||
|
||||
.multiselect__option--highlight {
|
||||
background: $ls-color-gray--very-light;
|
||||
color: $ls-color-black;
|
||||
|
||||
&.multiselect__option--selected {
|
||||
background: $ls-color-gray--light;
|
||||
color: $ls-color-black;
|
||||
|
||||
&::after {
|
||||
background: $ls-color-gray;
|
||||
color: $ls-color-black;
|
||||
}
|
||||
}
|
||||
|
||||
&::after {
|
||||
background: $ls-color-gray;
|
||||
color: $ls-color-black;
|
||||
}
|
||||
}
|
||||
|
||||
.multiselect__tags-wrap {
|
||||
.multiselect__tag {
|
||||
background: $ls-color-theme;
|
||||
color: $white;
|
||||
|
||||
.multiselect__tag-icon {
|
||||
&:hover {
|
||||
background: $ls-color-theme;
|
||||
}
|
||||
|
||||
&::after {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//DATEPICKER
|
||||
.vdp-datepicker__calendar .cell {
|
||||
|
||||
&:not(.blank):not(.disabled) {
|
||||
|
||||
&.day:hover,
|
||||
&.month:hover,
|
||||
&.year:hover {
|
||||
border: 1px solid $ls-color-theme !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.selected {
|
||||
background: $ls-color-theme !important;
|
||||
color:$white;
|
||||
}
|
||||
|
||||
&.highlighted {
|
||||
background:lighten($ls-color-theme,25%) !important;
|
||||
color:$white;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// Vue-Carousel
|
||||
.VueCarousel-dot {
|
||||
|
||||
.VueCarousel-dot-button {
|
||||
background: $ls-color-gray--dark!important;
|
||||
}
|
||||
|
||||
&.VueCarousel-dot--active {
|
||||
.VueCarousel-dot-button {
|
||||
background: $ls-color-theme !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//MAILBOX
|
||||
.mailbox .mailbox-content {
|
||||
|
||||
.table tr td .content-subject {
|
||||
color: $mailbox-font-color;
|
||||
}
|
||||
|
||||
.mailbox-content-footer {
|
||||
|
||||
.page-link {
|
||||
color: $mailbox-font-color;
|
||||
}
|
||||
|
||||
.active .page-link {
|
||||
background-color: $mailbox-page-link-bg;
|
||||
border-color: $mailbox-page-link-bg;
|
||||
color: $mailbox-page-link;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-favorite .active {
|
||||
color: $ls-color-theme;
|
||||
}
|
||||
}
|
||||
|
||||
.mailbox-modal .mail-body .message-heading.email a {
|
||||
color: $ls-color-black;
|
||||
}
|
||||
|
||||
.mailbox .mailbox-sidebar {
|
||||
|
||||
.sidebar-menu li.active {
|
||||
border-left: 5px solid $ls-color-theme;
|
||||
}
|
||||
.sidebar-menu li a{
|
||||
color: $mailbox-font-color;
|
||||
}
|
||||
|
||||
.left-sidebar-btn {
|
||||
color: $mailbox-font-color;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $x-small-breakpoint) {
|
||||
.header-nav .dropdown-menu {
|
||||
border: 0 !important;
|
||||
background-color: $sidemenu-submenu-bg !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
181
resources/assets/sass/variables.scss
vendored
181
resources/assets/sass/variables.scss
vendored
@ -1,181 +0,0 @@
|
||||
// Font Awesome
|
||||
// -------------------------
|
||||
|
||||
$fa-css-prefix: icon-fa !default;
|
||||
|
||||
// Colors
|
||||
// -------------------------
|
||||
|
||||
$crater-theme: #5851D8;
|
||||
$crater-theme--light: #817AE3;
|
||||
$crater-theme--very-light: rgba(88, 81, 216, 0.2);
|
||||
$gray--very-light: #F9FBFF;
|
||||
$gray--light: #EBF1FA;
|
||||
$gray: #B9C1D1;
|
||||
$gray--dark: #A5ACC1;
|
||||
$gray--very-dark: #595959;
|
||||
$red--dark: #9B2C2C;
|
||||
$red--very-light: #FED7D7;
|
||||
|
||||
|
||||
$ls-color-black: #040405;
|
||||
$ls-color-black--light: #263B5E;
|
||||
$ls-color-blue: #15B2EC;
|
||||
$ls-color-green: #00C99C;
|
||||
$ls-color-red: #FB7178;
|
||||
$ls-color-secondary: #55547A;
|
||||
$ls-color-gray--very-light: $gray--very-light;
|
||||
$ls-color-gray--light: $gray--light;
|
||||
$ls-color-gray: $gray;
|
||||
$ls-color-gray--dark: $gray--dark;
|
||||
$ls-color-gray--very-dark: $gray--very-dark;
|
||||
$ls-color-light-blue: #15B2EC;
|
||||
$ls-color-orange: #F3AF4E;
|
||||
|
||||
$ls-color-red--dark: $red--dark;
|
||||
$ls-color-red--very-light: $red--very-light;
|
||||
|
||||
$color-warning-light: #6C432E;
|
||||
$warning-light: #F8EDCB;
|
||||
$color-success-light: #354930;
|
||||
$success-light: #D5EED0;
|
||||
|
||||
// Theme Colors
|
||||
// -------------------------
|
||||
|
||||
$ls-color-primary: $crater-theme;
|
||||
$ls-color-primary--light: $crater-theme--light;
|
||||
$ls-color-primary--very-light: $crater-theme--very-light;
|
||||
|
||||
|
||||
// Gradients
|
||||
// -------------------------
|
||||
|
||||
$primary-to-primary-light-gradient: linear-gradient(to right, $ls-color-primary, $ls-color-primary--light);
|
||||
$primary-light-to-primary-gradient: linear-gradient(to right, $ls-color-primary--light, $ls-color-primary);
|
||||
|
||||
// Shadows
|
||||
// -------------------------
|
||||
|
||||
$shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
|
||||
$shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
||||
$shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
|
||||
$shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
|
||||
$shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
|
||||
$shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
|
||||
$shadow-outline: 0 0 0 3px rgba(66, 153, 225, 0.5);
|
||||
|
||||
// Bootstrap Overrides
|
||||
// -------------------------
|
||||
|
||||
$white: #fff;
|
||||
$brand-primary: $crater-theme;
|
||||
$brand-secondary: $ls-color-black;
|
||||
$brand-success: $ls-color-green;
|
||||
$brand-info: $ls-color-light-blue;
|
||||
$brand-warning: $ls-color-orange;
|
||||
$brand-danger: $ls-color-red;
|
||||
$brand-dark: $ls-color-secondary;
|
||||
|
||||
$btn-secondary-color: $white;
|
||||
$btn-secondary-bg: $ls-color-black;
|
||||
$btn-secondary-border: $ls-color-black;
|
||||
|
||||
$theme-colors: (
|
||||
primary: $ls-color-primary,
|
||||
secondary: $ls-color-secondary,
|
||||
success: $ls-color-green,
|
||||
info: $ls-color-light-blue,
|
||||
warning: $ls-color-orange,
|
||||
danger: $ls-color-red,
|
||||
light: $ls-color-primary--light,
|
||||
dark: $ls-color-secondary
|
||||
);
|
||||
|
||||
$navbar-dark-toggler-icon-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{str-replace(str-replace(#{$navbar-dark-color}, "(", "%28"), ")", "%29")}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
|
||||
$navbar-light-toggler-icon-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{str-replace(str-replace(#{$navbar-light-color}, "(", "%28"), ")", "%29")}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
|
||||
|
||||
|
||||
// -- HEADER SECTION --
|
||||
|
||||
$header-bg-color: $ls-color-primary;
|
||||
$header-font-color: $white;
|
||||
$header-buttons-bg-color: $ls-color-black;
|
||||
$header-buttons-bg-color--hover: lighten($ls-color-black,5%);
|
||||
$header-buttons-font-color: $white;
|
||||
|
||||
|
||||
// -- SIDEBAR SECTION --
|
||||
$sidebar-bg-color: $ls-color-secondary;
|
||||
$sidebar-font-color: $white;
|
||||
$sidebar-icon-color: #9EA9C4;
|
||||
$sidemenu-item-bg-color--hover: lighten($ls-color-black,10%);
|
||||
$sidemenu-item-bg-color--active: transparent;
|
||||
$sidemenu-item-font-color: $white;
|
||||
$sidemenu-item-font-color--active: $ls-color-primary;
|
||||
$sidemenu-arrow-color: $ls-color-gray--very-dark;
|
||||
$sidemenu-submenu-bg: lighten($ls-color-black,3%);
|
||||
|
||||
|
||||
// -- DROPDOWN --
|
||||
$dropdown-bg: $ls-color-black;
|
||||
$dropdown-link-color : $white;
|
||||
$dropdown-border-color : $ls-color-black;
|
||||
$dropdown-divider-bg : $ls-color-gray--very-dark;
|
||||
$dropdown-header-color : $ls-color-primary;
|
||||
$dropdown-header-border-color : $ls-color-gray--very-dark;
|
||||
|
||||
// -- HORIZONTAL MENU --
|
||||
|
||||
$header-bottom-bg : $ls-color-black;
|
||||
$header-menu-item-font-color : darken($white,10%);
|
||||
$header-menu-item-font-color--active : $white;
|
||||
$header-menu-item-bg-color--hover : lighten($ls-color-black,10%);
|
||||
$header-menu-item-bg-color--active : lighten($ls-color-black,10%);
|
||||
|
||||
// -- MISC --
|
||||
$code-bg : $ls-color-black;
|
||||
$code-color : $ls-color-primary;
|
||||
|
||||
|
||||
// Fonts
|
||||
//----------------------------------
|
||||
|
||||
$base-font-family : 'Poppins', sans-serif;
|
||||
$base-font-color : lighten($ls-color-black, 15%);
|
||||
$heading-font-color : $ls-color-black;
|
||||
$font-family-base : $base-font-family;
|
||||
|
||||
$font-size-base: 1rem;
|
||||
$font-size-section-title : 1.25rem;
|
||||
$font-size-semi-section-title : 1.1rem;
|
||||
$font-size-page-title : 1.5rem;
|
||||
|
||||
|
||||
|
||||
// Breakpoints
|
||||
//----------------------------------
|
||||
|
||||
$x-small-breakpoint : 480px;
|
||||
$x-small-breakpoint-below : $x-small-breakpoint - 1px;
|
||||
$small-breakpoint : 768px;
|
||||
$small-breakpoint-below : $small-breakpoint - 1px;
|
||||
$medium-breakpoint : 992px;
|
||||
$medium-breakpoint-below : $medium-breakpoint - 1px;
|
||||
$large-breakpoint : 1240px;
|
||||
$large-breakpoint-below : $large-breakpoint - 1px;
|
||||
$x-large-breakpoint : 1800px;
|
||||
$x-large-breakpoint-below : $x-large-breakpoint - 1px;
|
||||
|
||||
|
||||
|
||||
// Other
|
||||
//----------------------------------
|
||||
|
||||
$ls-login-bg-color-overlay: rgba(38 ,50 ,56,.6);
|
||||
$ls-login-3-bg-color-overlay: rgba(0, 0 , 0, .35);
|
||||
|
||||
$headings-margin-bottom: 1.2rem;
|
||||
$card-cap-bg: #fff;
|
||||
|
||||
$pace-loader-color : darken($ls-color-primary, 10%);
|
||||
Reference in New Issue
Block a user