Laravel 11, Vuexy Admin 10.3, by admin@koneko.mx
This commit is contained in:
39
modules/Admin/Resources/assets/vendor/scss/_bootstrap-dark.scss
vendored
Normal file
39
modules/Admin/Resources/assets/vendor/scss/_bootstrap-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended-dark.scss
vendored
Normal file
40
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended.scss
vendored
Normal file
39
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_accordion.scss
vendored
Normal file
250
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_accordion.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_alert.scss
vendored
Normal file
53
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_alert.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_badge.scss
vendored
Normal file
53
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_badge.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_breadcrumb.scss
vendored
Normal file
62
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_breadcrumb.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_button-group.scss
vendored
Normal file
161
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_button-group.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_buttons.scss
vendored
Normal file
178
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_buttons.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_card.scss
vendored
Normal file
389
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_card.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_carousel.scss
vendored
Normal file
50
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_carousel.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_close.scss
vendored
Normal file
12
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_close.scss
vendored
Normal file
@ -0,0 +1,12 @@
|
||||
// Close buttons
|
||||
// *******************************************************************************
|
||||
|
||||
.close:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
@include rtl-only {
|
||||
.close {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
126
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_dropdown.scss
vendored
Normal file
126
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_dropdown.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_forms.scss
vendored
Normal file
12
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_forms.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_functions.scss
vendored
Normal file
148
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_functions.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_include-dark.scss
vendored
Normal file
15
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_include-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_include.scss
vendored
Normal file
13
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_include.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_list-group.scss
vendored
Normal file
210
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_list-group.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_mixins.scss
vendored
Normal file
20
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_mixins.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_modal.scss
vendored
Normal file
390
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_modal.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_nav.scss
vendored
Normal file
510
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_nav.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_navbar.scss
vendored
Normal file
87
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_navbar.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_offcanvas.scss
vendored
Normal file
33
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_offcanvas.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_pagination.scss
vendored
Normal file
226
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_pagination.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_popover.scss
vendored
Normal file
42
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_popover.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_progress.scss
vendored
Normal file
44
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_progress.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_reboot.scss
vendored
Normal file
74
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_reboot.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_root.scss
vendored
Normal file
4
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_root.scss
vendored
Normal file
@ -0,0 +1,4 @@
|
||||
// The color-scheme CSS property https://web.dev/color-scheme/
|
||||
:root {
|
||||
color-scheme: #{$color-scheme};
|
||||
}
|
||||
44
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_spinners.scss
vendored
Normal file
44
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_spinners.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_tables.scss
vendored
Normal file
136
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_tables.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_toasts.scss
vendored
Normal file
51
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_toasts.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_tooltip.scss
vendored
Normal file
58
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_tooltip.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_type.scss
vendored
Normal file
13
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_type.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_utilities-ltr.scss
vendored
Normal file
299
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_utilities-ltr.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_utilities-rtl.scss
vendored
Normal file
301
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_utilities-rtl.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_utilities.scss
vendored
Normal file
1081
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_utilities.scss
vendored
Normal file
File diff suppressed because it is too large
Load Diff
236
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_variables-dark.scss
vendored
Normal file
236
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_variables-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_variables.scss
vendored
Normal file
1090
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/_variables.scss
vendored
Normal file
File diff suppressed because it is too large
Load Diff
36
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_floating-labels.scss
vendored
Normal file
36
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_floating-labels.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-check.scss
vendored
Normal file
79
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-check.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-control.scss
vendored
Normal file
73
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-control.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-range.scss
vendored
Normal file
49
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-range.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-select.scss
vendored
Normal file
109
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-select.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-text.scss
vendored
Normal file
2
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_form-text.scss
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
// Form Text
|
||||
// *******************************************************************************
|
||||
393
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_input-group.scss
vendored
Normal file
393
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_input-group.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_labels.scss
vendored
Normal file
17
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_labels.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_validation.scss
vendored
Normal file
130
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/forms/_validation.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_alert.scss
vendored
Normal file
101
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_alert.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_badge.scss
vendored
Normal file
9
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_badge.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_buttons.scss
vendored
Normal file
360
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_buttons.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_card.scss
vendored
Normal file
32
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_card.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_caret.scss
vendored
Normal file
64
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_caret.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_dropdown.scss
vendored
Normal file
33
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_dropdown.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_forms.scss
vendored
Normal file
361
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_forms.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_list-group.scss
vendored
Normal file
86
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_list-group.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_misc.scss
vendored
Normal file
158
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_misc.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_modal.scss
vendored
Normal file
20
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_modal.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_navs.scss
vendored
Normal file
101
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_navs.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_pagination.scss
vendored
Normal file
73
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_pagination.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_popover.scss
vendored
Normal file
53
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_popover.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_progress.scss
vendored
Normal file
14
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_progress.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_table-variants.scss
vendored
Normal file
26
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_table-variants.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_tooltip.scss
vendored
Normal file
35
modules/Admin/Resources/assets/vendor/scss/_bootstrap-extended/mixins/_tooltip.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_bootstrap.scss
vendored
Normal file
43
modules/Admin/Resources/assets/vendor/scss/_bootstrap.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_colors-dark.scss
vendored
Normal file
136
modules/Admin/Resources/assets/vendor/scss/_colors-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_colors.scss
vendored
Normal file
126
modules/Admin/Resources/assets/vendor/scss/_colors.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components-dark.scss
vendored
Normal file
16
modules/Admin/Resources/assets/vendor/scss/_components-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components.scss
vendored
Normal file
16
modules/Admin/Resources/assets/vendor/scss/_components.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_app-brand.scss
vendored
Normal file
75
modules/Admin/Resources/assets/vendor/scss/_components/_app-brand.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_avatar.scss
vendored
Normal file
157
modules/Admin/Resources/assets/vendor/scss/_components/_avatar.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_base.scss
vendored
Normal file
183
modules/Admin/Resources/assets/vendor/scss/_components/_base.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_blockui.scss
vendored
Normal file
10
modules/Admin/Resources/assets/vendor/scss/_components/_blockui.scss
vendored
Normal file
@ -0,0 +1,10 @@
|
||||
// Block UI
|
||||
// *******************************************************************************
|
||||
|
||||
.blockUI {
|
||||
&.blockOverlay,
|
||||
&.blockMsg {
|
||||
z-index: $zindex-modal + 1 !important;
|
||||
color: $white !important;
|
||||
}
|
||||
}
|
||||
255
modules/Admin/Resources/assets/vendor/scss/_components/_common.scss
vendored
Normal file
255
modules/Admin/Resources/assets/vendor/scss/_components/_common.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_custom-options.scss
vendored
Normal file
161
modules/Admin/Resources/assets/vendor/scss/_components/_custom-options.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_drag-drop.scss
vendored
Normal file
13
modules/Admin/Resources/assets/vendor/scss/_components/_drag-drop.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_footer.scss
vendored
Normal file
78
modules/Admin/Resources/assets/vendor/scss/_components/_footer.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_include-dark.scss
vendored
Normal file
13
modules/Admin/Resources/assets/vendor/scss/_components/_include-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_include.scss
vendored
Normal file
11
modules/Admin/Resources/assets/vendor/scss/_components/_include.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_layout.scss
vendored
Normal file
1181
modules/Admin/Resources/assets/vendor/scss/_components/_layout.scss
vendored
Normal file
File diff suppressed because it is too large
Load Diff
784
modules/Admin/Resources/assets/vendor/scss/_components/_menu.scss
vendored
Normal file
784
modules/Admin/Resources/assets/vendor/scss/_components/_menu.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_mixins.scss
vendored
Normal file
9
modules/Admin/Resources/assets/vendor/scss/_components/_mixins.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_switch.scss
vendored
Normal file
239
modules/Admin/Resources/assets/vendor/scss/_components/_switch.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_text-divider.scss
vendored
Normal file
180
modules/Admin/Resources/assets/vendor/scss/_components/_text-divider.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_timeline.scss
vendored
Normal file
363
modules/Admin/Resources/assets/vendor/scss/_components/_timeline.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_variables-dark.scss
vendored
Normal file
25
modules/Admin/Resources/assets/vendor/scss/_components/_variables-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/_variables.scss
vendored
Normal file
168
modules/Admin/Resources/assets/vendor/scss/_components/_variables.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_app-brand.scss
vendored
Normal file
29
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_app-brand.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_avatar.scss
vendored
Normal file
22
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_avatar.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_footer.scss
vendored
Normal file
47
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_footer.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_menu.scss
vendored
Normal file
133
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_menu.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_misc.scss
vendored
Normal file
6
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_misc.scss
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
// SVG Color
|
||||
@mixin template-svg-color($background) {
|
||||
.svg-illustration svg {
|
||||
fill: $background;
|
||||
}
|
||||
}
|
||||
90
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_navbar.scss
vendored
Normal file
90
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_navbar.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_switch.scss
vendored
Normal file
179
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_switch.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_text-divider.scss
vendored
Normal file
17
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_text-divider.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_timeline.scss
vendored
Normal file
33
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_timeline.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_treeview.scss
vendored
Normal file
30
modules/Admin/Resources/assets/vendor/scss/_components/mixins/_treeview.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_custom-variables/_bootstrap-extended-dark.scss
vendored
Normal file
6
modules/Admin/Resources/assets/vendor/scss/_custom-variables/_bootstrap-extended-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_custom-variables/_bootstrap-extended.scss
vendored
Normal file
7
modules/Admin/Resources/assets/vendor/scss/_custom-variables/_bootstrap-extended.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_custom-variables/_components-dark.scss
vendored
Normal file
5
modules/Admin/Resources/assets/vendor/scss/_custom-variables/_components-dark.scss
vendored
Normal 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
modules/Admin/Resources/assets/vendor/scss/_custom-variables/_components.scss
vendored
Normal file
6
modules/Admin/Resources/assets/vendor/scss/_custom-variables/_components.scss
vendored
Normal 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
Reference in New Issue
Block a user