koneko/laravel-vuexy-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Arturo Corro
2025-03-07 00:29:07 -06:00
commit b21a11c2ee
564 changed files with 94041 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
resources/assets/vendor/scss/_bootstrap-dark.scss vendored Normal file
View File

@ -0,0 +1,39 @@
@import '_bootstrap-extended/include-dark';
// Import bootstrap core scss from node_module
// ! Utilities are customized and added in bootstrap-extended
// Layout & components
@import 'bootstrap/scss/root';
@import 'bootstrap/scss/reboot';
@import 'bootstrap/scss/type';
@import 'bootstrap/scss/images';
@import 'bootstrap/scss/containers';
@import 'bootstrap/scss/grid';
@import 'bootstrap/scss/tables';
@import 'bootstrap/scss/forms';
@import 'bootstrap/scss/buttons';
@import 'bootstrap/scss/transitions';
@import 'bootstrap/scss/dropdown';
@import 'bootstrap/scss/button-group';
@import 'bootstrap/scss/nav';
@import 'bootstrap/scss/navbar';
@import 'bootstrap/scss/card';
@import 'bootstrap/scss/accordion';
@import 'bootstrap/scss/breadcrumb';
@import 'bootstrap/scss/pagination';
@import 'bootstrap/scss/badge';
@import 'bootstrap/scss/alert';
@import 'bootstrap/scss/progress';
@import 'bootstrap/scss/list-group';
@import 'bootstrap/scss/close';
@import 'bootstrap/scss/toasts';
@import 'bootstrap/scss/modal';
@import 'bootstrap/scss/tooltip';
@import 'bootstrap/scss/popover';
@import 'bootstrap/scss/carousel';
@import 'bootstrap/scss/spinners';
@import 'bootstrap/scss/offcanvas';
// Helpers
@import 'bootstrap/scss/helpers';

40
resources/assets/vendor/scss/_bootstrap-extended-dark.scss vendored Normal file
View File

@ -0,0 +1,40 @@
@import '_bootstrap-extended/include-dark';
// Import bootstrap extended scss
@import '_bootstrap-extended/root';
@import '_bootstrap-extended/reboot';
@import '_bootstrap-extended/type';
@import '_bootstrap-extended/utilities';
@import '_bootstrap-extended/tables';
@import '_bootstrap-extended/buttons';
@import '_bootstrap-extended/button-group';
@import '_bootstrap-extended/badge';
@import '_bootstrap-extended/dropdown';
@import '_bootstrap-extended/nav';
@import '_bootstrap-extended/pagination';
@import '_bootstrap-extended/alert';
@import '_bootstrap-extended/tooltip';
@import '_bootstrap-extended/popover';
@import '_bootstrap-extended/forms';
@import '_bootstrap-extended/modal';
@import '_bootstrap-extended/progress';
@import '_bootstrap-extended/breadcrumb';
@import '_bootstrap-extended/list-group';
@import '_bootstrap-extended/navbar';
@import '_bootstrap-extended/card';
@import '_bootstrap-extended/accordion';
@import '_bootstrap-extended/close';
@import '_bootstrap-extended/toasts';
@import '_bootstrap-extended/carousel';
@import '_bootstrap-extended/spinners';
@import '_bootstrap-extended/offcanvas';
// Common Utilities
@import 'bootstrap/scss/utilities/api';
// LTR Utilities
@include ltr-only {
@import '_bootstrap-extended/utilities-ltr';
@import 'bootstrap/scss/utilities/api';
}

39
resources/assets/vendor/scss/_bootstrap-extended.scss vendored Normal file
View File

@ -0,0 +1,39 @@
@import '_bootstrap-extended/include';
// Import bootstrap extended scss
@import '_bootstrap-extended/root';
@import '_bootstrap-extended/reboot';
@import '_bootstrap-extended/type';
@import '_bootstrap-extended/utilities';
@import '_bootstrap-extended/tables';
@import '_bootstrap-extended/buttons';
@import '_bootstrap-extended/button-group';
@import '_bootstrap-extended/badge';
@import '_bootstrap-extended/dropdown';
@import '_bootstrap-extended/nav';
@import '_bootstrap-extended/pagination';
@import '_bootstrap-extended/alert';
@import '_bootstrap-extended/tooltip';
@import '_bootstrap-extended/popover';
@import '_bootstrap-extended/forms';
@import '_bootstrap-extended/modal';
@import '_bootstrap-extended/progress';
@import '_bootstrap-extended/breadcrumb';
@import '_bootstrap-extended/list-group';
@import '_bootstrap-extended/navbar';
@import '_bootstrap-extended/card';
@import '_bootstrap-extended/accordion';
@import '_bootstrap-extended/close';
@import '_bootstrap-extended/toasts';
@import '_bootstrap-extended/carousel';
@import '_bootstrap-extended/spinners';
@import '_bootstrap-extended/offcanvas';
// Common Utilities
@import 'bootstrap/scss/utilities/api';
// LTR Utilities
@include ltr-only {
@import '_bootstrap-extended/utilities-ltr';
@import 'bootstrap/scss/utilities/api';
}

250
resources/assets/vendor/scss/_bootstrap-extended/_accordion.scss vendored Normal file
View File

@ -0,0 +1,250 @@
// Accordions
// *******************************************************************************
// arrow left
.accordion-arrow-left {
.accordion-button.collapsed:focus {
box-shadow: none;
}
.accordion-item {
border: 0;
}
.accordion-button {
padding: var(--#{$prefix}accordion-btn-padding-y) 0;
// Accordion icon
&::after {
content: '';
display: none;
}
&:not(.collapsed) {
color: var(--#{$prefix}accordion-active-color);
background-color: var(--#{$prefix}accordion-active-bg);
box-shadow: none; // stylelint-disable-line function-disallowed-list
&::before {
background-image: var(--#{$prefix}accordion-btn-active-icon);
transform: var(--#{$prefix}accordion-btn-icon-transform);
}
&::after {
background-image: none;
transform: none;
}
}
&.collapsed::before {
transform: rotate(-90deg);
}
&::before {
flex-shrink: 0;
width: var(--#{$prefix}accordion-btn-icon-width);
height: var(--#{$prefix}accordion-btn-icon-width);
margin-left: 0;
margin-top: 0.75rem;
margin-right: 0.9rem;
content: '';
background-image: var(--#{$prefix}accordion-btn-icon);
background-repeat: no-repeat;
background-size: var(--#{$prefix}accordion-btn-icon-width);
@include transition(var(--#{$prefix}accordion-btn-icon-transition));
}
}
}
// Solid variant icon color
.accordion[class*='accordion-solid-'] {
.accordion-button::after {
background-image: str-replace(str-replace($accordion-button-icon, '#{$accordion-icon-color}', $white), '#', '%23');
}
}
// Solid Accordion With Active Border
.accordion[class*='accordion-border-solid-'] {
.accordion-button.collapsed::after {
background-image: str-replace(str-replace($accordion-button-icon, '#{$accordion-icon-color}', $white), '#', '%23');
}
}
.accordion-header + .accordion-collapse .accordion-body {
padding-top: 0;
padding-bottom: 1.25rem;
}
// accordion without icon
.accordion {
&.accordion-without-arrow {
.accordion-button::after {
background-image: none !important;
}
}
}
.accordion-header {
line-height: $line-height-base;
}
.accordion:not(.accordion-custom-button):not(.accordion-arrow-left) .accordion-item {
box-shadow: $box-shadow-xs;
border: 0;
&:not(:first-child) {
margin-top: $spacer * 0.5;
}
&:last-child {
margin-bottom: $spacer * 0.5;
}
&.active {
box-shadow: $box-shadow;
& .accordion-button:not(.collapsed) {
box-shadow: none;
}
}
}
// Accordion border radius
.accordion-button {
font-weight: inherit;
align-items: unset;
@include border-top-radius($accordion-border-radius);
&.collapsed {
@include border-radius($accordion-border-radius);
}
&.collapsed {
&::after {
transform: rotate(-90deg);
}
}
}
// added box shadow
.accordion {
&:not(.accordion-bordered) > .card.accordion-item {
box-shadow: $box-shadow-xs;
&.active {
box-shadow: $card-box-shadow;
}
}
}
.accordion-header + .accordion-collapse .accordion-body {
padding-top: 0;
}
// Accordion custom button
.accordion-custom-button {
.accordion-item {
transition: $accordion-transition;
transition-property: margin-top, margin-bottom, border-radius, border;
box-shadow: none;
border: $accordion-border-width solid $accordion-border-color;
&:not(:last-child) {
border-bottom: 0;
}
&:not(.active):not(:first-child) {
.accordion-header {
border: none;
}
}
.accordion-button {
border-color: $accordion-border-color;
}
&.active {
margin: 0;
box-shadow: none;
.accordion-header .accordion-button:focus {
border-bottom: $accordion-border-width solid $accordion-border-color;
}
& + .accordion-item {
@include border-top-radius(0);
}
&:not(:first-child) {
@include border-top-radius(0);
}
&:not(:last-child) {
@include border-bottom-radius(0);
}
}
.accordion-body {
padding-top: $accordion-body-padding-x;
}
&.previous-active {
@include border-bottom-radius(0);
}
}
.accordion-button {
border-radius: 0;
background-color: #fafafa;
&:not(.collapsed) {
&::after {
background-image: escape-svg($accordion-custom-button-active-icon);
transform: rotate(-180deg);
}
}
// Accordion icon
&::after {
background-image: escape-svg($accordion-custom-button-icon);
}
}
&:focus {
z-index: 3;
border-color: $border-color;
outline: 0;
box-shadow: var(--#{$prefix}accordion-btn-focus-box-shadow);
}
}
// RTL
// *******************************************************************************
@include rtl-only {
.accordion-arrow-left {
.accordion-button {
&::before {
margin-left: 1.1rem;
margin-right: 0;
transform: rotate(90deg);
}
&:not(.collapsed)::before {
transform: rotate(0deg);
}
// !- For RTL accordion icon rotation in other templates
// &:not(.collapsed)::before {
// transform: rotate(90deg);
// }
}
}
.accordion-button {
text-align: right;
&::after {
margin-left: 0;
margin-right: auto;
}
&.collapsed {
&::after {
transform: rotate(90deg);
}
}
}
.accordion-custom-button {
.accordion-button:not(.collapsed)::after {
transform: rotate(180deg);
}
}
}
//Dark style
// *******************************************************************************
@include dark-layout-only {
.accordion-custom-button {
.accordion-button {
background-color: #353a52;
}
}
.accordion:not(.accordion-custom-button):not(.accordion-arrow-left) .accordion-item {
box-shadow: $box-shadow-xs;
&.active {
box-shadow: $box-shadow;
}
}
}

53
resources/assets/vendor/scss/_bootstrap-extended/_alert.scss vendored Normal file
View File

@ -0,0 +1,53 @@
// Alerts
// *******************************************************************************
// Alert mixins
@each $state, $value in $theme-colors {
@if $state != primary and $state != light {
@include template-alert-variant('.alert-#{$state}', $value);
@include template-alert-outline-variant('.alert-outline-#{$state}', $value);
@include template-alert-solid-variant('.alert-solid-#{$state}', $value);
}
}
// Alert and alert-icon styles
.alert {
line-height: 1.375rem;
.alert-icon {
color: $white;
height: $alert-icon-size;
width: $alert-icon-size;
padding: $spacer * 0.75;
margin-right: $spacer;
display: flex;
align-items: center;
justify-content: center;
}
&[class*='alert-solid-'] {
.alert-icon {
background-color: $white;
box-shadow: $box-shadow-xs;
:before {
font-size: 1.375rem;
}
}
}
}
// RTL
// *******************************************************************************
@include rtl-only {
.alert-dismissible {
padding-left: $alert-dismissible-padding-r;
padding-right: $alert-padding-x;
}
.alert-dismissible .btn-close {
right: auto;
left: 0;
}
.alert .alert-icon {
margin-right: 0;
margin-left: $spacer;
}
}

53
resources/assets/vendor/scss/_bootstrap-extended/_badge.scss vendored Normal file
View File

@ -0,0 +1,53 @@
// Badges
// ? Bootstrap use bg-label-variant and bg color for solid and label style, hence we have not created mixin for that.
// *******************************************************************************
@each $color, $value in $theme-colors {
@if $color != primary and $color != light {
@include bg-glow-variant('.bg-#{$color}', $value);
}
}
// Badge Center Style
.badge-center {
padding: 3px;
line-height: 1.375;
@include badge-size($badge-height, $badge-width, $badge-center-font-size);
i {
font-size: 0.875rem;
}
}
// Dots Style
.badge.badge-dot {
display: inline-block;
margin: 0;
padding: 0;
width: 0.5rem;
height: 0.5rem;
border-radius: 50%;
vertical-align: middle;
}
// Notifications
.badge.badge-notifications {
position: absolute;
top: auto;
display: inline-block;
margin: 0;
transform: translate(-50%, -45%);
@include rtl-style {
transform: translate(50%, -45%);
}
&:not(.badge-dot) {
padding: 0.063rem 0.112rem;
font-size: 0.75rem;
line-height: 0.875rem;
@include border-radius(50rem);
}
}

62
resources/assets/vendor/scss/_bootstrap-extended/_breadcrumb.scss vendored Normal file
View File

@ -0,0 +1,62 @@
// Breadcrumbs
// *******************************************************************************
.breadcrumb-item,
.breadcrumb-item a {
color: $breadcrumb-color;
}
.breadcrumb-item.active a {
&:hover,
&:focus {
color: $breadcrumb-color;
}
&:not(:hover, :focus) {
color: $breadcrumb-active-color;
}
}
.breadcrumb-item {
+ .breadcrumb-item {
&::before {
width: 26px;
height: 10px;
}
}
}
.breadcrumb-style1 .breadcrumb-item + .breadcrumb-item::before {
content: '/';
color: $breadcrumb-divider-color;
width: 1.43rem;
font-weight: 500;
margin-left: 0.2rem;
}
.breadcrumb-style2 .breadcrumb-item + .breadcrumb-item::before {
content: $breadcrumb-icon-check-svg;
line-height: 1.375rem;
width: 26px;
height: 10px;
}
// RTL
// *******************************************************************************
@include rtl-only {
.breadcrumb-item + .breadcrumb-item {
padding-right: $breadcrumb-item-padding-x;
padding-left: 0;
&::before {
padding-right: 0;
padding-left: $breadcrumb-item-padding-x;
float: right;
}
}
// Breadcrumb divider style Icons
.breadcrumb-style1 .breadcrumb-item + .breadcrumb-item::before {
content: '\\';
}
.breadcrumb-style2 .breadcrumb-item + .breadcrumb-item::before {
content: $breadcrumb-icon-check-svg;
}
}

161
resources/assets/vendor/scss/_bootstrap-extended/_button-group.scss vendored Normal file
View File

@ -0,0 +1,161 @@
// Button groups
// *******************************************************************************
// * Split button
// *******************************************************************************
.btn-group,
.btn-group-vertical {
&:disabled,
&.disabled {
opacity: 0.45;
}
}
.dropdown-toggle-split,
.btn-lg + .dropdown-toggle-split,
.btn-group-lg > .btn + .dropdown-toggle-split,
.input-group-lg .btn + .dropdown-toggle-split,
.btn-xl + .dropdown-toggle-split,
.btn-group-xl > .btn + .dropdown-toggle-split {
padding: 0.92em;
}
.btn-sm + .dropdown-toggle-split,
.btn-group-sm > .btn + .dropdown-toggle-split,
.input-group-sm .btn + .dropdown-toggle-split {
padding: 0.8em;
}
.btn-xs + .dropdown-toggle-split,
.btn-group-xs > .btn + .dropdown-toggle-split {
padding: 0.7em;
}
// * Sizing
// *******************************************************************************
.btn-group-xs > .btn {
@extend .btn-xs;
}
.btn-group-xl > .btn {
@extend .btn-xl;
}
// Button groups border
.btn-group > .btn-group:first-child > .btn:not([class*='btn-outline-']):first-child,
.input-group > .btn:not([class*='btn-outline-']):first-child,
:not(.btn-group):not(.input-group) > .btn-group > .btn:not([class*='btn-outline-']):first-child,
.input-group > .btn-group:first-child > .btn:not([class*='btn-outline-']):first-child {
@include ltr-style {
border-left-color: transparent !important;
}
@include rtl-style {
border-right-color: transparent !important;
}
}
.btn-group > .btn-group:last-child > .btn:not([class*='btn-outline-']):last-of-type,
.input-group > .btn:not([class*='btn-outline-']):last-of-type,
:not(.btn-group):not(.input-group) > .btn-group > .btn:not([class*='btn-outline-']):last-of-type,
.input-group > .btn-group:last-child > .btn:not([class*='btn-outline-']):last-of-type {
@include ltr-style {
border-right-color: transparent !important;
}
@include rtl-style {
border-left-color: transparent !important;
}
}
.btn-group-vertical > .btn-group-vertical:first-child > .btn:not([class*='btn-outline-']):first-child,
:not(.btn-group-vertical):not(.input-group) > .btn-group-vertical > .btn:not([class*='btn-outline-']):first-child {
@include ltr-style {
border-top-color: transparent !important;
}
}
.btn-group-vertical > .btn-group-vertical:last-child > .btn:not([class*='btn-outline-']):last-child,
:not(.btn-group-vertical):not(.input-group) > .btn-group-vertical > .btn:not([class*='btn-outline-']):last-child {
@include ltr-style {
border-bottom-color: transparent !important;
}
}
.btn-group-vertical > .btn-group-vertical:first-child > .btn:not([class*='btn-outline-']):first-child,
:not(.btn-group-vertical):not(.input-group) > .btn-group-vertical > .btn:not([class*='btn-outline-']):first-child {
border-top-color: transparent !important;
}
.btn-group-vertical > .btn-group-vertical:last-child > .btn:not([class*='btn-outline-']):last-of-type,
:not(.btn-group-vertical):not(.input-group) > .btn-group-vertical > .btn:not([class*='btn-outline-']):last-of-type {
border-bottom-color: transparent !important;
}
// * RTL
// *******************************************************************************
@include rtl-only {
.btn-group .btn[class] {
@include border-radius($border-radius);
}
.btn-group .btn-xs[class],
.btn-group-xs .btn[class] {
@include border-radius($border-radius-xs);
}
.btn-group .btn-sm[class],
.btn-group-sm .btn[class] {
@include border-radius($border-radius-sm);
}
.btn-group .btn-lg[class],
.btn-group-lg .btn[class] {
@include border-radius($border-radius-lg);
}
.btn-group .btn-xl[class],
.btn-group-xl .btn[class] {
@include border-radius($border-radius-xl);
}
.btn-group {
// Prevent double borders when buttons are next to each other
> .btn:not(:first-child),
> .btn-group:not(:first-child) {
margin-left: 0;
margin-right: calc(#{$btn-border-width} * -1);
}
// Reset rounded corners
> .btn:not(:last-child):not(.dropdown-toggle),
> .btn-group:not(:last-child) > .btn {
@include border-start-radius(0);
}
// The left radius should be 0 if the button is:
// - the "third or more" child
// - the second child and the previous element isn't `.btn-check` (making it the first child visually)
// - part of a btn-group which isn't the first child
> .btn:nth-child(n + 3),
> :not(.btn-check) + .btn,
> .btn-group:not(:first-child) > .btn {
@include border-end-radius(0);
}
}
.btn-group-vertical {
// Reset rounded corners
> .btn:not(:last-child):not(.dropdown-toggle),
> .btn-group:not(:last-child) > .btn {
@include border-bottom-radius(0);
}
> .btn ~ .btn,
> .btn-group:not(:first-child) > .btn {
@include border-top-radius(0);
}
}
}

178
resources/assets/vendor/scss/_bootstrap-extended/_buttons.scss vendored Normal file
View File

@ -0,0 +1,178 @@
// Buttons
// *******************************************************************************
.btn {
cursor: pointer;
display: inline-flex !important;
align-items: center;
justify-content: center;
&:not(.dropdown-toggle):not([class*='btn-text-']) {
transition: all 0.135s ease-in-out;
transform: scale(1.001);
}
&[class*='btn-outline-'] {
&:disabled,
&.disabled {
background: transparent !important;
}
}
&[class*='btn-text-'] {
padding-inline: 0.75rem;
&[class*='btn-sm'] {
padding-inline: 0.5625rem;
}
&[class*='btn-lg'] {
padding-inline: 1rem;
}
&:disabled,
&.disabled {
background: transparent !important;
border-color: transparent !important;
}
}
.ti {
line-height: 0.9;
}
&.btn-text {
background: none;
box-shadow: none;
border: none;
}
&.disabled,
&:disabled {
cursor: default;
}
&[class*='btn-']:active:not([class*='btn-text']):not(.dropdown-toggle),
&[class*='btn-'].active:not([class*='btn-text']):not(.dropdown-toggle) {
transform: scale(0.98);
transition: all 0.135s ease-in-out;
}
}
// Badge within button
.btn .badge {
@include transition($btn-transition);
}
label.btn {
margin-bottom: 0;
}
// Button Sizes
.btn-xl {
@include button-size($btn-padding-y-xl, $btn-padding-x-xl, $btn-font-size-xl, $btn-border-radius-xl);
}
.btn-sm {
line-height: $btn-line-height-sm;
}
.btn-xs {
@include button-size($btn-padding-y-xs, $btn-padding-x-xs, $btn-font-size-xs, $btn-border-radius-xs);
}
// Buttons Variant
@each $color, $value in $theme-colors {
@if $color != primary {
@include template-button-variant('.btn-#{$color}', if($color== 'dark' and $dark-style, $dark, $value));
@include template-button-label-variant('.btn-label-#{$color}', if($color== 'dark' and $dark-style, $dark, $value));
@include template-button-outline-variant(
'.btn-outline-#{$color}',
if($color== 'dark' and $dark-style, $dark, $value)
);
@if $color == secondary {
$value: $body-color;
}
@include template-button-text-variant('.btn-text-#{$color}', $value);
}
}
// Icon button
.btn-icon {
$btn-icon-size: ($btn-font-size * $btn-line-height) + ($btn-padding-y * 1.998);
$btn-icon-size-xl: ($btn-font-size-xl * $btn-line-height-xl) + ($btn-padding-y-xl * 2);
$btn-icon-size-lg: ($btn-font-size-lg * $btn-line-height-lg) + ($btn-padding-y-lg * 2);
$btn-icon-size-sm: ($btn-font-size-sm * $btn-line-height-sm) + ($btn-padding-y-sm * 2.785);
$btn-icon-size-xs: ($btn-font-size-xs * $btn-line-height-xs) + ($btn-padding-y-xs * 2);
$borders-width: calc(#{$btn-border-width} * 2);
--#{$prefix}btn-active-border-color: transparent;
padding: 0;
width: calc(#{$btn-icon-size} + #{$borders-width});
height: calc(#{$btn-icon-size} + #{$borders-width});
display: inline-flex;
flex-shrink: 0;
justify-content: center;
align-items: center;
&.btn-xl {
width: calc(#{$btn-icon-size-xl} + #{$borders-width});
height: calc(#{$btn-icon-size-xl} + #{$borders-width});
> span {
font-size: $btn-font-size-xl;
}
}
&.btn-lg {
width: calc(#{$btn-icon-size-lg} + #{$borders-width});
height: calc(#{$btn-icon-size-lg} + #{$borders-width});
font-size: $btn-font-size-lg;
}
&.btn-sm {
width: calc(#{$btn-icon-size-sm} + #{$borders-width});
height: calc(#{$btn-icon-size-sm} + #{$borders-width});
font-size: $btn-font-size-sm;
}
&.btn-xs {
width: calc(#{$btn-icon-size-xs} + #{$borders-width});
height: calc(#{$btn-icon-size-xs} + #{$borders-width});
font-size: $btn-font-size-xs;
}
}
// Without border
.btn.borderless {
&:not(.active):not(:active):not(:hover):not(:focus),
:not(.show) > &.dropdown-toggle:not(:hover):not(:focus) {
border-color: transparent;
box-shadow: none;
}
}
// Link buttons
.btn.btn-link {
font-size: inherit;
}
.btn-pinned {
position: absolute;
top: 1rem;
@include ltr-style {
right: 1rem;
}
@include rtl-style {
left: 1rem;
}
}
// Button focus
button:focus,
button:focus-visible {
outline: none;
}
// Table Action Dropdown fix
.btn:not([class*='btn-']):active,
.btn:not([class*='btn-']).active,
.btn:not([class*='btn-']).show,
.btn:not([class*='btn-']) {
border: none;
}

389
resources/assets/vendor/scss/_bootstrap-extended/_card.scss vendored Normal file
View File

@ -0,0 +1,389 @@
// Cards
// *******************************************************************************
@each $color, $value in $theme-colors {
@if $color != primary {
@include template-card-border-shadow-variant('.card-border-shadow-#{$color}', $value);
@include template-card-hover-border-variant('.card-hover-border-#{$color}', $value);
}
}
.card {
background-clip: padding-box;
box-shadow: $card-box-shadow;
.card-link {
display: inline-block;
}
// ! FIX: to remove padding top from first card-body if used with card-header
.card-header + .card-body,
.card-header + .card-content > .card-body:first-of-type,
.card-header + .card-footer,
.card-body + .card-footer {
padding-top: 0;
}
// color border bottom and shadow in card
&[class*='card-border-shadow-'] {
position: relative;
border-bottom: none;
transition: $card-transition;
z-index: 1;
&::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
border-bottom-width: 2px;
border-bottom-style: solid;
border-radius: $card-border-radius;
transition: $card-transition;
z-index: -1;
}
&:hover {
box-shadow: $box-shadow-lg;
&::after {
border-bottom-width: 3px;
}
}
}
// card hover border color
&[class*='card-hover-border-'] {
border-width: 1px;
}
}
// adding class with card background color
.bg-card {
background-color: $card-bg;
}
// Card action
.card-action {
// Expand card(fullscreen)
&.card-fullscreen {
display: block;
z-index: 9999;
position: fixed;
width: 100% !important;
height: 100% !important;
top: 0;
right: 0;
left: 0;
bottom: 0;
overflow: auto;
border: none;
border-radius: 0;
}
// Alert
.card-alert {
position: absolute;
width: 100%;
z-index: 999;
.alert {
border-bottom-right-radius: 0px;
border-bottom-left-radius: 0px;
}
}
// Collapsed
.card-header {
&.collapsed {
border-bottom: 0;
}
}
// Card header
.card-header {
display: flex;
.card-action-title {
flex-grow: 1;
margin-right: 0.5rem;
}
.card-action-element {
flex-shrink: 0;
background-color: inherit;
top: 1rem;
right: 1.5rem;
color: $body-color;
a {
color: $headings-color;
.collapse-icon::after {
margin-top: -0.15rem;
}
}
}
}
// Block UI loader
.blockUI {
.sk-fold {
margin: 0 auto;
}
h5 {
color: $body-color;
margin: 1rem 0 0 0;
}
}
.collapse > .card-body,
.collapsing > .card-body {
padding-top: 0;
}
}
// Card inner borders
.card-header,
.card-footer {
border-color: $card-inner-border-color;
}
.card hr {
color: $card-inner-border-color;
}
.card .row-bordered > [class*=' col '],
.card .row-bordered > [class^='col '],
.card .row-bordered > [class*=' col-'],
.card .row-bordered > [class^='col-'],
.card .row-bordered > [class='col'] {
.card .row-bordered > [class$=' col'],
&::before,
&::after {
border-color: $card-inner-border-color;
}
}
//Card header elements
.card-header.header-elements,
.card-title.header-elements {
display: flex;
width: 100%;
align-items: center;
flex-wrap: wrap;
}
.card-header {
&.card-header-elements {
padding-top: $card-spacer-y * 0.5;
padding-bottom: $card-spacer-y * 0.5;
}
.card-header-elements {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
}
.card-header-elements,
.card-title-elements {
display: flex;
flex-wrap: wrap;
align-items: center;
& + &,
> * + * {
margin-left: 0.25rem;
@include rtl-style {
margin-left: 0;
margin-right: 0.25rem;
}
}
}
.card-title {
&:not(:is(h1, h2, h3, h4, h5, h6)) {
color: $body-color;
}
}
// * Horizontal card radius issue fix
.card-img-left {
@include border-start-radius($card-inner-border-radius);
@include border-end-radius(0);
@include media-breakpoint-down(md) {
@include border-top-radius($card-inner-border-radius);
@include border-bottom-radius(0);
}
}
.card-img-right {
@include border-end-radius($card-inner-border-radius);
@include border-start-radius(0);
@include media-breakpoint-down(md) {
@include border-bottom-radius($card-inner-border-radius);
@include border-top-radius(0);
}
}
// Card group
.card-group {
box-shadow: $card-box-shadow;
background-color: $card-bg;
border-radius: $card-border-radius;
.card {
box-shadow: none;
@include media-breakpoint-down(sm) {
&:not(:first-child) .card-img-top {
@include border-top-radius(0);
}
}
}
}
// List groups
// *******************************************************************************
.card > .list-group .list-group-item {
padding-left: $card-spacer-x;
padding-right: $card-spacer-x;
}
// Card Statistics specific separator
// *******************************************************************************
.card {
.card-separator {
@include ltr-style {
border-right: $border-width solid $card-border-color;
}
@include rtl-style {
border-left: $border-width solid $card-border-color;
}
}
}
//Card Widget Separator
// *******************************************************************************
.card {
.card-widget-separator-wrapper {
@include media-breakpoint-down(lg) {
.card-widget-separator {
.card-widget-2.border-end {
border-right: none !important;
border-left: none !important;
}
}
}
@include media-breakpoint-down(sm) {
.card-widget-separator {
.card-widget-1.border-end,
.card-widget-2.border-end,
.card-widget-3.border-end {
border-right: none !important;
border-left: none !important;
border-bottom: 1px solid $border-color;
}
}
}
}
}
@include media-breakpoint-down(lg) {
.card {
.card-separator {
border-bottom: $border-width solid $card-border-color;
padding-bottom: $card-spacer-y;
@include ltr-style {
border-right-width: 0 !important;
}
@include rtl-style {
border-left-width: 0 !important;
}
}
}
}
// RTL
// *******************************************************************************
@include rtl-only {
.card-link + .card-link {
margin-right: $card-spacer-x;
margin-left: 0;
}
// Card advance
.card-action {
.card-header {
.card-action-title {
margin-left: 0.5rem;
margin-right: 0;
}
.card-action-element,
.card-action-element-toggle {
left: 1.5rem;
right: auto;
}
}
}
// * Horizontal card radius issue fix
.card-img-left {
@include border-start-radius(0);
@include border-end-radius($card-inner-border-radius);
@include media-breakpoint-down(md) {
@include border-top-radius(0);
@include border-bottom-radius($card-inner-border-radius);
}
}
.card-img-right {
@include border-end-radius(0);
@include border-start-radius($card-inner-border-radius);
@include media-breakpoint-down(md) {
@include border-bottom-radius(0);
@include border-top-radius($card-inner-border-radius);
}
}
// Card group
@include media-breakpoint-up(sm) {
.card-group > .card {
border: $card-border-width solid $card-border-color;
border-radius: $card-border-radius;
.card-img-top,
.card-header:first-child {
@include border-top-radius($card-inner-border-radius);
}
.card-img-bottom,
.card-footer:last-child {
@include border-bottom-radius($card-inner-border-radius);
}
+ .card {
border-right: 0;
}
}
// Handle rounded corners
@if $enable-rounded {
.card-group > .card {
&:not(:first-child) {
@include border-end-radius(0);
.card-img-top,
.card-header {
border-top-right-radius: 0;
}
.card-img-bottom,
.card-footer {
border-bottom-right-radius: 0;
}
}
&:not(:last-child) {
@include border-start-radius(0);
.card-img-top,
.card-header {
border-top-left-radius: 0;
}
.card-img-bottom,
.card-footer {
border-bottom-left-radius: 0;
}
}
}
}
}
}

50
resources/assets/vendor/scss/_bootstrap-extended/_carousel.scss vendored Normal file
View File

@ -0,0 +1,50 @@
// Carousel
// *******************************************************************************
//
.carousel {
.carousel-item.active,
.carousel-item.carousel-item-start {
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
color: $carousel-caption-color;
}
}
}
.carousel.carousel-dark {
.carousel-item,
.carousel-item.active,
.carousel-item.carousel-item-start {
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
color: $carousel-dark-caption-color;
}
}
}
.carousel-indicators {
margin-bottom: 1.06rem;
[data-bs-target] {
border-radius: $border-radius;
}
}

12
resources/assets/vendor/scss/_bootstrap-extended/_close.scss vendored Normal file
View File

@ -0,0 +1,12 @@
// Close buttons
// *******************************************************************************
.close:focus {
outline: 0;
}
@include rtl-only {
.close {
float: left;
}
}

126
resources/assets/vendor/scss/_bootstrap-extended/_dropdown.scss vendored Normal file
View File

@ -0,0 +1,126 @@
// Dropdowns
// *****************************************************************
// On hover outline
[data-trigger='hover'] {
outline: 0;
}
.dropdown-menu {
box-shadow: $dropdown-box-shadow;
// Mega dropdown inside the dropdown menu
.mega-dropdown > & {
left: 0 !important;
right: 0 !important;
}
// Badge within dropdown menu
.badge[class^='float-'],
.badge[class*=' float-'] {
position: relative;
top: 0.071em;
}
// Dark style
@if $dark-style {
.list-group-item {
border-color: rgba-to-hex($dropdown-divider-bg, $dropdown-bg);
}
}
// For RTL
@include rtl-style {
text-align: right;
}
}
// Dropdown item line height
.dropdown-item {
li:not(:first-child) &,
.dropdown-menu &:not(:first-child) {
margin-top: 2px;
}
border-radius: $dropdown-border-radius;
&.disabled .waves-ripple {
display: none;
}
}
// Hidden dropdown toggle arrow
.dropdown-toggle.hide-arrow,
.dropdown-toggle-hide-arrow > .dropdown-toggle {
&::before,
&::after {
display: none;
}
}
// Dropdown caret icon
@if $enable-caret {
// Dropdown arrow
.dropdown-toggle::after {
@include caret-down($caret-width);
}
// Dropend arrow
.dropend .dropdown-toggle::after {
@include caret-right($caret-width);
}
// Dropstart arrow
.dropstart .dropdown-toggle::before {
@include caret-left($caret-width);
}
// Dropup arrow
.dropup .dropdown-toggle::after {
@include caret-up($caret-width);
}
.dropstart .dropdown-toggle::before,
.dropend .dropdown-toggle::after {
vertical-align: $caret-vertical-align;
}
@include rtl-only {
.dropdown-toggle:not(.dropdown-toggle-split)::after {
margin-left: 0;
margin-right: $caret-spacing;
}
}
@include ltr-only {
.dropdown-toggle-split:after {
margin-left: 0 !important;
}
}
@include rtl-only {
.dropdown-toggle-split:after {
margin-right: 0 !important;
}
}
}
@include rtl-only {
// Dropdown menu alignment
@each $breakpoint in map-keys($grid-breakpoints) {
@include media-breakpoint-up($breakpoint) {
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
.dropdown-menu#{$infix}-start {
--bs-position: start;
&[data-bs-popper] {
left: auto;
right: 0;
}
}
.dropdown-menu#{$infix}-end {
--bs-position: end;
&[data-bs-popper] {
left: 0;
right: auto;
}
}
}
}
}

12
resources/assets/vendor/scss/_bootstrap-extended/_forms.scss vendored Normal file
View File

@ -0,0 +1,12 @@
// Forms
// *****************************************************************
@import 'forms/labels';
@import 'forms/form-text';
@import 'forms/form-control';
@import 'forms/form-select';
@import 'forms/form-check';
@import 'forms/form-range';
@import 'forms/input-group';
@import 'forms/floating-labels';
@import 'forms/validation';

148
resources/assets/vendor/scss/_bootstrap-extended/_functions.scss vendored Normal file
View File

@ -0,0 +1,148 @@
// Functions
// *******************************************************************************
// Lists
// *******************************************************************************
@function slice-list($list, $start: 1, $end: length($list)) {
$result: null;
@if type-of($start) != number or type-of($end) != number {
@warn "Either $start or $end are not a number for `slice`.";
} @else if $start > $end {
@warn "The start index has to be lesser than or equals to the end index for `slice`.";
} @else if $start < 1 or $end < 1 {
@warn "List indexes must be non-zero integers for `slice`.";
} @else if $start > length($list) {
@warn "List index is #{$start} but list is only #{length($list)} item long for `slice`.";
} @else if $end > length($list) {
@warn "List index is #{$end} but list is only #{length($list)} item long for `slice`.";
} @else {
$result: ();
@for $i from $start through $end {
$result: append($result, nth($list, $i));
}
}
@return $result;
}
// * Units
// *******************************************************************************
// Remove the unit of a length
@function strip-unit($number) {
@if type-of($number) == 'number' and not unitless($number) {
@return divide($number, ($number * 0 + 1));
}
@return $number;
}
// Convert size px to rem
@function px-to-rem($value) {
// Assumes the browser default font size = `16px`
@return (divide(strip-unit($value), 16)) * 1rem;
}
// Convert size rem to px
@function rem-to-px($value) {
// Assumes the browser default font size = `16px`
@return (strip-unit($value) * 16) * 1px;
}
// * Colors
// *******************************************************************************
// ? Override shade, tint and shift function with custom background color option i.e $card-bg to make it similar like design
// Shade a color: mix a color with background/white
@function tint-color($color, $weight, $background: null) {
$background: if($background, $background, white);
@return mix($background, $color, $weight);
}
// Shade a color: mix a color with background/black
@function shade-color($color, $weight, $background: null) {
$background: if($background, $background, black);
@return mix($background, $color, $weight);
}
// Shade the color if the weight is positive, else tint it
@function shift-color($color, $weight, $background: null) {
@return if($weight > 0, shade-color($color, $weight, $background), tint-color($color, -$weight));
}
//RGBA to HEX
@function rgba-to-hex($color, $background: #fff) {
@if $color and alpha($color) != 1 {
$percent: alpha($color) * 100%;
$opaque: opacify($color, 1);
@return mix($opaque, $background, $percent);
} @else {
@return $color;
}
}
// Calculating Color Contrast
@function contrast-value($color) {
@if $color == transparent {
@return $body-color;
} @else if alpha($color) != 1 {
$color: rgba-to-hex($color);
}
$r: red($color);
$g: green($color);
$b: blue($color);
@return divide((($r * 299) + ($g * 587) + ($b * 114)), 1000);
}
// * Utilities
// *******************************************************************************
// Return Nav opacity, contrast-percent, contrast-percent-inverted, bg, color, active-color, disabled-color, muted-color, border
@function get-navbar-prop($bg, $active-color: null, $inactive-color: null, $border: null, $text-color: null) {
$bg: rgba-to-hex($bg);
$active-color: rgba-to-hex($active-color);
$active-color: if($active-color, $active-color, color-contrast($bg));
$contrast-percent: divide(contrast-value($bg), 255);
$contrast-percent-inverted: 1 - $contrast-percent;
$opacity: if($active-color == #fff, 0.6 + (0.4 * $contrast-percent), 0.6 + (0.4 * (1 - $contrast-percent)));
$color: if(
$inactive-color,
rgba-to-hex($inactive-color, $bg),
rgba-to-hex(rgba($active-color, if($contrast-percent < 0.25, $opacity + 0.2, $opacity)), $bg)
);
$disabled-color: rgba-to-hex(rgba($color, 0.6), $bg);
$muted-color: rgba-to-hex(rgba($color, 0.4), $bg);
$border: if(
$border,
$border,
if(
$contrast-percent > 0.75,
rgba($active-color, divide($opacity, 8)),
if($contrast-percent < 0.25, rgba($active-color, 0.06), rgba($active-color, 0.15))
)
);
@return (
// Metadata
opacity: $opacity,
contrast-percent: $contrast-percent,
contrast-percent-inverted: $contrast-percent-inverted,
// Colors
bg: $bg,
color: $color,
active-color: $active-color,
disabled-color: $disabled-color,
muted-color: $muted-color,
border: $border,
text-color: $text-color
);
}

15
resources/assets/vendor/scss/_bootstrap-extended/_include-dark.scss vendored Normal file
View File

@ -0,0 +1,15 @@
//Functions
@import 'bootstrap/scss/functions'; // Bootstrap core functions
@import 'functions'; // Bootstrap extended functions
//Variables
@import '../_custom-variables/bootstrap-extended-dark'; // Bootstrap extended custom dark variable (for customization purpose)
@import '../_custom-variables/bootstrap-extended'; // Bootstrap extended custom dark variable (for customization purpose)
@import 'variables-dark'; // Bootstrap extended dark variable
@import 'variables'; // Bootstrap extended variable
@import 'bootstrap/scss/variables'; // Bootstrap core variable
@import 'bootstrap/scss/maps'; // Bootstrap core variable
//Mixins
@import 'bootstrap/scss/mixins'; // Bootstrap core mixins
@import 'mixins'; // Bootstrap extended mixins

13
resources/assets/vendor/scss/_bootstrap-extended/_include.scss vendored Normal file
View File

@ -0,0 +1,13 @@
//Functions
@import 'bootstrap/scss/functions'; // Bootstrap core functions
@import 'functions'; // Bootstrap extended functions
//Variables
@import '../_custom-variables/bootstrap-extended'; // Bootstrap extended custom variable (for customization purpose)
@import 'variables'; // Bootstrap extended variable
@import 'bootstrap/scss/variables'; // Bootstrap core variable
@import 'bootstrap/scss/maps'; // Bootstrap core variable
//Mixins
@import 'bootstrap/scss/mixins'; // Bootstrap core mixins
@import 'mixins'; // Bootstrap extended mixins

210
resources/assets/vendor/scss/_bootstrap-extended/_list-group.scss vendored Normal file
View File

@ -0,0 +1,210 @@
// List groups
// *******************************************************************************
// List Group Mixin
@each $color, $value in $theme-colors {
@if $color != primary and $color != light {
@include template-list-group-item-variant('.list-group-item-#{$color}', $value);
@include template-list-group-timeline-variant('.list-group-timeline-#{$color}', $value);
}
}
.list-group {
.list-group-item-action {
&:not(.active) {
& :not(.add-btn) > :active {
color: $list-group-color;
background-color: $list-group-hover-bg !important;
}
}
}
.list-group-item {
line-height: 1.375rem;
padding-bottom: calc($list-group-item-padding-y - 1px);
}
&:not([class*='list-group-flush']) .list-group-item:first-of-type {
padding-top: calc($list-group-item-padding-y - 1px);
}
&[class*='list-group-flush'] .list-group-item:last-of-type {
padding-bottom: $list-group-item-padding-y;
}
&[class*='list-group-horizontal-md'] .list-group-item {
@include media-breakpoint-up(md) {
padding-top: calc($list-group-item-padding-y - 1px);
}
}
}
.list-group {
// Timeline CSS
&.list-group-timeline {
position: relative;
&:before {
background-color: $border-color;
position: absolute;
content: '';
width: 1px;
height: 100%;
top: 0;
bottom: 0;
left: 0.2rem;
}
.list-group-item {
border: none;
padding-left: 1.25rem;
&:before {
position: absolute;
display: block;
content: '';
width: 7px;
height: 7px;
left: 0;
top: 50%;
margin-top: -3.5px;
border-radius: 100%;
}
}
}
.list-group-item.active {
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
color: $primary;
}
}
}
// RTL
// *******************************************************************************
@include rtl-only {
.list-group {
padding-right: 0;
// Timeline RTL List group
&.list-group-timeline {
&:before {
left: auto;
right: 0.2rem;
}
.list-group-item {
padding-right: 1.25rem;
&:before {
left: auto;
right: 1px;
}
}
}
// List group horizontal RTL style
&.list-group-horizontal {
.list-group-item {
&:first-child {
border-radius: 0.25rem;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
&:last-child {
border-radius: 0.25rem;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-left-width: 1px;
}
}
}
@include media-breakpoint-up(sm) {
&.list-group-horizontal-sm {
.list-group-item {
&:first-child {
border-radius: 0.25rem;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
&:last-child {
border-radius: 0.25rem;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-left-width: 1px;
}
}
}
}
@include media-breakpoint-up(md) {
&.list-group-horizontal-md {
.list-group-item {
&:first-child {
border-radius: 0.25rem;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
&:last-child {
border-radius: 0.25rem;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-left-width: 1px;
}
}
}
}
@include media-breakpoint-up(lg) {
&.list-group-horizontal-lg {
.list-group-item {
&:first-child {
border-radius: 0.25rem;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
&:last-child {
border-radius: 0.25rem;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-left-width: 1px;
}
}
}
}
@include media-breakpoint-up(xl) {
&.list-group-horizontal-xl {
.list-group-item {
&:first-child {
border-radius: 0.25rem;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
&:last-child {
border-radius: 0.25rem;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-left-width: 1px;
}
}
}
}
@include media-breakpoint-up(xxl) {
&.list-group-horizontal-xxl {
.list-group-item {
&:first-child {
border-radius: 0.25rem;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
&:last-child {
border-radius: 0.25rem;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-left-width: 1px;
}
}
}
}
}
}

20
resources/assets/vendor/scss/_bootstrap-extended/_mixins.scss vendored Normal file
View File

@ -0,0 +1,20 @@
// Mixins
//
// Template mixins (custom and overrides)
@import 'mixins/alert';
@import 'mixins/badge';
@import 'mixins/buttons';
@import 'mixins/list-group';
@import 'mixins/modal';
@import 'mixins/navs';
@import 'mixins/pagination';
@import 'mixins/progress';
@import 'mixins/popover';
@import 'mixins/tooltip';
@import 'mixins/caret';
@import 'mixins/dropdown';
@import 'mixins/forms';
@import 'mixins/table-variants';
@import 'mixins/misc';
@import 'mixins/card'; // layout, text directions & colors

390
resources/assets/vendor/scss/_bootstrap-extended/_modal.scss vendored Normal file
View File

@ -0,0 +1,390 @@
// Modals
// *******************************************************************************
//modal header btn close style
.modal {
.btn-close {
background-color: $card-bg;
border-radius: $border-radius-sm;
background-image: str-replace(str-replace($btn-close-bg, '#{$btn-close-color}', $text-muted), '#', '%23');
opacity: 1;
padding: 0.3757rem;
box-shadow: $box-shadow-xs;
transition: all 0.23s ease 0.1s;
@include ltr-style {
transform: translate(23px, -25px);
}
@include rtl-style {
transform: translate(-31px, -25px);
}
// For hover effect of close btn
&:hover,
&:focus,
&:active {
opacity: 1;
outline: none;
@include ltr-style {
transform: translate(20px, -20px);
}
@include rtl-style {
transform: translate(-26px, -20px);
}
}
}
.modal-header {
position: relative;
.btn-close {
position: absolute;
top: $modal-dialog-margin + 0.1875rem;
@include ltr-style() {
right: $modal-footer-margin-between - 0.1875rem;
}
@include rtl-style {
left: $modal-footer-margin-between + 0.3;
}
}
}
}
//modal footer
.modal-footer {
padding: $modal-footer-padding;
> * {
margin-block: 0;
@include ltr-style {
&:last-child {
margin-right: 0;
}
&:first-child {
margin-left: 0;
}
}
@include rtl-style {
&:last-child {
margin-left: 0;
}
&:first-child {
margin-right: 0;
}
}
}
}
// Modal Shadow
.modal-content {
box-shadow: $modal-content-box-shadow-xs;
}
// Modal RTL
// ! remove close button animation & shadow for .modal-dialog-scrollable, .modal-fullscreen, .modal-top modal
.modal-dialog-scrollable,
.modal-fullscreen,
.modal-top {
.btn-close {
box-shadow: none;
@include ltr-style {
transform: translate(0, 0) !important;
}
@include rtl-style {
transform: translate(0, 0) !important;
}
&:hover {
@include ltr-style {
transform: translate(0, 0) !important;
}
@include rtl-style {
transform: translate(0, 0) !important;
}
}
}
}
// Onboarding Modals
// *******************************************************************************
.modal-onboarding {
.close-label {
font-size: 0.8rem;
position: absolute;
top: 0.85rem;
opacity: $btn-close-opacity;
&:hover {
opacity: $btn-close-hover-opacity;
}
}
.modal-header {
.btn-close {
@include rtl-style {
margin-left: 0;
margin-right: auto;
}
}
}
.onboarding-media {
margin-bottom: 1rem;
img {
margin: 0 auto;
}
}
.onboarding-content {
margin: 2rem;
}
form {
margin-top: 2rem;
text-align: left;
}
// Carousel Inside Modal
.carousel-indicators {
bottom: -10px;
}
.carousel-control-prev,
.carousel-control-next {
top: auto;
bottom: 0.75rem;
opacity: 1;
@include rtl-style {
flex-direction: row-reverse;
}
}
.carousel-control-prev {
left: 1rem;
}
.onboarding-horizontal {
display: flex;
justify-content: space-between;
align-items: center;
.onboarding-media {
margin: 2rem;
margin-top: 0;
}
.carousel-control-prev {
left: 0;
}
}
// Modal animation
&.animated {
.onboarding-media {
transform: translateY(10px) scale(0.8);
transition: all 0.5s cubic-bezier(0.25, 1.1, 0.5, 1.35);
transition-delay: 0.3s;
opacity: 0;
}
.onboarding-content {
transform: translateY(40px);
transition-delay: 0.1s;
transition: all 0.4s ease;
opacity: 0;
}
.onboarding-title {
opacity: 0;
transition-delay: 0.5s;
transition: all 0.5s cubic-bezier(0.25, 1.1, 0.5, 1.35);
transform: translateY(40px);
}
.onboarding-info {
opacity: 0;
transition-delay: 0.6s;
transition: all 0.5s cubic-bezier(0.25, 1.1, 0.5, 1.35);
transform: translateY(40px);
}
form {
opacity: 0;
transition-delay: 0.7s;
transition: all 0.5s ease;
transform: translateY(40px);
}
&.show {
.onboarding-media {
transform: translateY(0) scale(1);
opacity: 1;
}
.onboarding-content {
transform: translateY(0);
opacity: 1;
}
.onboarding-title {
transform: translateY(0);
opacity: 1;
}
.onboarding-info {
opacity: 1;
transform: translateY(0px);
}
form {
opacity: 1;
transform: translateY(0px);
}
}
}
}
// Top modals
// *******************************************************************************
.modal-top {
.modal-dialog {
margin-top: 0;
}
.modal-content {
@include border-top-radius(0);
}
}
// Transparent modals
// ******************************************************************************
.modal-transparent {
.modal-dialog {
display: flex;
margin: 0 auto;
min-height: 100vh;
}
.modal-content {
margin: auto;
width: 100%;
border: 0;
background: transparent;
box-shadow: none;
}
.btn-close {
position: absolute;
top: 0;
right: $modal-inner-padding;
opacity: 1;
padding: $btn-close-padding-y $btn-close-padding-x;
background-image: str-replace(str-replace($btn-close-bg, '#{$btn-close-color}', $white), '#', '%23');
background-color: transparent !important;
box-shadow: none;
@include rtl-style {
right: auto;
left: $modal-header-padding-x;
}
}
}
// Modal Simple (Modal Examples)
// ******************************************************************************
.modal-simple {
.modal-content {
padding: $modal-simple-padding;
@include media-breakpoint-down(md) {
padding: 1rem;
.modal-body {
padding: 1rem;
}
}
}
.btn-close {
position: absolute;
top: -($modal-simple-padding - $modal-simple-close-position);
@include rtl-style() {
left: -($modal-simple-padding - $modal-simple-close-position);
}
@include ltr-style() {
right: -($modal-simple-padding - $modal-simple-close-position);
}
// For small screen set top, left/right 0 p-3, p-md-5
@include media-breakpoint-down(md) {
top: 0;
@include rtl-style() {
left: 0;
}
@include ltr-style() {
right: 0;
}
}
}
}
// Refer & Earn Modal Example
.modal-refer-and-earn {
.modal-refer-and-earn-step {
width: 88px;
height: 88px;
display: flex;
justify-content: center;
align-items: center;
border-radius: $card-border-radius;
i {
font-size: 2.5rem;
}
}
}
// Add new address modal
.modal-add-new-address {
.custom-option-icon:not(.checked) svg {
stroke: $headings-color;
}
.custom-option-icon.checked svg {
stroke: $primary;
}
}
// Modal Animations
// ******************************************************************************
// Slide from Top
.modal-top.fade .modal-dialog,
.modal-top .modal.fade .modal-dialog {
transform: translateY(-100%);
}
.modal-top.show .modal-dialog,
.modal-top .modal.show .modal-dialog {
transform: translateY(0);
}
// Transparent
.modal-transparent.fade .modal-dialog,
.modal-transparent .modal.fade .modal-dialog {
transform: scale(0.5, 0.5);
}
.modal-transparent.show .modal-dialog,
.modal-transparent .modal.show .modal-dialog {
transform: scale(1, 1);
}
// Responsive
// *******************************************************************************
@include media-breakpoint-down(lg) {
.modal-onboarding .onboarding-horizontal {
flex-direction: column;
}
}
@include media-breakpoint-down(md) {
.modal {
.carousel-control-prev,
.carousel-control-next {
display: none;
}
}
}
@include media-breakpoint-up(sm) {
.modal-content {
box-shadow: $modal-content-box-shadow-sm-up;
}
.modal-sm .modal-dialog {
max-width: $modal-sm;
}
}
@include media-breakpoint-up(xl) {
.modal-xl .modal-dialog {
max-width: $modal-xl;
}
}

510
resources/assets/vendor/scss/_bootstrap-extended/_nav.scss vendored Normal file
View File

@ -0,0 +1,510 @@
// Nav
// *******************************************************************************
.nav .nav-item,
.nav .nav-link,
.tab-pane,
.tab-pane .card-body {
outline: none !important;
}
// To fix height issue of nav pills
.nav {
flex-wrap: inherit;
&.nav-pills:not(.nav-align-right):not(.nav-align-left) {
flex-wrap: wrap;
}
.nav-item {
white-space: nowrap;
}
.nav-tabs {
background-color: $card-bg;
}
}
//nav tabs shadow
.nav-tabs-shadow {
box-shadow: $card-box-shadow;
}
// Tab and pills style
.nav-tabs,
.nav-pills {
.nav-link {
display: inline-flex;
align-items: center;
justify-content: center;
text-transform: capitalize;
&.active {
background-color: transparent;
}
}
&:not(.nav-fill):not(.nav-justified) .nav-link {
margin-right: $nav-spacer;
width: 100%;
@include rtl-style {
margin-left: $nav-spacer;
margin-right: 0;
}
}
}
.tab-content:not(.doc-example-content) {
padding: $card-spacer-y;
.tab-pane {
opacity: 0;
transition: all linear 0.1s;
@include ltr-style {
transform: translateX(-30px);
}
@include rtl-style {
transform: translateX(30px);
}
&.show {
opacity: 1;
transform: unset !important;
transition: all ease-out 0.2s 0.1s;
}
}
}
// For scrollable navs/tabs/pills
.nav-scrollable {
display: -webkit-inline-box;
display: -moz-inline-box;
width: 100%;
overflow-y: auto;
flex-wrap: nowrap;
}
// Widget Tabs
// --------------------------------------------------
.nav-tabs {
div:not(.nav-align-left):not(.nav-align-right) > & {
display: inline-flex;
width: 100%;
overflow-x: auto !important;
overflow-y: hidden;
}
&.widget-nav-tabs {
border: 0 !important;
overflow-x: auto;
.nav-link {
border: $border-width dashed $border-color;
&.active {
border: $border-width solid $border-color;
}
@include media-breakpoint-up(md) {
height: 100px !important;
width: 110px !important;
@include border-radius($border-radius);
}
@include media-breakpoint-down(md) {
border: 0 !important;
padding: 0;
}
&.active {
border-color: $primary;
box-shadow: none !important;
.badge {
background-color: $component-hover-bg !important;
color: $component-active-bg !important;
}
}
.tab-widget-title {
@include media-breakpoint-down(md) {
display: none;
}
}
}
}
}
// Todo: remove/ update style for nav with perfect scrollbar
// ? Not working with fixed width
// ? if provide width/min-width with %/auto not working
// ? Also can't use width with PX (as it's required for ps)
// ? removed JS so need to initialize ps again
// ? Once done add an example to docs
// .nav-scrollable {
// display: -webkit-inline-box;
// display: -moz-inline-box;
// width: 420px;
// padding-bottom: 0.5rem;
// position: relative;
// // overflow-y: auto;
// flex-wrap: nowrap;
// }
// Tab link
.nav-tabs {
position: relative;
.tab-slider {
height: 2px;
position: absolute;
.nav-align-left &,
.nav-align-right & {
width: 2px !important;
}
}
.nav-link {
background-clip: padding-box;
border-radius: 0;
}
}
.nav-pills {
.nav-link {
padding: $nav-pills-padding-y $nav-pills-padding-x;
}
& .nav-item .nav-link:not(.active):hover {
border-bottom: none;
padding-bottom: $nav-link-padding-y;
background-color: $nav-pills-link-hover-bg;
}
~ .tab-content {
box-shadow: $box-shadow;
}
}
// Sizing
// *******************************************************************************
.nav-sm {
@include template-nav-size($nav-link-padding-y-sm, $nav-link-padding-x-sm, $font-size-sm, $nav-link-line-height-sm);
}
.nav-lg {
@include template-nav-size($nav-link-padding-y-lg, $nav-link-padding-x-lg, $font-size-lg, $nav-link-line-height-lg);
}
// Top, Right, Bottom & Left Tabbed panels
// *******************************************************************************
.nav-align-top,
.nav-align-right,
.nav-align-bottom,
.nav-align-left {
.nav-tabs {
background: $nav-tabs-link-active-bg;
}
display: flex;
> .nav,
> div > .nav {
z-index: 1;
position: relative;
}
&:has(.nav-tabs) {
border-radius: $border-radius !important;
}
.row-bordered > [class^='col-'],
.row-bordered > [class*=' col-'],
.row-bordered > [class^='col '],
.row-bordered > [class*=' col '],
.row-bordered > [class$=' col'],
.row-bordered > [class='col'] {
&::before,
&::after {
border-color: $card-inner-border-color;
}
}
}
.nav-align-right,
.nav-align-left {
align-items: stretch;
> .nav,
> div > .nav {
flex-grow: 0;
flex-direction: column;
border-bottom-width: 0;
}
> .nav.nav-pills .nav-item:not(:last-child),
> div > .nav.nav-pills .nav-item:not(:last-child) {
margin: 0 0 $nav-spacer 0 !important;
}
> .tab-content {
flex-grow: 1;
.tab-pane {
transform: translateY(-30px);
&.show {
transform: translateY(0px);
}
}
}
}
// Top tabs
.nav-align-top {
.tab-content {
@include border-bottom-radius($border-radius);
}
flex-direction: column;
.nav-tabs {
border-bottom: $border-width solid $border-color;
@include border-top-radius($border-radius);
& .nav-link:not(.active):hover {
color: $primary !important;
border-bottom: 2px solid $nav-pills-link-hover-bg !important;
padding-bottom: calc($nav-link-padding-y - 0.125rem);
}
&.nav-lg .nav-link:not(.active):hover {
padding-bottom: calc($nav-link-padding-y-lg - 0.125rem);
}
&.nav-sm .nav-link:not(.active):hover {
padding-bottom: calc($nav-link-padding-y-sm - 0.125rem);
}
}
.nav-pills ~ .tab-content {
@include border-top-radius($border-radius);
}
}
.nav-align-top,
.nav-align-bottom {
> .tab-content {
.tab-pane {
@include ltr-style {
transform: translateX(-30px);
}
@include rtl-style {
transform: translateX(30px);
}
&.show {
transform: translateX(0px) !important;
}
}
}
@include ltr-style {
> .nav.nav-pills .nav-item:not(:last-child) {
margin-right: $nav-spacer;
}
}
@include rtl-style {
> .nav.nav-pills .nav-item:not(:last-child) {
margin-left: $nav-spacer;
}
}
}
.nav-align-right {
.tab-content {
@include border-start-radius($border-radius);
}
flex-direction: row-reverse;
.nav-tabs {
border-left: $border-width solid $border-color;
@include border-end-radius($border-radius);
position: relative;
.tab-slider {
@include ltr-style {
left: 0;
}
@include rtl-style {
right: 0;
}
}
~ .tab-content {
.card & {
@include ltr-style {
border-right: $nav-tabs-border-width solid $nav-tabs-border-color;
}
@include rtl-style {
border-left: $nav-tabs-border-width solid $nav-tabs-border-color;
}
}
}
@include ltr-style {
& .nav-link:not(.active):hover {
color: $primary !important;
border-left: 2px solid $nav-pills-link-hover-bg !important;
padding-left: calc($nav-link-padding-x - 0.125rem);
}
}
@include rtl-style {
& .nav-link:not(.active):hover {
color: $primary !important;
border-right: 2px solid $nav-pills-link-hover-bg !important;
padding-right: calc($nav-link-padding-x - 0.125rem);
}
}
}
> .nav .nav-item,
> div > .nav .nav-item {
margin-left: 0;
@include rtl-style {
margin-left: 0;
margin-right: 0;
}
}
.nav-link {
text-align: right;
justify-content: end;
}
.nav-pills ~ .tab-content {
@include border-end-radius($border-radius);
}
}
// Bottom tabs
.nav-align-bottom {
.tab-content {
@include border-top-radius($border-radius);
}
flex-direction: column-reverse;
> .nav .nav-item,
> div > .nav .nav-item {
margin-bottom: 0;
margin-top: 0;
}
> .nav,
> div > .nav {
border-bottom-width: 0;
border-top: $nav-tabs-border-width solid $nav-tabs-border-color;
}
.nav-tabs {
border-top: $border-width solid $border-color;
@include border-bottom-radius($border-radius);
.tab-slider {
bottom: inherit !important;
}
& .nav-link:not(.active):hover {
color: $primary !important;
border-top: 2px solid $nav-pills-link-hover-bg !important;
padding-top: calc($nav-link-padding-y - 0.125rem);
}
}
.nav-pills ~ .tab-content {
@include border-bottom-radius($border-radius);
}
}
// Left tabs
.nav-align-left {
.tab-content {
@include border-end-radius($border-radius);
}
.nav-tabs {
border-right: $border-width solid $border-color;
@include border-start-radius($border-radius);
position: relative;
~ .tab-content {
.card & {
@include ltr-style {
border-left: $nav-tabs-border-width solid $nav-tabs-border-color;
}
@include rtl-style {
border-right: $nav-tabs-border-width solid $nav-tabs-border-color;
}
}
}
@include ltr-style {
& .nav-link:not(.active):hover {
color: $primary !important;
border-right: 2px solid $nav-pills-link-hover-bg !important;
padding-right: calc($nav-link-padding-x - 0.125rem);
}
}
@include rtl-style {
& .nav-link:not(.active):hover {
color: $primary !important;
border-left: 2px solid $nav-pills-link-hover-bg !important;
padding-left: calc($nav-link-padding-x - 0.125rem);
}
}
}
> .nav .nav-item,
> div > .nav .nav-item {
margin-right: 0;
@include rtl-style {
margin-right: 0;
margin-left: 0;
}
}
.nav-link {
text-align: left;
justify-content: start;
}
.nav-pills ~ .tab-content {
@include border-start-radius($border-radius);
}
}
// Tab content
.nav-align-top > .tab-content,
.nav-align-right > .tab-content,
.nav-align-bottom > .tab-content,
.nav-align-left > .tab-content {
flex-shrink: 1;
background-clip: padding-box;
background: $nav-tabs-link-active-bg;
.card & {
background: transparent;
}
}
.card .tab-content {
box-shadow: none !important;
}
// Dark
@if $dark-style {
.nav-tabs {
.nav-link.active {
border-color: $border-color;
border-bottom-color: $nav-tabs-link-active-bg;
}
}
.nav-align-top,
.nav-align-bottom,
.nav-align-left,
.nav-align-right {
.nav-tabs {
.nav-link.active {
border-color: $gray-200;
@include rtl-style {
border-right-color: $gray-200 !important;
}
}
}
}
.nav-align-top {
.nav-tabs {
.nav-link.active {
border-bottom-color: $nav-tabs-link-active-bg !important;
}
}
}
.nav-align-bottom {
.nav-tabs {
.nav-link.active {
border-top-color: $nav-tabs-link-active-bg !important;
}
}
}
}
// RTL
@include rtl-only {
.nav {
padding-right: 0;
}
.nav-align-left {
.nav-link {
text-align: right;
}
}
.nav-align-right {
.nav-link {
text-align: left;
}
}
}

87
resources/assets/vendor/scss/_bootstrap-extended/_navbar.scss vendored Normal file
View File

@ -0,0 +1,87 @@
// Navbar
// *******************************************************************************
.navbar {
z-index: 2;
// ! Fix: navbar dropdown focus outline
.dropdown:focus,
.dropdown-toggle:focus {
outline: 0;
}
.navbar-toggler:focus {
box-shadow: none;
}
.list-group-item:hover,
.list-group-item:focus {
background-color: $navbar-dropdown-hover-bg;
color: inherit;
}
}
.fixed-top {
z-index: $zindex-fixed;
}
.navbar.navbar-light {
color: $navbar-light-color;
}
.navbar-light .navbar-nav .nav-link.disabled {
color: $navbar-light-disabled-color !important;
}
.navbar.navbar-dark {
color: $navbar-dark-color;
}
.navbar-dark .navbar-nav .nav-link.disabled {
color: $navbar-dark-disabled-color !important;
}
// IE fix
.navbar-collapse,
.navbar-brand,
.navbar-text {
flex-shrink: 1;
}
// Icons
// .navbar-icon {
// font-size: 130%;
// }
// Rulers
.navbar-dark hr {
border-color: rgba(255, 255, 255, 0.1);
}
.navbar-light hr {
border-color: $gray-100;
}
// RTL Style
// ******************************************************************************
@include rtl-only {
.navbar-nav {
padding-right: 0;
}
.navbar-brand {
margin-right: 0;
margin-left: $navbar-padding-x;
}
}
// Mega dropdown
// ******************************************************************************
.mega-dropdown {
.dropdown-toggle {
outline: 0;
box-shadow: none;
}
.dropdown-menu {
width: 100%;
}
}

33
resources/assets/vendor/scss/_bootstrap-extended/_offcanvas.scss vendored Normal file
View File

@ -0,0 +1,33 @@
// Offcanvas
// *******************************************************************************
.offcanvas {
box-shadow: $offcanvas-box-shadow;
.offcanvas-header {
.btn-close {
padding: 0.44rem;
margin-right: 0;
background-size: 1.5rem;
background-image: str-replace(
str-replace($btn-close-bg, '#{$offcanvas-btn-close-color}', $headings-color),
'#',
'%23'
);
}
}
}
// RTL
// *******************************************************************************
@include rtl-only {
.offcanvas-start {
right: 0;
transform: translateX(100%);
}
.offcanvas-end {
right: auto;
left: 0;
transform: translateX(-100%);
}
}

226
resources/assets/vendor/scss/_bootstrap-extended/_pagination.scss vendored Normal file
View File

@ -0,0 +1,226 @@
// Pagination
// *******************************************************************************
// Pagination Mixins
@each $color, $value in $theme-colors {
@if $color != primary and $color != light {
@include template-pagination-variant('.pagination-#{$color}', $value);
@include template-pagination-outline-variant('.pagination-outline-#{$color}', $value);
}
}
// Pagination next, prev, first & last css padding
.page-item {
&.first,
&.last,
&.next,
&.prev,
&.previous {
.page-link {
padding: $pagination-padding-y - 0.043rem $pagination-padding-x - 0.067rem;
}
}
&.disabled,
&[disabled] {
.page-link {
pointer-events: none;
}
}
}
.pagination {
&.disabled,
&[disabled] {
.page-item .page-link {
opacity: $pagination-disabled-opacity;
}
}
}
// Pagination basic style
.page-link,
.page-link > a {
@include border-radius($border-radius);
text-align: center;
min-width: calc(
#{'#{($font-size-base * $pagination-line-height) + ($pagination-padding-x * 1.923)} + calc(#{$pagination-border-width} * 2)'}
);
min-height: calc(
#{'#{($font-size-base * $pagination-line-height) + ($pagination-padding-y * 2)} + calc(#{$pagination-border-width} * 2)'}
);
&:focus {
color: $pagination-hover-color;
}
display: inline-flex !important;
justify-content: center;
align-items: center;
}
// Add spacing between pagination items
.page-item + .page-item .page-link,
.pagination li + li > a:not(.page-link) {
.pagination-sm & {
margin-left: 0.25rem;
}
.pagination-lg & {
margin-left: 0.5rem;
}
}
// Removed border from default pagination and set line-height of icons
.pagination {
&:not([class*='pagination-outline-']) {
.page-link {
border-color: transparent;
}
& .page-item.active .waves-ripple {
background: none;
}
}
&[class*='pagination-outline-'] {
.page-item.active .page-link {
box-shadow: none;
}
.page-item:not(.active) .page-link,
.pagination li > a:not(.page-link) {
background-color: transparent;
&:hover,
&:focus {
background-color: rgba-to-hex(rgba($black, 0.06), $rgba-to-hex-bg);
border-color: rgba-to-hex(rgba($black, 0.22), $rgba-to-hex-bg);
color: $headings-color;
}
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba($black, 0.3) 0,
rgba($black, 0.4) 40%,
rgba($black, 0.5) 50%,
rgba($black, 0.6) 60%,
rgba($black, 0) 70%
);
}
}
}
}
}
.page-link.btn-primary {
box-shadow: none !important;
}
// Pagination shape rounded & Square
.pagination {
&.pagination-square .page-item a {
@include border-radius(0);
}
&.pagination-round .page-item a {
@include border-radius(50%);
}
&.pagination-rounded .page-item a {
@include border-radius($border-radius);
}
&.pagination-sm.pagination-rounded .page-item a {
@include border-radius($border-radius-sm);
}
&.pagination-lg.pagination-rounded .page-item a {
@include border-radius($border-radius-lg);
}
}
// Sizing
// *******************************************************************************
// Pagination Large
.pagination-lg .page-link,
.pagination-lg > li > a:not(.page-link) {
min-width: calc(
#{'#{($font-size-base * $pagination-line-height) + ($pagination-padding-x-lg * 1.615)} + calc(#{$pagination-border-width} * 2)'}
);
min-height: calc(
#{'#{($font-size-base * $pagination-line-height) + ($pagination-padding-y-lg * 2.33)} + calc(#{$pagination-border-width} * 2)'}
);
}
// Pagination Small
.pagination-sm .page-link,
.pagination-sm > li > a:not(.page-link) {
min-width: calc(
#{'#{($font-size-sm * $pagination-line-height) + ($pagination-padding-x-sm * 2.356)} + calc(#{$pagination-border-width} * 2)'}
);
min-height: calc(
#{'#{($font-size-sm * $pagination-line-height) + ($pagination-padding-y-sm * 2)} + calc(#{$pagination-border-width} * 2)'}
);
}
.pagination-sm > .page-item {
&.first,
&.last,
&.next,
&.prev,
&.previous {
.page-link {
padding: $pagination-padding-y-sm - 0.1055rem;
}
}
}
// RTL pagination
// *******************************************************************************
@include rtl-only {
.pagination {
padding-right: 0;
}
// Add spacing between pagination items
.page-item + .page-item .page-link,
.pagination li + li > a:not(.page-link) {
margin-left: 0;
margin-right: $pagination-margin-start;
.pagination-sm & {
margin-right: 0.25rem;
}
.pagination-lg & {
margin-right: 0.5rem;
}
}
.page-item {
&.first,
&.last,
&.next,
&.prev,
&.previous {
.page-link {
i {
transform: rotate(180deg);
}
}
}
}
}
@include dark-layout-only {
.pagination[class*='pagination-outline-'] {
.page-item .page-link,
.pagination li > a:not(.page-link) {
background-color: transparent;
&:hover,
&:focus {
background-color: rgba-to-hex(rgba($base, 0.06), $rgba-to-hex-bg);
border-color: rgba-to-hex(rgba($base, 0.22), $rgba-to-hex-bg);
}
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba(#000, 0.3) 0,
rgba(#000, 0.4) 40%,
rgba(#000, 0.5) 50%,
rgba(#000, 0.6) 60%,
rgba(#000, 0) 70%
);
}
}
}
}
}

42
resources/assets/vendor/scss/_bootstrap-extended/_popover.scss vendored Normal file
View File

@ -0,0 +1,42 @@
// Popovers
// *******************************************************************************
@each $color, $value in $theme-colors {
@if $color != primary and $color != light {
@include template-popover-variant(
'.popover-#{$color}, .popover-#{$color} > .popover, .ngb-popover-#{$color} + ngb-popover-window',
rgba-to-hex($value, $rgba-to-hex-bg)
);
}
}
.modal-open .popover {
z-index: $zindex-modal + 1;
}
.popover {
box-shadow: $popover-box-shadow;
// Popover header padding and font-size
.popover-header {
padding-bottom: 0;
font-size: $h5-font-size;
}
// Popover body padding
.popover-body {
padding-top: $spacer;
}
.popover-arrow {
z-index: 1;
}
}
// RTL
// *******************************************************************************
@include rtl-only {
.popover {
text-align: right;
}
}

44
resources/assets/vendor/scss/_bootstrap-extended/_progress.scss vendored Normal file
View File

@ -0,0 +1,44 @@
// Progress
// *******************************************************************************
.progress:has(:only-child) {
overflow: visible;
}
@each $color, $value in $theme-colors {
@if $color != primary {
@include template-progress-shadow-theme('.progress-bar.bg-#{$color}', $value);
}
}
@include ltr-only {
.progress {
.progress-bar:last-child {
border-top-right-radius: $progress-border-radius;
border-bottom-right-radius: $progress-border-radius;
}
.progress-bar:first-child {
border-top-left-radius: $progress-border-radius;
border-bottom-left-radius: $progress-border-radius;
}
}
}
// RTL
// *******************************************************************************
@include rtl-only {
.progress-bar-animated {
animation-direction: reverse;
}
.progress {
// border radius for first and last child
.progress-bar:last-child {
border-top-left-radius: $progress-border-radius;
border-bottom-left-radius: $progress-border-radius;
}
.progress-bar:first-child {
border-top-right-radius: $progress-border-radius;
border-bottom-right-radius: $progress-border-radius;
}
}
}

74
resources/assets/vendor/scss/_bootstrap-extended/_reboot.scss vendored Normal file
View File

@ -0,0 +1,74 @@
// Reboot
//
b,
strong {
font-weight: $font-weight-bold;
}
// Todo: commenting this style as creating issue on toast select and customizer select in windows
// @if $dark-style {
// select:not([multiple]):not([size]),
// select[size='1'] {
// option {
// color: $black;
// }
// }
// }
@include rtl-only {
caption {
text-align: right;
}
dd {
margin-right: 0;
}
}
a:not([href]) {
color: inherit;
text-decoration: none;
&:hover {
color: inherit;
text-decoration: none;
}
}
//! Fix: Autofill input bg and text color issue on different OS and browsers
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
input:-internal-autofill-selected {
background-clip: text !important;
-webkit-background-clip: text !important;
}
h1 {
line-height: $h1-line-height;
}
h2 {
line-height: $h2-line-height;
}
h3 {
line-height: $h3-line-height;
}
h4 {
line-height: $h4-line-height;
}
h5 {
line-height: $h5-line-height;
}
h6 {
line-height: $h6-line-height;
}

4
resources/assets/vendor/scss/_bootstrap-extended/_root.scss vendored Normal file
View File

@ -0,0 +1,4 @@
// The color-scheme CSS property https://web.dev/color-scheme/
:root {
color-scheme: #{$color-scheme};
}

44
resources/assets/vendor/scss/_bootstrap-extended/_spinners.scss vendored Normal file
View File

@ -0,0 +1,44 @@
// Spinners
//
//Large size
.spinner-border-lg {
width: $spinner-width-lg;
height: $spinner-height-lg;
border-width: $spinner-border-width-lg;
}
.spinner-grow-lg {
width: $spinner-width-lg;
height: $spinner-height-lg;
border-width: $spinner-border-width-lg;
}
// * Within button
// *******************************************************************************
.btn {
.spinner-border,
.spinner-grow {
position: relative;
top: -0.0625rem;
height: 1em;
width: 1em;
}
.spinner-border {
border-width: 0.15em;
}
}
@include keyframes('spinner-border-rtl') {
to {
transform: rotate(-360deg);
}
}
// RTL
@include rtl-only {
.spinner-border {
animation-name: spinner-border-rtl;
}
}

136
resources/assets/vendor/scss/_bootstrap-extended/_tables.scss vendored Normal file
View File

@ -0,0 +1,136 @@
// Tables
// ********************************************************************************/
@each $color, $value in $table-variants {
@if $color != primary {
@include template-table-variant($color, $value);
}
}
// Firefox fix for table head border bottom
.table {
> :not(caption) > * > * {
background-clip: padding-box;
}
&:not(.table-borderless):not(.table-dark) > :not(caption) > *:not(.table-dark) > * {
border-top-width: 1px;
}
.dropdown-item {
display: flex;
gap: 0.25rem;
}
tr {
> td {
.dropdown {
position: static;
}
}
}
caption {
padding: $table-cell-padding-y $table-cell-padding-x;
}
&.table-sm {
thead tr th {
padding-block: $table-head-padding-y-sm;
}
}
thead tr th {
padding-block: $table-head-padding-y;
}
}
// Style for table inside card
.card {
.table {
margin-bottom: 0;
}
}
@supports (-moz-appearance: none) {
.table {
.dropdown-menu.show {
display: inline-table;
}
}
}
// Table heading style
.table th {
text-transform: uppercase;
font-size: $font-size-sm;
letter-spacing: 0.2px;
color: $table-th-color;
}
.table-dark th {
color: var(--#{$prefix}table-color);
border-top: 1px solid $table-border-color;
}
@if $dark-style {
.table-light th {
color: var(--#{$prefix}table-color);
}
}
// Dark Table icon button
.table.table-dark .btn.btn-icon {
color: $table-border-color;
}
// class for to remove table border bottom
.table-border-bottom-0 {
tr:last-child {
td,
th {
border-bottom-width: 0;
}
}
}
// Dark Table icon button color
.table.table-dark {
.btn {
i {
color: $component-active-color;
}
}
}
// Flush spacing of left from first column ans right from last column
.table.table-flush-spacing {
thead,
tbody {
tr > td:first-child {
padding-left: 0;
}
tr > td:last-child {
padding-right: 0;
}
}
}
// * Table inside card
// *******************************************************************************
// .card,
.nav-align-top,
.nav-align-right,
.nav-align-bottom,
.nav-align-left {
.table:not(.table-dark),
.table:not(.table-dark) thead:not(.table-dark) th,
.table:not(.table-dark) tfoot:not(.table-dark) th,
.table:not(.table-dark) td {
border-color: $border-color;
}
}
// Dark styles
// Dark Table icon button color
@if $dark-style {
.table.table-dark {
.btn {
i {
color: $card-bg;
}
}
}
}

51
resources/assets/vendor/scss/_bootstrap-extended/_toasts.scss vendored Normal file
View File

@ -0,0 +1,51 @@
// Toasts
// *******************************************************************************
.toast.bs-toast {
z-index: $zindex-toast;
}
//btn close
.toast-header {
border-bottom: $border-width solid $toast-header-border-color;
.btn-close {
background-image: str-replace(str-replace($btn-close-bg, '#{$btn-close-color}', $text-muted), '#', '%23');
padding-top: 0;
padding-bottom: 0;
margin-left: 0.875rem;
background-size: 0.875rem;
}
}
// Toast body font size and padding override
.toast-body {
font-size: 0.8125rem;
padding-top: 0.684rem;
padding-bottom: 0.684rem;
}
.toast-container {
--#{$prefix}toast-zindex: 9;
}
// RTL close btn style
@include rtl-only {
.toast-header {
.btn-close {
margin-left: $toast-padding-x * -0.5;
margin-right: $toast-padding-x + 0.125;
}
}
}
// Bootstrap Toasts Example
.toast-ex {
position: fixed;
top: 4.1rem;
right: 0.5rem;
@include rtl-style {
left: 0.5rem;
right: auto;
}
}
// Placement Toast example
.toast-placement-ex {
position: fixed;
}

58
resources/assets/vendor/scss/_bootstrap-extended/_tooltip.scss vendored Normal file
View File

@ -0,0 +1,58 @@
// Tooltips
// *******************************************************************************
@each $color, $value in $theme-colors {
@if $color != primary and $color != light {
@include template-tooltip-variant(
'.tooltip-#{$color}, .tooltip-#{$color} > .tooltip, .ngb-tooltip-#{$color} + ngb-tooltip-window',
rgba-to-hex($value, $rgba-to-hex-bg)
);
}
}
// Open modal tooltip z-index
.modal-open .tooltip {
z-index: $zindex-modal + 2;
}
.tooltip-inner {
box-shadow: $tooltip-box-shadow;
font-weight: $font-weight-medium;
}
// Tooltip line height override
.tooltip {
line-height: $line-height-lg;
}
// RTL
// *******************************************************************************
@include rtl-only {
.tooltip {
text-align: right;
}
&.bs-tooltip-auto {
&[data-popper-placement='right'] {
.tooltip-arrow {
right: 0;
left: inherit;
&::before {
left: -1px;
border-width: ($tooltip-arrow-width * 0.5) 0 ($tooltip-arrow-width * 0.5) $tooltip-arrow-height;
border-left-color: $tooltip-arrow-color;
}
}
}
&[data-popper-placement='left'] {
.tooltip-arrow {
left: 0;
right: inherit;
&::before {
right: -1px;
border-width: ($tooltip-arrow-width * 0.5) $tooltip-arrow-height ($tooltip-arrow-width * 0.5) 0;
border-right-color: $tooltip-arrow-color;
}
}
}
}
}

13
resources/assets/vendor/scss/_bootstrap-extended/_type.scss vendored Normal file
View File

@ -0,0 +1,13 @@
// Type
//
@include rtl-only {
.list-inline,
.list-unstyled {
padding-right: 0;
}
.list-inline-item:not(:last-child) {
margin-right: 0;
margin-left: $list-inline-padding;
}
}

299
resources/assets/vendor/scss/_bootstrap-extended/_utilities-ltr.scss vendored Normal file
View File

@ -0,0 +1,299 @@
// stylelint-disable indentation
// Utilities
// stylelint-disable-next-line scss/dollar-variable-default
$utilities: map-merge(
$utilities,
(
'align': null,
'overflow': null,
'display': null,
'shadow': null,
'position': null,
'top': null,
'bottom': null,
'border': null,
'border-top': null,
'border-bottom': null,
'border-color': null,
'border-width': null,
'border-bottom-dashed': null,
'border-top-dashed': null,
'width': null,
'max-width': null,
'viewport-width': null,
'min-viewport-width': null,
'height': null,
'max-height': null,
'viewport-height': null,
'min-viewport-height': null,
'flex': null,
'flex-direction': null,
'flex-grow': null,
'flex-shrink': null,
'flex-wrap': null,
'gap': null,
'justify-content': null,
'align-items': null,
'align-content': null,
'align-self': null,
'order': null,
'margin': null,
'margin-x': null,
'margin-y': null,
'margin-top': null,
'margin-bottom': null,
'negative-margin': null,
'negative-margin-x': null,
'negative-margin-y': null,
'negative-margin-top': null,
'negative-margin-bottom': null,
'padding': null,
'padding-x': null,
'padding-y': null,
'padding-top': null,
'padding-bottom': null,
'font-family': null,
'font-size': null,
'font-style': null,
'font-weight': null,
'line-height': null,
'text-decoration': null,
'text-transform': null,
'white-space': null,
'word-wrap': null,
'color': null,
'background-color': null,
'transparent': null,
'gradient': null,
'user-select': null,
'pointer-events': null,
'rounded': null,
'rounded-top': null,
'rounded-bottom': null,
'visibility': null,
'opacity': null,
'flex-basis': null,
'cursor': null,
// scss-docs-start utils-float
'float':
(
responsive: true,
property: float,
values: (
start: left,
end: right,
none: none
)
),
// scss-docs-end utils-float
// scss-docs-start utils-position
'end':
(
property: right,
class: end,
values: $position-values
),
'start': (
property: left,
class: start,
values: $position-values
),
'translate-middle': (
property: transform,
class: translate-middle,
values: (
null: translate(-50%, -50%),
x: translateX(-50%),
y: translateY(-50%)
)
),
// scss-docs-end utils-position
// scss-docs-start utils-borders
'border-end':
(
property: border-right,
class: border-end,
values: (
null: $border-width solid $border-color,
0: 0
)
),
'border-start': (
property: border-left,
class: border-start,
values: (
null: $border-width solid $border-color,
0: 0
)
),
'border-left-dashed': (
property: border-left-style,
class: border-left-dashed,
values: (
null: dashed
)
),
'border-right-dashed': (
property: border-right-style,
class: border-right-dashed,
values: (
null: dashed
)
),
// scss-docs-end utils-borders
// scss-docs-start utils-text
'text-align':
(
responsive: true,
property: text-align,
class: text,
values: (
start: left,
end: right,
center: center
)
),
// scss-docs-end utils-text
// scss-docs-start utils-border-radius
'rounded-end':
(
property: border-top-right-radius border-bottom-right-radius,
class: rounded-end,
values: (
null: $border-radius
)
),
'rounded-start': (
property: border-bottom-left-radius border-top-left-radius,
class: rounded-start,
values: (
null: $border-radius
)
),
'rounded-start-top': (
property: border-top-left-radius,
class: rounded-start-top,
values: (
null: $border-radius
)
),
'rounded-start-bottom': (
property: border-bottom-left-radius,
class: rounded-start-bottom,
values: (
null: $border-radius
)
),
'rounded-end-top': (
property: border-top-right-radius,
class: rounded-end-top,
values: (
null: $border-radius
)
),
'rounded-end-bottom': (
property: border-bottom-right-radius,
class: rounded-end-bottom,
values: (
null: $border-radius
)
),
// scss-docs-end utils-border-radius
// Margin utilities
// scss-docs-start utils-spacing
'margin-end':
(
responsive: true,
property: margin-right,
class: me,
values:
map-merge(
$spacers,
(
auto: auto
)
)
),
'margin-start': (
responsive: true,
property: margin-left,
class: ms,
values:
map-merge(
$spacers,
(
auto: auto
)
)
),
// Negative margin utilities
'negative-margin-end':
(
responsive: true,
property: margin-right,
class: me,
values: $negative-spacers
),
'negative-margin-start': (
responsive: true,
property: margin-left,
class: ms,
values: $negative-spacers
),
// Padding utilities
'padding-end':
(
responsive: true,
property: padding-right,
class: pe,
values: $spacers
),
'padding-start': (
responsive: true,
property: padding-left,
class: ps,
values: $spacers
),
// scss-docs-end utils-spacing
// Custom Utilities
// *******************************************************************************
// scss-docs-start utils-rotate
'rotate':
(
property: transform,
class: rotate,
values: (
0: rotate(0deg),
90: rotate(90deg),
180: rotate(180deg),
270: rotate(270deg),
n90: rotate(-90deg),
n180: rotate(-180deg),
n270: rotate(-270deg)
)
),
// scss-docs-end utils-rotate
// scss-docs-start utils-scaleX
'scaleX':
(
property: transform,
class: scaleX,
values: (
n1: scaleX(-1)
)
),
// scss-docs-end utils-scaleX
// scss-docs-start utils-scaleY
'scaleY':
(
property: transform,
class: scaleY,
values: (
n1: scaleY(-1)
)
)
// scss-docs-end utils-scaleY
)
);

301
resources/assets/vendor/scss/_bootstrap-extended/_utilities-rtl.scss vendored Normal file
View File

@ -0,0 +1,301 @@
// stylelint-disable indentation
// Utilities
// stylelint-disable-next-line scss/dollar-variable-default
$utilities: map-merge(
$utilities,
(
'align': null,
'overflow': null,
'display': null,
'shadow': null,
'position': null,
'top': null,
'bottom': null,
'border': null,
'border-top': null,
'border-bottom': null,
'border-color': null,
'border-width': null,
'border-bottom-dashed': null,
'border-top-dashed': null,
'width': null,
'max-width': null,
'viewport-width': null,
'min-viewport-width': null,
'height': null,
'max-height': null,
'viewport-height': null,
'min-viewport-height': null,
'flex': null,
'flex-direction': null,
'flex-grow': null,
'flex-shrink': null,
'flex-wrap': null,
'gap': null,
'justify-content': null,
'align-items': null,
'align-content': null,
'align-self': null,
'order': null,
'margin': null,
'margin-x': null,
'margin-y': null,
'margin-top': null,
'margin-bottom': null,
'negative-margin': null,
'negative-margin-x': null,
'negative-margin-y': null,
'negative-margin-top': null,
'negative-margin-bottom': null,
'padding': null,
'padding-x': null,
'padding-y': null,
'padding-top': null,
'padding-bottom': null,
'font-family': null,
'font-size': null,
'font-style': null,
'font-weight': null,
'line-height': null,
'text-decoration': null,
'text-transform': null,
'white-space': null,
'word-wrap': null,
'color': null,
'background-color': null,
'transparent': null,
'gradient': null,
'user-select': null,
'pointer-events': null,
'rounded': null,
'rounded-top': null,
'rounded-bottom': null,
'visibility': null,
'opacity': null,
'flex-basis': null,
'cursor': null,
// scss-docs-start utils-float
'float':
(
responsive: true,
property: float,
values: (
start: right,
end: left,
none: none
)
),
// scss-docs-end utils-float
// scss-docs-start utils-position
'end':
(
property: left,
class: end,
values: $position-values
),
'start': (
property: right,
class: start,
values: $position-values
),
'translate-middle': (
property: transform,
class: translate-middle,
values: (
null: translate(50%, -50%),
x: translateX(50%),
y: translateY(-50%)
)
),
// scss-docs-end utils-position
// scss-docs-start utils-borders
'border-end':
(
property: border-left,
class: border-end,
values: (
null: $border-width solid $border-color,
0: 0
)
),
'border-start': (
property: border-right,
class: border-start,
values: (
null: $border-width solid $border-color,
0: 0
)
),
'border-left-dashed': (
property: border-right-style,
class: border-left-dashed,
values: (
null: dashed
)
),
'border-right-dashed': (
property: border-left-style,
class: border-right-dashed,
values: (
null: dashed
)
),
// scss-docs-end utils-borders
// scss-docs-start utils-text
'text-align':
(
responsive: true,
property: text-align,
class: text,
values: (
start: right,
end: left,
center: center
)
),
// scss-docs-end utils-text
// scss-docs-start utils-border-radius
'rounded-end':
(
property: border-top-left-radius border-bottom-left-radius,
class: rounded-end,
values: (
null: $border-radius
)
),
'rounded-start': (
property: border-bottom-right-radius border-top-right-radius,
class: rounded-start,
values: (
null: $border-radius
)
),
'rounded-start-top': (
property: border-top-right-radius,
class: rounded-start-top,
values: (
null: $border-radius
)
),
'rounded-start-bottom': (
property: border-bottom-right-radius,
class: rounded-start-bottom,
values: (
null: $border-radius
)
),
'rounded-end-top': (
property: border-top-left-radius,
class: rounded-end-top,
values: (
null: $border-radius
)
),
'rounded-end-bottom': (
property: border-bottom-left-radius,
class: rounded-end-bottom,
values: (
null: $border-radius
)
),
// scss-docs-end utils-border-radius
// Margin utilities
// scss-docs-start utils-spacing
'margin-end':
(
responsive: true,
property: margin-left,
class: me,
values:
map-merge(
$spacers,
(
auto: auto
)
)
),
'margin-start': (
responsive: true,
property: margin-right,
class: ms,
values:
map-merge(
$spacers,
(
auto: auto
)
)
),
// Negative margin utilities
'negative-margin-end':
(
responsive: true,
property: margin-left,
class: me,
values: $negative-spacers
),
'negative-margin-start': (
responsive: true,
property: margin-right,
class: ms,
values: $negative-spacers
),
// Padding utilities
'padding-end':
(
responsive: true,
property: padding-left,
class: pe,
values: $spacers
),
'padding-start': (
responsive: true,
property: padding-right,
class: ps,
values: $spacers
),
// scss-docs-end utils-spacing
// Custom Utilities
// *******************************************************************************
// scss-docs-start utils-rotate
'rotate':
(
property: transform,
class: rotate,
values: (
0: rotate(0deg),
90: rotate(-90deg),
180: rotate(-180deg),
270: rotate(-270deg),
n90: rotate(90deg),
n180: rotate(180deg),
n270: rotate(270deg)
)
),
// scss-docs-end utils-rotate
// scss-docs-start utils-scaleX
'scaleX':
(
property: transform,
class: scaleX,
values: (
n1: scaleX(1),
n1-rtl: scaleX(-1)
)
),
// scss-docs-end utils-scaleX
// scss-docs-start utils-scaleY
'scaleY':
(
property: transform,
class: scaleY,
values: (
n1: scaleY(1),
n1-rtl: scaleY(-1)
)
)
// scss-docs-end utils-scaleY
)
);

1081
resources/assets/vendor/scss/_bootstrap-extended/_utilities.scss vendored Normal file
View File

File diff suppressed because it is too large Load Diff

236
resources/assets/vendor/scss/_bootstrap-extended/_variables-dark.scss vendored Normal file
View File

@ -0,0 +1,236 @@
// Variables
//
// Variables should follow the `$component-state-property-size` formula for
// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
//
// (C) Custom variables for extended components of bootstrap only
// ! _variable-dark.scss file overrides _variable.scss file.
// * Colors
// *******************************************************************************
// scss-docs-start gray-color-variables
$white: #fff !default;
$black: #2f3349 !default;
$base: #e1def5 !default;
$gray-25: rgba($base, 0.025) !default; // (C)
$gray-50: rgba($base, 0.06) !default; // (C)
$gray-75: rgba($base, 0.08) !default; // (C)
$gray-100: rgba($base, 0.1) !default;
$gray-200: rgba($base, 0.12) !default;
$gray-300: rgba($base, 0.3) !default;
$gray-400: rgba($base, 0.4) !default;
$gray-500: rgba($base, 0.5) !default;
$gray-600: rgba($base, 0.6) !default;
$gray-700: rgba($base, 0.7) !default;
$gray-800: rgba($base, 0.8) !default;
$gray-900: rgba($base, 0.9) !default;
// scss-docs-end gray-color-variables
// scss-docs-start gray-colors-map
$grays: (
'25': $gray-25,
'50': $gray-50
) !default;
// scss-docs-end gray-colors-map
// scss-docs-start color-variables
$blue: #007bff !default;
$indigo: #6610f2 !default;
$purple: #7367f0 !default;
$pink: #e83e8c !default;
$red: #ff4c51 !default;
$orange: #fd7e14 !default;
$yellow: #ff9f43 !default;
$green: #28c76f !default;
$teal: #20c997 !default;
$cyan: #00bad1 !default;
// scss-docs-end color-variables
// scss-docs-start theme-color-variables
$primary: $purple !default;
$secondary: #808390 !default;
$success: $green !default;
$info: $cyan !default;
$warning: $yellow !default;
$danger: $red !default;
$light: #44475b !default;
$dark: #d7d8de !default;
$gray: $gray-500 !default; // (C)
// scss-docs-end theme-color-variables
// scss-docs-start theme-colors-map
$theme-colors: (
'primary': $primary,
'secondary': $secondary,
'success': $success,
'info': $info,
'warning': $warning,
'danger': $danger,
'light': $light,
'dark': $dark,
'gray': $gray
) !default;
// scss-docs-end theme-colors-map
$color-scheme: 'dark' !default; // (C)
// * Body
// *******************************************************************************
$body-bg: #25293c !default;
$rgba-to-hex-bg: $black !default; // (C)
$body-color: rgba-to-hex($gray-700, $rgba-to-hex-bg) !default;
$rgba-to-hex-bg-inverted: rgb(160, 149, 149) !default; // (C)
// * Components
// *******************************************************************************
$alert-border-scale: -84% !default;
$alert-color-scale: 0% !default;
$border-color: rgba-to-hex($gray-200, $rgba-to-hex-bg) !default;
// scss-docs-start box-shadow-variables
$shadow-bg: #131120 !default; // (C)
$box-shadow: 0 0.1875rem 0.75rem 0 rgba($shadow-bg, 0.2) !default;
$box-shadow-xs: 0 0.0625rem 0.375rem 0 rgba($shadow-bg, 0.16) !default;
$box-shadow-sm: 0 0.125rem 0.5rem 0 rgba($shadow-bg, 0.18) !default;
$box-shadow-lg: 0 0.25rem 1.125rem 0 rgba($shadow-bg, 0.22) !default;
$box-shadow-xl: 0 0.3125rem 1.875rem 0 rgba($shadow-bg, 0.24) !default;
// scss-docs-end box-shadow-variables
$floating-component-border-color: rgba($white, 0.05) !default; // (C)
$floating-component-shadow: 0 0.31rem 1.25rem 0 rgba($black, 0.4) !default; // (C)
// * Typography
// *******************************************************************************
$text-muted: rgba-to-hex($gray-400, $rgba-to-hex-bg) !default;
$text-muted-hover: rgba-to-hex($white, $rgba-to-hex-bg) !default; // (C)
$text-light: rgba-to-hex($gray-500, $rgba-to-hex-bg) !default; // (C)
$text-lighter: rgba-to-hex($gray-400, $rgba-to-hex-bg) !default; // (C)
$text-lightest: rgba-to-hex($gray-300, $rgba-to-hex-bg) !default; // (C)
$headings-color: rgba-to-hex($gray-900, $rgba-to-hex-bg) !default;
// * Cards
// *******************************************************************************
$card-bg: #2f3349 !default;
$card-subtitle-color: rgba-to-hex(rgba($base, 0.55), $rgba-to-hex-bg) !default;
// * Tables
// *******************************************************************************
$table-bg-scale: -84% !default;
$table-hover-bg-factor: 0.06 !default;
$table-hover-bg: rgba($base, $table-hover-bg-factor) !default;
$table-striped-bg-factor: 0.06 !default;
$table-striped-bg: rgba-to-hex(rgba($base, $table-striped-bg-factor), $rgba-to-hex-bg) !default;
$table-active-color: $body-color !default;
$table-active-bg-factor: 0.08 !default;
$table-active-bg: rgba($primary, $table-active-bg-factor) !default;
$table-hover-bg-factor: 0.06 !default;
$table-hover-bg: rgba($black, $table-hover-bg-factor) !default;
$table-border-color: $border-color !default;
$table-group-separator-color: $table-border-color !default;
// * Accordion
// *******************************************************************************
$accordion-bg: $card-bg !default;
$accordion-border-color: $border-color !default;
$accordion-button-color: $headings-color !default;
// * Tooltips
// *******************************************************************************
$tooltip-bg: #f7f4ff !default;
$tooltip-color: $black !default;
// Buttons
// *******************************************************************************
$btn-box-shadow: 0px 2px 4px rgba(15, 20, 34, 0.4) !default;
// * Forms
// *******************************************************************************
$input-bg: transparent !default;
$input-disabled-border-color: rgba-to-hex(rgba($base, 0.23), $rgba-to-hex-bg) !default;
$input-border-hover-color: rgba-to-hex($gray-600, $rgba-to-hex-bg) !default; // (C)
$input-border-color: rgba-to-hex(rgba($base, 0.22), $rgba-to-hex-bg) !default;
$form-select-bg: $input-bg !default;
$form-select-indicator: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 22" fill="none"><path d="M10.9999 12.0743L15.5374 7.53676L16.8336 8.83292L10.9999 14.6666L5.16626 8.83292L6.46243 7.53676L10.9999 12.0743Z" fill="#{$base}" fill-opacity="0.9"/></svg>') !default;
$form-range-thumb-bg: $primary !default;
// * Navs
// *******************************************************************************
$nav-tabs-link-active-bg: $card-bg !default;
$nav-tabs-link-active-border-color: $nav-tabs-link-active-bg !default;
$nav-pills-link-hover-bg: rgba-to-hex(rgba($primary, 0.16), $card-bg) !default; // (C)
// * Navbar
// *******************************************************************************
$navbar-light-hover-color: #4e5155 !default;
$navbar-light-active-color: #4e5155 !default;
$navbar-light-disabled-color: rgba($black, 0.2) !default;
$navbar-dropdown-hover-bg: rgba-to-hex(rgba($base, 0.06), $rgba-to-hex-bg) !default; // (C)
$navbar-dropdown-icon-bg: rgba-to-hex(rgba($base, 0.08), $rgba-to-hex-bg) !default; // (C)
// * Dropdowns
// *******************************************************************************
$dropdown-bg: $card-bg !default;
$dropdown-divider-bg: $border-color !default;
$dropdown-link-hover-bg: $gray-50 !default;
// * Pagination
// *******************************************************************************
$pagination-bg: $gray-75 !default;
$pagination-border-color: rgba-to-hex(rgba($base, 0.22), $rgba-to-hex-bg) !default;
$pagination-disabled-border-color: rgba-to-hex(rgba($base, 0.22), $rgba-to-hex-bg) !default;
// * Modal
// *******************************************************************************
$modal-content-bg: $card-bg !default;
$modal-backdrop-bg: #171925 !default;
$modal-backdrop-opacity: 0.6 !default;
// * Progress bars
// *******************************************************************************
$progress-bg: $gray-75 !default;
// * List group
// *******************************************************************************
$list-group-border-color: $border-color !default;
$list-group-item-bg-hover-scale: 6% !default; // (c)
$list-group-active-bg: rgba-to-hex(rgba($primary, 0.16), $rgba-to-hex-bg) !default;
$list-group-hover-bg: rgba-to-hex($gray-50, $rgba-to-hex-bg) !default;
// * Close
// *******************************************************************************
$btn-close-color: $white !default;
$kbd-color: $dark !default;
// * Config
$rtl-support: false !default;
$dark-style: true !default;

1090
resources/assets/vendor/scss/_bootstrap-extended/_variables.scss vendored Normal file
View File

File diff suppressed because it is too large Load Diff

36
resources/assets/vendor/scss/_bootstrap-extended/forms/_floating-labels.scss vendored Normal file
View File

@ -0,0 +1,36 @@
// Floating Labels
// *******************************************************************************
// Display placeholder on focus
.form-floating {
> .form-control:focus,
> .form-control:not(:placeholder-shown) {
&::placeholder {
color: $input-placeholder-color;
}
}
}
// RTL
@include rtl-only {
.form-floating {
> label {
right: 0;
transform-origin: 100% 0;
}
> .form-control:focus,
> .form-control:not(:placeholder-shown),
> .form-select {
~ label {
transform: $form-floating-label-transform-rtl;
}
}
> .form-control:-webkit-autofill {
~ label {
transform: $form-floating-label-transform-rtl;
}
}
}
}

79
resources/assets/vendor/scss/_bootstrap-extended/forms/_form-check.scss vendored Normal file
View File

@ -0,0 +1,79 @@
// Checkboxes and Radios
// *******************************************************************************
.form-check-input {
cursor: $form-check-label-cursor;
&:disabled {
background-color: $form-check-input-disabled-bg;
border-color: $form-check-input-disabled-bg;
}
&:checked {
box-shadow: $box-shadow-xs;
}
}
.form-check {
position: relative;
}
// Only for checkbox and radio (not for bs default switch)
//? .dt-checkboxes-cell class is used for DataTables checkboxes
.form-check:not(.form-switch),
.dt-checkboxes-cell {
.form-check-input[type='radio'] {
background-size: 1.3125rem;
&:not(:checked) {
background-size: 0.75rem;
}
}
}
// RTL Style
@include rtl-only {
.form-check {
padding-left: 0;
padding-right: $form-check-padding-start;
}
.form-check .form-check-input {
float: right;
margin-left: 0;
margin-right: $form-check-padding-start * -1;
}
}
// Switches
// *******************************************************************************
.form-switch .form-check-input {
background-color: $form-switch-bg;
border: none;
box-shadow: $form-switch-box-shadow;
&:focus {
box-shadow: $form-switch-box-shadow;
}
}
// RTL Style
@include rtl-only {
.form-switch {
padding-left: 0;
padding-right: $form-switch-padding-start;
.form-check-input {
margin-left: 0;
margin-right: $form-switch-padding-start * -1;
background-position: right center;
&:checked {
background-position: $form-switch-checked-bg-position-rtl;
}
}
}
.form-check-inline {
margin-right: 0;
margin-left: $form-check-inline-margin-end;
}
}
// Contextual colors for form check
@each $color, $value in $theme-colors {
@if $color != primary {
@include template-form-check-variant('.form-check-#{$color}', $value);
}
}

73
resources/assets/vendor/scss/_bootstrap-extended/forms/_form-control.scss vendored Normal file
View File

@ -0,0 +1,73 @@
// Form control
// *******************************************************************************
//? Form control (all size) padding calc due to border increase on focus
.form-control {
&::placeholder,
&:focus::placeholder {
transition: all 0.2s ease;
}
padding: calc($input-padding-y - $input-border-width) calc($input-padding-x - $input-border-width);
// border color on hover state
&:hover {
&:not([disabled]):not([focus]) {
border-color: $input-border-hover-color;
}
}
// ! FIX: wizard-ex input type number placeholder align issue
&[type='number'] {
.input-group & {
line-height: 1.375rem;
min-height: 2.375rem;
}
.input-group-lg & {
line-height: 1.5rem;
min-height: 3rem;
}
.input-group-sm & {
min-height: 1.875rem;
}
}
&:focus {
border-width: $input-focus-border-width;
padding: calc($input-padding-y - $input-focus-border-width) calc($input-padding-x - $input-focus-border-width);
}
&.form-control-lg {
padding: calc($input-padding-y-lg - $input-border-width) calc($input-padding-x-lg - $input-border-width);
&:focus {
padding: calc($input-padding-y-lg - $input-focus-border-width)
calc($input-padding-x-lg - $input-focus-border-width);
}
}
&.form-control-sm {
padding: calc($input-padding-y-sm - $input-border-width) calc($input-padding-x-sm - $input-border-width);
&:focus {
padding: calc($input-padding-y-sm - $input-focus-border-width)
calc($input-padding-x-sm - $input-focus-border-width);
}
}
}
.input-group:has(button) .form-control {
padding: calc($input-padding-y - $input-border-width) calc($input-padding-x - $input-border-width) !important;
border-width: $input-border-width !important;
}
// ltr only
@include ltr-only {
.form-control:not([readonly]) {
&:focus::placeholder {
transform: translateX(4px);
}
}
}
// rtl only
@include rtl-only {
input[type='tel'] {
text-align: right;
}
.form-control:not([readonly]) {
&:focus::placeholder {
transform: translateX(-4px);
}
}
}

49
resources/assets/vendor/scss/_bootstrap-extended/forms/_form-range.scss vendored Normal file
View File

@ -0,0 +1,49 @@
// Range select
// *******************************************************************************
.form-range {
// Chrome specific
&::-webkit-slider-thumb {
box-shadow: $form-range-thumb-box-shadow;
&:hover {
box-shadow: 0 0 0 8px rgba($primary, 0.16);
}
&:active,
&:focus {
box-shadow: 0 0 0 13px rgba($primary, 0.16);
background-color: $primary;
border-color: $primary;
}
}
&::-webkit-slider-runnable-track {
background-color: $primary;
}
// Mozilla specific
&::-moz-range-thumb {
box-shadow: $form-range-thumb-box-shadow;
&:hover {
box-shadow: 0 0 0 8px rgba($primary, 0.16);
}
&:active,
&:focus {
box-shadow: 0 0 0 13px rgba($primary, 0.16);
background-color: $primary;
border-color: $primary;
}
}
&::-moz-range-track {
background-color: $primary;
}
&:disabled {
&::-webkit-slider-runnable-track {
background-color: $form-range-track-disabled-bg;
}
&::-moz-range-track {
background-color: $form-range-track-disabled-bg;
}
}
}

109
resources/assets/vendor/scss/_bootstrap-extended/forms/_form-select.scss vendored Normal file
View File

@ -0,0 +1,109 @@
// Select
// *******************************************************************************
.form-select {
background-clip: padding-box;
padding: calc($form-select-padding-y - $input-border-width) calc($form-select-padding-x - $input-border-width);
padding-inline-end: calc($form-select-padding-x * 3 - $input-border-width);
optgroup {
background-color: $card-bg;
}
&:hover {
&:not([disabled]):not([focus]) {
border-color: $input-border-hover-color;
}
}
&:disabled {
@include ltr-style {
background-image: escape-svg($form-select-disabled-indicator);
}
@include rtl-style {
background-image: escape-svg($form-select-disabled-indicator);
}
}
&:focus,
.was-validated & {
border-width: $input-focus-border-width;
@include ltr-style {
padding: calc($form-select-padding-y - $input-focus-border-width)
calc($form-select-padding-x * 3 - $input-focus-border-width)
calc($form-select-padding-y - $input-focus-border-width)
calc($form-select-padding-x - $input-focus-border-width);
}
@include rtl-style {
padding: calc($form-select-padding-y - $input-focus-border-width)
calc($form-select-padding-x - $input-focus-border-width)
calc($form-select-padding-y - $input-focus-border-width)
calc($form-select-padding-x * 3 - $input-focus-border-width);
}
background-position: right calc($form-select-padding-x - 1px) center;
}
&.form-select-lg {
min-height: $input-height-lg;
background-size: 24px 24px;
padding: calc($form-select-padding-y-lg - $input-border-width) calc($form-select-padding-x-lg - $input-border-width);
padding-inline-end: calc($form-select-padding-x-lg * 3 - $input-border-width);
&:focus,
.was-validated & {
@include ltr-style {
padding: calc($form-select-padding-y-lg - $input-focus-border-width)
calc($form-select-padding-x-lg * 3 - $input-focus-border-width)
calc($form-select-padding-y-lg - $input-focus-border-width)
calc($form-select-padding-x-lg - $input-focus-border-width);
}
@include rtl-style {
padding: calc($form-select-padding-y-lg - $input-focus-border-width)
calc($form-select-padding-x-lg - $input-focus-border-width)
calc($form-select-padding-y-lg - $input-focus-border-width)
calc($form-select-padding-x-lg * 3 - $input-focus-border-width);
}
}
}
&.form-select-sm {
min-height: $input-height-sm;
background-size: 20px 20px;
padding: calc($form-select-padding-y-sm - $input-border-width) calc($form-select-padding-x-sm - $input-border-width);
padding-inline-end: calc($form-select-padding-x-sm * 3 - $input-border-width);
&:focus,
.was-validated & {
@include ltr-style {
padding: calc($form-select-padding-y-sm - $input-focus-border-width)
calc($form-select-padding-x-sm * 3 - $input-focus-border-width)
calc($form-select-padding-y-sm - $input-focus-border-width)
calc($form-select-padding-x-sm - $input-focus-border-width);
}
@include rtl-style {
padding: calc($form-select-padding-y-sm - $input-focus-border-width)
calc($form-select-padding-x-sm - $input-focus-border-width)
calc($form-select-padding-y-sm - $input-focus-border-width)
calc($form-select-padding-x-sm * 3 - $input-focus-border-width);
}
}
// background-size: 14px 11px;
}
}
// Multiple select RTL Only
@include rtl-only {
.form-select {
background-image: $form-select-indicator-rtl;
background-position: left $form-select-padding-x center;
&:focus {
background-position: left calc($form-select-padding-x - 1px) center;
}
&[multiple],
&[size]:not([size='1']) {
background-image: none;
}
}
.was-validated .form-select {
background-position: left calc($form-select-padding-x - 1px) center;
}
}
@if $dark-style {
select.form-select {
option {
background-color: $card-bg;
}
}
}

2
resources/assets/vendor/scss/_bootstrap-extended/forms/_form-text.scss vendored Normal file
View File

@ -0,0 +1,2 @@
// Form Text
// *******************************************************************************

393
resources/assets/vendor/scss/_bootstrap-extended/forms/_input-group.scss vendored Normal file
View File

@ -0,0 +1,393 @@
// Input groups
// *******************************************************************************
$validation-messages: '';
@each $state in map-keys($form-validation-states) {
$validation-messages: $validation-messages +
':not(.' +
unquote($state) +
'-tooltip)' +
':not(.' +
unquote($state) +
'-feedback)';
}
// Using :focus-within to apply focus/validation border and shadow to default and merged input-group
.input-group {
border-radius: $input-border-radius;
// Input group (Default)
.input-group-text {
padding: calc($input-padding-y - $input-focus-border-width) calc($input-padding-x - $input-border-width);
@include transition($input-transition);
}
//? Info :focus-within to apply focus/validation border and shadow to default and merged input & input-group
&:focus-within {
.input-group-text {
border-width: $input-focus-border-width;
padding: calc($input-padding-y - calc($input-focus-border-width + $input-border-width))
calc($input-padding-x - $input-focus-border-width);
.was-validated &,
.fv-plugins-bootstrap5-row-invalid & {
padding: calc($input-padding-y - $input-focus-border-width) calc($input-padding-x - $input-border-width);
}
}
.form-control,
.form-select {
border-width: $input-focus-border-width;
padding: calc($input-padding-y - $input-focus-border-width) calc($input-padding-x - $input-border-width);
&:first-child {
padding-inline-start: calc($input-padding-x - $input-focus-border-width);
}
}
}
// Input group (lg)
&.input-group-lg {
.input-group-text {
padding: calc($input-padding-y-lg - $input-border-width) calc($input-padding-x-lg - $input-border-width);
}
&:focus-within {
.input-group-text {
padding: calc($input-padding-y-lg - $input-border-width) calc($input-padding-x-lg - $input-focus-border-width);
}
.form-control:not(:first-child),
.form-select:not(:first-child) {
padding: calc($input-padding-y-lg - $input-border-width) calc($input-padding-x-lg);
}
}
}
// Input group (sm)
&.input-group-sm {
.form-control,
.form-select {
padding-inline: calc($input-padding-x-sm - $input-border-width);
}
.input-group-text {
padding: calc($input-padding-y-sm - $input-border-width) calc($input-padding-x-sm - $input-border-width);
}
&:focus-within {
.input-group-text {
padding: calc($input-padding-y-sm - $input-focus-border-width)
calc($input-padding-x-sm - $input-focus-border-width);
}
.form-control,
.form-select {
padding: calc($input-padding-y-sm - $input-border-width) calc($input-padding-x-sm);
}
}
}
> :not(:first-child):not(.dropdown-menu):not(.btn):not(.dropdown-menu + .form-control):not(
.btn + .form-control
)#{$validation-messages} {
margin-inline-start: calc($input-focus-border-width - 3px);
}
// Input group merge
&.input-group-merge {
> :not(:first-child):not(.dropdown-menu):not(.btn):not(.dropdown-menu + .form-control):not(
.btn + .form-control
)#{$validation-messages} {
margin-inline-start: calc(($input-focus-border-width + $input-border-width) * -1);
}
&:focus-within {
> .form-control:first-child,
> .form-select:first-child {
padding-inline: calc($input-padding-x - $input-focus-border-width);
}
}
&.input-group-sm {
&:focus-within {
> .form-control:first-child,
> .form-select:first-child {
padding-inline: calc($input-padding-x - $input-focus-border-width);
}
}
}
}
// Input group on focus-within use margin-left same as as focus border width
&:focus-within {
> :not(:first-child):not(.dropdown-menu):not(.btn):not(.dropdown-menu + .form-control):not(
.btn + .form-control
)#{$validation-messages} {
margin-inline-start: calc($input-focus-border-width * -1);
}
}
// Rounded pill option
&.rounded-pill {
.input-group-text,
.form-control {
@include border-radius($border-radius-pill);
}
}
&:hover {
.input-group-text,
.form-control {
border-color: $input-border-hover-color;
}
}
&:focus-within {
box-shadow: $input-focus-box-shadow;
.form-control,
.input-group-text {
box-shadow: none;
}
}
.was-validated & {
&:has(.is-invalid),
&:has(.is-valid),
&:has(:valid),
&:has(:invalid) {
box-shadow: none;
}
}
&.has-validation,
&.is-invalid {
&:has(.is-invalid),
&:has(.is-valid),
&:has(:invalid),
&:has(.form-control.is-invalid) {
box-shadow: none;
}
}
// For disabled input group
&.disabled {
.input-group-text {
background-color: $input-disabled-bg;
}
}
// ! FIX: Formvalidation border radius issue
&.has-validation {
> .input-group-text:first-child {
@include border-end-radius(0);
}
> .form-control:first-child {
@include border-end-radius(0);
}
> .form-control:not(:first-child):not(:last-child) {
@include border-radius(0);
}
}
}
// input-group-text icon size
.input-group-text {
background-clip: padding-box;
i {
@include font-size(1.25rem);
}
}
.input-group-lg > .input-group-text {
i {
@include font-size(1.375rem);
}
}
.input-group-sm > .input-group-text {
i {
@include font-size(1.125rem);
}
}
// Merge input
// Input group merge .form-control border & padding
@include ltr-only {
.input-group-merge {
.input-group-text {
&:first-child {
border-right: 0;
}
&:last-child {
border-left: 0;
}
}
&.disabled {
> :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(
.invalid-feedback
) {
margin-left: 0 !important;
}
}
.form-control:not(textarea) {
&:not(:first-child) {
padding-left: 0 !important;
border-left: 0;
}
&:not(:last-child) {
padding-right: 0 !important;
border-right: 0;
}
}
.form-control:not(textarea) {
&:not(:first-child) {
padding-left: 0;
}
&:not(:last-child) {
padding-right: 0;
}
}
}
}
// Adding transition (On focus border color change)
.input-group-text {
@include transition($input-transition);
}
// RTL Style
// *******************************************************************************
@include rtl-only {
.input-group {
// Rounded input field
&.rounded-pill {
.input-group-text {
border-top-right-radius: $border-radius-pill !important;
border-bottom-right-radius: $border-radius-pill !important;
}
.form-control {
border-top-left-radius: $border-radius-pill !important;
border-bottom-left-radius: $border-radius-pill !important;
}
}
// Input group with dropdown rounded corners, while not validate
&:not(.has-validation) {
> :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),
> .dropdown-toggle:nth-last-child(n + 3) {
@include border-start-radius(0);
@include border-end-radius($input-border-radius);
}
}
&.input-group-lg {
&:not(.has-validation) {
> :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),
> .dropdown-toggle:nth-last-child(n + 3) {
@include border-end-radius($input-border-radius-lg);
}
}
}
&.input-group-sm {
&:not(.has-validation) {
> :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),
> .dropdown-toggle:nth-last-child(n + 3) {
@include border-end-radius($input-border-radius-sm);
}
}
}
// Input group with dropdown rounded corners, while validate
&.has-validation {
> :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),
> .dropdown-toggle:nth-last-child(n + 4) {
@include border-start-radius(0);
@include border-end-radius($input-border-radius);
}
}
&.input-group-lg {
> :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),
> .dropdown-toggle:nth-last-child(n + 4) {
@include border-end-radius($input-border-radius-lg);
}
}
&.input-group-sm {
> :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),
> .dropdown-toggle:nth-last-child(n + 4) {
@include border-end-radius($input-border-radius-sm);
}
}
// Input group border radius
$validation-messages: '';
@each $state in map-keys($form-validation-states) {
$validation-messages: $validation-messages +
':not(.' +
unquote($state) +
'-tooltip)' +
':not(.' +
unquote($state) +
'-feedback)';
}
> :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
margin-right: calc(#{$input-border-width} * -1);
@include border-end-radius(0);
margin-left: 0px;
@include border-start-radius($input-border-radius);
}
&.input-group-lg {
> :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
@include border-start-radius($input-border-radius-lg);
}
}
&.input-group-sm {
> :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
@include border-start-radius($input-border-radius-sm);
}
}
// ? We apply border radius from the above styles
// Remove border radius from first and last element
> :not(:first-child):not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),
> .dropdown-toggle:nth-last-child(n + 3):not(:first-child) {
@include border-radius(0 !important);
}
// ! FIX: Formvalidation border radius issue
&.has-validation {
> .input-group-text:first-child {
@include border-start-radius(0);
@include border-end-radius($input-border-radius);
}
> .form-control:first-child {
@include border-start-radius(0);
@include border-end-radius($input-border-radius);
}
}
}
// Input group merge .input-group-text border & .form-control border & padding
// Merge input
.input-group-merge {
.input-group-text {
&:first-child {
border-left: 0;
}
&:last-child {
border-right: 0;
}
}
.form-control {
&:not(:first-child) {
padding-right: 0 !important;
border-right: 0;
}
&:not(:last-child) {
padding-left: 0 !important;
border-left: 0;
}
}
}
}
//! FIX: Formvalidation : .input-group-text valid/invalid border color, If .input-group has .input-group-text first.
.fv-plugins-bootstrap5-row-invalid {
.input-group.has-validation,
.input-group.has-validation:focus-within {
.input-group-text {
border-color: $form-feedback-invalid-color !important;
}
}
}
// ? UnComment If eleValidClass is not blank i.e form-validation.js Line no. ~208
// .fv-plugins-bootstrap5-row-valid {
// .input-group,
// .input-group:focus-within {
// .input-group-text {
// border-color: $form-feedback-valid-color;
// }
// }
// }

17
resources/assets/vendor/scss/_bootstrap-extended/forms/_labels.scss vendored Normal file
View File

@ -0,0 +1,17 @@
// Labels
// *******************************************************************************
.form-label,
.col-form-label {
text-transform: $form-label-text-transform;
letter-spacing: $form-label-letter-spacing;
color: $headings-color;
}
// Default (vertical ) form label size
.form-label-lg {
@include font-size($input-font-size-lg);
}
.form-label-sm {
@include font-size($input-font-size-sm);
}

130
resources/assets/vendor/scss/_bootstrap-extended/forms/_validation.scss vendored Normal file
View File

@ -0,0 +1,130 @@
// Validation states
// *******************************************************************************
@each $state, $data in $form-validation-states {
@include template-form-validation-state($state, $data...);
}
// Currently supported for form-validation and jq-validation
form {
.error:not(li):not(input) {
color: $form-feedback-invalid-color;
font-size: 85%;
margin-top: 0.25rem;
}
.invalid,
.is-invalid .invalid:before,
.is-invalid::before {
border-width: $input-focus-border-width;
border-color: $form-feedback-invalid-color !important;
}
.form-label {
&.invalid,
&.is-invalid {
border-width: $input-focus-border-width;
border-color: $form-feedback-invalid-color;
box-shadow: 0 0 0 2px rgba($form-feedback-invalid-color, 0.4) !important;
}
}
select {
&.invalid {
& ~ .select2 {
.select2-selection {
border-width: $input-focus-border-width;
border-color: $form-feedback-invalid-color;
}
}
}
// FormValidation
//Select2
&.is-invalid {
& ~ .select2 {
.select2-selection {
border-width: $input-focus-border-width;
border-color: $form-feedback-invalid-color !important;
}
}
}
// Bootstrap select
&.selectpicker {
&.is-invalid {
~ .btn {
padding: calc($input-padding-y - $input-focus-border-width) calc($input-padding-x - $input-border-width);
border-width: $input-focus-border-width;
border-color: $form-feedback-invalid-color !important;
}
}
}
}
}
//!FIX: Input group form floating label .input-group-text border color on validation state
//? Can't use form-validation-state-selector mixin due to :has selector
.was-validated .input-group:has(.input-group-text):has(.form-control:invalid) .input-group-text,
.was-validated .input-group:has(.input-group-text):has(.form-control:valid) .input-group-text,
.input-group:has(.input-group-text):has(.form-control.is-valid) .input-group-text,
.input-group:has(.input-group-text):has(.form-control.is-invalid) .input-group-text {
border-width: $input-focus-border-width;
}
//! FIX: Basic input (without floating) has shake effect due to padding
.was-validated .form-control:invalid,
.was-validated .form-control:valid,
.form-control.is-invalid,
.form-control.is-valid {
padding: calc($input-padding-y - $input-focus-border-width) calc($input-padding-x - $input-border-width);
~ .input-group-text {
padding: calc($input-padding-y - $input-focus-border-width) calc($input-padding-x - $input-border-width);
}
}
.input-group {
> :not(:first-child):not(.dropdown-menu):not(.btn):not(.dropdown-menu + .form-control):not(
.btn + .form-control
)#{$validation-messages}.form-control.is-invalid,
> :not(:first-child):not(.dropdown-menu):not(.btn):not(.dropdown-menu + .form-control):not(
.btn + .form-control
)#{$validation-messages}.form-control.is-valid {
margin-inline-start: calc($input-focus-border-width - 4px);
}
.was-validated & .form-control:invalid,
.was-validated & .form-control:valid,
.form-control.is-invalid,
.form-control.is-valid,
.form-select.is-invalid,
.form-select.is-valid {
&:first-child {
padding-inline-start: calc($input-padding-x - $input-focus-border-width);
}
}
}
// ! Fix: FormValidation: Set border color to .form-control in touch devices for HTML5 inputs i.e date picker
@media (hover: none) {
.fv-plugins-bootstrap5-row-invalid {
.form-control {
&.flatpickr-mobile {
border-color: $form-feedback-invalid-color;
}
}
}
}
// ! Fix: FormValidation: Validation error message display fix for those inputs where .invalid-feedback/tooltip is not a sibling element
.fv-plugins-bootstrap5 {
.invalid-feedback,
.invalid-tooltip {
display: block;
}
}
//! Fix: FormValidation: Tagify validation error (border color)
.fv-plugins-bootstrap5-row-invalid .tagify.tagify--empty {
border-width: $input-focus-border-width;
border-color: $form-feedback-invalid-color !important;
}
// ? Uncomment if required
// .fv-plugins-bootstrap5-row-valid .tagify:not(.tagify--empty) {
// border-color: $form-feedback-valid-color;
// }

101
resources/assets/vendor/scss/_bootstrap-extended/mixins/_alert.scss vendored Normal file
View File

@ -0,0 +1,101 @@
// Alerts
// *******************************************************************************
@mixin alert-variant($background: null, $border: null, $color: null) {
}
// Basic Alerts
@mixin template-alert-variant($parent, $background) {
$border: if(
$dark-style,
shift-color($background, -$alert-border-scale, $card-bg),
shift-color($background, $alert-border-scale, $card-bg)
);
$color: $background;
$background: if(
$dark-style,
shade-color($background, $alert-bg-scale, $card-bg),
tint-color($background, $alert-bg-tint-scale, $card-bg)
);
#{$parent} {
@include gradient-bg($background);
border-color: $border;
color: $color;
.btn-close {
background-image: str-replace(str-replace($btn-close-bg, '#{$btn-close-color}', $color), '#', '%23');
}
.alert-link {
color: $color;
}
}
#{$parent} {
hr {
color: $color !important;
}
.alert-icon {
background-color: $color;
}
}
}
// Solid Alerts
@mixin template-alert-solid-variant($parent, $background, $color: null) {
$color: if($color, $color, color-contrast($background));
#{$parent} {
@include gradient-bg($background);
color: $color;
.btn-close {
background-image: str-replace(str-replace($btn-close-bg, '#{$btn-close-color}', $color), '#', '%23');
}
.alert-link {
color: $color;
}
}
#{$parent} {
hr {
color: $color !important;
}
.alert-icon {
color: $background !important;
}
}
}
// Outline Alerts
@mixin template-alert-outline-variant($parent, $background, $color: null) {
$color: $background;
$icon-bg: if(
$dark-style,
shade-color($background, $alert-bg-scale, $card-bg),
tint-color($background, $alert-bg-tint-scale, $card-bg)
);
#{$parent} {
border-color: $background;
color: $color;
.btn-close {
background-image: str-replace(str-replace($btn-close-bg, '#{$btn-close-color}', $background), '#', '%23');
}
.alert-link {
color: $color;
}
}
#{$parent} {
hr {
color: $color !important;
}
.alert-icon {
color: $color !important;
background-color: $icon-bg !important;
}
}
}

9
resources/assets/vendor/scss/_bootstrap-extended/mixins/_badge.scss vendored Normal file
View File

@ -0,0 +1,9 @@
// Badges
// *******************************************************************************
// Size
@mixin badge-size($badge-height, $badge-width, $badge-font-size) {
height: $badge-height;
width: $badge-width;
@include font-size($badge-font-size);
}

360
resources/assets/vendor/scss/_bootstrap-extended/mixins/_buttons.scss vendored Normal file
View File

@ -0,0 +1,360 @@
// Buttons
// *******************************************************************************
// Basic
@mixin button-variant(
$background: null,
$border: null,
$hover-background: null,
$hover-border: null,
$active-background: null,
$active-border: null
) {
}
@mixin template-button-variant($parent, $background, $color: null, $border: null) {
$background: $background;
$border: $background;
$color: if($color, $color, color-contrast($background));
$hover-background: if(
$color == $color-contrast-light,
shade-color($background, $btn-hover-bg-shade-amount),
tint-color($background, $btn-hover-bg-tint-amount)
);
$hover-border: if(
$color == $color-contrast-light,
shade-color($border, $btn-hover-border-shade-amount),
tint-color($border, $btn-hover-border-tint-amount)
);
$hover-color: color-contrast($hover-background);
$active-background: if(
$color == $color-contrast-light,
shade-color($background, $btn-active-bg-shade-amount),
tint-color($background, $btn-active-bg-tint-amount)
);
$active-border: if(
$color == $color-contrast-light,
shade-color($border, $btn-active-border-shade-amount),
tint-color($border, $btn-active-border-tint-amount)
);
$active-color: color-contrast($active-background);
#{$parent} {
color: $color;
@include gradient-bg($background);
border-color: $border;
&.btn[class*='btn-']:not([class*='btn-label-']):not([class*='btn-outline-']):not([class*='btn-text-']):not(
.btn-icon
):not(:disabled):not(.disabled) {
box-shadow: 0 0.125rem 0.375rem 0 rgba($background, 0.3);
}
&:hover {
color: $hover-color !important;
@include gradient-bg($hover-background !important);
border-color: $hover-border !important;
}
.btn-check:focus + &,
&:focus,
&.focus {
color: $hover-color;
@include gradient-bg($hover-background);
border-color: $hover-border;
}
.btn-check:checked + &,
.btn-check:active + &,
&:active,
&.active,
&.show.dropdown-toggle,
.show > &.dropdown-toggle {
color: $active-color !important;
background-color: $active-background !important;
// Remove CSS gradients if they're enabled
background-image: if($enable-gradients, none !important, null);
border-color: $active-border !important;
}
&.disabled,
&:disabled {
color: $color !important;
background-color: $background !important;
// Remove CSS gradients if they're enabled
background-image: if($enable-gradients, none !important, null);
border-color: $border !important;
}
}
// Button groups
.btn-group #{$parent},
.input-group #{$parent} {
border-right: $input-btn-border-width solid $active-background;
border-left: $input-btn-border-width solid $active-background;
}
.btn-group-vertical #{$parent} {
border-top-color: $active-background;
border-bottom-color: $active-background;
}
}
@mixin template-button-text-variant($parent, $background, $color: null, $border: null) {
$border: transparent;
$label-color: if($color, $color, $background);
$hover-color: $background;
$hover-background: $background;
$hover-background: if(
$hover-color == $color-contrast-light,
shade-color($background, $btn-text-hover-shade-amount, $card-bg),
tint-color($background, $btn-text-hover-tint-amount, $card-bg)
);
$focus-background: if(
$hover-color == $color-contrast-light,
shade-color($background, $btn-text-focus-shade-amount, $card-bg),
tint-color($background, $btn-text-focus-tint-amount, $card-bg)
);
$active-color: $hover-color;
$active-background: if(
$active-color == $color-contrast-light,
shade-color($background, $btn-text-active-shade-amount, $card-bg),
tint-color($background, $btn-text-active-tint-amount, $card-bg)
);
#{$parent} {
color: $label-color;
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba($background, 0.2) 0,
rgba($background, 0.3) 40%,
rgba($background, 0.4) 50%,
rgba($background, 0.5) 60%,
rgba($white, 0) 70%
);
}
}
&:hover {
border-color: $border;
background: $hover-background;
color: $hover-color;
}
&:focus,
&.focus {
color: $hover-color;
background: $focus-background;
}
&:active,
&.active,
&.show.dropdown-toggle,
.show > &.dropdown-toggle {
color: $active-color !important;
background: $active-background !important;
// Remove CSS gradients if they're enabled
background-image: if($enable-gradients, none !important, null);
border-color: $border !important;
}
&:disabled,
&.disabled {
color: $label-color;
}
}
// Button groups
.btn-group #{$parent},
.input-group #{$parent} {
border-right: $input-btn-border-width solid $background !important;
border-left: $input-btn-border-width solid $background !important;
}
.btn-group-vertical #{$parent} {
border-top: $input-btn-border-width solid $background !important;
border-bottom: $input-btn-border-width solid $background !important;
}
}
// Label
@mixin button-label-variant($background: null, $border: null, $active-background: null, $active-border: null) {
}
@mixin template-button-label-variant($parent, $background, $color: null, $border: null) {
// Using the $dark-style variable for condition as in label style text color can't compare with $color-contrast-light/dark
$border: transparent;
$label-color: if($color, $color, $background);
$hover-color: if($color, $color, color-contrast($background));
$label-background: if(
$hover-color == $color-contrast-light,
shade-color($background, $btn-label-bg-shade-amount, $card-bg),
tint-color($background, $btn-label-bg-tint-amount, $card-bg)
);
$hover-color: $background;
$hover-background: $background;
$hover-background: if(
$hover-color == $color-contrast-light,
shade-color($background, $btn-label-hover-shade-amount, $card-bg),
tint-color($background, $btn-label-hover-tint-amount, $card-bg)
);
$active-color: $hover-color;
$active-background: $hover-background;
$disabled-background: if(
$hover-color == $color-contrast-light,
shade-color($background, $btn-label-disabled-bg-shade-amount, $card-bg),
tint-color($background, $btn-label-disabled-bg-tint-amount, $card-bg)
);
$border-color: if(
$dark-style,
shade-color($background, $btn-label-border-shade-amount, $card-bg),
tint-color($background, $btn-label-border-tint-amount, $card-bg)
);
#{$parent} {
color: $label-color !important;
border-color: $border !important;
background: $label-background !important;
@include box-shadow($btn-box-shadow);
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba($background, 0.2) 0,
rgba($background, 0.3) 40%,
rgba($background, 0.4) 50%,
rgba($background, 0.5) 60%,
rgba($white, 0) 70%
);
}
}
&:hover {
border-color: $border !important;
background: $hover-background !important;
color: $hover-color !important;
}
&:focus,
&.focus {
color: $hover-color;
background: $hover-background;
}
&:active,
&.active,
&.show.dropdown-toggle,
.show > &.dropdown-toggle {
color: $active-color !important;
background-color: $active-background !important;
// Remove CSS gradients if they're enabled
background-image: if($enable-gradients, none !important, null);
border-color: $border !important;
}
&.disabled,
&:disabled {
color: $label-color !important;
border-color: $border !important;
background: $label-background !important;
}
}
// Button groups
.btn-group #{$parent},
.input-group #{$parent} {
border-right: $input-btn-border-width solid $border-color !important;
border-left: $input-btn-border-width solid $border-color !important;
}
.btn-group-vertical #{$parent} {
border-top: $input-btn-border-width solid $border-color !important;
border-bottom: $input-btn-border-width solid $border-color !important;
}
}
// Outline
@mixin button-outline-variant($color: null, $color-hover: null, $hover-color: null) {
}
@mixin template-button-outline-variant($parent, $color, $hover-color: null) {
$color: $color;
$color-hover: $color;
$hover-background: if(
$color-hover == $color-contrast-light,
shade-color($color, $btn-outline-hover-bg-shade-amount, $card-bg),
tint-color($color, $btn-outline-hover-bg-tint-amount, $card-bg)
);
$focus-background: $color;
$active-background: if(
$color == $color-contrast-light,
shade-color($color, $btn-outline-active-bg-shade-amount, $card-bg),
tint-color($color, $btn-outline-active-bg-tint-amount, $card-bg)
);
$active-border: $color;
$active-color: $color;
#{$parent} {
color: $color;
border-color: $color;
background: transparent;
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba($color, 0.2) 0,
rgba($color, 0.3) 40%,
rgba($color, 0.4) 50%,
rgba($color, 0.5) 60%,
rgba($white, 0) 70%
);
}
}
&:hover {
color: $color-hover !important;
background-color: $hover-background !important;
border-color: $active-border !important;
}
.btn-check:focus + &,
&:focus {
color: $color-hover;
background-color: $hover-background;
border-color: $active-border;
}
.btn-check:checked + &,
.btn-check:active + &,
&:active,
&.active,
&.dropdown-toggle.show {
color: $active-color !important;
background-color: $active-background !important;
border-color: $active-border !important;
}
&.disabled,
&:disabled {
color: $color !important;
}
}
#{$parent} .badge {
background: $color;
border-color: $color;
color: color-contrast($color);
}
#{$parent}:hover .badge,
#{$parent}:focus:hover .badge,
#{$parent}:active .badge,
#{$parent}.active .badge,
.show > #{$parent}.dropdown-toggle .badge {
background: $color-hover;
border-color: $color-hover;
}
}

32
resources/assets/vendor/scss/_bootstrap-extended/mixins/_card.scss vendored Normal file
View File

@ -0,0 +1,32 @@
// Cards
// *******************************************************************************
// color border bottom and shadow in card
@mixin template-card-border-shadow-variant($parent, $background) {
$border-color: shade-color($background, $card-border-color-scale, $card-bg);
.card {
&#{$parent} {
&::after {
border-bottom-color: $border-color;
}
&:hover {
&::after {
border-bottom-color: $background;
}
}
}
}
}
// card hover border color
@mixin template-card-hover-border-variant($parent, $background) {
$border-color: shade-color($background, $card-hover-border-scale, $card-bg);
.card {
&#{$parent},
#{$parent} {
&:hover {
border-color: $border-color;
}
}
}
}

64
resources/assets/vendor/scss/_bootstrap-extended/mixins/_caret.scss vendored Normal file
View File

@ -0,0 +1,64 @@
// * Carets
// *******************************************************************************
@mixin caret-up($caret-width) {
margin-top: 0.97 * divide($caret-width, 2);
margin-left: 0.8em;
width: $caret-width;
height: $caret-width;
border: 2px solid;
border-bottom: 0;
border-left: 0;
transform: rotate(-45deg);
@include rtl-style {
margin-right: 0.8em !important;
margin-left: 0 !important;
}
}
@mixin caret-down($caret-width) {
margin-top: -1.08 * divide($caret-width, 2);
margin-left: 0.8em;
width: $caret-width;
height: $caret-width;
border: 2px solid;
border-top: 0;
border-left: 0;
transform: rotate(45deg);
@include rtl-style {
margin-right: 0.8em !important;
margin-left: 0 !important;
}
}
@mixin caret-left($caret-width) {
margin-top: 0;
margin-right: 0.5em;
width: $caret-width;
height: $caret-width;
border: 2px solid;
border-top: 0;
border-right: 0;
transform: rotate(45deg);
@include rtl-style {
margin-right: 0 !important;
margin-left: $caret-spacing !important;
transform: rotate(225deg);
}
}
@mixin caret-right($caret-width) {
margin-top: 0;
margin-right: 0.5em;
width: $caret-width;
height: $caret-width;
border: 2px solid;
border-top: 0;
border-left: 0;
transform: rotate(-45deg);
@include rtl-style {
margin-left: 0 !important;
margin-right: $caret-spacing !important;
transform: rotate(135deg);
}
}

33
resources/assets/vendor/scss/_bootstrap-extended/mixins/_dropdown.scss vendored Normal file
View File

@ -0,0 +1,33 @@
// * Dropdowns
// *******************************************************************************
@mixin template-dropdown-variant($parent, $background, $color: null) {
#{$parent} .dropdown-item {
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba($color, 0.2) 0,
rgba($color, 0.3) 40%,
rgba($color, 0.4) 50%,
rgba($color, 0.5) 60%,
rgba($white, 0) 70%
);
}
}
&:not(.disabled).active,
&:not(.disabled):active {
background-color: $background;
color: if($color, $color, color-contrast($background)) !important;
}
}
#{$parent}.dropdown-menu > li:not(.disabled) > a:not(.dropdown-item):active,
#{$parent}.dropdown-menu > li.active:not(.disabled) > a:not(.dropdown-item) {
background-color: $background;
color: if($color, $color, color-contrast($background)) !important;
}
}
@mixin template-dropdown-theme($background, $color: null) {
@include template-dropdown-variant('', $background, $color);
}

361
resources/assets/vendor/scss/_bootstrap-extended/mixins/_forms.scss vendored Normal file
View File

@ -0,0 +1,361 @@
// * Form controls
// *******************************************************************************
// Form control
@mixin template-form-control-theme($color) {
.form-control:focus,
.form-select:focus {
border-color: $color !important;
}
// Using :focus-within to apply focus border color to default and merged input-group
.input-group {
&:focus-within {
.form-control,
.input-group-text {
border-color: $color !important;
}
}
}
}
// Float labels
@mixin template-float-label-theme($color) {
.form-floating {
> .form-control:focus,
> .form-control:focus:not(:placeholder-shown),
> .form-select:focus,
> .form-select:focus:not(:placeholder-shown) {
~ label {
color: $color;
}
}
}
}
// Form Switch
@mixin template-form-switch-theme($background) {
$focus-color: $background;
$focus-bg-image: str-replace(str-replace($form-switch-focus-bg-image, '#{$form-switch-color}', $white), '#', '%23');
$checked-color: $component-active-color;
$checked-bg-image: str-replace(
str-replace($form-switch-checked-bg-image, '#{$form-switch-checked-color}', $checked-color),
'#',
'%23'
);
.form-switch {
.form-check-input {
&:focus {
background-image: escape-svg($focus-bg-image);
}
&:checked {
@if $enable-gradients {
background-image: escape-svg($checked-bg-image), var(--#{$variable-prefix}gradient);
} @else {
background-image: escape-svg($checked-bg-image);
}
}
}
}
}
// File Input
@mixin template-file-input-theme($color) {
.form-control:focus ~ .form-label {
border-color: $color;
&::after {
border-color: inherit;
}
}
}
// Form Check
@mixin template-form-check-variant($parent, $background, $color: null) {
$color: if($color, $color, color-contrast($background));
$focus-border: $background;
$focus-color: 0 0 $input-btn-focus-blur $input-focus-width rgba($color, $input-btn-focus-color-opacity);
#{$parent} .form-check-input {
&:checked {
background-color: $background;
border-color: $background;
box-shadow: 0 2px 6px 0 rgba($background, 0.3);
}
&[type='checkbox']:indeterminate {
background-color: $background;
border-color: $background;
box-shadow: 0 2px 6px 0 rgba($background, 0.3);
}
}
// Custom options
#{$parent}.custom-option {
&.checked {
border: $input-focus-border-width solid $background !important;
margin: 0;
.custom-option-body,
.custom-option-header {
i {
color: $background;
}
}
}
&.custom-option-label {
&.checked {
background-color: rgba($background, 0.12);
color: $background;
.custom-option-header span,
.custom-option-title {
color: $background;
}
}
}
}
}
@mixin template-form-check-theme($background, $color: null) {
@include template-form-check-variant('', $background, $color);
}
// Form Validation
@mixin form-validation-state(
$state: null,
$color: null,
$icon: null,
$tooltip-color: null,
$tooltip-bg-color: null,
$focus-box-shadow: null,
$border-color: null
) {
}
@mixin template-form-validation-state(
$state,
$color,
$icon,
$tooltip-color: color-contrast($color),
$tooltip-bg-color: rgba($color, $form-feedback-tooltip-opacity),
$focus-box-shadow: none,
$border-color: $color
) {
.#{$state}-feedback {
display: none;
width: 100%;
margin-top: $form-feedback-margin-top;
@include font-size($form-feedback-font-size);
font-style: $form-feedback-font-style;
color: $color;
}
.#{$state}-tooltip {
position: absolute;
top: 100%;
z-index: 5;
display: none;
max-width: 100%; // Contain to parent when possible
padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;
margin-top: 0.1rem;
@include font-size($form-feedback-tooltip-font-size);
line-height: $form-feedback-tooltip-line-height;
color: $tooltip-color;
background-color: $tooltip-bg-color;
@include border-radius($form-feedback-tooltip-border-radius);
}
@include form-validation-state-selector($state) {
~ .#{$state}-feedback,
~ .#{$state}-tooltip {
display: block;
}
}
.form-control {
@include form-validation-state-selector($state) {
border-color: $color !important;
border-width: $input-focus-border-width;
~ .input-group-text {
border-width: $input-focus-border-width;
}
.dark-style & {
border-color: $color !important;
}
@if $enable-validation-icons {
background-image: escape-svg($icon);
background-repeat: no-repeat;
background-size: $input-height-inner-half $input-height-inner-half;
@include ltr-style {
padding-right: $input-height-inner;
background-position: right $input-height-inner-quarter center;
}
@include rtl-style {
padding-left: $input-height-inner;
background-position: left $input-height-inner-quarter center;
}
}
&:focus {
border-color: $color !important;
box-shadow: $focus-box-shadow;
}
}
}
// StyleLint-disable-next-line selector-no-qualifying-type
textarea.form-control {
@include form-validation-state-selector($state) {
@if $enable-validation-icons {
@include ltr-style {
padding-right: $input-height-inner;
background-position: top $input-height-inner-quarter right $input-height-inner-quarter;
}
@include rtl-style {
padding-left: $input-height-inner;
background-position: top $input-height-inner-quarter left $input-height-inner-quarter;
}
}
}
}
.form-select {
@include form-validation-state-selector($state) {
border-color: $color !important;
background-image: escape-svg($form-select-indicator), escape-svg($icon);
border-width: $input-focus-border-width;
~ .input-group-text {
border-width: $input-focus-border-width;
}
@include ltr-style {
background-position: $form-select-bg-position, $form-select-feedback-icon-position;
}
@include rtl-style {
background-position:
left $form-select-padding-x center,
center left $form-select-indicator-padding; // RTL
}
@if $enable-validation-icons {
background-size: $form-select-bg-size, $form-select-feedback-icon-size;
@include ltr-style {
background-image: escape-svg($form-select-indicator), escape-svg($icon);
padding-right: $form-select-feedback-icon-padding-end;
background-position: $form-select-bg-position, $form-select-feedback-icon-position;
}
@include rtl-style {
background-image: escape-svg($form-select-indicator), escape-svg($icon);
padding-left: $form-select-feedback-icon-padding-end;
background-position:
left $form-select-padding-x center,
center left $form-select-indicator-padding; // RTL
}
}
&:focus {
border-color: $color;
box-shadow: $focus-box-shadow;
}
}
}
.form-switch .form-check-input {
@include form-validation-state-selector($state) {
background-color: $color;
}
}
.form-check-input {
@include form-validation-state-selector($state) {
border-color: $color;
&:checked {
background-color: $color;
border-color: $color;
}
&:active {
box-shadow: $focus-box-shadow;
border-color: $color;
}
~ .form-check-label {
color: $color;
}
}
}
.form-check-inline .form-check-input {
~ .#{$state}-feedback {
@include ltr-style {
margin-left: 0.5em;
}
@include rtl-style {
margin-right: 0.5em;
}
}
}
// On validation .input-group & .input-group-merged, setup proper border color & box-shadow
.input-group {
.form-control {
@include form-validation-state-selector($state) {
~ .input-group-text {
border-color: $color !important;
}
&:focus {
border-color: $color !important;
box-shadow: none;
// ? .input-group has .input-group-text last/sibling
~ .input-group-text {
border-color: $color !important;
}
}
}
}
}
.form-control {
@include form-validation-state-selector($state) {
&:focus {
.input-group & {
box-shadow: none;
}
}
}
}
.input-group .form-control,
.input-group .form-select {
@include form-validation-state-selector($state) {
z-index: 3;
}
}
@if ($state == 'invalid') {
.was-validated .input-group:has(.input-group-text):has(.form-control:invalid) .input-group-text,
.input-group:has(.input-group-text):has(.form-control.is-invalid) .input-group-text {
border-color: $color;
}
.was-validated .input-group:has(input:invalid) {
.#{$state}-feedback,
.#{$state}-tooltip {
display: block;
}
}
}
@if ($state == 'valid') {
.was-validated .input-group:has(.input-group-text):has(.form-control:valid) .input-group-text,
.input-group:has(.input-group-text):has(.form-control.is-valid) .input-group-text {
border-color: $color;
}
.was-validated .input-group:has(input:valid) {
.#{$state}-feedback,
.#{$state}-tooltip {
display: block;
}
}
}
}

86
resources/assets/vendor/scss/_bootstrap-extended/mixins/_list-group.scss vendored Normal file
View File

@ -0,0 +1,86 @@
// List groups
// *******************************************************************************
@mixin list-group-item-variant($state: null, $background: null, $color: null) {
}
// Basic List groups
@mixin template-list-group-item-variant($parent, $background, $color: null) {
$border-color: if(
$dark-style,
shift-color($background, -$list-group-item-border-scale, $card-bg),
shift-color($background, $list-group-item-border-scale, $card-bg)
);
$background-color: if(
$dark-style,
shift-color($background, -$list-group-item-bg-scale, $card-bg),
shift-color($background, $list-group-item-bg-scale, $card-bg)
);
$border-color: if(
$dark-style,
if(
$parent == '.list-group-item-dark',
color-contrast($background),
shift-color($background, -$list-group-item-color-scale, $card-bg)
),
shift-color($background, $list-group-item-color-scale, $card-bg)
);
$color: shift-color($background, $list-group-item-color-scale);
$hover-background: shade-color($background-color, $list-group-item-bg-hover-scale);
#{$parent} {
border-color: $border-color;
background-color: $background-color;
color: $color !important;
}
a#{$parent},
button#{$parent} {
color: $color;
&:hover,
&:focus {
border-color: $border-color;
background-color: $hover-background;
color: $color;
}
&.active {
border-color: $border-color !important;
background-color: $background !important;
// color: if($color, $color, color-contrast($background));
color: color-contrast($background) !important;
}
}
}
@mixin template-list-group-theme($background, $color: null) {
@include template-list-group-item-variant('.list-group-item-primary', $background);
.list-group-item.active {
background-color: rgba-to-hex(rgba($background, 0.16), $card-bg);
color: $background;
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba($background, 0.2) 0,
rgba($background, 0.3) 40%,
rgba($background, 0.4) 50%,
rgba($background, 0.5) 60%,
rgba($black, 0) 70%
);
}
}
}
}
@mixin template-list-group-timeline-variant($parent, $background) {
.list-group {
&.list-group-timeline {
#{$parent} {
&:before {
border-color: $background;
background-color: $background;
}
}
}
}
}

158
resources/assets/vendor/scss/_bootstrap-extended/mixins/_misc.scss vendored Normal file
View File

@ -0,0 +1,158 @@
// * Light/Dark layout
// *******************************************************************************
@mixin light-layout-only() {
@if $dark-style {
html:not(.dark-style) {
@content;
}
} @else {
@content;
}
}
@mixin dark-layout-only() {
@if $dark-style {
.dark-style {
@content;
}
}
}
// * RTL/LTR
// *******************************************************************************
@mixin ltr-only() {
@if $rtl-support {
html:not([dir='rtl']) {
@content;
}
} @else {
@content;
}
}
@mixin rtl-only() {
@if $rtl-support {
[dir='rtl'] {
@content;
}
}
}
@mixin ltr-style() {
@if $rtl-support {
html:not([dir='rtl']) & {
@content;
}
} @else {
@content;
}
}
@mixin rtl-style() {
@if $rtl-support {
[dir='rtl'] & {
@content;
}
}
}
// * Keyframes
// *******************************************************************************
@mixin keyframes($name) {
@-webkit-keyframes #{$name} {
@content;
}
@-moz-keyframes #{$name} {
@content;
}
@keyframes #{$name} {
@content;
}
}
// * Colors
// *******************************************************************************
@mixin bg-color-variant($parent, $color, $rth-color: #000) {
#{$parent} {
background-color: $color !important;
}
a#{$parent} {
&:hover,
&:focus {
background-color: rgba-to-hex(rgba($color, 0.95), $background: $rth-color) !important;
}
}
//! Fix: Dropdown notification read badge bg color
.dropdown-notifications-item:not(.mark-as-read) {
.dropdown-notifications-read span {
background-color: $color;
}
}
}
@mixin bg-variant($parent, $color, $rth-color: #000) {
@include bg-color-variant($parent, $color);
}
@mixin bg-glow-variant($parent, $color) {
#{$parent} {
&.bg-glow {
box-shadow: 0px 2px 3px 0px rgba($color, 0.3);
}
}
}
// BG Label
@mixin bg-label-variant($parent, $background, $color: $background) {
$label-background: if(
$dark-style,
shade-color($background, $btn-label-bg-shade-amount, $card-bg),
tint-color($background, $btn-label-bg-tint-amount, $card-bg)
);
#{$parent} {
background-color: $label-background !important;
color: if($color, $color, color-contrast($bg)) !important;
}
}
// BG hover: label to solid
@mixin bg-label-hover-variant($parent, $background, $color: $background) {
$label-background: if(
$dark-style,
shade-color($background, $btn-label-bg-shade-amount, $card-bg),
tint-color($background, $btn-label-bg-tint-amount, $card-bg)
);
#{$parent} {
background-color: $label-background !important;
color: if($color, $color, color-contrast($bg)) !important;
&:hover {
background-color: $background !important;
color: $white !important;
}
}
}
@mixin bg-gradient-variant($parent, $background, $deg: 45deg) {
#{$parent} {
background-image: linear-gradient($deg, $background, rgba-to-hex(rgba($background, 0.5))) !important;
}
}
@mixin text-variant($parent, $color) {
#{$parent} {
color: $color !important;
}
//! Fix: text-body hover color
.text-body,
.text-heading {
&[href]:hover {
color: shift-color($color, $link-shade-percentage) !important;
}
}
}

20
resources/assets/vendor/scss/_bootstrap-extended/mixins/_modal.scss vendored Normal file
View File

@ -0,0 +1,20 @@
// Modal
// *******************************************************************************
@mixin template-modal-onboarding-theme($background, $color) {
.modal-onboarding {
.carousel-indicators {
[data-bs-target] {
background-color: $background;
}
}
}
.carousel-control-prev,
.carousel-control-next {
color: $background;
&:hover,
&:focus {
color: $background;
}
}
}

101
resources/assets/vendor/scss/_bootstrap-extended/mixins/_navs.scss vendored Normal file
View File

@ -0,0 +1,101 @@
// Navs
// *******************************************************************************
@mixin template-nav-size($padding-y, $padding-x, $font-size, $line-height) {
> .nav .nav-link,
&.nav .nav-link {
padding: $padding-y $padding-x;
font-size: $font-size;
line-height: $line-height;
}
}
@mixin template-nav-variant($parent, $background, $color: null) {
$pills-selector: if($parent== '', '.nav-pills', '#{$parent}.nav-pills, #{$parent} > .nav-pills');
#{$pills-selector} .nav-link.active {
box-shadow: 0 0.125rem 0.375rem 0 rgba($background, 0.3);
&,
&:hover,
&:focus {
background-color: $background;
color: if($color, $color, color-contrast($background));
}
}
#{$parent}.nav-tabs {
.nav-link {
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba($background, 0.2) 0,
rgba($background, 0.3) 40%,
rgba($background, 0.4) 50%,
rgba($background, 0.5) 60%,
rgba($white, 0) 70%
);
}
}
}
}
#{$parent}.nav-tabs .nav-link.active,
#{$parent}.nav-tabs .nav-link.active {
&,
&:hover,
&:focus {
box-shadow: 0 -2px 0 $background inset;
}
}
.nav-align-bottom .nav-tabs .nav-link.active,
.nav-align-bottom .nav-tabs .nav-link.active {
&,
&:hover,
&:focus {
box-shadow: 0 2px 0 $background inset;
}
}
.nav-align-left .nav-tabs .nav-link.active,
.nav-align-left .nav-tabs .nav-link.active {
&,
&:hover,
&:focus {
box-shadow: -2px 0px 0 $background inset;
}
}
.nav-align-right .nav-tabs .nav-link.active,
.nav-align-right .nav-tabs .nav-link.active {
&,
&:hover,
&:focus {
box-shadow: 2px 0px 0 $background inset;
}
}
@include rtl-only {
.nav-align-left .nav-tabs .nav-link.active,
.nav-align-left .nav-tabs .nav-link.active {
&,
&:hover,
&:focus {
box-shadow: 2px 0px 0 $background inset;
}
}
.nav-align-right .nav-tabs .nav-link.active,
.nav-align-right .nav-tabs .nav-link.active {
&,
&:hover,
&:focus {
box-shadow: -2px 0px 0 $background inset;
}
}
}
}
@mixin template-nav-theme($background, $color: null) {
@include template-nav-variant('', $background, $color);
}

73
resources/assets/vendor/scss/_bootstrap-extended/mixins/_pagination.scss vendored Normal file
View File

@ -0,0 +1,73 @@
// Pagination
// *******************************************************************************
// Basic Pagination
@mixin template-pagination-variant($parent, $background, $color: null) {
$hover-background: if(
$dark-style,
shade-color($background, $pagination-hover-bg-scale, $rgba-to-hex-bg),
tint-color($background, $pagination-hover-bg-scale, $rgba-to-hex-bg)
);
#{$parent} .page-item .page-link,
#{$parent}.pagination li > a:not(.page-link) {
&:hover,
&:focus {
background-color: $hover-background;
color: $background;
}
}
#{$parent} .page-item.active .page-link,
#{$parent}.pagination li.active > a:not(.page-link) {
box-shadow: 0 0.125rem 0.375rem 0 rgba($background, 0.3);
&,
&:hover,
&:focus {
border-color: $background;
background-color: $background;
color: if($color, $color, color-contrast($background));
}
}
#{$parent} .page-item .page-link,
#{$parent}.pagination li > a:not(.page-link) {
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba($background, 0.2) 0,
rgba($background, 0.3) 40%,
rgba($background, 0.4) 50%,
rgba($background, 0.5) 60%,
rgba($black, 0) 70%
);
}
}
}
}
// Pagination Outline Variant
@mixin template-pagination-outline-variant($parent, $background, $color: null) {
#{$parent} .page-item.active .page-link,
#{$parent}.pagination li.active > a:not(.page-link) {
&,
&:hover,
&:focus {
border-color: $background !important;
color: $background !important;
background-color: rgba-to-hex(rgba($background, 0.16), $card-bg) !important;
}
&.waves-effect {
.waves-ripple {
background: radial-gradient(
rgba($background, 0.2) 0,
rgba($background, 0.3) 40%,
rgba($background, 0.4) 50%,
rgba($background, 0.5) 60%,
rgba($black, 0) 70%
);
}
}
}
}
@mixin template-pagination-theme($background, $color: null) {
@include template-pagination-variant('', $background, $color);
}

53
resources/assets/vendor/scss/_bootstrap-extended/mixins/_popover.scss vendored Normal file
View File

@ -0,0 +1,53 @@
// Popovers
// *******************************************************************************
@mixin template-popover-variant($parent, $background, $color: null) {
$color: if($color, $color, color-contrast($background));
#{$parent} {
border-color: transparent;
background: $background;
.popover-header {
border-color: $background;
background: transparent;
color: $color;
}
.popover-body {
background: transparent;
color: rgba($color, 0.8);
}
> .popover-arrow::before {
border-color: transparent;
}
&.bs-popover-auto {
&[data-popper-placement='top'] > .popover-arrow::after {
border-top-color: $background !important;
}
&[data-popper-placement='right'] > .popover-arrow::after {
border-right-color: $background !important;
@include rtl-style {
border-left-color: $background !important;
}
}
&[data-popper-placement='bottom'] > .popover-arrow::after {
border-bottom-color: $background !important;
}
&[data-popper-placement='left'] > .popover-arrow::after {
border-left-color: $background !important;
@include rtl-style {
border-right-color: $background !important;
}
}
&[data-popper-placement='bottom'] .popover-header::before {
border-bottom: 1px solid transparent !important;
}
}
}
}

14
resources/assets/vendor/scss/_bootstrap-extended/mixins/_progress.scss vendored Normal file
View File

@ -0,0 +1,14 @@
// Progress bars
// *******************************************************************************
@mixin template-progress-bar-theme($background, $color: null) {
.progress-bar {
background-color: $background;
color: if($color, $color, color-contrast($background));
}
}
@mixin template-progress-shadow-theme($parent, $background) {
#{$parent} {
box-shadow: 0 0.125rem 0.375rem 0 rgba($background, 0.3);
}
}

26
resources/assets/vendor/scss/_bootstrap-extended/mixins/_table-variants.scss vendored Normal file
View File

@ -0,0 +1,26 @@
// Tables
// *******************************************************************************
@mixin template-table-variant($parent, $background, $layout-color: $white) {
.table-#{$parent} {
$color: color-contrast(opaque($body-bg, $background));
$hover-bg: mix($color, $background, percentage($table-hover-bg-factor));
$striped-bg: mix($color, $background, percentage($table-striped-bg-factor));
$active-bg: mix($color, $background, percentage($table-active-bg-factor));
--#{$variable-prefix}table-bg: #{$background};
--#{$variable-prefix}table-striped-bg: #{$striped-bg};
--#{$variable-prefix}table-striped-color: #{color-contrast($striped-bg)};
--#{$variable-prefix}table-active-bg: #{$active-bg};
--#{$variable-prefix}table-active-color: #{color-contrast($active-bg)};
--#{$variable-prefix}table-hover-bg: #{$hover-bg};
--#{$variable-prefix}table-hover-color: #{color-contrast($hover-bg)};
color: $color;
border-color: mix($color, $background, percentage($table-border-factor));
.btn-icon,
.btn {
color: $color;
}
}
}

35
resources/assets/vendor/scss/_bootstrap-extended/mixins/_tooltip.scss vendored Normal file
View File

@ -0,0 +1,35 @@
// Tooltips
// *******************************************************************************
@mixin template-tooltip-variant($parent, $background, $color: null) {
#{$parent} {
.tooltip-inner {
background: $background;
color: if($color, $color, color-contrast($background));
}
&.bs-tooltip-auto {
&[data-popper-placement='top'] .tooltip-arrow::before {
border-top-color: $background;
}
&[data-popper-placement='left'] .tooltip-arrow::before {
border-left-color: $background;
@include rtl-style {
border-right-color: $background;
}
}
&[data-popper-placement='bottom'] .tooltip-arrow::before {
border-bottom-color: $background;
}
&[data-popper-placement='right'] .tooltip-arrow::before {
border-right-color: $background;
@include rtl-style {
border-left-color: $background;
}
}
}
}
}

43
resources/assets/vendor/scss/_bootstrap.scss vendored Normal file
View File

@ -0,0 +1,43 @@
@import 'bootstrap/scss/mixins/banner';
@include bsBanner('');
@import '_bootstrap-extended/include';
// Import bootstrap core scss from node_module
// ! Utilities are customized and added in bootstrap-extended
// Layout & components
@import 'bootstrap/scss/root';
@import 'bootstrap/scss/reboot';
@import 'bootstrap/scss/type';
@import 'bootstrap/scss/images';
@import 'bootstrap/scss/containers';
@import 'bootstrap/scss/grid';
@import 'bootstrap/scss/tables';
@import 'bootstrap/scss/forms';
@import 'bootstrap/scss/buttons';
@import 'bootstrap/scss/transitions';
@import 'bootstrap/scss/dropdown';
@import 'bootstrap/scss/button-group';
@import 'bootstrap/scss/nav';
@import 'bootstrap/scss/navbar';
@import 'bootstrap/scss/card';
@import 'bootstrap/scss/accordion';
@import 'bootstrap/scss/breadcrumb';
@import 'bootstrap/scss/pagination';
@import 'bootstrap/scss/badge';
@import 'bootstrap/scss/alert';
@import 'bootstrap/scss/progress';
@import 'bootstrap/scss/list-group';
@import 'bootstrap/scss/close';
@import 'bootstrap/scss/toasts';
@import 'bootstrap/scss/modal';
@import 'bootstrap/scss/tooltip';
@import 'bootstrap/scss/popover';
@import 'bootstrap/scss/carousel';
@import 'bootstrap/scss/spinners';
@import 'bootstrap/scss/offcanvas';
@import 'bootstrap/scss/placeholders';
// Helpers
@import 'bootstrap/scss/helpers';

136
resources/assets/vendor/scss/_colors-dark.scss vendored Normal file
View File

@ -0,0 +1,136 @@
@import '_components/include-dark';
// * Custom colors
// *******************************************************************************
$facebook: #3b5998 !default;
$twitter: #1da1f2 !default;
$google-plus: #dd4b39 !default;
$instagram: #e1306c !default;
$linkedin: #0077b5 !default;
$github: #cfcde4 !default;
$dribbble: #ea4c89 !default;
$pinterest: #cb2027 !default;
$slack: #4a154b !default;
$reddit: #ff4500 !default;
$youtube: #ff0000 !default;
$vimeo: #1ab7ea !default;
$custom-colors: (
'facebook': $facebook,
'twitter': $twitter,
'google-plus': $google-plus,
'instagram': $instagram,
'linkedin': $linkedin,
'github': $github,
'dribbble': $dribbble,
'pinterest': $pinterest,
'slack': $slack,
'reddit': $reddit,
'youtube': $youtube,
'vimeo': $vimeo
) !default;
:root {
@each $color, $value in $custom-colors {
--#{$prefix}#{$color}: #{$value};
}
}
@each $color-name, $color-value in $custom-colors {
@include bg-variant('.bg-#{$color-name}', $color-value);
@include bg-label-variant('.bg-label-#{$color-name}', $color-value);
@include bg-label-hover-variant('.bg-label-hover-#{$color-name}', $color-value);
@include template-button-variant('.btn-#{$color-name}', $color-value);
@include template-button-label-variant('.btn-label-#{$color-name}', $color-value);
@include template-button-outline-variant('.btn-outline-#{$color-name}', $color-value);
@include template-button-text-variant('.btn-text-#{$color-name}', $color-value);
}
// * Bootstrap colors (Uncomment required colors)
// *******************************************************************************
$bootstrap-colors: (
// blue: $blue,
// indigo: $indigo,
// purple: $purple,
// pink: $pink,
// orange: $orange,
// teal: $teal
) !default;
@each $color-name, $color-value in $bootstrap-colors {
@include bg-variant('.bg-#{$color-name}', $color-value);
@include bg-label-variant('.bg-label-#{$color-name}', $color-value);
@include bg-label-hover-variant('.bg-label-hover-#{$color-name}', $color-value);
@include bg-gradient-variant('.bg-gradient-#{$color-name}', $color-value);
.border-#{$color-name} {
border-color: $color-value !important;
}
@include template-button-variant('.btn-#{$color-name}', $color-value);
@include template-button-label-variant('.btn-label-#{$color-name}', $color-value);
@include template-button-outline-variant('.btn-outline-#{$color-name}', $color-value);
}
// * Buttons
// *******************************************************************************
@include template-button-variant('.btn-white', $white, $body-color);
@include template-button-label-variant('.btn-label-white', $white, $body-color);
@include template-button-outline-variant('.btn-outline-white', $white, $body-color);
// ! ToDo: Custom colors (checkbox & radio)
// *******************************************************************************
$form-control-colors: (
black: #000,
white: #fff,
silver: #eee,
gray: #777,
gold: #ffeb3b,
pink: #e91e63,
red: #f44336
) !default;
@each $color-name, $color-value in $form-control-colors {
@include template-form-check-variant('.form-check-#{$color-name}', $color-value);
}
// * Navbar
// *******************************************************************************
@each $color, $value in $theme-colors {
@if $color !=primary and $color !=light {
@include template-navbar-style('.navbar.bg-#{$color}', $value);
}
}
@include template-navbar-style('.navbar.bg-white', #fff, $color: $black, $active-color: $black);
@include template-navbar-style('.navbar.bg-light', $light, $color: $body-color, $active-color: $headings-color);
@include template-navbar-style('.navbar.bg-lighter', $gray-50, $color: $body-color, $active-color: $headings-color);
// * Footer
// *******************************************************************************
@each $color, $value in $theme-colors {
@if $color !=primary and $color !=light {
@include template-footer-style('.footer.bg-#{$color}', $value);
}
}
@include template-footer-style('.footer.bg-white', #fff, $color: #6d6b77, $active-color: #444050);
@include template-footer-style(
'.footer.bg-light',
rgba-to-hex($gray-100, $rgba-to-hex-bg),
$color: $body-color,
$active-color: $headings-color
);
@include template-footer-style(
'.footer.bg-lighter',
rgba-to-hex($gray-50, $rgba-to-hex-bg),
$color: $body-color,
$active-color: $headings-color
);

126
resources/assets/vendor/scss/_colors.scss vendored Normal file
View File

@ -0,0 +1,126 @@
@import '_components/include';
// * Custom colors
// *******************************************************************************
$facebook: #3b5998 !default;
$twitter: #1da1f2 !default;
$google-plus: #dd4b39 !default;
$instagram: #e1306c !default;
$linkedin: #0077b5 !default;
$github: #444050 !default;
$dribbble: #ea4c89 !default;
$pinterest: #cb2027 !default;
$slack: #4a154b !default;
$reddit: #ff4500 !default;
$youtube: #ff0000 !default;
$vimeo: #1ab7ea !default;
$custom-colors: (
'facebook': $facebook,
'twitter': $twitter,
'google-plus': $google-plus,
'instagram': $instagram,
'linkedin': $linkedin,
'github': $github,
'dribbble': $dribbble,
'pinterest': $pinterest,
'slack': $slack,
'reddit': $reddit,
'youtube': $youtube,
'vimeo': $vimeo
) !default;
:root {
@each $color, $value in $custom-colors {
--#{$prefix}#{$color}: #{$value};
}
}
@each $color-name, $color-value in $custom-colors {
@include bg-variant('.bg-#{$color-name}', $color-value);
@include bg-label-variant('.bg-label-#{$color-name}', $color-value);
@include bg-label-hover-variant('.bg-label-hover-#{$color-name}', $color-value);
@include template-button-variant('.btn-#{$color-name}', $color-value);
@include template-button-label-variant('.btn-label-#{$color-name}', $color-value);
@include template-button-outline-variant('.btn-outline-#{$color-name}', $color-value);
@include template-button-text-variant('.btn-text-#{$color-name}', $color-value);
}
// * Bootstrap colors (Uncomment required colors)
// *******************************************************************************
$bootstrap-colors: (
// blue: $blue,
// indigo: $indigo,
// purple: $purple,
// pink: $pink,
// orange: $orange,
// teal: $teal
) !default;
@each $color-name, $color-value in $bootstrap-colors {
@include bg-variant('.bg-#{$color-name}', $color-value);
@include bg-label-variant('.bg-label-#{$color-name}', $color-value);
@include bg-label-hover-variant('.bg-label-hover-#{$color-name}', $color-value);
@include bg-gradient-variant('.bg-gradient-#{$color-name}', $color-value);
.border-#{$color-name} {
border-color: $color-value !important;
}
@include template-button-variant('.btn-#{$color-name}', $color-value);
@include template-button-label-variant('.btn-label-#{$color-name}', $color-value);
@include template-button-outline-variant('.btn-outline-#{$color-name}', $color-value);
}
// * Buttons
// *******************************************************************************
@include template-button-variant('.btn-white', $white, $body-color);
@include template-button-label-variant('.btn-label-white', $white, $body-color);
@include template-button-outline-variant('.btn-outline-white', $white, $body-color);
// ! ToDo: Custom colors (checkbox & radio)
// *******************************************************************************
$form-control-colors: (
black: #000,
white: #fff,
silver: #eee,
gray: #777,
gold: #ffeb3b,
pink: #e91e63,
red: #f44336
) !default;
@each $color-name, $color-value in $form-control-colors {
@include template-form-check-variant('.form-check-#{$color-name}', $color-value);
}
// * Navbar
// *******************************************************************************
@each $color, $value in $theme-colors {
@if $color !=primary and $color !=light {
@include template-navbar-style('.navbar.bg-#{$color}', $value);
}
}
@include template-navbar-style('.navbar.bg-white', #fff, $color: $black, $active-color: $black);
@include template-navbar-style('.navbar.bg-light', $light, $color: $body-color, $active-color: $headings-color);
@include template-navbar-style('.navbar.bg-lighter', $gray-50, $color: $body-color, $active-color: $headings-color);
// * Footer
// *******************************************************************************
@each $color, $value in $theme-colors {
@if $color !=primary and $color !=light {
@include template-footer-style('.footer.bg-#{$color}', $value);
}
}
@include template-footer-style('.footer.bg-white', #fff, $color: $body-color, $active-color: $headings-color);
@include template-footer-style('.footer.bg-light', $light, $color: $body-color, $active-color: $headings-color);
@include template-footer-style('.footer.bg-lighter', $gray-50, $color: $body-color, $active-color: $headings-color);

16
resources/assets/vendor/scss/_components-dark.scss vendored Normal file
View File

@ -0,0 +1,16 @@
@import '_components/include-dark';
// Import components scss
@import '_components/base';
@import '_components/common';
@import '_components/menu';
@import '_components/layout';
@import '_components/app-brand';
@import '_components/custom-options';
@import '_components/switch';
@import '_components/avatar';
@import '_components/timeline';
@import '_components/blockui';
@import '_components/drag-drop';
@import '_components/text-divider';
@import '_components/footer';

16
resources/assets/vendor/scss/_components.scss vendored Normal file
View File

@ -0,0 +1,16 @@
@import '_components/include';
// Import components scss
@import '_components/base';
@import '_components/common';
@import '_components/menu';
@import '_components/layout';
@import '_components/app-brand';
@import '_components/custom-options';
@import '_components/switch';
@import '_components/avatar';
@import '_components/timeline';
@import '_components/blockui';
@import '_components/drag-drop';
@import '_components/text-divider';
@import '_components/footer';

75
resources/assets/vendor/scss/_components/_app-brand.scss vendored Normal file
View File

@ -0,0 +1,75 @@
// App Brand
// *******************************************************************************
@import 'mixins/app-brand';
.app-brand {
display: flex;
flex-grow: 0;
flex-shrink: 0;
overflow: hidden;
line-height: 1;
min-height: 1px;
align-items: center;
}
// For cover auth pages
.auth-cover-brand {
position: absolute;
z-index: 1;
inset-block-start: 2.5rem;
inset-inline-start: $spacer * 1.5;
}
.app-brand-link {
display: flex;
align-items: center;
}
.app-brand-logo {
display: block;
flex-grow: 0;
flex-shrink: 0;
overflow: hidden;
min-height: 1px;
img,
svg {
display: block;
}
}
.app-brand-text {
flex-shrink: 0;
opacity: 1;
transition: opacity $menu-animation-duration ease-in-out;
margin-inline-start: 0.75rem !important;
}
.app-brand-img-collapsed {
display: none;
}
.app-brand .layout-menu-toggle {
display: block;
}
// App brand with vertical menu
.menu-vertical .app-brand {
padding-right: $menu-vertical-link-padding-x + 0.25rem;
padding-left: $menu-vertical-link-padding-x + 0.625rem;
}
// App brand with vertical menu
.menu-horizontal .app-brand,
.menu-horizontal .app-brand + .menu-divider {
display: none !important;
}
:not(.layout-menu) > .menu-vertical.menu-collapsed:not(.layout-menu):not(:hover) {
@include template-app-brand-collapsed();
}
@include media-breakpoint-up($menu-collapsed-layout-breakpoint) {
.layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-offcanvas):not(.layout-menu-fixed-offcanvas)
.layout-menu {
@include template-app-brand-collapsed();
}
}

157
resources/assets/vendor/scss/_components/_avatar.scss vendored Normal file
View File

@ -0,0 +1,157 @@
// Avatar
// *******************************************************************************
// Avatar Styles
.avatar {
position: relative;
width: $avatar-size;
height: $avatar-size;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
// Avatar Initials if no images added
.avatar-initial {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
text-transform: uppercase;
display: flex;
align-items: center;
justify-content: center;
color: $component-active-color;
background-color: $avatar-bg;
font-size: $avatar-initial;
}
// Avatar Status indication
&.avatar-online,
&.avatar-offline,
&.avatar-away,
&.avatar-busy {
&:after {
content: '';
position: absolute;
bottom: 0;
right: 3px;
width: 8px;
height: 8px;
border-radius: 100%;
box-shadow: 0 0 0 2px $avatar-group-border;
}
}
&.avatar-online:after {
background-color: $success;
}
&.avatar-offline:after {
background-color: $secondary;
}
&.avatar-away:after {
background-color: $warning;
}
&.avatar-busy:after {
background-color: $danger;
}
}
// Pull up avatar style
.pull-up {
transition: all 0.25s ease;
&:hover {
transform: translateY(-5px);
box-shadow: $box-shadow;
z-index: 30;
border-radius: 50%;
}
}
// Avatar Sizes
.avatar-xs {
@include template-avatar-style($avatar-size-xs, $avatar-size-xs, $avatar-initial-xs, 1px);
}
.avatar-sm {
@include template-avatar-style($avatar-size-sm, $avatar-size-sm, $avatar-initial-sm, 2px);
}
.avatar-md {
@include template-avatar-style($avatar-size-md, $avatar-size-md, $avatar-initial-md, 4px);
}
.avatar-lg {
@include template-avatar-style($avatar-size-lg, $avatar-size-lg, $avatar-initial-lg, 5px);
}
.avatar-xl {
@include template-avatar-style($avatar-size-xl, $avatar-size-xl, $avatar-initial-xl, 6px);
}
// Avatar Group SCSS
.avatar-group {
.avatar {
transition: all 0.25s ease;
img,
.avatar-initial {
border: 2px solid $avatar-group-border;
// box-shadow: 0 0 0 2px $avatar-group-border, inset 0 0 0 1px rgba($black, 0.07); //0 2px 10px 0 rgba($secondary,.3);
}
.avatar-initial {
background-color: $avatar-bg;
color: $headings-color;
}
&:hover {
z-index: 30 !important;
transition: all 0.25s ease;
}
}
}
// Avatar Group LTR only with sizing
@include ltr-only {
.avatar-group {
// Avatar Group Sizings
.avatar {
margin-left: -0.8rem;
&:first-child {
margin-left: 0;
}
}
.avatar-xs {
margin-left: -0.65rem;
}
.avatar-sm {
margin-left: -0.75rem;
}
.avatar-md {
margin-left: -0.9rem;
}
.avatar-lg {
margin-left: -1.5rem;
}
.avatar-xl {
margin-left: -1.75rem;
}
}
}
// Avatar Group RTL with sizing
@include rtl-only {
.avatar-group {
// Avatar Group Sizings
.avatar {
margin-right: -0.8rem;
margin-left: 0;
}
.avatar-xs {
margin-right: -0.65rem;
}
.avatar-sm {
margin-right: -0.75rem;
}
.avatar-md {
margin-right: -0.9rem;
}
.avatar-lg {
margin-right: -1.5rem;
}
.avatar-xl {
margin-right: -1.75rem;
}
}
}

183
resources/assets/vendor/scss/_components/_base.scss vendored Normal file
View File

@ -0,0 +1,183 @@
// Base
// *******************************************************************************
body {
text-rendering: optimizeLegibility;
font-smoothing: antialiased;
-moz-font-feature-settings: 'liga' on;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@include media-breakpoint-up(md) {
button.list-group-item {
outline: none;
}
}
// * App Overlay
// *******************************************************************************
.app-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
visibility: hidden;
z-index: 3;
transition: all 0.25s ease;
&.show {
visibility: visible;
}
@if not $dark-style {
.light-style & {
background-color: rgba($black, 0.5);
}
}
@if $dark-style {
.dark-style & {
background-color: rgba($modal-backdrop-bg, 0.6);
}
}
}
// * Containers
// *******************************************************************************
.container,
.container-fluid,
.container-xxl {
padding-right: $container-padding-x-sm;
padding-left: $container-padding-x-sm;
@include media-breakpoint-up(lg) {
padding-right: $container-padding-x;
padding-left: $container-padding-x;
}
}
// * Thumbnails
// *******************************************************************************
.img-thumbnail {
position: relative;
display: block;
img {
z-index: 1;
}
}
.img-thumbnail-content {
position: absolute;
top: 50%;
left: 50%;
z-index: 3;
display: block;
opacity: 0;
transition: all 0.2s ease-in-out;
transform: translate(-50%, -50%);
.img-thumbnail:hover &,
.img-thumbnail:focus & {
opacity: 1;
}
}
// Overlay effect
.img-thumbnail-overlay {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 2;
display: block;
transition: all 0.2s ease-in-out;
.img-thumbnail:not(:hover):not(:focus) & {
opacity: 0 !important;
}
}
.img-thumbnail-shadow {
transition: box-shadow 0.2s;
&:hover,
&:focus {
box-shadow: 0 5px 20px rgba($black, 0.4);
}
}
// Zoom-in effect
.img-thumbnail-zoom-in {
overflow: hidden;
img {
transition: all 0.3s ease-in-out;
transform: translate3d(0);
}
.img-thumbnail-content {
transform: translate(-50%, -50%) scale(0.6);
}
&:hover,
&:focus {
img {
transform: scale(1.1);
}
.img-thumbnail-content {
transform: translate(-50%, -50%) scale(1);
}
}
}
// * IE Fixes
// *******************************************************************************
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
// Fix IE parent container height bug when containing image with fluid width
.card,
.card-body,
.media,
.flex-column,
.tab-content {
min-height: 1px;
}
img {
min-height: 1px;
height: auto;
}
}
// * RTL
// *******************************************************************************
@if $rtl-support {
[dir='rtl'] body {
text-align: right;
direction: rtl;
}
}
// * Buy now section
// *******************************************************************************
.buy-now {
.btn-buy-now {
position: fixed;
bottom: 3rem;
right: $container-padding-x;
@include rtl-style() {
left: $container-padding-x;
right: inherit;
}
z-index: $zindex-menu-fixed;
box-shadow: 0 1px 20px 1px $danger !important;
&:hover {
box-shadow: none;
}
}
}

10
resources/assets/vendor/scss/_components/_blockui.scss vendored Normal file
View File

@ -0,0 +1,10 @@
// Block UI
// *******************************************************************************
.blockUI {
&.blockOverlay,
&.blockMsg {
z-index: $zindex-modal + 1 !important;
color: $white !important;
}
}

255
resources/assets/vendor/scss/_components/_common.scss vendored Normal file
View File

@ -0,0 +1,255 @@
// * Common
// *******************************************************************************
@use '../_bootstrap-extended/include' as light;
.ui-square,
.ui-rect,
.ui-rect-30,
.ui-rect-60,
.ui-rect-67,
.ui-rect-75 {
position: relative !important;
display: block !important;
padding-top: 100% !important;
width: 100% !important;
}
.ui-square {
padding-top: 100% !important;
}
.ui-rect {
padding-top: 50% !important;
}
.ui-rect-30 {
padding-top: 30% !important;
}
.ui-rect-60 {
padding-top: 60% !important;
}
.ui-rect-67 {
padding-top: 67% !important;
}
.ui-rect-75 {
padding-top: 75% !important;
}
.ui-square-content,
.ui-rect-content {
position: absolute !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
}
.text-strike-through {
text-decoration: line-through;
}
// * Line Clamp with ellipsis
// *******************************************************************************
$clamp-numbers: (
'1': 1,
'2': 2,
'3': 3
) !default;
@each $clamp-class, $clamp-value in $clamp-numbers {
.line-clamp-#{$clamp-class} {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: $clamp-value;
-webkit-box-orient: vertical;
}
}
// * Stars
// *******************************************************************************
.ui-stars,
.ui-star,
.ui-star > * {
height: $ui-star-size;
// Disable dragging
-webkit-user-drag: none;
-khtml-user-drag: none;
-moz-user-drag: none;
-o-user-drag: none;
user-drag: none;
}
.ui-stars {
display: inline-block;
vertical-align: middle;
white-space: nowrap;
}
.ui-star {
position: relative;
display: block;
float: left;
width: $ui-star-size;
height: $ui-star-size;
text-decoration: none !important;
font-size: $ui-star-size;
line-height: 1;
user-select: none;
@include rtl-style {
float: right;
}
& + & {
margin-left: $ui-stars-spacer;
@include rtl-style {
margin-right: $ui-stars-spacer;
margin-left: 0;
}
}
> *,
> *::before,
> *::after {
position: absolute;
left: $ui-star-size * 0.5;
height: 100%;
font-size: 1em;
line-height: 1;
transform: translateX(-50%);
@include rtl-style {
right: $ui-star-size * 0.5;
left: auto;
transform: translateX(50%);
}
}
> * {
top: 0;
width: 100%;
text-align: center;
}
> *:first-child {
z-index: 10;
display: none;
overflow: hidden;
color: $ui-star-filled-color;
}
// Default icon
> *:last-child {
z-index: 5;
display: block;
}
&.half-filled > *:first-child {
width: 50%;
transform: translateX(-100%);
@include rtl-style {
transform: translateX(100%);
}
}
&.filled > *:first-child,
&.half-filled > *:first-child {
display: block;
}
&.filled > *:last-child {
display: none;
}
}
// Hoverable
.ui-stars.hoverable .ui-star > *:first-child {
display: block;
}
// Empty stars if first star is not filled
.ui-stars.hoverable .ui-star:first-child:not(.filled),
.ui-stars.hoverable .ui-star:first-child:not(.half-filled) {
> *:first-child,
~ .ui-star > *:first-child {
display: none;
}
}
.ui-stars.hoverable .ui-star.filled > *:first-child,
.ui-stars.hoverable .ui-star.half-filled > *:first-child {
display: block !important;
}
.ui-stars.hoverable:hover .ui-star > *:first-child {
display: block !important;
width: 100% !important;
transform: translateX(-50%) !important;
@include rtl-style {
transform: translateX(50%) !important;
}
}
.ui-stars.hoverable .ui-star:hover ~ .ui-star {
> *:first-child {
display: none !important;
}
> *:last-child {
display: block !important;
}
}
// * Background
// *******************************************************************************
.ui-bg-cover {
background-color: rgba(0, 0, 0, 0);
background-position: center center;
background-size: cover;
}
.ui-bg-overlay-container,
.ui-bg-video-container {
position: relative;
> * {
position: relative;
}
}
.ui-bg-overlay-container .ui-bg-overlay {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
}
// * Styles
// *******************************************************************************
@if not $dark-style {
.light-style {
$ui-star-empty-color: light.$gray-200;
.ui-bordered {
border: 1px solid light.$border-color;
}
.ui-star > *:last-child {
color: $ui-star-empty-color;
}
}
}

161
resources/assets/vendor/scss/_components/_custom-options.scss vendored Normal file
View File

@ -0,0 +1,161 @@
// Custom Options
// *******************************************************************************
// Custom option
.custom-option {
padding-left: 0;
border: $custom-option-border-width solid $custom-option-border-color;
border-radius: $border-radius;
margin: subtract($input-focus-border-width, $custom-option-border-width);
&:hover {
border-width: $custom-option-border-width;
border-color: $custom-option-border-hover-color;
}
&.custom-option-image {
border-width: $custom-option-image-border-width !important;
overflow: hidden;
margin: 0;
&:hover {
border-width: $custom-option-image-border-width !important;
border-color: $custom-option-border-hover-color;
}
}
.custom-option-content {
cursor: $custom-option-cursor;
width: 100%;
}
.form-check-input {
background-color: transparent;
margin-inline-start: $form-check-padding-start * -1.12;
}
}
// Custom option basic
.custom-option-basic {
.custom-option-content {
padding: $custom-option-padding;
padding-left: $custom-option-padding + $form-check-padding-start + 0.65em;
}
.custom-option-header {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 0.4375rem;
}
}
.custom-option-body {
color: $body-color;
}
// Custom option with icon
.custom-option-icon {
overflow: hidden;
&.checked {
i,
svg {
color: $component-active-bg;
}
}
&:not(.checked) svg {
color: $headings-color;
}
.custom-option-content {
text-align: center;
padding: $custom-option-padding;
}
.custom-option-body {
display: block;
margin-bottom: 0.5rem;
i {
color: $headings-color;
&::before {
font-size: 1.75rem;
}
margin-bottom: 0.5rem;
display: block;
}
svg {
height: 28px;
width: 28px;
margin-bottom: 0.5rem;
}
.custom-option-title {
display: block;
font-size: $font-size-base;
font-weight: $font-weight-medium;
color: $headings-color;
margin-bottom: 0.5rem;
}
}
.form-check-input {
float: none !important;
margin: 0 !important;
}
}
// Custom option with image
.custom-option-image {
border-width: $custom-option-image-border-width;
.custom-option-content {
padding: 0;
}
.custom-option-body {
img {
height: 100%;
width: 100%;
}
}
//radio
&.custom-option-image-radio {
.form-check-input {
display: none;
}
}
//check
&.custom-option-image-check {
position: relative;
.form-check-input {
position: absolute;
top: 16px;
right: 16px;
margin: 0;
border: 0;
opacity: 0;
border: 1px solid transparent;
&:checked {
opacity: 1;
}
}
&:hover {
.form-check-input {
border-color: $form-check-input-focus-border;
border-width: 1px;
opacity: 1;
&:checked {
border-color: $primary;
}
}
}
}
}
// RTL Style
@include rtl-only {
.custom-option {
padding-right: 0;
}
.custom-option-basic {
.custom-option-content {
padding-right: $custom-option-padding + $form-check-padding-start;
padding-left: $custom-option-padding;
}
}
.custom-option-image.custom-option-image-check {
.form-check-input {
right: auto;
left: 16px;
}
}
}

13
resources/assets/vendor/scss/_components/_drag-drop.scss vendored Normal file
View File

@ -0,0 +1,13 @@
// * RTL
// *******************************************************************************
@include rtl-only {
#sortable-cards {
flex-direction: row-reverse;
}
#image-list-1,
#image-list-2 {
flex-direction: row-reverse;
justify-content: flex-end;
}
}

78
resources/assets/vendor/scss/_components/_footer.scss vendored Normal file
View File

@ -0,0 +1,78 @@
// Footer
// *******************************************************************************
.footer-link {
display: inline-block;
}
.layout-footer-fixed .layout-wrapper:not(.layout-horizontal) .content-footer .footer-container {
padding-inline: 1.5rem;
@include border-top-radius($border-radius);
}
.content-footer .footer-container {
block-size: 54px;
}
// Light footer
.footer-light {
color: $navbar-light-color;
.footer-text {
color: $navbar-light-active-color;
}
.footer-link {
color: $navbar-light-color;
&:hover,
&:focus {
color: $navbar-light-hover-color;
}
&.disabled {
color: $navbar-light-disabled-color !important;
}
}
.show > .footer-link,
.active > .footer-link,
.footer-link.show,
.footer-link.active {
color: $navbar-light-active-color;
}
hr {
border-color: $menu-light-border-color;
}
}
// Dark footer
.footer-dark {
color: $navbar-dark-color;
.footer-text {
color: $navbar-dark-active-color;
}
.footer-link {
color: $navbar-dark-color;
&:hover,
&:focus {
color: $navbar-dark-hover-color;
}
&.disabled {
color: $navbar-dark-disabled-color !important;
}
}
.show > .footer-link,
.active > .footer-link,
.footer-link.show,
.footer-link.active {
color: $navbar-dark-active-color;
}
hr {
border-color: $menu-dark-border-color;
}
}

13
resources/assets/vendor/scss/_components/_include-dark.scss vendored Normal file
View File

@ -0,0 +1,13 @@
// Include Dark
// *******************************************************************************
@import '../_bootstrap-extended/include-dark';
// Mixins
@import './_mixins'; // Components mixins
//Variables
@import '../_custom-variables/components-dark'; // Components custom dark variable (for customization purpose)
@import '../_custom-variables/components'; // Components custom variable (for customization purpose)
@import 'variables-dark'; // Components dark variable
@import 'variables'; // Components variable

11
resources/assets/vendor/scss/_components/_include.scss vendored Normal file
View File

@ -0,0 +1,11 @@
// Include
// *******************************************************************************
@import '../_bootstrap-extended/include';
//Mixins
@import './_mixins'; // Components mixins
//Components variables
@import '../_custom-variables/components'; // Components variable (for customization purpose)
@import 'variables'; // Components variable

1181
resources/assets/vendor/scss/_components/_layout.scss vendored Normal file
View File

File diff suppressed because it is too large Load Diff

784
resources/assets/vendor/scss/_components/_menu.scss vendored Normal file
View File

@ -0,0 +1,784 @@
// Menu
// *******************************************************************************
.menu {
display: flex;
.app-brand {
width: 100%;
transition: padding 0.3s ease-in-out;
}
//PS Scrollbar
.ps__thumb-y,
.ps__rail-y {
width: 0.125rem !important;
}
.ps__rail-y {
right: 0.25rem !important;
left: auto !important;
background: none !important;
@include rtl-style {
right: auto !important;
left: 0.25rem !important;
}
}
.ps__rail-y:hover,
.ps__rail-y:focus,
.ps__rail-y.ps--clicking,
.ps__rail-y:hover > .ps__thumb-y,
.ps__rail-y:focus > .ps__thumb-y,
.ps__rail-y.ps--clicking > .ps__thumb-y {
width: 0.375rem !important;
}
}
.menu-inner {
display: flex;
align-items: flex-start;
justify-content: flex-start;
margin: 0;
padding: 0;
height: 100%;
}
.menu-inner-shadow {
display: none;
position: absolute;
top: $navbar-height - (($navbar-height - 3rem) * 0.5);
@include media-breakpoint-up($menu-collapsed-layout-breakpoint) {
height: 3rem;
}
@include media-breakpoint-down($menu-collapsed-layout-breakpoint) {
height: 1.5rem;
}
width: 100%;
pointer-events: none;
z-index: 2;
// Hide menu inner shadow in static layout
html:not(.layout-menu-fixed) & {
display: none !important;
}
}
// Menu item
.menu-item {
align-items: flex-start;
justify-content: flex-start;
&.menu-item-animating {
transition: height $menu-animation-duration ease-in-out;
}
}
.menu-item,
.menu-header,
.menu-divider,
.menu-block {
flex: 0 0 auto;
flex-direction: column;
margin: 0;
padding: 0;
list-style: none;
}
.menu-header {
opacity: 1;
transition: opacity $menu-animation-duration ease-in-out;
.menu-header-text {
text-transform: uppercase;
letter-spacing: 0.4px;
white-space: nowrap;
color: $text-muted;
}
}
// Menu Icon
.menu-icon {
flex-grow: 0;
flex-shrink: 0;
margin-right: $menu-icon-expanded-spacer;
line-height: 1;
font-size: $menu-icon-expanded-font-size;
.menu:not(.menu-no-animation) & {
transition: margin-right $menu-animation-duration ease;
}
@include rtl-style {
margin-right: 0;
margin-left: $menu-icon-expanded-spacer;
.menu:not(.menu-no-animation) & {
transition: margin-left $menu-animation-duration ease;
}
}
}
// Menu link
.menu-link {
position: relative;
display: flex;
align-items: center;
flex: 0 1 auto;
margin: 0;
.menu-item.disabled & {
cursor: not-allowed !important;
}
// link hover animation
.menu:not(.menu-no-animation) & {
transition-duration: $menu-animation-duration;
transition-property: color, background-color;
}
> :not(.menu-icon) {
flex: 0 1 auto;
opacity: 1;
.menu:not(.menu-no-animation) & {
transition: opacity $menu-animation-duration ease-in-out;
}
}
}
// Sub menu
.menu-sub {
display: none;
flex-direction: column;
margin: 0;
padding: 0;
.menu:not(.menu-no-animation) & {
transition: background-color $menu-animation-duration;
}
.menu-item.open > & {
display: flex;
}
}
// Menu toggle open/close arrow
.menu-toggle::after {
position: absolute;
top: 50%;
display: block;
font-family: 'tabler-icons';
font-size: $menu-icon-expanded-font-size;
transform: translateY(-50%);
@include ltr-style {
content: '\ea61';
}
@include rtl-style {
content: '\ea60';
}
.menu:not(.menu-no-animation) & {
transition-duration: $menu-animation-duration;
transition-property: -webkit-transform, transform;
}
}
// Menu divider
.menu-divider {
width: 100%;
border: 0;
border-top: 1px solid;
}
// Vertical Menu
// *******************************************************************************
.menu-vertical {
overflow: hidden;
flex-direction: column;
// menu expand collapse animation
&:not(.menu-no-animation) {
transition: width $menu-animation-duration;
}
&,
.menu-block,
.menu-inner > .menu-item,
.menu-inner > .menu-header {
width: $menu-width;
}
.menu-inner {
flex-direction: column;
flex: 1 1 auto;
> .menu-item {
margin: $menu-item-spacer 0 0;
// menu-link spacing
.menu-link {
margin: 0 $menu-vertical-link-margin-x;
border-radius: $border-radius;
}
}
}
.menu-header {
padding: $menu-vertical-header-margin-x calc($menu-vertical-link-margin-x * 2) 0.375rem;
}
.menu-item .menu-link,
.menu-block {
padding: $menu-vertical-menu-link-padding-y $menu-vertical-link-padding-x;
}
.menu-item .menu-link {
font-size: $menu-font-size;
min-height: 38px;
> div:not(.badge) {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
line-height: 1.467;
}
}
.menu-item .menu-toggle {
padding-right: calc(#{$menu-vertical-link-padding-x} + #{$caret-width * 3.2});
@include rtl-style {
padding-right: $menu-vertical-link-padding-x;
padding-left: calc(#{$menu-vertical-link-padding-x} + #{$caret-width * 3.2});
}
&::after {
right: $menu-vertical-link-padding-x;
@include rtl-style {
right: auto;
left: $menu-vertical-link-padding-x;
}
}
}
.menu-item.open:not(.menu-item-closing) > .menu-link:after {
transform: translateY(-50%) rotate(90deg);
@include rtl-style {
transform: translateY(-50%) rotate(-90deg);
}
}
.menu-divider {
margin-top: $menu-link-spacer-x;
margin-bottom: $menu-link-spacer-x;
padding: 0;
}
.menu-sub {
.menu-link {
padding-top: $menu-vertical-menu-link-padding-y;
padding-bottom: $menu-vertical-menu-link-padding-y;
}
.menu-item {
margin: $menu-item-spacer 0 0;
}
}
.menu-icon {
width: $menu-icon-expanded-width;
}
.menu-sub .menu-icon {
margin-right: 0;
@include rtl-style {
margin-left: 0;
}
}
.menu-horizontal-wrapper {
flex: none;
}
// Levels
//
$menu-first-level-spacer: $menu-vertical-link-padding-x + $menu-icon-expanded-width + $menu-icon-expanded-spacer;
.menu-sub .menu-link {
padding-left: $menu-first-level-spacer;
@include rtl-style {
padding-right: $menu-first-level-spacer;
padding-left: $menu-vertical-link-padding-x;
}
}
// Menu levels loop for padding left/right
@for $i from 2 through $menu-max-levels {
$selector: '';
@for $l from 1 through $i {
$selector: '#{$selector} .menu-sub';
}
.layout-wrapper:not(.layout-horizontal) & {
.menu-inner > .menu-item {
#{$selector} .menu-link {
padding-left: $menu-first-level-spacer + ($menu-vertical-menu-level-spacer * ($i)) - 0.225;
&::before {
left: $menu-icon-expanded-left-spacer + ($menu-vertical-menu-level-spacer * $i) - 1.5;
@include rtl-style {
right: $menu-icon-expanded-left-spacer + ($menu-vertical-menu-level-spacer * $i) - 1.5;
left: inherit;
}
}
@include rtl-style {
padding-right: $menu-first-level-spacer + ($menu-vertical-menu-level-spacer * ($i)) - 0.225;
padding-left: $menu-vertical-link-padding-x;
}
}
}
}
}
}
// Vertical Menu Collapsed
// *******************************************************************************
@mixin layout-menu-collapsed() {
width: $menu-collapsed-width;
.menu-inner > .menu-item {
width: $menu-collapsed-width;
}
.menu-inner > .menu-header,
.menu-block {
position: relative;
margin-left: $menu-collapsed-width;
padding-right: ($menu-vertical-link-padding-x * 2) - $menu-icon-expanded-spacer;
padding-left: $menu-icon-expanded-spacer;
width: $menu-width;
.menu-header-text {
overflow: hidden;
opacity: 0;
}
&::before {
content: '';
position: absolute;
left: -1 * ($menu-collapsed-width * 0.66);
height: 1px;
width: 1.375rem;
background-color: $border-color;
top: 50%;
}
}
.app-brand {
padding-left: $menu-vertical-link-padding-x + 0.38rem;
}
.menu-inner > .menu-item div:not(.menu-block) {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
opacity: 0;
}
.menu-inner > .menu-item > .menu-sub,
.menu-inner > .menu-item.open > .menu-sub {
display: none;
}
.menu-inner > .menu-item > .menu-toggle::after {
display: none;
}
&:not(.layout-menu-hover) {
.menu-inner > .menu-item > .menu-link,
.menu-inner > .menu-block,
.menu-inner > .menu-header {
padding-right: calc(#{$menu-vertical-link-padding-x} + #{$caret-width * 1.2});
}
}
.menu-inner > .menu-item > .menu-link .menu-icon {
text-align: center;
margin-right: 0;
}
}
@mixin layout-menu-collapsed-rtl() {
.menu-block {
width: $menu-collapsed-width !important;
}
.menu-inner > .menu-item > .menu-link {
padding-left: $menu-vertical-link-padding-x;
}
.menu-inner > .menu-header,
.menu-block {
margin-right: $menu-collapsed-width;
margin-left: 0;
padding-right: $menu-icon-expanded-spacer;
padding-left: ($menu-vertical-link-padding-x * 2) - $menu-icon-expanded-spacer;
&::before {
right: -1 * ($menu-collapsed-width * 0.66);
left: auto;
}
}
&:not(.layout-menu-hover) {
.menu-inner > .menu-item > .menu-link,
.menu-inner > .menu-block,
.menu-inner > .menu-header {
padding-inline: $menu-vertical-link-padding-x;
}
}
.menu-inner > .menu-item > .menu-link .menu-icon {
margin-left: 0;
}
}
// Only for menu example
.menu-collapsed:not(:hover) {
@include layout-menu-collapsed();
@include rtl-style {
@include layout-menu-collapsed-rtl();
}
}
// Horizontal
// *******************************************************************************
.menu-horizontal {
flex-direction: row;
width: 100%;
.menu-inner {
overflow: hidden;
flex-direction: row;
flex: 0 1 100%;
> .menu-item.active > .menu-link.menu-toggle {
font-weight: $font-weight-medium;
}
.menu-item.active > .menu-link:not(.menu-toggle) {
font-weight: $font-weight-medium;
}
}
.menu-item .menu-link {
padding: $menu-horizontal-link-padding-y $menu-horizontal-link-padding-x;
}
.menu-item .menu-toggle {
padding-right: calc(#{$menu-horizontal-link-padding-x} + #{$caret-width * 3});
@include rtl-style {
padding-right: $menu-horizontal-link-padding-x;
padding-left: calc(#{$menu-horizontal-link-padding-x} + #{$caret-width * 3});
}
&::after {
right: calc(#{$menu-horizontal-link-padding-x} - #{0.2rem});
@include rtl-style {
right: auto;
left: calc(#{$menu-horizontal-link-padding-x} - #{0.2rem});
}
}
}
.menu-inner > .menu-item > .menu-toggle {
&::after {
transform: translateY(-50%) rotate(90deg);
@include rtl-style {
transform: translateY(-50%) rotate(-90deg);
}
}
&::before {
position: absolute;
block-size: $menu-vertical-header-margin-y;
content: '';
inline-size: 100%;
inset-block-start: 100%;
inset-inline-start: 0;
z-index: 2;
pointer-events: auto;
}
}
.menu-inner > .menu-item > .menu-sub {
margin-top: $menu-vertical-header-margin-y;
}
.menu-inner > .menu-item:not(.menu-item-closing).open .menu-item.open {
position: relative;
}
.menu-header,
.menu-divider {
display: none !important;
}
.menu-sub {
position: absolute;
width: $menu-sub-width;
padding: calc($menu-horizontal-item-spacer + $menu-item-spacer) 0;
box-shadow: $box-shadow-lg;
.menu-item {
padding: 1px $menu-link-spacer-x;
&.open .menu-link > div::after {
position: absolute;
content: '';
z-index: 2;
pointer-events: auto;
width: 1.0625rem;
height: 100%;
right: -1.0625rem;
}
}
.menu-sub {
position: absolute;
left: 100%;
top: 0;
width: 100%;
@include rtl-style {
left: -100%;
}
}
.menu-link {
padding-top: $menu-horizontal-menu-link-padding-y;
padding-bottom: $menu-horizontal-menu-link-padding-y;
border-radius: $border-radius;
}
}
.menu-inner > .menu-item {
.menu-sub {
@include border-radius($border-radius);
}
> .menu-sub {
.menu-sub {
margin: 0 $menu-horizontal-spacer-x;
}
}
}
&:not(.menu-no-animation) .menu-inner .menu-item.open .menu-sub {
animation: menuDropdownShow $menu-animation-duration ease-in-out;
}
// Sub menu link padding left
.menu-sub .menu-link {
padding-left: $menu-horizontal-menu-level-spacer;
min-height: 2.375rem;
@include rtl-style {
padding-right: $menu-horizontal-menu-level-spacer;
padding-left: $menu-horizontal-link-padding-x;
}
}
@include media-breakpoint-down(lg) {
& {
display: none;
}
}
}
.menu-horizontal-wrapper {
overflow: hidden;
flex: 0 1 100%;
width: 0;
.menu:not(.menu-no-animation) & .menu-inner {
transition: margin $menu-animation-duration;
}
}
.menu-horizontal-prev,
.menu-horizontal-next {
position: relative;
display: block;
flex: 0 0 auto;
width: $menu-control-width;
&::after {
content: '\ea61';
position: absolute;
top: 50%;
display: block;
font-family: 'tabler-icons';
font-size: $menu-icon-expanded-font-size;
transform: translateY(-50%);
}
&.disabled {
cursor: not-allowed !important;
}
}
.menu-horizontal-prev::after {
border-right: 0;
transform: translate(0, -50%) rotate(180deg);
@include rtl-style {
transform: translate(0, -50%) rotate(360deg);
}
}
.menu-horizontal-next::after {
border-left: 0;
transform: translate(50%, -50%) rotate(360deg);
@include rtl-style {
transform: translate(-50%, -50%) rotate(180deg);
}
}
@include keyframes(menuDropdownShow) {
0% {
opacity: 0;
transform: translateY(-0.5rem);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
// Menu light/dark color mode
// *******************************************************************************
.menu-light {
color: $navbar-light-color;
.menu-link,
.menu-horizontal-prev,
.menu-horizontal-next {
color: $navbar-light-color;
&:hover,
&:focus {
color: $navbar-light-hover-color;
}
&.active {
color: $navbar-light-active-color;
}
}
.menu-item.disabled .menu-link {
color: $navbar-light-disabled-color !important;
}
.menu-item.open:not(.menu-item-closing) > .menu-toggle,
.menu-item.active > .menu-link {
color: $navbar-light-active-color;
}
.menu-item.active > .menu-link:not(.menu-toggle) {
background: $menu-light-menu-bg;
}
.menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-sub,
.menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-toggle {
color: $navbar-light-color;
}
.menu-text {
color: $navbar-light-active-color;
}
.menu-header {
color: $navbar-light-color;
}
hr,
.menu-divider,
.menu-inner > .menu-item.open > .menu-sub::before {
border-color: $menu-light-border-color !important;
}
.menu-inner > .menu-header::before,
.menu-block::before {
background-color: $navbar-light-disabled-color;
}
.menu-inner > .menu-item.open .menu-item.open > .menu-toggle::before {
background-color: $menu-light-border-color;
}
.menu-inner > .menu-item.open .menu-item.active > .menu-link::before {
background-color: $navbar-light-active-color;
}
.ps__thumb-y {
background: $navbar-light-color !important;
}
}
.menu-dark {
color: $navbar-dark-color;
.menu-link,
.menu-horizontal-prev,
.menu-horizontal-next {
color: $navbar-dark-color;
&:hover,
&:focus {
color: $navbar-dark-hover-color;
}
&.active {
color: $navbar-dark-active-color;
}
}
.menu-item.disabled .menu-link {
color: $navbar-dark-disabled-color !important;
}
.menu-item.open:not(.menu-item-closing) > .menu-toggle,
.menu-item.active > .menu-link {
color: $navbar-dark-active-color;
}
.menu-item.active > .menu-link:not(.menu-toggle) {
background: $menu-dark-menu-bg;
}
.menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-sub,
.menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-toggle {
color: $navbar-dark-color;
}
.menu-text {
color: $navbar-dark-active-color;
}
.menu-header {
color: $navbar-dark-color;
}
hr,
.menu-divider,
.menu-inner > .menu-item.open > .menu-sub::before {
border-color: $menu-dark-border-color !important;
}
.menu-inner > .menu-header::before,
.menu-block::before {
background-color: $navbar-dark-disabled-color;
}
.menu-inner > .menu-item.open .menu-item.open > .menu-toggle::before {
background-color: $menu-dark-border-color;
}
.menu-inner > .menu-item.open .menu-item.active > .menu-link::before {
background-color: $navbar-dark-active-color;
}
.ps__thumb-y {
background: $navbar-dark-color !important;
}
}

9
resources/assets/vendor/scss/_components/_mixins.scss vendored Normal file
View File

@ -0,0 +1,9 @@
@import 'mixins/navbar';
@import 'mixins/footer';
@import 'mixins/menu';
@import 'mixins/avatar';
@import 'mixins/text-divider';
@import 'mixins/timeline';
@import 'mixins/treeview';
@import 'mixins/switch';
@import 'mixins/misc';

239
resources/assets/vendor/scss/_components/_switch.scss vendored Normal file
View File

@ -0,0 +1,239 @@
// Switches
// *******************************************************************************
.switch {
margin-right: $switch-spacer-x;
position: relative;
vertical-align: middle;
margin-bottom: 0;
display: inline-block;
border-radius: $switch-border-radius;
cursor: pointer;
@include template-switch-size-base(
'',
$switch-width,
$switch-height,
$switch-font-size,
$switch-label-font-size,
$switch-label-line-height,
$switch-inner-spacer
);
@include rtl-style {
margin-left: $switch-spacer-x;
margin-right: 0;
}
}
// Input
// *******************************************************************************
.switch-input {
opacity: 0;
position: absolute;
padding: 0;
margin: 0;
z-index: -1;
}
// Toggle slider
// *******************************************************************************
.switch-toggle-slider {
position: absolute;
overflow: hidden;
border-radius: $switch-border-radius;
background: $switch-off-bg;
color: $switch-off-color;
transition-duration: 0.2s;
transition-property: left, right, background, box-shadow;
cursor: pointer;
user-select: none;
box-shadow: $form-switch-box-shadow;
&::after {
top: 50%;
transform: translateY(-50%);
}
}
// Label switch
// *******************************************************************************
.switch-label {
display: inline-block;
font-weight: 400;
color: $switch-label-color;
position: relative;
cursor: default;
}
// Checked / Unchecked states
.switch-off,
.switch-on {
height: 100%;
width: 100%;
text-align: center;
position: absolute;
top: 0;
transition-duration: 0.2s;
transition-property: left, right;
}
.switch-on {
left: -100%;
@include rtl-style {
left: auto;
right: -100%;
}
.switch-input:not(:checked) ~ .switch-toggle-slider & {
color: transparent;
}
}
.switch-off {
left: 0;
@include rtl-style {
right: 0;
left: auto;
}
}
// Checked state
.switch-input:checked ~ .switch-toggle-slider {
.switch-on {
left: 0;
@include rtl-style {
right: 0;
left: auto;
}
}
.switch-off {
left: 100%;
color: transparent;
@include rtl-style {
right: 100%;
left: auto;
}
}
}
// Toggler
// *******************************************************************************
.switch-toggle-slider::after {
content: '';
position: absolute;
left: 0;
display: block;
border-radius: 999px;
background: $switch-holder-bg;
box-shadow: $switch-holder-shadow;
transition-duration: 0.2s;
transition-property: left, right, background;
@include rtl-style {
right: 0;
left: auto;
}
}
// Stacked switches
// *******************************************************************************
.switches-stacked {
@include clearfix;
.switch {
display: block;
@include ltr-style {
margin-right: 0;
}
@include rtl-style {
margin-left: 0;
}
&:not(:last-child) {
margin-bottom: $switch-spacer-y;
}
}
}
// Square
// *******************************************************************************
.switch-square,
.switch-square .switch-toggle-slider {
@if $enable-rounded {
border-radius: $switch-square-border-radius;
} @else {
border-radius: 0;
}
}
.switch-square .switch-toggle-slider::after {
@if $enable-rounded {
border-radius: calc(#{$switch-square-border-radius} - 2px);
} @else {
border-radius: 0;
}
}
// Disabled
// *******************************************************************************
.switch-input:disabled {
~ .switch-toggle-slider {
opacity: $switch-disabled-opacity;
}
~ .switch-label {
color: $switch-label-disabled-color;
}
}
// Switch Sizes
// *******************************************************************************
@include template-switch-size(
'sm',
$switch-width-sm,
$switch-height-sm,
$switch-font-size,
$switch-label-font-size-sm,
$switch-label-line-height-sm,
$switch-inner-spacer-sm
);
@include template-switch-size(
'lg',
$switch-width-lg,
$switch-height-lg,
$switch-font-size,
$switch-label-font-size-lg,
$switch-label-line-height-lg
);
// Variations
// *******************************************************************************
@each $color, $value in $theme-colors {
@if $color != primary and $color != light {
@include template-switch-variant('.switch-#{$color}', $value);
}
}
// Validation states
// *******************************************************************************
.switch .valid-feedback,
.switch .invalid-feedback {
padding-left: $switch-gutter;
}
@include template-switch-validation-state('valid', $form-feedback-valid-color);
@include template-switch-validation-state('invalid', $form-feedback-invalid-color);

180
resources/assets/vendor/scss/_components/_text-divider.scss vendored Normal file
View File

@ -0,0 +1,180 @@
// Divider
// *******************************************************************************
@import '../../scss/_custom-variables/libs';
.divider {
display: block;
text-align: center;
margin: $divider-margin-y $divider-margin-x;
overflow: hidden;
white-space: nowrap;
.divider-text {
position: relative;
display: inline-block;
font-size: $divider-font-size;
padding: $divider-text-padding-y $divider-text-padding-x;
color: $divider-text-color;
i {
font-size: $divider-icon-size;
}
&:before,
&:after {
content: '';
position: absolute;
top: 50%;
width: 100vw;
border-top: 1px solid $divider-color;
}
&:before {
right: 100%;
}
&:after {
left: 100%;
}
}
&.text-start {
.divider-text {
padding-left: 0;
}
}
&.text-end {
.divider-text {
padding-right: 0;
}
}
&.text-start-center {
.divider-text {
left: -25%;
}
}
&.text-end-center {
.divider-text {
right: -25%;
}
}
// Dotted Divider
&.divider-dotted .divider-text:before,
&.divider-dotted .divider-text:after,
&.divider-dotted:before,
&.divider-dotted:after {
border-style: dotted;
border-width: 0 1px 1px;
border-color: $divider-color;
}
// Dashed Divider
&.divider-dashed .divider-text:before,
&.divider-dashed .divider-text:after,
&.divider-dashed:before,
&.divider-dashed:after {
border-style: dashed;
border-width: 0 1px 1px;
border-color: $divider-color;
}
// For Vertical Divider
&.divider-vertical {
position: relative;
display: flex;
align-items: center;
justify-content: center;
height: 100%;
margin: unset;
&:before,
&:after {
content: '';
position: absolute;
left: 48%;
border-left: 1px solid $divider-color;
}
&:before {
bottom: 50%;
top: 0;
}
&:after {
top: 50%;
bottom: 0;
}
// Dashed Vertical Divider
&.divider-dashed {
&:before,
&:after {
border-width: 1px 1px 1px 0;
}
}
// Dotted Vertical Divider
&.divider-dotted {
&:before,
&:after {
border-width: 1px 1px 1px 0;
}
}
// For Vertical Divider text
.divider-text {
background-color: $card-bg;
z-index: 1;
padding: 0.5125rem;
&:before,
&:after {
content: unset;
}
// For card statistics Sales Overview divider
.badge-divider-bg {
padding: $divider-text-padding-x - 0.687rem $divider-text-padding-x - 0.748rem;
border-radius: 50%;
font-size: $divider-font-size - 0.1875rem;
background-color: $gray-50;
color: $text-muted;
}
}
}
}
// RTL
@include rtl-only {
.divider {
&.text-start-center {
.divider-text {
right: -25%;
left: auto;
}
}
&.text-end-center {
.divider-text {
left: -25%;
right: auto;
}
}
&.text-start {
.divider-text {
padding-right: 0;
padding-left: $divider-text-padding-x;
}
}
&.text-end {
.divider-text {
padding-left: 0;
padding-right: $divider-text-padding-x;
}
}
}
}
// For Contextual Colors
@each $color, $value in $theme-colors {
@if $color !=primary and $color !=light {
@include template-text-divider-variant('.divider-#{$color}', $value);
}
}

363
resources/assets/vendor/scss/_components/_timeline.scss vendored Normal file
View File

@ -0,0 +1,363 @@
// Timeline
// *******************************************************************************
@import '../../scss/_custom-variables/libs';
.timeline {
position: relative;
height: 100%;
width: 100%;
padding: 0;
list-style: none;
.timeline-header {
display: flex;
justify-content: space-between;
align-items: center;
flex-direction: row;
> *:first-child {
margin-right: 0.5rem;
}
}
// End Indicator
.timeline-end-indicator {
position: absolute;
bottom: -1.35rem;
left: -0.65rem;
i {
font-size: $timeline-end-indicator-font-size;
color: $timeline-border-color;
}
}
// Timeline Item
.timeline-item {
position: relative;
padding-left: 1.4rem;
.timeline-event {
position: relative;
width: 100%;
min-height: $timeline-item-min-height;
background-color: $timeline-item-bg-color;
border-radius: $timeline-item-border-radius;
padding: $timeline-item-padding-y $timeline-item-padding-x $timeline-item-padding-y - 0.1625;
.timeline-event-time {
position: absolute;
top: 1.2rem;
font-size: $timeline-event-time-size;
color: $timeline-event-time-color;
}
}
// Timeline Point Indicator
.timeline-indicator,
.timeline-indicator-advanced {
position: absolute;
left: -1rem;
top: 0.64rem;
z-index: 2;
height: $timeline-indicator-size;
width: $timeline-indicator-size;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
border-radius: 50%;
}
.timeline-indicator {
box-shadow: 0 0 0 10px $body-bg;
}
//For advanced Timeline Indicator Background
.timeline-indicator-advanced {
background-color: $card-bg;
top: 0;
}
.timeline-point {
position: absolute;
left: -0.38rem;
top: 0;
z-index: 2;
display: block;
height: $timeline-point-size;
width: $timeline-point-size;
border-radius: 50%;
background-color: $timeline-point-color;
box-shadow: 0 0 0 10px $card-bg;
}
// Transparent Timeline Item
&.timeline-item-transparent {
.timeline-event {
top: -0.9rem;
background-color: transparent;
@include ltr-style {
padding-left: 0;
}
&.timeline-event-shadow {
padding-left: 2rem;
}
}
}
}
// Timeline outline
&.timeline-outline {
.timeline-item {
.timeline-point {
outline: unset;
background-color: $card-bg !important;
border: 2px solid $primary;
}
}
}
// Timeline Center
&.timeline-center {
.timeline-end-indicator {
bottom: -1.4rem;
left: 50%;
margin-left: 0.55rem;
}
.timeline-item {
width: 50%;
clear: both;
&.timeline-item-left,
&:nth-of-type(odd):not(.timeline-item-left):not(.timeline-item-right) {
float: left;
padding-left: 0;
padding-right: 2.25rem;
padding-bottom: 2.5rem;
border-left: 0;
border-right: 1px solid $timeline-border-color;
.timeline-event {
.timeline-event-time {
right: -10.2rem;
}
}
.timeline-point {
left: 100%;
}
}
&.timeline-item-right,
&:nth-of-type(even):not(.timeline-item-left):not(.timeline-item-right) {
float: right;
right: 1px;
padding-left: 2.25rem;
padding-bottom: 2.5rem;
border-left: 1px solid $timeline-border-color;
.timeline-event {
.timeline-event-time {
left: -10.2rem;
}
.timeline-point {
left: 0;
}
}
}
.timeline-point {
left: 50%;
margin-left: -0.6875rem;
}
.timeline-point-indicator {
left: 50%;
margin-left: -0.3125rem;
}
}
}
// To remove arrows (visible while switching tabs) in widgets
&.timeline-advance {
.timeline-item {
.timeline-event {
&:before,
&:after {
border: transparent;
}
}
}
}
}
// LTR only
@include ltr-only {
.timeline:not(.timeline-center) {
padding-left: 0.5rem;
}
.timeline-item {
border-left: 1px solid $timeline-border-color;
}
}
// RTL
@include rtl-only {
.timeline:not(.timeline-center) {
padding-right: 0.5rem;
.timeline-item {
border-right: 1px solid $timeline-border-color;
}
.timeline-end-indicator {
left: auto;
right: -0.75rem;
}
.timeline-item {
padding-left: 0;
padding-right: 2rem;
border-right: 1px solid $timeline-border-color;
&.timeline-item-transparent {
.timeline-event {
padding-right: 0;
}
}
.timeline-point {
right: -0.38rem;
left: auto;
}
.timeline-indicator {
right: -0.75rem;
left: auto;
}
.timeline-indicator-advanced {
right: -1rem;
left: auto;
}
}
}
}
@include media-breakpoint-up(md) {
.timeline.timeline-center .timeline-item {
&.timeline-item-left,
&:nth-of-type(odd):not(.timeline-item-left):not(.timeline-item-right) {
.timeline-indicator {
left: calc(100% - calc(#{$timeline-indicator-size}/ 2));
}
}
}
}
// To Change Timeline Center's Alignment om small Screen
@include media-breakpoint-down(md) {
.timeline {
&.timeline-center {
.timeline-end-indicator {
left: -2px;
}
.timeline-item {
border-right: 0 !important;
left: 1rem;
&:not(:last-child) {
border-left: 1px solid $timeline-border-color !important;
}
float: left !important;
width: 100%;
padding-left: 3rem !important;
padding-right: 1.5rem !important;
.timeline-event {
.timeline-event-time {
top: -1.7rem;
left: 0 !important;
right: auto !important;
}
}
.timeline-point {
left: -0.7rem !important;
margin-left: 0 !important;
}
.timeline-point-indicator {
left: 0 !important;
margin-left: -0.3125rem !important;
}
}
}
}
// RTL: Timeline Center's Alignment om small Screen
@include rtl-only {
.timeline {
&.timeline-center {
.timeline-item {
border-left: 0 !important;
right: 1rem !important;
&:not(:last-child) {
border-right: 1px solid $timeline-border-color !important;
}
}
.timeline-item {
float: right !important;
width: 100%;
padding-right: 3.5rem !important;
padding-left: 1.5rem !important;
.timeline-event {
.timeline-event-time {
top: -1.2rem;
right: 0 !important;
left: auto !important;
}
}
.timeline-point {
right: -0.7rem !important;
margin-right: 0 !important;
}
}
}
}
}
}
@include media-breakpoint-down(md) {
.timeline .timeline-item .timeline-indicator,
.timeline .timeline-item .timeline-indicator-advanced {
@include rtl-style {
left: auto;
right: -0.6875rem;
}
}
@include rtl-only {
.timeline-center {
.timeline-item {
padding-left: 0;
padding-right: 3rem;
}
}
}
}
@include media-breakpoint-down(sm) {
.timeline {
.timeline-header {
flex-direction: column;
align-items: flex-start;
}
}
}
// For Contextual Colors
@each $color, $value in $theme-colors {
@if $color !=primary and $color !=light {
@include template-timeline-point-variant(
'.timeline-point-#{$color}',
if($color== 'dark' and $dark-style, $light, $value)
);
@include template-timeline-indicator-variant(
'.timeline-indicator-#{$color}',
if($color== 'dark' and $dark-style, $light, $value)
);
}
}

25
resources/assets/vendor/scss/_components/_variables-dark.scss vendored Normal file
View File

@ -0,0 +1,25 @@
// Dark Layout Variables
// ! _variable-dark.scss file overrides _variable.scss file.
// Avatar
// *******************************************************************************
$avatar-bg: #373b50 !default; // (C)
// Menu
// *******************************************************************************
$menu-horizontal-box-shadow: 0px 1px 4px 0px rgba($shadow-bg, 0.1) !default;
// switch
// *******************************************************************************
$switch-off-color: rgba-to-hex($gray-600, $rgba-to-hex-bg) !default;
$switch-off-bg: rgba-to-hex(rgba($base, 0.1), $rgba-to-hex-bg) !default;
$switch-off-border: rgba-to-hex(rgba($base, 0.1), $rgba-to-hex-bg) !default;
// Timeline
// *******************************************************************************
$timeline-border-color: rgba-to-hex(rgba($base, 0.12), $rgba-to-hex-bg) !default;
$timeline-event-time-color: $body-color !default;
// Text Divider
// *******************************************************************************
$divider-color: $border-color !default;

168
resources/assets/vendor/scss/_components/_variables.scss vendored Normal file
View File

@ -0,0 +1,168 @@
// Common
// *******************************************************************************
$ui-star-size: 1.1em !default;
$ui-stars-spacer: -0.1em !default;
$ui-star-filled-color: $yellow !default;
// Navbar (custom navbar)
// *******************************************************************************
$navbar-height: 3.5rem !default;
$navbar-suggestion-width: 100% !default;
$navbar-suggestion-height: 28rem !default;
$navbar-suggestion-border-radius: $border-radius !default;
$navbar-dropdown-width: 22rem !default;
$navbar-dropdown-content-height: 24.08rem !default;
$navbar-notifications-dropdown-item-padding-y: 0.75rem !default;
$navbar-notifications-dropdown-item-padding-x: 1rem !default;
// Menu
// *******************************************************************************
$menu-width: 16.25rem !default;
$menu-collapsed-width: 4.375rem !default;
$menu-collapsed-layout-breakpoint: xl !default;
$menu-font-size: $font-size-base !default;
$menu-item-spacer: 0.375rem !default;
$menu-vertical-link-margin-x: 0.75rem !default;
$menu-link-spacer-x: 0.5rem !default;
$menu-vertical-link-padding-y: 0.5rem !default;
$menu-vertical-link-padding-x: 0.75rem !default;
$menu-vertical-menu-link-padding-y: 0.5rem !default;
$menu-vertical-menu-level-spacer: 0.5rem !default;
$menu-vertical-header-margin-y: 0.5rem !default;
$menu-vertical-header-margin-x: 1.25rem !default;
$menu-horizontal-spacer-x: 0.375rem !default;
$menu-horizontal-item-spacer: 0.25rem !default;
$menu-horizontal-link-padding-y: 0.5rem !default;
$menu-horizontal-link-padding-x: 1rem !default;
$menu-horizontal-menu-link-padding-y: 0.5rem !default;
$menu-horizontal-menu-level-spacer: 2.75rem !default;
$menu-horizontal-box-shadow: 0px 1px 4px 0px rgba($black, 0.1) !default;
$menu-sub-width: $menu-width !default;
$menu-control-width: 2.25rem !default;
$menu-control-arrow-size: 0.5rem !default;
$menu-icon-expanded-width: 1.375rem !default;
$menu-icon-expanded-left-spacer: 2.25rem !default;
$menu-icon-expanded-font-size: 1.375rem !default;
$menu-icon-expanded-spacer: 0.5rem !default;
$menu-animation-duration: 0.3s !default;
$menu-max-levels: 5 !default;
$menu-dark-border-color: rgba(255, 255, 255, 0.2) !default;
$menu-dark-menu-bg: rgba(0, 0, 0, 0.06) !default;
$menu-light-border-color: rgba(0, 0, 0, 0.06) !default;
$menu-light-menu-bg: rgba(0, 0, 0, 0.05) !default;
// Custom Options
// *******************************************************************************
$custom-option-padding: 1.067em !default;
$custom-option-cursor: pointer !default;
$custom-option-border-color: $border-color !default;
$custom-option-border-width: 1px !default;
$custom-option-image-border-width: 2px !default;
$custom-option-border-hover-color: $input-border-hover-color !default;
// Switches
// *******************************************************************************
$switch-font-size: 0.625rem !default;
$switch-border-radius: 30rem !default;
$switch-width: 2.5rem !default;
$switch-width-sm: 1.875rem !default;
$switch-width-lg: 3.25rem !default;
$switch-height: 1.35rem !default;
$switch-height-sm: 1.125rem !default;
$switch-height-lg: 1.75rem !default;
$switch-label-font-size: $font-size-base !default;
$switch-label-font-size-sm: $font-size-xs !default;
$switch-label-font-size-lg: $font-size-lg !default;
$switch-label-line-height: 1.4 !default;
$switch-label-line-height-sm: 1.6 !default;
$switch-label-line-height-lg: 1.47 !default;
$switch-spacer-x: 0.75rem !default;
$switch-spacer-y: 0.75rem !default;
$switch-gutter: 0.5rem !default;
$switch-inner-spacer: 0.25rem !default;
$switch-inner-spacer-sm: 0.17rem !default;
$switch-square-border-radius: $border-radius !default;
$switch-label-color: $headings-color !default;
$switch-label-disabled-color: $text-muted !default;
$switch-disabled-opacity: 0.45 !default;
$switch-off-color: $gray-400 !default;
$switch-off-bg: rgba-to-hex($gray-100, $rgba-to-hex-bg) !default;
$switch-off-border: rgba-to-hex($gray-100, $rgba-to-hex-bg) !default;
$switch-holder-bg: $white !default;
$switch-holder-shadow: $box-shadow-xs !default;
$switch-focus-box-shadow: $input-btn-focus-box-shadow !default;
// Avatars
// *******************************************************************************
$avatar-size-xl: 4rem !default;
$avatar-size-lg: 3.5rem !default;
$avatar-size-md: 3rem !default;
$avatar-size: 2.5rem !default; // Default
$avatar-size-sm: 2rem !default;
$avatar-size-xs: 1.5rem !default;
$avatar-initial-xl: 1.875rem !default;
$avatar-initial-lg: 1.5rem !default;
$avatar-initial-md: 1.125rem !default;
$avatar-initial: $font-size-base !default;
$avatar-initial-sm: 0.8125rem !default;
$avatar-initial-xs: 0.625rem !default;
$avatar-group-border: $card-bg !default;
$avatar-bg: #eeedf0 !default; // (C)
// Timeline
// *******************************************************************************
$timeline-border-color: $border-color !default;
$timeline-indicator-size: 2rem !default;
$timeline-point-size: 0.75rem !default;
$timeline-point-color: $primary !default;
$timeline-point-indicator-color: $primary !default;
$timeline-end-indicator-font-size: 1.5rem !default;
$timeline-item-min-height: 4rem !default;
$timeline-item-padding-x: 0 !default;
$timeline-item-padding-y: 0.5rem !default;
$timeline-item-bg-color: $card-bg !default;
$timeline-item-border-radius: $border-radius !default;
$timeline-event-time-size: 0.85rem !default;
$timeline-event-time-color: $text-muted !default;
// Text Divider
// *******************************************************************************
$divider-color: $gray-200 !default;
$divider-margin-y: 1rem !default;
$divider-margin-x: 0 !default;
$divider-text-padding-y: 0rem !default;
$divider-text-padding-x: 1rem !default;
$divider-font-size: $font-size-base !default;
$divider-text-color: $headings-color !default;
$divider-icon-size: 1.25rem !default;

29
resources/assets/vendor/scss/_components/mixins/_app-brand.scss vendored Normal file
View File

@ -0,0 +1,29 @@
// Within menu
@mixin template-app-brand-collapsed() {
.app-brand {
width: $menu-collapsed-width;
}
.app-brand-logo,
.app-brand-link,
.app-brand-text {
margin-right: auto;
margin-left: auto;
}
.app-brand-logo ~ .app-brand-text,
.app-brand .layout-menu-toggle {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
opacity: 0;
}
.app-brand-img {
display: none;
}
.app-brand-img-collapsed {
display: block;
}
}

22
resources/assets/vendor/scss/_components/mixins/_avatar.scss vendored Normal file
View File

@ -0,0 +1,22 @@
// Avatar
// *******************************************************************************
@mixin template-avatar-style($height, $width, $font-size, $status-indicator-position: 2px) {
width: $width;
height: $height;
.avatar-initial {
font-size: $font-size;
}
&.avatar-online,
&.avatar-offline,
&.avatar-away,
&.avatar-busy {
&:after {
width: $width * 0.2;
height: $height * 0.2;
right: $status-indicator-position;
}
}
}

47
resources/assets/vendor/scss/_components/mixins/_footer.scss vendored Normal file
View File

@ -0,0 +1,47 @@
// Footer
// *******************************************************************************
@mixin template-footer-style($parent, $bg, $color: null, $active-color: null, $border: null) {
$colors: get-navbar-prop($bg, $active-color, $color, $border);
#{$parent} {
color: map-get($colors, color);
.layout-footer-fixed .layout-horizontal & {
background-color: map-get($colors, bg) !important;
}
.layout-footer-fixed .layout-wrapper:not(.layout-horizontal) & {
.footer-container {
background-color: map-get($colors, bg) !important;
}
}
.footer-link {
color: map-get($colors, color);
&:hover,
&:focus {
color: map-get($colors, active-color);
}
&.disabled {
color: map-get($colors, disabled-color) !important;
}
}
.footer-text {
color: map-get($colors, active-color);
}
.show > .footer-link,
.active > .footer-link,
.footer-link.show,
.footer-link.active {
color: map-get($colors, active-color);
}
hr {
border-color: map-get($colors, border);
}
}
}

133
resources/assets/vendor/scss/_components/mixins/_menu.scss vendored Normal file
View File

@ -0,0 +1,133 @@
// Menu
// *******************************************************************************
@mixin template-menu-style($parent, $bg, $color: null, $active-color: null, $border: null, $active-bg: null) {
$colors: get-navbar-prop($bg, $active-color, $color, $border);
$contrast-percent: map-get($colors, contrast-percent);
@if not $active-bg {
$active-bg: rgba-to-hex(
rgba(map-get($colors, bg), 1 - if($contrast-percent < 0.75, 0.025, 0.05)),
if($contrast-percent > 0.25, #fff, #000)
);
}
$menu-active-bg: linear-gradient(270deg, rgba($active-bg, 0.7) 0%, $active-bg 100%);
$menu-active-bg-rtl: linear-gradient(-270deg, rgba($active-bg, 0.7) 0%, $active-bg 100%);
$horizontal-active-bg: rgba-to-hex(rgba($active-bg, 0.16), $bg);
#{$parent} {
background-color: map-get($colors, bg) !important;
&.menu-horizontal {
background-color: rgba(map-get($colors, bg), 0.95) !important;
}
color: map-get($colors, color);
.menu-link,
.menu-horizontal-prev,
.menu-horizontal-next {
color: map-get($colors, color);
&:hover,
&:focus {
color: map-get($colors, active-color);
}
&.active {
color: map-get($colors, active-color);
}
}
.menu-toggle::after {
color: map-get($colors, color);
}
.menu-item.disabled .menu-link,
.menu-horizontal-prev.disabled,
.menu-horizontal-next.disabled {
color: map-get($colors, disabled-color) !important;
}
.menu-item.open:not(.menu-item-closing) > .menu-toggle,
.menu-item.active > .menu-link {
color: map-get($colors, active-color);
}
//vertical menu active item bg color
&.menu-vertical .menu-item.active > .menu-link:not(.menu-toggle) {
background: $menu-active-bg;
box-shadow: 0px 2px 6px 0px rgba($active-bg, 0.3);
color: color-contrast($active-bg) !important;
&.menu-toggle::after {
color: color-contrast($active-bg) !important;
}
@if $rtl-support {
[dir='rtl'] & {
background: $menu-active-bg-rtl !important;
}
}
}
//-
&.menu-horizontal {
.menu-inner > .menu-item.active > .menu-link.menu-toggle {
background: $menu-active-bg;
color: color-contrast($active-bg) !important;
box-shadow: 0px 2px 6px 0px rgba($active-bg, 0.3);
&.menu-toggle::after {
color: color-contrast($active-bg) !important;
}
@if $rtl-support {
[dir='rtl'] & {
background: $menu-active-bg-rtl;
box-shadow: 0px 2px 6px 0px rgba($active-bg, 0.3);
color: color-contrast($active-bg) !important;
}
}
}
.menu-inner .menu-item:not(.menu-item-closing) > .menu-sub,
.menu-inner .menu-item.open > .menu-toggle {
background: $bg;
}
.menu-item.active > .menu-link:not(.menu-toggle) {
background: $horizontal-active-bg;
color: $active-bg !important;
}
}
.menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-sub,
.menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-toggle {
background: transparent;
color: color-contrast($active-bg);
}
.menu-inner-shadow {
background: linear-gradient($bg 41%, rgba($bg, 0.11) 95%, rgba($bg, 0));
}
.menu-text {
color: map-get($colors, active-color);
}
.menu-header {
color: map-get($colors, muted-color);
}
hr,
.menu-divider,
.menu-inner > .menu-item.open > .menu-sub::before {
border-color: map-get($colors, border) !important;
}
.menu-block::before {
background-color: map-get($colors, muted-color);
}
.ps__thumb-y,
.ps__rail-y.ps--clicking > .ps__thumb-y {
background: rgba(
map-get($colors, active-color),
if($contrast-percent > 0.75, map-get($colors, opacity) - 0.4, map-get($colors, opacity) - 0.2)
) !important;
}
}
}

6
resources/assets/vendor/scss/_components/mixins/_misc.scss vendored Normal file
View File

@ -0,0 +1,6 @@
// SVG Color
@mixin template-svg-color($background) {
.svg-illustration svg {
fill: $background;
}
}

90
resources/assets/vendor/scss/_components/mixins/_navbar.scss vendored Normal file
View File

@ -0,0 +1,90 @@
// Navbar
// *******************************************************************************
@mixin template-navbar-style($parent, $bg, $color: null, $active-color: null, $border: null) {
$colors: get-navbar-prop($bg, $active-color, $color, $border);
#{$parent} {
background-color: rgba(map-get($colors, bg), 0.88) !important;
color: map-get($colors, color);
.navbar-brand,
.navbar-brand a {
color: map-get($colors, active-color);
&:hover,
&:focus {
color: map-get($colors, active-color);
}
}
// Navbar search color
.navbar-search-wrapper {
.navbar-search-icon,
.search-input {
color: map-get($colors, color);
}
}
.search-input-wrapper {
.search-input,
.search-toggler {
background-color: $bg !important;
color: map-get($colors, color);
}
}
.navbar-nav {
> .nav-link,
> .nav-item > .nav-link,
> .nav > .nav-item > .nav-link {
color: map-get($colors, color);
&:hover,
&:focus {
color: map-get($colors, active-color);
}
&.disabled {
color: map-get($colors, disabled-color) !important;
}
}
.show > .nav-link,
.active > .nav-link,
.nav-link.show,
.nav-link.active {
color: map-get($colors, active-color);
}
}
.navbar-toggler {
color: map-get($colors, color);
border-color: map-get($colors, border);
}
.navbar-toggler-icon {
background-image: if(
map-get($colors, contrast-percent) > 0.75,
$navbar-light-toggler-icon-bg,
$navbar-dark-toggler-icon-bg
);
}
.navbar-text {
color: map-get($colors, color);
a {
color: map-get($colors, active-color);
&:hover,
&:focus {
color: map-get($colors, active-color);
}
}
}
hr {
border-color: map-get($colors, border);
}
}
}

179
resources/assets/vendor/scss/_components/mixins/_switch.scss vendored Normal file
View File

@ -0,0 +1,179 @@
// * Switches
// *******************************************************************************
@mixin template-switch-size-base(
$size,
$width,
$height,
$font-size,
$form-label-font-size,
$label-line-height,
$inner-spacer
) {
min-height: $height;
font-size: $form-label-font-size;
line-height: $label-line-height;
$delta: 0;
$line-height-computed: $form-label-font-size * $label-line-height;
.switch-label:first-child {
padding-right: $switch-gutter;
}
.switch-input ~ .switch-label {
padding-left: $width + $switch-gutter;
}
.switch-toggle-slider {
width: $width;
height: $height - ($delta * 2);
font-size: $font-size;
line-height: $height;
border: 1px solid transparent;
i {
position: relative;
font-size: $form-label-font-size;
@if ($size== 'lg') {
top: -2px;
} @else if ($size== 'sm') {
top: -2px;
} @else {
top: -1.35px;
}
}
@if ($line-height-computed>$height) {
top: (($line-height-computed - $height) * 0.5) + $delta;
} @else {
top: 50%;
transform: translateY(-50%);
}
}
.switch-label {
@if ($line-height-computed < $height) {
top: ($height - $line-height-computed) * 0.5;
} @else {
top: 0;
}
}
.switch-input:checked ~ .switch-toggle-slider::after {
left: $width - $height - 0.1;
}
.switch-toggle-slider::after {
margin-left: $inner-spacer;
width: ceil(rem-to-px($height - $inner-spacer * 2));
height: ceil(rem-to-px($height - $inner-spacer * 2));
}
.switch-on {
padding-left: $inner-spacer;
padding-right: $height - $inner-spacer;
}
.switch-off {
padding-left: $height - $inner-spacer;
padding-right: $inner-spacer;
}
@if $rtl-support {
[dir='rtl'] & .switch-label {
padding-right: $width + $switch-gutter;
padding-left: 0;
}
[dir='rtl'] & .switch-input:checked ~ .switch-toggle-slider::after {
left: auto;
right: $width - $height - 0.15;
}
[dir='rtl'] & .switch-toggle-slider {
&::after {
margin-left: 0;
margin-right: $inner-spacer;
}
}
[dir='rtl'] & .switch-on {
padding-left: $height - $inner-spacer;
padding-right: $inner-spacer;
}
[dir='rtl'] & .switch-off {
padding-left: $inner-spacer;
padding-right: $height - $inner-spacer;
}
}
}
// Switch size
@mixin template-switch-size(
$size,
$width,
$height,
$font-size,
$form-label-font-size,
$label-line-height,
$inner-spacer: $switch-inner-spacer
) {
.switch-#{$size} {
@include template-switch-size-base(
$size,
$width,
$height,
$font-size,
$form-label-font-size,
$label-line-height,
$inner-spacer
);
}
}
// Switch variant
@mixin template-switch-variant($parent, $background, $color: null) {
$selector: if($parent== '', '', '#{$parent}.switch');
$color: if($color, $color, color-contrast($background));
#{$selector} .switch-input:checked ~ .switch-toggle-slider {
background: $background;
color: $color;
box-shadow: 0 2px 6px 0 rgba($background, 0.3);
}
}
// Switch theme
@mixin template-switch-theme($parent, $background, $color: null) {
@include template-switch-variant($parent, $background, $color);
}
// Switch validation
@mixin template-switch-validation-state($state, $color) {
.switch-input {
//BS & jQuery validation
.was-validated &:#{$state},
&.invalid,
//jq
&.is-#{$state} {
~ .switch-label {
color: $color;
}
~ .#{$state}-feedback,
~ .#{$state}-tooltip {
display: block;
}
~ .switch-toggle-slider {
border: 1px solid $color !important;
}
&:checked ~ .switch-toggle-slider {
background: $color;
color: color-contrast($color);
box-shadow: 0 2px 6px 0 rgba($color, 0.3);
}
}
}
}

17
resources/assets/vendor/scss/_components/mixins/_text-divider.scss vendored Normal file
View File

@ -0,0 +1,17 @@
// Text Divider
// *******************************************************************************
@mixin template-text-divider-variant($divider-color, $background) {
$divider-selector: if($divider-color== '', '', '#{$divider-color}');
.divider {
&#{$divider-selector} {
&.divider-vertical,
.divider-text {
&:before,
&:after {
border-color: $background;
}
}
}
}
}

33
resources/assets/vendor/scss/_components/mixins/_timeline.scss vendored Normal file
View File

@ -0,0 +1,33 @@
// Timeline
// *******************************************************************************
// Timeline point
@mixin template-timeline-point-variant($point-color, $background) {
.timeline {
#{$point-color} {
background-color: $background !important;
outline: 3px solid rgba($background, 0.12);
}
// Timeline-outline styles
&.timeline-outline {
#{$point-color} {
border: 2px solid $background !important;
}
}
}
}
@mixin template-timeline-indicator-variant($indicator-color, $background) {
$color: $background;
$background: rgba-to-hex(rgba($background, 0.16), $rgba-to-hex-bg);
.timeline {
#{$indicator-color} {
background-color: $background;
i {
color: $color !important;
}
}
}
}

30
resources/assets/vendor/scss/_components/mixins/_treeview.scss vendored Normal file
View File

@ -0,0 +1,30 @@
// Treeview
// *******************************************************************************
// Treeview click
@mixin template-treeview-clicked-bg($background) {
.jstree-default {
.jstree-wholerow-hovered,
.jstree-hovered {
background: $component-hover-bg;
color: $component-hover-color;
}
.jstree-wholerow-clicked,
.jstree-clicked {
background: $component-hover-color;
color: $white;
}
}
.jstree-default-dark {
.jstree-wholerow-hovered,
.jstree-hovered {
background: $component-hover-bg;
color: $component-hover-color;
}
.jstree-wholerow-clicked,
.jstree-clicked {
background: $component-hover-color;
color: $white;
}
}
}

6
resources/assets/vendor/scss/_custom-variables/_bootstrap-extended-dark.scss vendored Normal file
View File

@ -0,0 +1,6 @@
// ===================================================================================================================
// ? TIP: It is recommended to use this file for overriding bootstrap extended dark variables (_bootstrap-extended/_variables-dark.scss).
// Copy and paste variables as needed, modify their values, and remove the !default flag.
// ===================================================================================================================
// $success: #f0f000 !default;

7
resources/assets/vendor/scss/_custom-variables/_bootstrap-extended.scss vendored Normal file
View File

@ -0,0 +1,7 @@
// ===================================================================================================================
// ? TIP: It is recommended to use this file for overriding bootstrap extended variables (_bootstrap-extended/_variables.scss).
// Copy and paste variables as needed, modify their values, and remove the !default flag.
// ===================================================================================================================
// $font-size-root: 14px !default;
// $success: #00ff00 !default;

5
resources/assets/vendor/scss/_custom-variables/_components-dark.scss vendored Normal file
View File

@ -0,0 +1,5 @@
// ==========================================================================================================
// ? TIP: It is recommended to use this file for overriding component dark variables (_components/_variables-dark.scss).
// Copy and paste variables as needed, modify their values, and remove the !default flag.
// ==========================================================================================================
// $menu-width: 18rem !default;

6
resources/assets/vendor/scss/_custom-variables/_components.scss vendored Normal file
View File

@ -0,0 +1,6 @@
// ================================================================================================
// ? TIP: It is recommended to use this file for overriding component variables (_components/_variables.scss).
// Copy and paste variables as needed, modify their values, and remove the !default flag.
// ================================================================================================
// $menu-width: 14rem !default;

Some files were not shown because too many files have changed in this diff Show More