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

first commit

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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