Laravel 11, Vuexy Admin 10.3, by admin@koneko.mx
This commit is contained in:
93
modules/Admin/Resources/assets/vendor/libs/bootstrap-datepicker/_mixins.scss
vendored
Normal file
93
modules/Admin/Resources/assets/vendor/libs/bootstrap-datepicker/_mixins.scss
vendored
Normal file
@ -0,0 +1,93 @@
|
||||
@import '../../scss/_bootstrap-extended/functions';
|
||||
|
||||
@mixin bs-datepicker-theme($background, $color: null) {
|
||||
$color: if($color, $color, color-contrast($background));
|
||||
$range-bg: rgba-to-hex(rgba($background, 0.16), $card-bg);
|
||||
$range-color: $background;
|
||||
|
||||
.datepicker {
|
||||
table {
|
||||
tr td {
|
||||
&.active,
|
||||
&.active.highlighted,
|
||||
.focused,
|
||||
span.active,
|
||||
span.active.disabled,
|
||||
&.range-start,
|
||||
&.range-end {
|
||||
background: $background !important;
|
||||
color: $color !important;
|
||||
box-shadow: 0 0.125rem 0.375rem 0 rgba($background, 0.3);
|
||||
}
|
||||
|
||||
&.range,
|
||||
&.range.highlighted,
|
||||
&.range.today {
|
||||
color: $range-color !important;
|
||||
background: $range-bg !important;
|
||||
|
||||
&.focused {
|
||||
background: rgba-to-hex(rgba($background, 0.24), $card-bg) !important;
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
background: transparentize($range-bg, 0.5) !important;
|
||||
color: transparentize($range-color, 0.5) !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.today:not(.active),
|
||||
&.today:not(.active):hover {
|
||||
color: $background;
|
||||
background-color: rgba-to-hex(rgba($background, 0.16), $card-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin bs-datepicker-dark-theme($background, $color: null) {
|
||||
$color: if($color, $color, color-contrast($background));
|
||||
$range-bg: rgba-to-hex(rgba($background, 0.24), $card-bg);
|
||||
$range-color: $background;
|
||||
|
||||
.datepicker {
|
||||
table {
|
||||
tr td {
|
||||
&.active,
|
||||
&.active.highlighted,
|
||||
.focused,
|
||||
span.active,
|
||||
span.active.disabled,
|
||||
&.range-start,
|
||||
&.range-end {
|
||||
color: $color !important;
|
||||
background: $background !important;
|
||||
box-shadow: 0 0.125rem 0.375rem 0 rgba($background, 0.3);
|
||||
}
|
||||
|
||||
&.range,
|
||||
&.range.highlighted,
|
||||
&.range.today {
|
||||
color: $range-color !important;
|
||||
background: $range-bg !important;
|
||||
|
||||
&.disabled {
|
||||
color: transparentize($range-color, 0.5) !important;
|
||||
background: transparentize($range-bg, 0.5) !important;
|
||||
}
|
||||
|
||||
&.focused {
|
||||
background: rgba-to-hex(rgba($background, 0.24), $card-bg) !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.today:not(.active),
|
||||
&.today:not(.active):hover {
|
||||
color: $background;
|
||||
background-color: rgba-to-hex(rgba($background, 0.16), $card-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
1
modules/Admin/Resources/assets/vendor/libs/bootstrap-datepicker/bootstrap-datepicker.js
vendored
Normal file
1
modules/Admin/Resources/assets/vendor/libs/bootstrap-datepicker/bootstrap-datepicker.js
vendored
Normal file
@ -0,0 +1 @@
|
||||
import 'bootstrap-datepicker/dist/js/bootstrap-datepicker';
|
482
modules/Admin/Resources/assets/vendor/libs/bootstrap-datepicker/bootstrap-datepicker.scss
vendored
Normal file
482
modules/Admin/Resources/assets/vendor/libs/bootstrap-datepicker/bootstrap-datepicker.scss
vendored
Normal file
@ -0,0 +1,482 @@
|
||||
@use '../../scss/_bootstrap-extended/include' as light;
|
||||
@use '../../scss/_bootstrap-extended/include-dark' as dark;
|
||||
@import '../../scss/_custom-variables/libs';
|
||||
|
||||
$datepicker-arrow-size: 0.45rem !default;
|
||||
$datepicker-item-width: 2.25rem !default;
|
||||
$datepicker-item-height: 2.25rem !default;
|
||||
$white: #fff;
|
||||
|
||||
.datepicker {
|
||||
direction: ltr;
|
||||
|
||||
&.dropdown-menu {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.datepicker-days {
|
||||
margin: 0.875rem 0.875rem 0.875rem;
|
||||
}
|
||||
|
||||
// Basic styles for next and prev arrows
|
||||
.next,
|
||||
.prev {
|
||||
color: transparent !important;
|
||||
position: absolute;
|
||||
top: 0.65rem;
|
||||
height: 1.875rem;
|
||||
width: 1.875rem;
|
||||
border-radius: light.$border-radius-pill;
|
||||
display: table-caption;
|
||||
}
|
||||
|
||||
// LRT & RTL only styles for arrows
|
||||
table thead tr th {
|
||||
&.next {
|
||||
@include app-ltr {
|
||||
float: right;
|
||||
right: 0.125rem;
|
||||
}
|
||||
@include app-rtl {
|
||||
float: left;
|
||||
left: 0.125rem;
|
||||
}
|
||||
}
|
||||
&.prev {
|
||||
@include app-ltr {
|
||||
right: 2.75rem;
|
||||
}
|
||||
@include app-rtl {
|
||||
left: 2.75rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.datepicker-inline {
|
||||
table {
|
||||
thead tr th {
|
||||
&.next {
|
||||
inset-inline-end: 0.5rem !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.datepicker-days {
|
||||
.datepicker-switch {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// next & prev arrow after style
|
||||
.next::after,
|
||||
.prev::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 46%;
|
||||
top: 46%;
|
||||
height: $datepicker-arrow-size;
|
||||
width: $datepicker-arrow-size;
|
||||
border-radius: 0;
|
||||
border-style: solid;
|
||||
transform: rotate(-45deg);
|
||||
transform-origin: left;
|
||||
}
|
||||
|
||||
.next::after {
|
||||
margin-left: -$datepicker-arrow-size * 0.35;
|
||||
border-width: 0 1.9px 1.9px 0;
|
||||
|
||||
@include app-rtl {
|
||||
transform: rotate(-45deg);
|
||||
border-width: 1.9px 0 0 1.9px;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.prev::after {
|
||||
border-width: 1.9px 0 0 1.9px;
|
||||
|
||||
@include app-rtl {
|
||||
transform: rotate(-45deg);
|
||||
border-width: 0 1.9px 1.9px 0;
|
||||
margin-left: -$datepicker-arrow-size * 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
// arrow alignments excluding datepicker-days
|
||||
.datepicker-months,
|
||||
.datepicker-years,
|
||||
.datepicker-decades,
|
||||
.datepicker-centuries {
|
||||
.next {
|
||||
@include app-ltr {
|
||||
right: 1rem;
|
||||
}
|
||||
@include app-rtl {
|
||||
left: 1rem;
|
||||
}
|
||||
}
|
||||
.prev {
|
||||
@include app-ltr {
|
||||
right: 3.4rem;
|
||||
}
|
||||
@include app-rtl {
|
||||
left: 3.4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// switch default styles
|
||||
.datepicker-switch {
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
@include app-ltr {
|
||||
text-align: left;
|
||||
}
|
||||
@include app-rtl {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
// switch alignments datepicker-days
|
||||
.datepicker-days {
|
||||
.datepicker-switch {
|
||||
top: -4px;
|
||||
@include app-ltr {
|
||||
left: -1.68rem;
|
||||
}
|
||||
@include app-rtl {
|
||||
right: -1.68rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// switch alignments excluding datepicker-days
|
||||
.datepicker-months,
|
||||
.datepicker-years,
|
||||
.datepicker-decades,
|
||||
.datepicker-centuries {
|
||||
.datepicker-switch {
|
||||
@include app-ltr {
|
||||
left: 1rem;
|
||||
}
|
||||
@include app-rtl {
|
||||
right: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
table thead tr:nth-child(2) {
|
||||
height: 60px !important;
|
||||
width: 80px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&.datepicker-rtl {
|
||||
direction: rtl;
|
||||
|
||||
table tr td span {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
@include app-rtl {
|
||||
direction: rtl;
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker table {
|
||||
user-select: none;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
border-radius: light.$dropdown-border-radius;
|
||||
tbody {
|
||||
//! FIX: padding or margin top will not work in table
|
||||
&:before {
|
||||
content: '@';
|
||||
display: block;
|
||||
line-height: 6px;
|
||||
text-indent: -99999px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker table tr td,
|
||||
.datepicker table tr th {
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
border: none;
|
||||
|
||||
&.dow {
|
||||
font-size: light.$font-size-sm;
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker table tr td {
|
||||
border-radius: light.$border-radius-pill;
|
||||
width: $datepicker-item-width;
|
||||
height: $datepicker-item-height;
|
||||
&.day:hover,
|
||||
&.focused {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:hover {
|
||||
cursor: default;
|
||||
background: none;
|
||||
}
|
||||
|
||||
&.range {
|
||||
border-radius: 0 !important;
|
||||
&.today {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
// span.month,
|
||||
// span.year {
|
||||
// margin: 0 0.5rem;
|
||||
// }
|
||||
|
||||
&.range-start:not(.range-end) {
|
||||
@include app-ltr {
|
||||
border-bottom-right-radius: 0 !important;
|
||||
border-top-right-radius: 0 !important;
|
||||
}
|
||||
|
||||
@include app-rtl {
|
||||
border-bottom-left-radius: 0 !important;
|
||||
border-top-left-radius: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.range-end:not(.range-start) {
|
||||
@include app-ltr {
|
||||
border-bottom-left-radius: 0 !important;
|
||||
border-top-left-radius: 0 !important;
|
||||
}
|
||||
|
||||
@include app-rtl {
|
||||
border-bottom-right-radius: 0 !important;
|
||||
border-top-right-radius: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.selected,
|
||||
&.selected:hover,
|
||||
&.selected.highlighted {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
// Styles for datepicker months, years, decades etc
|
||||
.datepicker table tr td span {
|
||||
display: block;
|
||||
float: left;
|
||||
width: 3.625rem;
|
||||
height: 2rem;
|
||||
line-height: 2rem;
|
||||
cursor: pointer;
|
||||
|
||||
&.disabled,
|
||||
&.disabled:hover {
|
||||
background: none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
@include app-rtl {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.datepicker .datepicker-switch,
|
||||
.datepicker .prev,
|
||||
.datepicker .next,
|
||||
.datepicker tfoot tr th {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.datepicker-months table,
|
||||
.datepicker-years table,
|
||||
.datepicker-decades table,
|
||||
.datepicker-centuries table {
|
||||
width: (3.375rem * 3) + 2.625rem;
|
||||
|
||||
td {
|
||||
padding: 0 0 0.5rem 0.8125rem;
|
||||
|
||||
@include app-rtl {
|
||||
padding: 0 0.8125rem 0.5rem 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker-dropdown {
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.input-daterange input {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
// Light style
|
||||
@if $enable-light-style {
|
||||
.light-style {
|
||||
.datepicker-dropdown {
|
||||
z-index: light.$zindex-popover !important;
|
||||
box-shadow: light.$card-box-shadow;
|
||||
}
|
||||
|
||||
.datepicker {
|
||||
th {
|
||||
&.prev,
|
||||
&.next {
|
||||
background-color: light.rgba-to-hex(rgba(light.$black, 0.08), light.$card-bg);
|
||||
&::after {
|
||||
border-color: light.$body-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.datepicker-inline {
|
||||
table {
|
||||
box-shadow: light.$box-shadow;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
thead {
|
||||
background-color: light.$card-bg;
|
||||
tr,
|
||||
td {
|
||||
color: light.$headings-color;
|
||||
}
|
||||
}
|
||||
tr td,
|
||||
tr th {
|
||||
&.new {
|
||||
color: light.$text-muted;
|
||||
}
|
||||
}
|
||||
|
||||
tr td {
|
||||
&.old,
|
||||
&.disabled {
|
||||
color: light.$text-muted;
|
||||
}
|
||||
|
||||
&.cw {
|
||||
background-color: light.$card-bg;
|
||||
color: light.$body-color;
|
||||
}
|
||||
|
||||
&.day:hover,
|
||||
&.focused {
|
||||
background: light.rgba-to-hex(light.$gray-50, light.$card-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker table tr td span {
|
||||
border-radius: light.$border-radius;
|
||||
|
||||
&:hover,
|
||||
&.focused {
|
||||
background: light.rgba-to-hex(light.$gray-50, light.$card-bg);
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:hover {
|
||||
color: light.$text-muted;
|
||||
}
|
||||
|
||||
&.old,
|
||||
&.new {
|
||||
color: light.$text-muted;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Dark style
|
||||
@if $enable-dark-style {
|
||||
.dark-style {
|
||||
.datepicker-dropdown {
|
||||
z-index: dark.$zindex-popover !important;
|
||||
box-shadow: dark.$card-box-shadow;
|
||||
}
|
||||
|
||||
.datepicker {
|
||||
th {
|
||||
&.prev,
|
||||
&.next {
|
||||
background-color: dark.rgba-to-hex(rgba(dark.$base, 0.08), dark.$card-bg);
|
||||
&::after {
|
||||
border-color: dark.$body-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.datepicker-inline {
|
||||
table {
|
||||
box-shadow: dark.$card-box-shadow;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
thead {
|
||||
background-color: dark.$card-bg;
|
||||
tr,
|
||||
td {
|
||||
color: dark.$headings-color;
|
||||
}
|
||||
}
|
||||
tr td,
|
||||
tr th {
|
||||
&.new {
|
||||
color: dark.$text-muted;
|
||||
}
|
||||
}
|
||||
|
||||
tr td {
|
||||
color: dark.$body-color;
|
||||
|
||||
&.old,
|
||||
&.disabled {
|
||||
color: dark.$text-muted;
|
||||
}
|
||||
|
||||
&.cw {
|
||||
background-color: dark.$card-bg;
|
||||
color: dark.$body-color;
|
||||
}
|
||||
|
||||
&.day:hover,
|
||||
&.focused {
|
||||
background: dark.rgba-to-hex(dark.$gray-50, dark.$card-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker table tr td span {
|
||||
border-radius: dark.$border-radius;
|
||||
|
||||
&:hover,
|
||||
&.focused {
|
||||
background: dark.rgba-to-hex(dark.$gray-50, dark.$card-bg);
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:hover {
|
||||
color: dark.$text-muted;
|
||||
}
|
||||
|
||||
&.old,
|
||||
&.new {
|
||||
color: dark.$text-muted;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user