wg svelte multiple component communication

This commit is contained in:
infidel
2022-11-21 18:58:44 +07:00
parent dbf9049c48
commit 6f44d2b645
21 changed files with 431 additions and 260 deletions

View File

@@ -3,3 +3,4 @@
@tailwind components;
@tailwind utilities;

View File

@@ -1237,21 +1237,11 @@ select {
background-color: rgba(168, 85, 247, var(--tw-bg-opacity));
}
.bg-purple-600 {
--tw-bg-opacity: 1;
background-color: rgba(147, 51, 234, var(--tw-bg-opacity));
}
.bg-indigo-500 {
--tw-bg-opacity: 1;
background-color: rgba(99, 102, 241, var(--tw-bg-opacity));
}
.bg-blue-600 {
--tw-bg-opacity: 1;
background-color: rgba(37, 99, 235, var(--tw-bg-opacity));
}
.bg-lightBlue-200 {
--tw-bg-opacity: 1;
background-color: rgba(186, 230, 253, var(--tw-bg-opacity));
@@ -1272,11 +1262,26 @@ select {
background-color: rgba(2, 132, 199, var(--tw-bg-opacity));
}
.bg-cyan-500 {
--tw-bg-opacity: 1;
background-color: rgba(6, 182, 212, var(--tw-bg-opacity));
}
.bg-teal-50 {
--tw-bg-opacity: 1;
background-color: rgba(240, 253, 250, var(--tw-bg-opacity));
}
.bg-teal-200 {
--tw-bg-opacity: 1;
background-color: rgba(153, 246, 228, var(--tw-bg-opacity));
}
.bg-teal-300 {
--tw-bg-opacity: 1;
background-color: rgba(94, 234, 212, var(--tw-bg-opacity));
}
.bg-teal-500 {
--tw-bg-opacity: 1;
background-color: rgba(20, 184, 166, var(--tw-bg-opacity));
@@ -1312,6 +1317,11 @@ select {
background-color: rgba(249, 115, 22, var(--tw-bg-opacity));
}
.bg-red-50 {
--tw-bg-opacity: 1;
background-color: rgba(254, 242, 242, var(--tw-bg-opacity));
}
.bg-red-200 {
--tw-bg-opacity: 1;
background-color: rgba(254, 202, 202, var(--tw-bg-opacity));
@@ -1387,51 +1397,21 @@ select {
background-color: rgba(30, 41, 59, var(--tw-bg-opacity));
}
.hover\:bg-purple-700:hover {
--tw-bg-opacity: 1;
background-color: rgba(126, 34, 206, var(--tw-bg-opacity));
}
.hover\:bg-blue-700:hover {
--tw-bg-opacity: 1;
background-color: rgba(29, 78, 216, var(--tw-bg-opacity));
}
.focus\:bg-white:focus {
--tw-bg-opacity: 1;
background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}
.focus\:bg-purple-700:focus {
--tw-bg-opacity: 1;
background-color: rgba(126, 34, 206, var(--tw-bg-opacity));
}
.focus\:bg-blue-700:focus {
--tw-bg-opacity: 1;
background-color: rgba(29, 78, 216, var(--tw-bg-opacity));
}
.focus\:bg-gray-200:focus {
--tw-bg-opacity: 1;
background-color: rgba(228, 228, 231, var(--tw-bg-opacity));
}
.active\:bg-purple-800:active {
--tw-bg-opacity: 1;
background-color: rgba(107, 33, 168, var(--tw-bg-opacity));
}
.active\:bg-indigo-600:active {
--tw-bg-opacity: 1;
background-color: rgba(79, 70, 229, var(--tw-bg-opacity));
}
.active\:bg-blue-800:active {
--tw-bg-opacity: 1;
background-color: rgba(30, 64, 175, var(--tw-bg-opacity));
}
.active\:bg-red-500:active {
--tw-bg-opacity: 1;
background-color: rgba(239, 68, 68, var(--tw-bg-opacity));
@@ -1556,10 +1536,6 @@ select {
border-color: rgba(113, 113, 122, var(--tw-border-opacity));
}
.rounded-none {
border-radius: 0px;
}
.rounded {
border-radius: 0.25rem;
}
@@ -1596,16 +1572,6 @@ select {
border-bottom-left-radius: 0.25rem;
}
.rounded-t-md {
border-top-left-radius: 0.375rem;
border-top-right-radius: 0.375rem;
}
.rounded-b-md {
border-bottom-right-radius: 0.375rem;
border-bottom-left-radius: 0.375rem;
}
.rounded-t-lg {
border-top-left-radius: 0.5rem;
border-top-right-radius: 0.5rem;
@@ -1675,6 +1641,10 @@ select {
border-bottom-width: 2px;
}
.border-t-8 {
border-top-width: 8px;
}
.border-t {
border-top-width: 1px;
}
@@ -2019,10 +1989,6 @@ select {
flex-grow: 1;
}
.flex-shrink-0 {
flex-shrink: 0;
}
.flex-shrink {
flex-shrink: 1;
}
@@ -2063,10 +2029,6 @@ select {
font-weight: 400;
}
.font-medium {
font-weight: 500;
}
.font-semibold {
font-weight: 600;
}
@@ -2083,10 +2045,6 @@ select {
height: 0.5rem;
}
.h-4 {
height: 1rem;
}
.h-5 {
height: 1.25rem;
}
@@ -2200,10 +2158,6 @@ select {
line-height: 1;
}
.leading-tight {
line-height: 1.25;
}
.leading-snug {
line-height: 1.375;
}
@@ -2566,14 +2520,6 @@ select {
opacity: .8;
}
.hover\:opacity-75:hover {
opacity: 0.75;
}
.focus\:opacity-100:focus {
opacity: 1;
}
.outline-none {
outline: 2px solid transparent;
outline-offset: 2px;
@@ -2792,11 +2738,6 @@ select {
padding-right: 0.125rem;
}
.py-2\.5 {
padding-top: 0.625rem;
padding-bottom: 0.625rem;
}
.pt-0 {
padding-top: 0px;
}
@@ -3092,21 +3033,6 @@ select {
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.focus\:shadow-lg:focus {
--tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.focus\:shadow-none:focus {
--tw-shadow: 0 0 #0000;
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.active\:shadow-lg:active {
--tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
* {
--tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
--tw-ring-offset-width: 0px;
@@ -3229,11 +3155,21 @@ select {
color: rgba(2, 132, 199, var(--tw-text-opacity));
}
.text-teal-50 {
--tw-text-opacity: 1;
color: rgba(240, 253, 250, var(--tw-text-opacity));
}
.text-teal-500 {
--tw-text-opacity: 1;
color: rgba(20, 184, 166, var(--tw-text-opacity));
}
.text-teal-700 {
--tw-text-opacity: 1;
color: rgba(15, 118, 110, var(--tw-text-opacity));
}
.text-emerald-500 {
--tw-text-opacity: 1;
color: rgba(16, 185, 129, var(--tw-text-opacity));
@@ -3279,11 +3215,6 @@ select {
color: rgba(63, 63, 70, var(--tw-text-opacity));
}
.text-gray-800 {
--tw-text-opacity: 1;
color: rgba(39, 39, 42, var(--tw-text-opacity));
}
.text-gray-900 {
--tw-text-opacity: 1;
color: rgba(24, 24, 27, var(--tw-text-opacity));
@@ -3329,11 +3260,6 @@ select {
color: rgba(30, 41, 59, var(--tw-text-opacity));
}
.hover\:text-black:hover {
--tw-text-opacity: 1;
color: rgba(0, 0, 0, var(--tw-text-opacity));
}
.hover\:text-red-600:hover {
--tw-text-opacity: 1;
color: rgba(220, 38, 38, var(--tw-text-opacity));
@@ -3409,10 +3335,6 @@ select {
text-decoration: none;
}
.hover\:no-underline:hover {
text-decoration: none;
}
.antialiased {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@@ -3561,10 +3483,6 @@ select {
word-break: break-all;
}
.w-4 {
width: 1rem;
}
.w-5 {
width: 1.25rem;
}
@@ -4137,3 +4055,4 @@ select {
@media (min-width: 1536px) {
}