Update various configuration files, components, and assets; enhance notification system and API endpoints; improve documentation and styles across the application.
This commit is contained in:
Haqeem Solehan
27
assets/style/scss/custom/library/_dropdown.scss
Normal file
27
assets/style/scss/custom/library/_dropdown.scss
Normal file
@@ -0,0 +1,27 @@
|
||||
$small: 640px;
|
||||
$medium: 768px;
|
||||
$large: 1024px;
|
||||
$xlarge: 1280px;
|
||||
|
||||
.s-dropdown {
|
||||
background-color: white;
|
||||
padding: 10px 0;
|
||||
border-radius: 5px;
|
||||
top: 65px !important;
|
||||
border: 1px solid rgb(229, 231, 235);
|
||||
box-shadow: 0px 0px 10px rgba(226, 232, 240, 0.2);
|
||||
|
||||
@media screen and (max-width: $medium) {
|
||||
left: 0px !important;
|
||||
width: 100% !important;
|
||||
margin: 0px 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.dark {
|
||||
.s-dropdown {
|
||||
background-color: #1e293b;
|
||||
box-shadow: 0px 0px 10px rgba(15, 23, 42, 0.2);
|
||||
border: 1px solid #182130;
|
||||
}
|
||||
}
|
||||
19
assets/style/scss/custom/library/_floatingvue.scss
Normal file
19
assets/style/scss/custom/library/_floatingvue.scss
Normal file
@@ -0,0 +1,19 @@
|
||||
.v-popper--theme-dropdown .v-popper__inner {
|
||||
background: rgb(var(--bg-2)) !important;
|
||||
border: 0px !important;
|
||||
color: rgb(var(--text-color)) !important;
|
||||
}
|
||||
|
||||
// Disable arrow
|
||||
.v-popper__arrow-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// .v-popper--theme-my-theme .v-popper__inner {
|
||||
// background: #fff000;
|
||||
// color: black;
|
||||
// padding: 24px;
|
||||
// border-radius: 6px;
|
||||
// border: 1px solid #ddd;
|
||||
// box-shadow: 0 6px 30px rgba(0, 0, 0, 0.1);
|
||||
// }
|
||||
237
assets/style/scss/custom/library/_formkit.scss
Normal file
237
assets/style/scss/custom/library/_formkit.scss
Normal file
@@ -0,0 +1,237 @@
|
||||
$small: 640px;
|
||||
$medium: 768px;
|
||||
$large: 1024px;
|
||||
$xlarge: 1280px;
|
||||
|
||||
.formkit-form {
|
||||
.form-wizard {
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
&.top-form {
|
||||
.formkit-actions {
|
||||
button[type="submit"] {
|
||||
display: block;
|
||||
margin-right: 0;
|
||||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
ul.top-steps {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
margin-bottom: 1rem;
|
||||
gap: 1rem;
|
||||
|
||||
@media screen and (max-width: $medium) {
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
}
|
||||
|
||||
li {
|
||||
flex-grow: 1;
|
||||
display: inline-block;
|
||||
|
||||
.progress {
|
||||
position: relative;
|
||||
bottom: -8px;
|
||||
width: 0%;
|
||||
height: 8px;
|
||||
border-radius: 10px;
|
||||
background-color: rgb(var(--color-primary));
|
||||
transition: width 0.25s ease-in;
|
||||
}
|
||||
|
||||
.step--errors {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
float: right;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background-color: #f23131;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.counter {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
border-radius: 10px;
|
||||
background-color: rgb(var(--bg-1));
|
||||
}
|
||||
|
||||
&[data-step-active="true"] {
|
||||
color: rgb(var(--color-primary));
|
||||
font-weight: 600;
|
||||
|
||||
.progress {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&[data-step-active="false"] {
|
||||
color: rgb(var(--bg-1));
|
||||
.progress {
|
||||
width: 0%;
|
||||
}
|
||||
}
|
||||
|
||||
&[data-step-completed="true"] {
|
||||
color: rgb(var(--color-primary));
|
||||
font-weight: 600;
|
||||
.progress {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.left-form {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
grid-template-columns: 230px auto;
|
||||
|
||||
@media screen and (max-width: $medium) {
|
||||
grid-template-columns: repeat(1, minmax(0, 1fr));
|
||||
gap: 0rem;
|
||||
}
|
||||
|
||||
.formkit-actions {
|
||||
grid-column: span 2 / span 2;
|
||||
|
||||
@media screen and (max-width: $medium) {
|
||||
grid-column: span 1 / span 1;
|
||||
}
|
||||
|
||||
button[type="submit"] {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
ul.left-steps {
|
||||
display: block;
|
||||
li {
|
||||
margin-bottom: 1rem;
|
||||
.progress {
|
||||
position: relative;
|
||||
bottom: -8px;
|
||||
width: 0%;
|
||||
height: 8px;
|
||||
border-radius: 10px;
|
||||
background-color: rgb(var(--color-primary));
|
||||
transition: width 0.25s ease-in;
|
||||
}
|
||||
|
||||
.step--errors {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
float: right;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background-color: #f23131;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.counter {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
border-radius: 10px;
|
||||
background-color: rgb(var(--bg-1));
|
||||
}
|
||||
|
||||
&[data-step-active="true"] {
|
||||
color: rgb(var(--color-primary));
|
||||
font-weight: 600;
|
||||
|
||||
.progress {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&[data-step-active="false"] {
|
||||
color: rgb(var(--bg-1));
|
||||
.progress {
|
||||
width: 0%;
|
||||
}
|
||||
}
|
||||
|
||||
&[data-step-completed="true"] {
|
||||
color: rgb(var(--color-primary));
|
||||
font-weight: 600;
|
||||
.progress {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Custom Formkit Input for VSelect
|
||||
.formkit-vselect {
|
||||
margin-bottom: 1rem;
|
||||
|
||||
.vs__dropdown-menu {
|
||||
background: rgb(var(--bg-2));
|
||||
}
|
||||
|
||||
.vs__dropdown-menu li {
|
||||
background: rgb(var(--bg-1));
|
||||
color: rgb(var(--text-color));
|
||||
}
|
||||
|
||||
.vs__dropdown-toggle {
|
||||
min-height: 2.5rem;
|
||||
padding-left: 0.75rem;
|
||||
padding-right: 0.75rem;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
color: rgb(var(--color-primary));
|
||||
|
||||
border-width: 1px;
|
||||
border-radius: 0.5rem;
|
||||
margin-bottom: 0px;
|
||||
border-color: rgb(var(--fk-border-color));
|
||||
|
||||
.vs__selected {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
padding-top: 0.25rem;
|
||||
padding-bottom: 0.25rem;
|
||||
|
||||
background-color: rgb(var(--color-primary));
|
||||
color: white;
|
||||
|
||||
border: 0;
|
||||
border-radius: 0.5rem;
|
||||
|
||||
gap: 0.25rem;
|
||||
margin-right: 0.35rem;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Custom Decorator
|
||||
input[type="checkbox"]:checked.icon-check + .formkit-decorator::before {
|
||||
content: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-check"><polyline points="20 6 9 17 4 12"></polyline></svg>');
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
}
|
||||
114
assets/style/scss/custom/library/_fullcalendar.scss
Normal file
114
assets/style/scss/custom/library/_fullcalendar.scss
Normal file
@@ -0,0 +1,114 @@
|
||||
$small: 640px;
|
||||
$medium: 768px;
|
||||
$large: 1024px;
|
||||
$xlarge: 1280px;
|
||||
|
||||
.fc-theme-standard td,
|
||||
.fc-theme-standard th {
|
||||
border-color: rgb(var(--bg-1)) !important;
|
||||
}
|
||||
|
||||
// Overwrite fullcalendar styles light
|
||||
.fc {
|
||||
.fc-scrollgrid {
|
||||
border: 1px solid rgb(var(--bg-1)) !important;
|
||||
}
|
||||
|
||||
.fc-toolbar {
|
||||
@media screen and (max-width: $medium) {
|
||||
flex-direction: column;
|
||||
align-items: flex-start !important;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.fc-toolbar-chunk {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-button {
|
||||
padding: 0.75rem 1rem !important;
|
||||
|
||||
&.fc-button-primary {
|
||||
background-color: transparent !important;
|
||||
color: rgb(var(--color-primary));
|
||||
border-color: rgb(var(--color-primary)) !important;
|
||||
}
|
||||
|
||||
&.fc-button-active {
|
||||
background-color: rgb(var(--color-primary)) !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: rgb(var(--color-primary)) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
box-shadow: 0 0 0 0.05rem rgba(255, 113, 133, 0.5) !important;
|
||||
background-color: rgb(var(--color-primary)) !important;
|
||||
color: white !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-view-harness {
|
||||
table {
|
||||
&.fc-col-header {
|
||||
td,
|
||||
th {
|
||||
border-color: rgb(var(--bg-1)) !important;
|
||||
}
|
||||
|
||||
.fc-col-header-cell {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-daygrid-day {
|
||||
&.fc-day-today {
|
||||
background-color: rgb(var(--bg-1));
|
||||
background: rgb(var(--bg-1));
|
||||
}
|
||||
}
|
||||
|
||||
.fc-daygrid-day-top {
|
||||
color: #6b727f !important;
|
||||
}
|
||||
|
||||
.fc-more-link {
|
||||
color: rgb(var(--color-primary));
|
||||
}
|
||||
}
|
||||
|
||||
.fc-daygrid-event-harness {
|
||||
.fc-daygrid-event {
|
||||
padding: 0.5rem 1rem;
|
||||
}
|
||||
|
||||
.fc-h-event {
|
||||
&.fc-event-start {
|
||||
border-color: rgb(var(--color-primary));
|
||||
background-color: rgb(var(--color-primary));
|
||||
}
|
||||
}
|
||||
}
|
||||
.fc-list {
|
||||
.fc-list-event-dot {
|
||||
background-color: rgb(var(--color-primary));
|
||||
border: 5px solid #f3f4f6;
|
||||
border-color: rgb(var(--color-primary)) !important;
|
||||
}
|
||||
|
||||
.fc-list-day-cushion {
|
||||
background-color: #f3f4f6;
|
||||
padding: 0.5rem 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-popover-header {
|
||||
padding: 0.5rem !important;
|
||||
background: #f3f4f6;
|
||||
}
|
||||
}
|
||||
81
assets/style/scss/custom/library/_nprogress.scss
Normal file
81
assets/style/scss/custom/library/_nprogress.scss
Normal file
@@ -0,0 +1,81 @@
|
||||
/* Make clicks pass-through */
|
||||
#nprogress {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#nprogress .bar {
|
||||
background: #fb7185;
|
||||
|
||||
position: fixed;
|
||||
z-index: 1031;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
}
|
||||
|
||||
/* Fancy blur effect */
|
||||
#nprogress .peg {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
width: 100px;
|
||||
height: 100%;
|
||||
box-shadow: 0 0 10px #fb7185, 0 0 5px #fb7185;
|
||||
opacity: 1;
|
||||
|
||||
-webkit-transform: rotate(3deg) translate(0px, -4px);
|
||||
-ms-transform: rotate(3deg) translate(0px, -4px);
|
||||
transform: rotate(3deg) translate(0px, -4px);
|
||||
}
|
||||
|
||||
/* Remove these to get rid of the spinner */
|
||||
#nprogress .spinner {
|
||||
display: block;
|
||||
position: fixed;
|
||||
z-index: 1031;
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
}
|
||||
|
||||
#nprogress .spinner-icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
box-sizing: border-box;
|
||||
|
||||
border: solid 2px transparent;
|
||||
border-top-color: #fb7185;
|
||||
border-left-color: #fb7185;
|
||||
border-radius: 50%;
|
||||
|
||||
-webkit-animation: nprogress-spinner 400ms linear infinite;
|
||||
animation: nprogress-spinner 400ms linear infinite;
|
||||
}
|
||||
|
||||
.nprogress-custom-parent {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nprogress-custom-parent #nprogress .spinner,
|
||||
.nprogress-custom-parent #nprogress .bar {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
@-webkit-keyframes nprogress-spinner {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes nprogress-spinner {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
18
assets/style/scss/custom/library/_swiper.scss
Normal file
18
assets/style/scss/custom/library/_swiper.scss
Normal file
@@ -0,0 +1,18 @@
|
||||
.swiper-button-next,
|
||||
.swiper-button-prev {
|
||||
color: #4B5563 !important;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
.swiper-button-next:after,
|
||||
.swiper-button-prev:after {
|
||||
font-size: 1.5rem !important;
|
||||
}
|
||||
|
||||
.swiper-pagination-bullet {
|
||||
background-color: #8b98a9 !important;
|
||||
}
|
||||
|
||||
.swiper-pagination-bullet-active {
|
||||
background: #4B5563 !important;
|
||||
}
|
||||
7
assets/style/scss/custom/library/_vuecountryflag.scss
Normal file
7
assets/style/scss/custom/library/_vuecountryflag.scss
Normal file
@@ -0,0 +1,7 @@
|
||||
.flag.normal-flag {
|
||||
margin: 0em -1em -0em -1em !important;
|
||||
transform: scale(0.38) !important;
|
||||
-ms-transform: scale(0.38) !important;
|
||||
-webkit-transform: scale(0.38) !important;
|
||||
-moz-transform: scale(0.38) !important;
|
||||
}
|
||||
3
assets/style/scss/custom/library/_vuetoastification.scss
Normal file
3
assets/style/scss/custom/library/_vuetoastification.scss
Normal file
@@ -0,0 +1,3 @@
|
||||
.Vue-Toastification__toast {
|
||||
padding: 18px 21px;
|
||||
}
|
||||
Reference in New Issue
Block a user