Skip to content
This repository was archived by the owner on Mar 18, 2025. It is now read-only.

Commit fd3ba2a

Browse files
authored
Tree select (#43)
1 parent 2b9e8fd commit fd3ba2a

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+2399
-372
lines changed

dist/form-components.js

Lines changed: 273 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/mix-manifest.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
{
2-
"/form-components.js": "/form-components.js?id=2509d89034e6f7c041d5"
2+
"/form-components.js": "/form-components.js?id=612366e061bf7f335abd"
33
}

resources/css/addons.css

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
.leading-addon svg {
2+
@apply h-5 w-5;
3+
}
4+
5+
.leading-icon {
6+
z-index: 1;
7+
}
8+
9+
.leading-icon svg {
10+
@apply max-w-full;
11+
}

resources/css/checkbox-group.css

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
:root {
2+
--fc-checkbox-grid-cols: 3;
3+
}
4+
5+
.form-checkbox-group {
6+
grid-template-columns: repeat(var(--fc-checkbox-grid-cols), minmax(0, 1fr));
7+
}

resources/css/custom-select.css

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
.custom-select-container .inline-addon,
2+
.custom-select-container .leading-icon {
3+
z-index: 1;
4+
}
5+
6+
.custom-select__option--selected {
7+
@apply text-blue-gray-900 bg-blue-gray-300;
8+
}
9+
10+
.custom-select__option--selected .custom-select__option-display {
11+
@apply font-semibold;
12+
}
13+
14+
.custom-select__option--hovered {
15+
@apply bg-blue-600 text-white;
16+
}
17+
18+
.custom-select__option--disabled {
19+
@apply opacity-50 cursor-not-allowed;
20+
}
21+
22+
.custom-select__opt-group {
23+
@apply bg-blue-gray-200 text-blue-gray-900 font-semibold;
24+
}
25+
26+
.custom-select__select-count {
27+
@apply text-xs text-blue-gray-500 ml-1;
28+
}
29+
30+
.custom-select-clear {
31+
top: 50%;
32+
transform: translateY(-50%);
33+
}
34+
35+
.custom-select__menu-container[data-popper-placement="bottom-start"],
36+
.custom-select__menu-container[data-popper-placement="bottom-start"] .custom-select__menu {
37+
@apply rounded-t-none;
38+
}
39+
40+
.custom-select__menu-container[data-popper-placement="bottom-start"] + .custom-select__button-container,
41+
.custom-select__menu-container[data-popper-placement="bottom-start"] + .custom-select__button-container .custom-select__button {
42+
@apply rounded-b-none;
43+
}
44+
45+
.custom-select__menu-container[data-popper-placement="top-start"],
46+
.custom-select__menu-container[data-popper-placement="top-start"] .custom-select__menu {
47+
@apply rounded-b-none;
48+
}
49+
50+
.custom-select__menu-container[data-popper-placement="top-start"] + .custom-select__button-container,
51+
.custom-select__menu-container[data-popper-placement="top-start"] + .custom-select__button-container .custom-select__button {
52+
@apply rounded-t-none;
53+
}

resources/css/disabled.css

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
input[disabled],
2+
textarea[disabled],
3+
select[disabled] {
4+
@apply bg-blue-gray-50 cursor-not-allowed;
5+
}
6+
7+
.form-checkbox[disabled],
8+
.form-checkbox.disabled,
9+
.form-radio[disabled],
10+
.form-radio.disabled {
11+
@apply opacity-75 text-blue-gray-300;
12+
}

resources/css/errors.css

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
.has-error label {
2+
@apply text-red-500;
3+
}
4+
5+
.input-error,
6+
.has-error .form-input,
7+
.has-error .form-select,
8+
.has-error .custom-select__button {
9+
@apply border-red-300 text-red-900 focus:border-red-300;
10+
}
11+
12+
.input-error:not(.password-toggleable),
13+
.has-error .custom-select__button,
14+
.has-error .form-input:not(.password-toggleable),
15+
.has-error .form-select:not(.password-toggleable) {
16+
@apply focus:ring-red-400 focus:ring-opacity-50;
17+
}
18+
19+
.has-error .password-input-container {
20+
@apply focus-within:ring-red-400 focus-within:border-red-300 focus-within:ring-opacity-50;
21+
}
22+
23+
.has-error .password-toggle {
24+
@apply border-red-300;
25+
}
26+
27+
.input-error::placeholder,
28+
.has-error .form-input::placeholder,
29+
.has-error .form-select::placeholder {
30+
@apply text-red-300;
31+
}

resources/css/filepond.css

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
/* filepond overrides */
2+
/* purgecss start ignore */
3+
.filepond--panel-root {
4+
@apply border-dashed border-2 border-blue-gray-200 rounded-md max-w-full transition;
5+
@apply bg-transparent !important;
6+
}
7+
8+
.filepond--label-action {
9+
@apply text-blue-600 transition hover:opacity-75 focus:opacity-75;
10+
text-decoration-color: theme('colors.blue.600');
11+
}
12+
13+
.fc-filepond-desc {
14+
@apply text-blue-gray-500;
15+
}
16+
17+
.fc-filepond--sub-desc {
18+
@apply text-xs !important;
19+
}
20+
/* purgecss end ignore */

resources/css/flatpickr.css

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
/* flatpickr overrides */
2+
/* purgecss start ignore */
3+
.flatpickr-calendar {
4+
width: 345px !important;
5+
}
6+
7+
.flatpickr-calendar.open {
8+
max-height: 650px;
9+
}
10+
11+
.flatpickr-months {
12+
@apply relative bg-blue-600 text-white py-3 px-2 items-center;
13+
}
14+
15+
.flatpickr-months .flatpickr-prev-month,
16+
.flatpickr-months .flatpickr-next-month {
17+
@apply absolute transition rounded-full top-1/2 transform -translate-y-1/2 !important;
18+
}
19+
20+
.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month {
21+
@apply left-1 !important;
22+
}
23+
24+
.flatpickr-months .flatpickr-next-month.flatpickr-next-month {
25+
@apply right-1 !important;
26+
}
27+
28+
.flatpickr-months .flatpickr-prev-month:hover svg,
29+
.flatpickr-months .flatpickr-next-month:hover svg {
30+
fill: theme('colors.blue-gray.800') !important;
31+
}
32+
33+
.flatpickr-months .flatpickr-prev-month svg,
34+
.flatpickr-months .flatpickr-next-month svg {
35+
fill: #fff;
36+
opacity: .8;
37+
}
38+
39+
.flatpickr-months .flatpickr-prev-month:hover,
40+
.flatpickr-months .flatpickr-next-month:hover {
41+
@apply bg-blue-gray-300;
42+
}
43+
44+
.flatpickr-months .flatpickr-month {
45+
@apply flex w-full;
46+
}
47+
48+
.flatpickr-months .flatpickr-month .flatpickr-current-month {
49+
@apply text-white w-full relative;
50+
left: unset;
51+
transform: unset;
52+
}
53+
54+
.flatpickr-months .flatpickr-month .flatpickr-current-month .flatpickr-monthDropdown-months {
55+
@apply pl-0 pr-1 mr-1;
56+
}
57+
58+
.flatpickr-current-month .numInputWrapper span.arrowUp:after {
59+
border-bottom-color: rgba(255, 255, 255, .9);
60+
}
61+
62+
.flatpickr-current-month .numInputWrapper span.arrowDown:after {
63+
border-top-color: rgba(255, 255, 255, .9);
64+
}
65+
66+
.flatpickr-innerContainer {
67+
@apply p-4;
68+
}
69+
70+
.flatpickr-day.today:not(.selected) {
71+
@apply border-none bg-blue-gray-300 rounded-full text-blue-gray-500;
72+
}
73+
/* purgecss end ignore */

resources/css/index.css

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
@import 'addons.css';
2+
@import 'checkbox-group.css';
3+
@import 'disabled.css';
4+
@import 'errors.css';
5+
@import 'filepond.css';
6+
@import 'flatpickr.css';
7+
@import 'input.css';
8+
@import 'select.css';
9+
@import 'switch-toggle.css';
10+
@import 'tree-select.css';

0 commit comments

Comments
 (0)