Laravel 11, Vuexy Admin 10.3, by admin@koneko.mx
This commit is contained in:
16
modules/Admin/Resources/assets/vendor/libs/bootstrap-select/_mixins.scss
vendored
Normal file
16
modules/Admin/Resources/assets/vendor/libs/bootstrap-select/_mixins.scss
vendored
Normal file
@ -0,0 +1,16 @@
|
||||
@import '../../scss/_bootstrap-extended/functions';
|
||||
|
||||
@mixin bs-select-theme($background, $color: null) {
|
||||
$color: if($color, $color, color-contrast($background));
|
||||
|
||||
.bootstrap-select {
|
||||
.dropdown-menu.inner a[aria-selected='true'] {
|
||||
background: $background !important;
|
||||
color: $color !important;
|
||||
}
|
||||
// Fix: To add focus border, .bootstrap-select adding border but not able to update as we can not have the focus on div
|
||||
.dropdown-toggle.show {
|
||||
border-color: $background;
|
||||
}
|
||||
}
|
||||
}
|
1
modules/Admin/Resources/assets/vendor/libs/bootstrap-select/bootstrap-select.js
vendored
Normal file
1
modules/Admin/Resources/assets/vendor/libs/bootstrap-select/bootstrap-select.js
vendored
Normal file
@ -0,0 +1 @@
|
||||
import 'bootstrap-select/js/bootstrap-select';
|
259
modules/Admin/Resources/assets/vendor/libs/bootstrap-select/bootstrap-select.scss
vendored
Normal file
259
modules/Admin/Resources/assets/vendor/libs/bootstrap-select/bootstrap-select.scss
vendored
Normal file
@ -0,0 +1,259 @@
|
||||
// Bootstrap Select
|
||||
// *******************************************************************************
|
||||
|
||||
@use '../../scss/_bootstrap-extended/include' as light;
|
||||
@use '../../scss/_bootstrap-extended/include-dark' as dark;
|
||||
@import '../../scss/_custom-variables/libs';
|
||||
@import 'bootstrap-select/sass/bootstrap-select.scss';
|
||||
|
||||
// Common Styles
|
||||
.bootstrap-select *,
|
||||
.bootstrap-select .dropdown-toggle:focus {
|
||||
outline: 0 !important;
|
||||
}
|
||||
.bootstrap-select {
|
||||
.bs-searchbox,
|
||||
.bs-actionsbox,
|
||||
.bs-donebutton {
|
||||
padding: 0 0 8px;
|
||||
}
|
||||
.dropdown-toggle {
|
||||
transition: none;
|
||||
padding: calc(light.$input-padding-y - light.$input-border-width) light.$input-padding-x;
|
||||
box-shadow: none !important;
|
||||
&.show,
|
||||
&:focus {
|
||||
padding: calc(light.$input-padding-y - light.$input-focus-border-width)
|
||||
calc(light.$input-padding-x - light.$input-border-width);
|
||||
}
|
||||
&:after {
|
||||
transform: rotate(45deg) translateY(-100%);
|
||||
position: absolute;
|
||||
inset-inline-end: 23px;
|
||||
top: 50%;
|
||||
margin: 0 !important;
|
||||
@include app-rtl {
|
||||
inset-inline-end: 12px;
|
||||
}
|
||||
}
|
||||
&:active {
|
||||
transform: none !important;
|
||||
}
|
||||
&.show {
|
||||
&:after {
|
||||
inset-inline-end: calc(23px - light.$input-border-width);
|
||||
@include app-rtl {
|
||||
inset-inline-end: calc(12px - light.$input-border-width);
|
||||
}
|
||||
}
|
||||
}
|
||||
.filter-option-inner-inner {
|
||||
line-height: light.$input-line-height;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
&:disabled,
|
||||
&.disabled {
|
||||
color: light.$btn-color !important;
|
||||
}
|
||||
}
|
||||
|
||||
// For header dropdown close btn
|
||||
.dropdown-menu .popover-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
button {
|
||||
border: none;
|
||||
font-size: light.$h4-font-size;
|
||||
background: transparent;
|
||||
padding-bottom: 0.125rem;
|
||||
}
|
||||
}
|
||||
.is-invalid {
|
||||
~ .dropdown-toggle {
|
||||
&:after {
|
||||
inset-inline-end: calc(23px - light.$input-border-width);
|
||||
@include app-rtl {
|
||||
inset-inline-end: calc(12px - light.$input-border-width);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bootstrap-select.dropup {
|
||||
.dropdown-toggle {
|
||||
&:after {
|
||||
transform: rotate(317deg) translateY(-30%);
|
||||
inset-inline-end: 14px;
|
||||
@include app-rtl {
|
||||
inset-inline-end: calc(18px);
|
||||
}
|
||||
}
|
||||
&.show {
|
||||
&:after {
|
||||
inset-inline-end: calc(14px - light.$input-border-width);
|
||||
@include app-rtl {
|
||||
inset-inline-end: calc(18px - light.$input-border-width);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.is-invalid {
|
||||
~ .dropdown-toggle {
|
||||
&:after {
|
||||
inset-inline-end: calc(14px - light.$input-border-width);
|
||||
@include app-rtl {
|
||||
inset-inline-end: calc(18px - light.$input-border-width);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Menu Position
|
||||
.bootstrap-select.show-tick .dropdown-menu {
|
||||
li a {
|
||||
position: relative;
|
||||
}
|
||||
// RTL
|
||||
@include app-rtl {
|
||||
li a span.text {
|
||||
margin-left: 2.125rem;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.selected span.check-mark {
|
||||
display: block;
|
||||
right: 1rem;
|
||||
top: 50%;
|
||||
margin: 0;
|
||||
transform: translateY(-50%);
|
||||
line-height: 1;
|
||||
|
||||
@include app-rtl {
|
||||
left: 1rem;
|
||||
right: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// To remove ripple effect
|
||||
.bootstrap-select .dropdown-menu.inner .selected .waves-ripple {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.bootstrap-select:not(.input-group-btn),
|
||||
.bootstrap-select[class*='col-'] {
|
||||
display: block;
|
||||
}
|
||||
|
||||
html[class] .bootstrap-select.form-select {
|
||||
background: none !important;
|
||||
border: 0 !important;
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
// RTL
|
||||
|
||||
@include app-rtl(false) {
|
||||
.bootstrap-select .dropdown-toggle .filter-option {
|
||||
float: right;
|
||||
right: 0;
|
||||
left: auto;
|
||||
text-align: right;
|
||||
padding-left: inherit;
|
||||
padding-right: 0;
|
||||
margin-left: -100%;
|
||||
margin-right: 0;
|
||||
}
|
||||
// Fix: Subtext rtl support
|
||||
.bootstrap-select .filter-option-inner-inner {
|
||||
float: right;
|
||||
}
|
||||
.bootstrap-select .dropdown-menu li small.text-muted,
|
||||
.bootstrap-select .filter-option small.text-muted {
|
||||
position: relative;
|
||||
top: 2px;
|
||||
padding-left: 0;
|
||||
padding-right: 0.5em;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.bootstrap-select .dropdown-toggle .filter-option-inner {
|
||||
padding-left: inherit;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Light style
|
||||
@if $enable-light-style {
|
||||
.light-style {
|
||||
.bootstrap-select {
|
||||
background-color: light.$input-bg;
|
||||
.dropdown-toggle {
|
||||
border-radius: light.$border-radius;
|
||||
border: light.$input-border-width solid light.$input-border-color;
|
||||
&.show,
|
||||
&:focus {
|
||||
border: light.$input-focus-border-width solid light.$primary;
|
||||
}
|
||||
&:not(.show):hover {
|
||||
border-color: light.$input-border-hover-color;
|
||||
}
|
||||
}
|
||||
.dropdown-menu {
|
||||
&[data-popper-placement='top-start'],
|
||||
&[data-popper-placement='top-end'] {
|
||||
box-shadow: 0 -0.2rem 1.25rem rgba(light.rgba-to-hex(light.$gray-500, light.$rgba-to-hex-bg), 0.4);
|
||||
}
|
||||
.notify {
|
||||
background: light.$popover-bg;
|
||||
border: light.$input-border-width solid light.$popover-border-color;
|
||||
}
|
||||
.popover-header button {
|
||||
color: light.$body-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Dark Style
|
||||
@if $enable-dark-style {
|
||||
.dark-style {
|
||||
.bootstrap-select {
|
||||
background-color: dark.$input-bg;
|
||||
.dropdown-toggle {
|
||||
color: dark.$input-color;
|
||||
&:hover {
|
||||
color: dark.$input-color;
|
||||
}
|
||||
border: dark.$input-border-width solid dark.$input-border-color;
|
||||
border-radius: dark.$border-radius;
|
||||
&.show,
|
||||
&:focus {
|
||||
border: dark.$input-focus-border-width solid dark.$primary;
|
||||
}
|
||||
&:not(.show):hover {
|
||||
border-color: dark.$input-border-hover-color;
|
||||
}
|
||||
}
|
||||
.dropdown-menu {
|
||||
&[data-popper-placement='top-start'],
|
||||
&[data-popper-placement='top-end'] {
|
||||
box-shadow: 0 -0.2rem 1.25rem rgba(15, 20, 34, 0.55);
|
||||
}
|
||||
.notify {
|
||||
background: dark.$popover-bg;
|
||||
border: dark.$input-border-width solid dark.$popover-border-color;
|
||||
}
|
||||
.popover-header button {
|
||||
color: dark.$body-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user