spicykatsu 0.9.5 → 0.9.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/spicykatsu.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
:root{--skBgColor:#28292a;--skBgSecondaryColor:#424344;--skBorderColor:#515353;--skPrimaryColor:#811faf;--skSecondaryColor:#0066b3;--skAccentColor:#004a77;--skHoverColor:#656769;--skTextColor:#ddd;--skFontFamily:"Helvetica Neue", Helvetica, Arial, sans-serif;--skFontSize:1rem;--skFontWeight:500;--skBorderRadius:4px}.spicyText{color:var(--skTextColor);font-family:var(--skFontFamily);font-size:var(--skFontSize)}.spicyHeader{color:var(--skTextColor);font-family:var(--skFontFamily);font-size:24px;font-weight:700}.spicyLink:hover{color:var(--skHoverColor)}.spicyLink:active,.spicyLink:focus{color:var(--skPrimaryColor)}.spicyLink:disabled{opacity:.3}.spicyRipple{pointer-events:none;z-index:1;background:currentColor;border-radius:50%;animation:.6s linear spicy-ripple-animation;position:absolute;transform:scale(0)}@keyframes spicy-ripple-animation{to{opacity:0;transform:scale(4)}}.spicyAccordion{border:1px solid var(--skBorderColor,#ddd);border-radius:4px;overflow:hidden}.spicyAccordionItem{border-bottom:1px solid var(--skBorderColor,#ddd)}.spicyAccordionItem:last-child{border-bottom:none}.spicyAccordionHeader{background-color:var(--skBgSecondaryColor,#f5f5f5);color:var(--skTextColor,#333);text-align:left;cursor:pointer;border:none;justify-content:space-between;align-items:center;width:100%;padding:10px;transition:background-color .2s;display:flex}.spicyAccordionHeader.open{background-color:var(--skBgColor,#e0e0e0)}.spicyAccordionHeader.open .accordionArrow{transform:rotate(180deg)}.spicyAccordionContent{background-color:var(--skBgColor,#fff);color:var(--skTextColor,#333);padding:10px}.accordionToggle{align-items:center;transition:transform .2s;display:flex}.accordionArrow{width:20px;height:20px;transition:transform .2s}.spicyAccordion.disabled,.spicyAccordionHeader:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.accordion-slide-enter-active,.accordion-slide-leave-active{transition:max-height .2s,opacity .2s;overflow:hidden}.accordion-slide-enter-from,.accordion-slide-leave-to{opacity:0;max-height:0}.accordion-slide-enter-to,.accordion-slide-leave-from{opacity:1;max-height:500px}.spicyAlert{align-items:center;gap:10px;padding:12px;display:flex}.spicyAlert.info{color:#333;background-color:#e0e0e0}.spicyAlert.success{color:#155724;background-color:#a3ffb7}.spicyAlert.warning{color:#856404;background-color:#ffecaf}.spicyAlert.error{color:#911f2a;background-color:#ffbdc2}.spicyAlert.custom{background-color:var(--skBgSecondaryColor,#424344);color:var(--skTextColor,#ddd)}.spicyAlert.spicyAlertRound{border-radius:8px}.spicyAlertIcon{width:24px;height:24px}.spicyAlertContainer{flex-direction:column;display:flex}.spicyAlertCloseBtn{cursor:pointer;background:0 0;border:none;width:20px;height:20px;margin-left:auto}.spicyAlertCloseBtn svg{width:20px;height:20px}.spicyBadge{white-space:nowrap;-webkit-user-select:none;user-select:none;border:1px solid #0000;border-radius:9999px;align-items:center;gap:6px;font-weight:600;line-height:1;display:inline-flex}.spicyBadge.sm{padding:2px 8px;font-size:11px}.spicyBadge.md{padding:4px 10px;font-size:13px}.spicyBadge.lg{padding:6px 14px;font-size:15px}.spicyBadge.solid{background-color:var(--skPrimaryColor,#811faf);color:#fff}.spicyBadge.outlined{border-color:var(--skPrimaryColor,#811faf);color:var(--skPrimaryColor,#811faf);background-color:#0000}.spicyBadge.soft{background-color:color-mix(in srgb, var(--skPrimaryColor,#811faf) 15%, transparent);color:var(--skPrimaryColor,#811faf)}.spicyBadge.dot{padding-left:8px}.spicyBadgeDot{background-color:var(--skPrimaryColor,#811faf);border-radius:50%;flex-shrink:0;width:8px;height:8px}.spicyBadgeRemove{cursor:pointer;color:inherit;opacity:.6;background:0 0;border:none;border-radius:50%;align-items:center;padding:0 2px;font-size:10px;display:inline-flex}.spicyBadgeRemove:hover{opacity:1}.spicyBtn{text-align:center;cursor:pointer;color:var(--skTextColor,#ddd);background-color:var(--skBgColor,#28292a);font-size:var(--skFontSize,16px);font-weight:var(--skFontWeight,500);-webkit-user-select:none;user-select:none;border:none;border-radius:4px;justify-content:center;align-items:center;gap:4px;padding:8px 16px;display:flex}.spicyBtn.outlined{border:2px solid var(--skBorderColor,#515353);background-color:#0000}.spicyBtn.disabled{opacity:.3;cursor:not-allowed;pointer-events:none}.spicyBtn:hover:not(.disabled){background-color:var(--hoverColor,grey)}.spicyBtn:focus-visible{outline:2px solid var(--skTextColor,#ddd);outline-offset:2px}.spicyBtn.isRound{border-radius:50px;padding:12px}.spicyBtn.lg{font-size:calc(var(--skFontSize,16px) * 1.2);padding:12px 24px}.spicyBtn.lg.isRound{padding:16px}.spicyBtn.lg .spicyBtnIcon{width:32px;height:32px}.spicyBtn.sm{font-size:calc(var(--skFontSize,16px) * .85);padding:4px 12px}.spicyBtn.sm.isRound{padding:8px}.spicyBtn.sm .spicyBtnIcon{width:18px;height:18px}.spicyBtn .spicyBtnIcon{justify-content:center;align-items:center;width:22px;height:22px;display:flex}.spicyCarouselWrapper{width:var(--width,580px);max-width:100%;height:var(--height,360px);justify-content:center;align-items:center;padding:30px;display:flex;position:relative}.spicyCarouselWrapper .spicyCarouselTitle{width:var(--width,580px);color:#ccc;background-color:#0009;height:30px;font-size:18px;font-weight:700;position:absolute;top:0}.spicyCarouselWrapper .spicyCarouselContainer{border-radius:var(--borderRadius);background-color:#0009;width:100%;height:100%;position:relative;overflow:hidden}.spicyCarouselWrapper .spicyCarouselSlide{background-position:50%;background-repeat:no-repeat;background-size:cover;width:100%;height:100%;transition:opacity .3s;position:absolute;top:0;left:0}.spicyCarouselWrapper .spicyCarouselTextOverlay{color:#ccc;text-shadow:2px 2px 4px #00000080;background-color:#000000bf;border-radius:4px;padding:10px;font-size:18px;font-weight:700;position:absolute;bottom:10px;left:10px}.spicyCarouselWrapper .spicyCarouselTextOverlay.fullScreen{text-align:center;background-color:#0000004d;justify-content:center;align-items:center;display:flex;inset:0}.spicyCarouselWrapper .spicyCarouselNavControls{pointer-events:none;justify-content:space-between;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselPrevBtn,.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselNextBtn{color:#ccc;cursor:pointer;pointer-events:auto;z-index:2;background:#0009;border:none;justify-content:center;align-items:center;width:30px;height:100%;font-size:24px;transition:transform .3s;display:flex}:is(.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselPrevBtn,.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselNextBtn):hover{background:var(--skPrimaryColor)}.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselPrevBtn{border-radius:6px 0 0 6px}.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselNextBtn{border-radius:0 6px 6px 0}.spicyCarouselWrapper .spicyCarouselPagination{height:30px;width:var(--width,580px);z-index:2;pointer-events:auto;background:#0009;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.spicyCarouselWrapper .spicyCarouselPagination .spicyCarouselPageBtn{color:#fff;cursor:pointer;background:#00b7ff80;border:none;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;transition:transform .3s;display:flex}.spicyCarouselWrapper .spicyCarouselPagination .spicyCarouselPageBtn.active{background:var(--activeColor,var(--skPrimaryColor))}.spicyCarouselWrapper .spicyCarouselPagination .spicyCarouselPageBtn:hover{background:var(--skPrimaryColor)}.spicyCarouselWrapper .pointCursor{cursor:pointer}.spicyCarouselWrapper .slide-enter-active,.spicyCarouselWrapper .slide-leave-active{transition:opacity .3s}.spicyCarouselWrapper .slide-enter-from,.spicyCarouselWrapper .slide-leave-to{opacity:0}.spicyProgress{background-color:#e0e0e0;border-radius:8px;width:100%;position:relative;overflow:hidden}.spicyProgressBar{transition:width .4s}.spicyProgressLabel{color:#fff;font-size:12px;position:absolute;top:0;right:10px}.spicyProgressCircular{justify-content:center;align-items:center;display:flex;position:relative}.spicyCircularSvg{background-color:#00000080;border-radius:50%;transform:rotate(-90deg)}.spicyCircularTrack{fill:none;stroke:#e0e0e0}.spicyCircularProgress{fill:none;transition:stroke-dashoffset .4s}.spicyCircularLabel{font-size:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.spicySelectWrapper{flex-direction:column;width:100%;display:flex;position:relative}.spicySelectWrapper.disabled{opacity:.5;pointer-events:none}.spicySelectWrapper.hasError .spicySelectTrigger{border-color:var(--skErrorColor,red)}.spicySelectWrapper.isOpen .spicySelectArrow{transform:rotate(180deg)}.spicySelectLabel{color:var(--skTextColor);margin-bottom:4px;font-size:14px}.spicySelectContainer{position:relative}.spicySelectTrigger{border:1px solid var(--skBorderColor,#515353);width:100%;color:var(--skTextColor);cursor:pointer;background-color:#0000;border-radius:4px;justify-content:space-between;align-items:center;padding:10px 12px;font-size:16px;transition:border-color .2s;display:flex}.spicySelectTrigger:focus{border-color:var(--skPrimaryColor,#811faf);outline:none}.spicySelectTrigger:disabled{cursor:not-allowed}.spicySelectTrigger.placeholder{color:var(--skTextColor,#969696);opacity:.6}.spicySelectValue{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.spicySelectArrow{flex-shrink:0;width:20px;height:20px;transition:transform .2s}.spicySelectDropdown{background-color:var(--skBgColor,#1a1a1a);border:1px solid var(--skBorderColor,#515353);z-index:1000;border-radius:4px;flex-direction:column;max-height:250px;display:flex;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow:hidden}.spicySelectSearch{border-bottom:1px solid var(--skBorderColor,#515353);padding:8px}.spicySelectSearchInput{border:1px solid var(--skBorderColor,#515353);width:100%;color:var(--skTextColor);background-color:#0000;border-radius:4px;outline:none;padding:6px 8px;font-size:14px}.spicySelectSearchInput:focus{border-color:var(--skPrimaryColor,#811faf)}.spicySelectOptions{max-height:200px;margin:0;padding:4px;list-style:none;overflow-y:auto}.spicySelectOption{cursor:pointer;color:var(--skTextColor);border-radius:4px;justify-content:space-between;align-items:center;padding:8px 10px;transition:background-color .15s;display:flex}.spicySelectOption.highlighted{background-color:color-mix(in srgb, var(--skPrimaryColor,#811faf) 15%, transparent)}.spicySelectOption.selected{color:var(--skPrimaryColor,#811faf);font-weight:600}.spicySelectCheck{flex-shrink:0;width:18px;height:18px}.spicySelectEmpty{text-align:center;color:var(--skTextColor,#969696);padding:12px;font-size:14px}.spicySelectError{color:var(--skErrorColor,red);margin-top:4px;font-size:12px}.spicySelect-slide-enter-active,.spicySelect-slide-leave-active{transition:opacity .15s,transform .15s}.spicySelect-slide-enter-from,.spicySelect-slide-leave-to{opacity:0;transform:translateY(-8px)}.spicyDataTable{background-color:var(--skBgColor);width:100%;color:var(--skTextColor);font-family:var(--skFontFamily);font-size:var(--skFontSize);flex-direction:column;display:flex;position:relative}.spicyDataTableContainer{border:1px solid var(--skBorderColor);border-radius:var(--skBorderRadius);overflow-x:auto}.spicyDataTableTable{border-collapse:collapse;table-layout:fixed;width:100%}.spicyDataTableHeader{background-color:var(--skBgSecondaryColor);z-index:10;position:sticky;top:0}.spicyDataTableHeaderCell{border-bottom:2px solid var(--skBorderColor);-webkit-user-select:none;user-select:none;white-space:nowrap;text-overflow:ellipsis;padding:12px 16px;font-weight:600;overflow:hidden}.spicyDataTableHeaderCell.sortable{cursor:pointer;transition:background-color .2s}.spicyDataTableHeaderCell.sortable:hover{background-color:var(--skHoverColor)}.headerText{margin-right:4px;display:inline-block}.sortIcon{opacity:.7;font-size:12px;display:inline-block}.spicyDataTableBody{background-color:var(--skBgColor)}.spicyDataTableRow{border-bottom:1px solid var(--skBorderColor);transition:background-color .2s}.spicyDataTableRow.clickable{cursor:pointer}.spicyDataTableRow:hover{background-color:var(--skHoverColor)}.spicyDataTableRow:nth-child(2n){background-color:rgba(var(--skBgSecondaryColor), .3)}.spicyDataTableRow:nth-child(2n):hover{background-color:var(--skHoverColor)}.spicyDataTableCell{white-space:nowrap;text-overflow:ellipsis;padding:12px 16px;overflow:hidden}.spicyDataTableCell.left{text-align:left}.spicyDataTableCell.center{text-align:center}.spicyDataTableCell.right{text-align:right}.spicyDataTableLoading{background-color:rgba(var(--skBgColor), .8);z-index:20;border-radius:var(--skBorderRadius);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.spicyDataTablePagination{border:1px solid var(--skBorderColor);border-radius:0 0 var(--skBorderRadius) var(--skBorderRadius);background-color:var(--skBgSecondaryColor);border-top:none;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.paginationInfo{color:var(--skTextColor);font-size:14px}.paginationControls{gap:8px;display:flex}.paginationPerPage{align-items:center;display:flex}@media (width<=768px){.spicyDataTablePagination{flex-direction:column;align-items:stretch}.paginationInfo{text-align:center}.paginationControls,.paginationPerPage{justify-content:center}.spicyDataTableHeaderCell,.spicyDataTableCell{padding:8px 12px;font-size:14px}}@media (width<=480px){.spicyDataTableHeaderCell,.spicyDataTableCell{padding:6px 8px;font-size:12px}.paginationInfo{font-size:12px}}.spicyDialogOverlay{z-index:2000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.spicyDialog{border-radius:8px;width:100%;padding:16px}.dialog-fade-enter-active,.dialog-fade-leave-active{transition:opacity .3s}.dialog-fade-enter-from,.dialog-fade-leave-to{opacity:0}.spicyDropdown{display:inline-block;position:relative}.spicyDropdownButton{background-color:var(--skBgColor);color:#fff;cursor:pointer;border:none;align-items:center;padding:10px 16px;font-size:16px;display:flex}.spicyDropdownButton .arrow{margin-left:8px;transition:transform .3s}.spicyDropdownButton .arrow.open{transform:rotate(180deg)}.dropdownIcon{margin-right:8px}.spicyDropdownMenu{z-index:1;background-color:#fff;border-radius:4px;padding:10px;position:absolute;box-shadow:0 4px 8px #0000001a}.spicyFileInputWrapper{cursor:pointer;border-width:2px;border-radius:8px;flex-direction:column;max-width:100%;display:flex;position:relative}.spicyFileInputWrapper.isDragging{border-color:var(--skPrimaryColor);background-color:#0000000d}.spicyFileInputWrapper.disabled{pointer-events:none;opacity:.3;cursor:not-allowed}.spicyFileInputWrapper.hasError{border-color:var(--skErrorColor,red)}.spicyFileInputWrapper.solid{border-style:solid}.spicyFileInputWrapper.dashed{border-style:dashed}.spicyFileInputWrapper.plain{border-style:none}.spicyFileInputLabel{color:var(--skTextColor,#ddd);-webkit-user-select:none;user-select:none;cursor:pointer;margin:8px;padding:8px;font-size:16px}.spicyFileInput{display:none}.spicyFilePreviewItem{color:var(--skTextColor);border:1px solid var(--skBorderColor);border-radius:4px;justify-content:space-between;align-items:center;margin:8px;padding:8px;display:flex;position:relative}.spicyFilePreviewItem:hover{border-color:var(--skPrimaryColor)}.spicyFilePreviewItem span{white-space:nowrap;text-overflow:ellipsis;max-width:90%;overflow:hidden}.removeButton{cursor:pointer;color:var(--skErrorColor,red);background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:14px;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.removeButton:hover{color:var(--skErrorColor,red);opacity:.7}.removeButtonMDI{cursor:pointer;color:var(--skErrorColor,red);background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:2px;display:flex;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.removeButtonMDI svg{width:20px;height:20px}.removeButtonMDI:hover{opacity:.7}.clearAllButton{cursor:pointer;color:var(--skPrimaryColor);background:0 0;border:none;margin-top:8px;font-size:16px}.spicyFileInputError{color:var(--skErrorColor,red);margin-top:8px;font-size:12px}.spicyModalOverlay{z-index:1000;background-color:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.spicyModal{border-radius:var(--skBorderRadius);background-color:var(--skBgColor);z-index:1001;padding:20px;font-size:15px;transition:transform .3s ease-out;box-shadow:0 0 6px 2px #0003}.spicyModalHeader{text-align:center;font-size:20px;font-weight:700}.spicyModalActions{text-align:right;margin-top:20px}.spicyModalActionBtn{color:var(--skTextColor,#ddd);cursor:pointer;background-color:#0000;border:none}.spicyModalActionBtn:hover{text-decoration:underline}.spicySheet.isRound{border-radius:8px}.spicySheet.flex{gap:var(--sheet-gap,0);flex-direction:column;display:flex}.spicySheet.elevation-1{box-shadow:0 2px 4px #00000026}.spicySheet.elevation-2{box-shadow:0 4px 8px #0003}.spicySheet.elevation-3{box-shadow:0 8px 16px #00000040}.spicySkeleton{background-color:var(--skSkeletonColor,var(--skBgSecondaryColor,#e0e0e0));display:block;position:relative;overflow:hidden}.spicySkeleton.text{border-radius:2px;height:1em;margin:4px 0;line-height:1}.spicySkeleton.rect{border-radius:4px}.spicySkeleton.circle{border-radius:50%}.spicySkeleton.rounded{border-radius:8px}.spicySkeleton:after{content:"";background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--skSkeletonColor,var(--skBgSecondaryColor,#e0e0e0)) 50%, transparent), transparent);animation:1.5s infinite skeleton-shimmer;position:absolute;inset:0}@keyframes skeleton-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.spicySlider{flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex}.spicySliderLabel{margin-bottom:5px;font-size:16px}.spicySliderInput{width:100%}.hidden{border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.spicyTabs{width:inherit;background-color:var(--skBgColor);flex-direction:column;display:flex;position:relative}.spicyTabsHeader{background-color:var(--skBgSecondaryColor);justify-content:space-between;align-items:center;display:flex;position:relative}.spicyOverflowButton{cursor:pointer;color:var(--skTextColor);background:0 0;background-color:var(--skBgColor);border:none;flex-shrink:0;height:100%;padding:0 10px;font-size:18px;transition:color .25s;top:0}.spicyOverflowButton.left{left:0}.spicyOverflowButton.right{right:0}.tabsWrapper{white-space:nowrap;scrollbar-width:none;-ms-overflow-style:none;flex:1;display:flex;overflow-x:auto}.tabsWrapper::-webkit-scrollbar{display:none}.spicyTabButton{cursor:pointer;color:var(--skTextColor);background:0 0;border:none;flex-shrink:0;padding:10px;font-size:16px;transition:color .25s}.spicyTabButton.active{color:var(--skPrimaryColor);font-weight:700}.spicyTabsContent{flex-direction:column;display:flex}.fade-enter-active,.fade-leave-active{transition:opacity .2s}.fade-enter-from,.fade-leave-to{opacity:0}.spicyTextArea{box-sizing:border-box;outline:none;width:100%;transition:border-color .2s}.spicyTextArea::placeholder{color:var(--skTextColor,#969696)}.spicyTextArea:focus{border-color:var(--spicyFocusColor,var(--skPrimaryColor,#811faf))}.spicyTextArea.isDisabled,.spicyTextArea:disabled{opacity:.5;cursor:not-allowed}.spicyTextArea.isDisabled::placeholder,.spicyTextArea:disabled::placeholder{color:#969696}.spicyInputWrapper{flex-direction:column;justify-content:center;width:100%;display:flex;position:relative}.spicyInputWrapper .spicyInput:focus{border-color:var(--skPrimaryColor);outline:none}.spicyInputLabel{z-index:1;color:var(--skTextColor);pointer-events:none;transition:top .25s,transform .25s,font-size .25s,color .25s;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.spicyInputWrapper:not(.hasValue):not(.hasFocus) .spicyInputLabel{white-space:nowrap;text-overflow:ellipsis;bottom:-4px;left:6px;right:14px;overflow:hidden}.spicyInputContainer{align-items:center;width:100%;display:flex;position:relative}.spicyInputPrefix{color:var(--skTextColor);pointer-events:none}.spicyInput{border:none;border-bottom:1px solid var(--skBorderColor,#515353);box-sizing:border-box;width:100%;color:var(--skTextColor);background-color:#0000;flex:1;padding:10px;font-size:16px;transition:border-color .25s}.spicyInput[type=number]::-webkit-inner-spin-button{opacity:.5;background-color:var(--skBgSecondaryColor,transparent);cursor:pointer;border-radius:3px;width:16px;height:24px}.spicyInput[type=number]::-webkit-outer-spin-button{opacity:.5;background-color:var(--skBgSecondaryColor,transparent);cursor:pointer;border-radius:3px;width:16px;height:24px}.spicyInput[type=number]:hover::-webkit-inner-spin-button{opacity:1}.spicyInput[type=number]:hover::-webkit-outer-spin-button{opacity:1}.clearButton{cursor:pointer;color:var(--skTextColor,#969696);background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:14px}.clearButton:hover{color:var(--skErrorColor,red)}.outlined .spicyInput{border:1px solid var(--skBorderColor,#515353);border-radius:4px}.filled .spicyInput{border:none;border-bottom:1px solid var(--skBorderColor,#515353)}.text .spicyInput{border:none}.hasValue .spicyInputLabel,.hasFocus .spicyInputLabel,.hasPlaceholder .spicyInputLabel{color:var(--skPrimaryColor);font-size:16px;font-weight:700;top:-20px;transform:translateY(0)}.hasError .spicyInput{border-color:var(--skErrorColor,red)}.spicyInputError{color:var(--skErrorColor,red);font-size:12px}.spicyInputWrapper:not(.hasValue):not(.hasFocus):not(.hasPlaceholder) .spicyInput::placeholder{color:#0000}.isDisabled .spicyInput{opacity:.5;cursor:not-allowed}.isDisabled .spicyInputLabel{opacity:.5}.spicyToggleLabel{flex-direction:column;align-items:center;gap:4px;font-size:14px;display:inline-flex}.spicyToggleLabel.disabled .spicyToggle{cursor:not-allowed;opacity:.3}.spicyToggle{background-color:var(--skBgSecondaryColor,#424344);cursor:pointer;border-radius:30px;outline:none;align-items:center;width:50px;height:24px;padding:2px;transition:background-color .2s;display:inline-flex}.spicyToggle.isActive{background-color:var(--activeColor,var(--skPrimaryColor))}.spicyToggle.isActive .spicyToggleKnob{transform:translate(30px)}.spicyToggle.outlined{border:2px solid var(--skBorderColor,#515353);background-color:#0000}.spicyToggle.outlined.isActive{background-color:var(--activeColor,var(--skPrimaryColor));border-color:var(--activeColor,var(--skPrimaryColor))}.spicyToggle:focus{box-shadow:0 0 0 2px #0003}.spicyToggle.disabled{pointer-events:none}.spicyToggle:not(.isActive):hover{background-color:var(--hoverColor,#555)}.spicyToggleKnob{background-color:#fff;border-radius:50%;width:20px;height:20px;transition:transform .2s;box-shadow:0 2px 4px #0003}.spicyToastContainer{z-index:9999;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed}.spicyToastContainer.top-right{top:16px;right:16px}.spicyToastContainer.top-left{top:16px;left:16px}.spicyToastContainer.bottom-right{bottom:16px;right:16px}.spicyToastContainer.bottom-left{bottom:16px;left:16px}.spicyToastContainer.top-center{top:16px;left:50%;transform:translate(-50%)}.spicyToastContainer.bottom-center{bottom:16px;left:50%;transform:translate(-50%)}.spicyToast{color:#fff;pointer-events:auto;border-radius:8px;justify-content:space-between;align-items:center;gap:12px;min-width:280px;max-width:400px;padding:12px 16px;font-size:14px;display:flex;box-shadow:0 4px 12px #0000004d}.spicyToast.info{background-color:var(--skPrimaryColor,#811faf)}.spicyToast.success{background-color:#2e7d32}.spicyToast.warning{background-color:#f57c00}.spicyToast.error{background-color:var(--skErrorColor,#d32f2f)}.spicyToastMessage{flex:1;line-height:1.4}.spicyToastClose{cursor:pointer;color:#ffffffb3;background:0 0;border:none;border-radius:4px;flex-shrink:0;padding:2px 4px;font-size:12px}.spicyToastClose:hover{color:#fff}.spicyToast-enter-active,.spicyToast-leave-active{transition:all .3s}.spicyToast-enter-from{opacity:0;transform:translate(100%)}.spicyToast-leave-to{opacity:0;transform:scale(.9)}.spicyTooltip{z-index:9999;background-color:var(--tooltipBgColor,var(--skBgColor));color:var(--tooltipTextColor,var(--skTextColor));border:1px solid var(--skBorderColor);border-radius:4px;justify-content:center;align-items:center;padding:8px;font-size:15px;display:flex}.spicyTooltipIcon{font-size:18px}.spicyTooltip-enter-active,.spicyTooltip-leave-active{transition:opacity .15s,transform .15s}.spicyTooltip-enter-from,.spicyTooltip-leave-to{opacity:0;transform:scale(.95)}.spicyTree ul{margin:0;padding-left:20px;list-style-type:none}.spicyTree li{margin:5px 0;position:relative}.spicyTreeNode{cursor:pointer;transition:background-color .3s}.spicyTreeNode:focus-within{outline:2px solid #007bff}.spicyTreeNodeIcon{width:24px;height:24px;margin-right:8px}.spicyToggleIcon{margin-left:10px;font-size:14px}.spicyTreeNodeItem{margin-left:16px;list-style:none}
|
|
1
|
+
:root{--skBgColor:#28292a;--skBgSecondaryColor:#424344;--skBorderColor:#515353;--skPrimaryColor:#811faf;--skSecondaryColor:#0066b3;--skAccentColor:#004a77;--skHoverColor:#656769;--skTextColor:#ddd;--skFontFamily:"Helvetica Neue", Helvetica, Arial, sans-serif;--skFontSize:1rem;--skFontWeight:500;--skBorderRadius:4px}.spicyText{color:var(--skTextColor);font-family:var(--skFontFamily);font-size:var(--skFontSize)}.spicyHeader{color:var(--skTextColor);font-family:var(--skFontFamily);font-size:24px;font-weight:700}.spicyLink:hover{color:var(--skHoverColor)}.spicyLink:active,.spicyLink:focus{color:var(--skPrimaryColor)}.spicyLink:disabled{opacity:.3}.spicyRipple{pointer-events:none;z-index:1;background:currentColor;border-radius:50%;animation:.6s linear spicy-ripple-animation;position:absolute;transform:scale(0)}@keyframes spicy-ripple-animation{to{opacity:0;transform:scale(4)}}.spicyAccordion{border:1px solid var(--skBorderColor,#ddd);border-radius:4px;overflow:hidden}.spicyAccordionItem{border-bottom:1px solid var(--skBorderColor,#ddd)}.spicyAccordionItem:last-child{border-bottom:none}.spicyAccordionHeader{background-color:var(--skBgSecondaryColor,#f5f5f5);color:var(--skTextColor,#333);text-align:left;cursor:pointer;border:none;justify-content:space-between;align-items:center;width:100%;padding:10px;transition:background-color .2s;display:flex}.spicyAccordionHeader.open{background-color:var(--skBgColor,#e0e0e0)}.spicyAccordionHeader.open .accordionArrow{transform:rotate(180deg)}.spicyAccordionContent{background-color:var(--skBgColor,#fff);color:var(--skTextColor,#333);padding:10px}.accordionToggle{align-items:center;transition:transform .2s;display:flex}.accordionArrow{width:20px;height:20px;transition:transform .2s}.spicyAccordion.disabled,.spicyAccordionHeader:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.accordion-slide-enter-active,.accordion-slide-leave-active{transition:max-height .2s,opacity .2s;overflow:hidden}.accordion-slide-enter-from,.accordion-slide-leave-to{opacity:0;max-height:0}.accordion-slide-enter-to,.accordion-slide-leave-from{opacity:1;max-height:500px}.spicyAlert{align-items:center;gap:10px;padding:12px;display:flex}.spicyAlert.info{color:#333;background-color:#e0e0e0}.spicyAlert.success{color:#155724;background-color:#a3ffb7}.spicyAlert.warning{color:#856404;background-color:#ffecaf}.spicyAlert.error{color:#911f2a;background-color:#ffbdc2}.spicyAlert.custom{background-color:var(--skBgSecondaryColor,#424344);color:var(--skTextColor,#ddd)}.spicyAlert.spicyAlertRound{border-radius:8px}.spicyAlertIcon{width:24px;height:24px}.spicyAlertContainer{flex-direction:column;display:flex}.spicyAlertCloseBtn{cursor:pointer;background:0 0;border:none;width:20px;height:20px;margin-left:auto}.spicyAlertCloseBtn svg{width:20px;height:20px}.spicyBadge{white-space:nowrap;-webkit-user-select:none;user-select:none;border:1px solid #0000;border-radius:9999px;align-items:center;gap:6px;font-weight:600;line-height:1;display:inline-flex}.spicyBadge.sm{padding:2px 8px;font-size:11px}.spicyBadge.md{padding:4px 10px;font-size:13px}.spicyBadge.lg{padding:6px 14px;font-size:15px}.spicyBadge.solid{background-color:var(--skPrimaryColor,#811faf);color:#fff}.spicyBadge.outlined{border-color:var(--skPrimaryColor,#811faf);color:var(--skPrimaryColor,#811faf);background-color:#0000}.spicyBadge.soft{background-color:color-mix(in srgb, var(--skPrimaryColor,#811faf) 15%, transparent);color:var(--skPrimaryColor,#811faf)}.spicyBadge.dot{padding-left:8px}.spicyBadgeDot{background-color:var(--skPrimaryColor,#811faf);border-radius:50%;flex-shrink:0;width:8px;height:8px}.spicyBadgeRemove{cursor:pointer;color:inherit;opacity:.6;background:0 0;border:none;border-radius:50%;align-items:center;padding:0 2px;font-size:10px;display:inline-flex}.spicyBadgeRemove:hover{opacity:1}.spicyBtn{text-align:center;cursor:pointer;color:var(--skTextColor,#ddd);background-color:var(--skBgColor,#28292a);font-size:var(--skFontSize,16px);font-weight:var(--skFontWeight,500);-webkit-user-select:none;user-select:none;border:none;border-radius:4px;justify-content:center;align-items:center;gap:4px;padding:8px 16px;display:flex}.spicyBtn.outlined{border:2px solid var(--skBorderColor,#515353);background-color:#0000}.spicyBtn.disabled{opacity:.3;cursor:not-allowed;pointer-events:none}.spicyBtn:hover:not(.disabled){background-color:var(--hoverColor,grey)}.spicyBtn:focus-visible{outline:2px solid var(--skTextColor,#ddd);outline-offset:2px}.spicyBtn.isRound{border-radius:50px;padding:12px}.spicyBtn.lg{font-size:calc(var(--skFontSize,16px) * 1.2);padding:12px 24px}.spicyBtn.lg.isRound{padding:16px}.spicyBtn.lg .spicyBtnIcon{width:32px;height:32px}.spicyBtn.sm{font-size:calc(var(--skFontSize,16px) * .85);padding:4px 12px}.spicyBtn.sm.isRound{padding:8px}.spicyBtn.sm .spicyBtnIcon{width:18px;height:18px}.spicyBtn .spicyBtnIcon{justify-content:center;align-items:center;width:22px;height:22px;display:flex}.spicyCarouselWrapper{width:var(--width,580px);max-width:100%;height:var(--height,360px);justify-content:center;align-items:center;padding:30px;display:flex;position:relative}.spicyCarouselWrapper .spicyCarouselTitle{width:var(--width,580px);color:#ccc;background-color:#0009;height:30px;font-size:18px;font-weight:700;position:absolute;top:0}.spicyCarouselWrapper .spicyCarouselContainer{border-radius:var(--borderRadius);background-color:#0009;width:100%;height:100%;position:relative;overflow:hidden}.spicyCarouselWrapper .spicyCarouselSlide{background-position:50%;background-repeat:no-repeat;background-size:cover;width:100%;height:100%;transition:opacity .3s;position:absolute;top:0;left:0}.spicyCarouselWrapper .spicyCarouselTextOverlay{color:#ccc;text-shadow:2px 2px 4px #00000080;background-color:#000000bf;border-radius:4px;padding:10px;font-size:18px;font-weight:700;position:absolute;bottom:10px;left:10px}.spicyCarouselWrapper .spicyCarouselTextOverlay.fullScreen{text-align:center;background-color:#0000004d;justify-content:center;align-items:center;display:flex;inset:0}.spicyCarouselWrapper .spicyCarouselNavControls{pointer-events:none;justify-content:space-between;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselPrevBtn,.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselNextBtn{color:#ccc;cursor:pointer;pointer-events:auto;z-index:2;background:#0009;border:none;justify-content:center;align-items:center;width:30px;height:100%;font-size:24px;transition:transform .3s;display:flex}:is(.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselPrevBtn,.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselNextBtn):hover{background:var(--skPrimaryColor)}.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselPrevBtn{border-radius:6px 0 0 6px}.spicyCarouselWrapper .spicyCarouselNavControls .spicyCarouselNextBtn{border-radius:0 6px 6px 0}.spicyCarouselWrapper .spicyCarouselPagination{height:30px;width:var(--width,580px);z-index:2;pointer-events:auto;background:#0009;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.spicyCarouselWrapper .spicyCarouselPagination .spicyCarouselPageBtn{color:#fff;cursor:pointer;background:#00b7ff80;border:none;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;transition:transform .3s;display:flex}.spicyCarouselWrapper .spicyCarouselPagination .spicyCarouselPageBtn.active{background:var(--activeColor,var(--skPrimaryColor))}.spicyCarouselWrapper .spicyCarouselPagination .spicyCarouselPageBtn:hover{background:var(--skPrimaryColor)}.spicyCarouselWrapper .pointCursor{cursor:pointer}.spicyCarouselWrapper .slide-enter-active,.spicyCarouselWrapper .slide-leave-active{transition:opacity .3s}.spicyCarouselWrapper .slide-enter-from,.spicyCarouselWrapper .slide-leave-to{opacity:0}.spicyProgress{background-color:#e0e0e0;border-radius:8px;width:100%;position:relative;overflow:hidden}.spicyProgressBar{transition:width .4s}.spicyProgressLabel{color:#fff;font-size:12px;position:absolute;top:0;right:10px}.spicyProgressCircular{justify-content:center;align-items:center;display:flex;position:relative}.spicyCircularSvg{background-color:#00000080;border-radius:50%;transform:rotate(-90deg)}.spicyCircularTrack{fill:none;stroke:#e0e0e0}.spicyCircularProgress{fill:none;transition:stroke-dashoffset .4s}.spicyCircularLabel{font-size:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.spicySelectWrapper{flex-direction:column;width:100%;display:flex;position:relative}.spicySelectWrapper.disabled{opacity:.5;pointer-events:none}.spicySelectWrapper.hasError .spicySelectTrigger{border-color:var(--skErrorColor,red)}.spicySelectWrapper.isOpen .spicySelectArrow{transform:rotate(180deg)}.spicySelectLabel{color:var(--skTextColor);margin-bottom:4px;font-size:14px}.spicySelectContainer{position:relative}.spicySelectTrigger{border:1px solid var(--skBorderColor,#515353);width:100%;color:var(--skTextColor);cursor:pointer;background-color:#0000;border-radius:4px;justify-content:space-between;align-items:center;padding:10px 12px;font-size:16px;transition:border-color .2s;display:flex}.spicySelectTrigger:focus{border-color:var(--skPrimaryColor,#811faf);outline:none}.spicySelectTrigger:disabled{cursor:not-allowed}.spicySelectTrigger.placeholder{color:var(--skTextColor,#969696);opacity:.6}.spicySelectValue{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.spicySelectArrow{flex-shrink:0;width:20px;height:20px;transition:transform .2s}.spicySelectDropdown{background-color:var(--skBgColor,#1a1a1a);border:1px solid var(--skBorderColor,#515353);z-index:1000;border-radius:4px;flex-direction:column;max-height:250px;display:flex;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow:hidden}.spicySelectSearch{border-bottom:1px solid var(--skBorderColor,#515353);padding:8px}.spicySelectSearchInput{border:1px solid var(--skBorderColor,#515353);width:100%;color:var(--skTextColor);background-color:#0000;border-radius:4px;outline:none;padding:6px 8px;font-size:14px}.spicySelectSearchInput:focus{border-color:var(--skPrimaryColor,#811faf)}.spicySelectOptions{max-height:200px;margin:0;padding:4px;list-style:none;overflow-y:auto}.spicySelectOption{cursor:pointer;color:var(--skTextColor);border-radius:4px;justify-content:space-between;align-items:center;padding:8px 10px;transition:background-color .15s;display:flex}.spicySelectOption.highlighted{background-color:color-mix(in srgb, var(--skPrimaryColor,#811faf) 15%, transparent)}.spicySelectOption.selected{color:var(--skPrimaryColor,#811faf);font-weight:600}.spicySelectCheck{flex-shrink:0;width:18px;height:18px}.spicySelectEmpty{text-align:center;color:var(--skTextColor,#969696);padding:12px;font-size:14px}.spicySelectError{color:var(--skErrorColor,red);margin-top:4px;font-size:12px}.spicySelect-slide-enter-active,.spicySelect-slide-leave-active{transition:opacity .15s,transform .15s}.spicySelect-slide-enter-from,.spicySelect-slide-leave-to{opacity:0;transform:translateY(-8px)}.spicyDataTable{background-color:var(--skBgColor);width:100%;color:var(--skTextColor);font-family:var(--skFontFamily);font-size:var(--skFontSize);flex-direction:column;display:flex;position:relative}.spicyDataTableContainer{border:1px solid var(--skBorderColor);border-radius:var(--skBorderRadius);overflow-x:auto}.spicyDataTableTable{border-collapse:collapse;table-layout:fixed;width:100%}.spicyDataTableHeader{background-color:var(--skBgSecondaryColor);z-index:10;position:sticky;top:0}.spicyDataTableHeaderCell{border-bottom:2px solid var(--skBorderColor);-webkit-user-select:none;user-select:none;white-space:nowrap;text-overflow:ellipsis;padding:12px 16px;font-weight:600;overflow:hidden}.spicyDataTableHeaderCell.sortable{cursor:pointer;transition:background-color .2s}.spicyDataTableHeaderCell.sortable:hover{background-color:var(--skHoverColor)}.headerText{margin-right:4px;display:inline-block}.sortIcon{opacity:.7;font-size:12px;display:inline-block}.spicyDataTableBody{background-color:var(--skBgColor)}.spicyDataTableRow{border-bottom:1px solid var(--skBorderColor);transition:background-color .2s}.spicyDataTableRow.clickable{cursor:pointer}.spicyDataTableRow:hover{background-color:var(--skHoverColor)}.spicyDataTableRow:nth-child(2n){background-color:rgba(var(--skBgSecondaryColor), .3)}.spicyDataTableRow:nth-child(2n):hover{background-color:var(--skHoverColor)}.spicyDataTableCell{white-space:nowrap;text-overflow:ellipsis;padding:12px 16px;overflow:hidden}.spicyDataTableCell.left{text-align:left}.spicyDataTableCell.center{text-align:center}.spicyDataTableCell.right{text-align:right}.spicyDataTableLoading{background-color:rgba(var(--skBgColor), .8);z-index:20;border-radius:var(--skBorderRadius);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.spicyDataTablePagination{border:1px solid var(--skBorderColor);border-radius:0 0 var(--skBorderRadius) var(--skBorderRadius);background-color:var(--skBgSecondaryColor);border-top:none;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.paginationInfo{color:var(--skTextColor);font-size:14px}.paginationControls{gap:8px;display:flex}.paginationPerPage{align-items:center;display:flex}@media (width<=768px){.spicyDataTablePagination{flex-direction:column;align-items:stretch}.paginationInfo{text-align:center}.paginationControls,.paginationPerPage{justify-content:center}.spicyDataTableHeaderCell,.spicyDataTableCell{padding:8px 12px;font-size:14px}}@media (width<=480px){.spicyDataTableHeaderCell,.spicyDataTableCell{padding:6px 8px;font-size:12px}.paginationInfo{font-size:12px}}.spicyDialogOverlay{z-index:2000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.spicyDialog{border-radius:8px;width:100%;padding:16px}.dialog-fade-enter-active,.dialog-fade-leave-active{transition:opacity .3s}.dialog-fade-enter-from,.dialog-fade-leave-to{opacity:0}.spicyDropdown{display:inline-block;position:relative}.spicyDropdownButton{background-color:var(--skBgColor);color:#fff;cursor:pointer;border:none;align-items:center;padding:10px 16px;font-size:16px;display:flex}.spicyDropdownButton .arrow{margin-left:8px;transition:transform .3s}.spicyDropdownButton .arrow.open{transform:rotate(180deg)}.dropdownIcon{margin-right:8px}.spicyDropdownMenu{z-index:1;background-color:#fff;border-radius:4px;padding:10px;position:absolute;box-shadow:0 4px 8px #0000001a}.spicyFileInputWrapper{cursor:pointer;border-width:2px;border-radius:8px;flex-direction:column;max-width:100%;display:flex;position:relative}.spicyFileInputWrapper.isDragging{border-color:var(--skPrimaryColor);background-color:#0000000d}.spicyFileInputWrapper.disabled{pointer-events:none;opacity:.3;cursor:not-allowed}.spicyFileInputWrapper.hasError{border-color:var(--skErrorColor,red)}.spicyFileInputWrapper.solid{border-style:solid}.spicyFileInputWrapper.dashed{border-style:dashed}.spicyFileInputWrapper.plain{border-style:none}.spicyFileInputLabel{color:var(--skTextColor,#ddd);-webkit-user-select:none;user-select:none;cursor:pointer;margin:8px;padding:8px;font-size:16px}.spicyFileInput{display:none}.spicyFilePreviewItem{color:var(--skTextColor);border:1px solid var(--skBorderColor);border-radius:4px;justify-content:space-between;align-items:center;margin:8px;padding:8px;display:flex;position:relative}.spicyFilePreviewItem:hover{border-color:var(--skPrimaryColor)}.spicyFilePreviewItem span{white-space:nowrap;text-overflow:ellipsis;max-width:90%;overflow:hidden}.removeButton{cursor:pointer;color:var(--skErrorColor,red);background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:14px;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.removeButton:hover{color:var(--skErrorColor,red);opacity:.7}.removeButtonMDI{cursor:pointer;color:var(--skErrorColor,red);background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:2px;display:flex;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.removeButtonMDI svg{width:20px;height:20px}.removeButtonMDI:hover{opacity:.7}.clearAllButton{cursor:pointer;color:var(--skPrimaryColor);background:0 0;border:none;margin-top:8px;font-size:16px}.spicyFileInputError{color:var(--skErrorColor,red);margin-top:8px;font-size:12px}.spicyModalOverlay{z-index:1000;background-color:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.spicyModal{border-radius:var(--skBorderRadius);background-color:var(--skBgColor);z-index:1001;padding:20px;font-size:15px;transition:transform .3s ease-out;box-shadow:0 0 6px 2px #0003}.spicyModalHeader{text-align:center;font-size:20px;font-weight:700}.spicyModalActions{text-align:right;margin-top:20px}.spicyModalActionBtn{color:var(--skTextColor,#ddd);cursor:pointer;background-color:#0000;border:none}.spicyModalActionBtn:hover{text-decoration:underline}.spicySheet.isRound{border-radius:8px}.spicySheet.flex{gap:var(--sheet-gap,0);flex-direction:column;display:flex}.spicySheet.elevation-1{box-shadow:0 2px 4px #00000026}.spicySheet.elevation-2{box-shadow:0 4px 8px #0003}.spicySheet.elevation-3{box-shadow:0 8px 16px #00000040}.spicySkeleton{background-color:var(--skSkeletonColor,var(--skBgSecondaryColor,#e0e0e0));display:block;position:relative;overflow:hidden}.spicySkeleton.text{border-radius:2px;height:1em;margin:4px 0;line-height:1}.spicySkeleton.rect{border-radius:4px}.spicySkeleton.circle{border-radius:50%}.spicySkeleton.rounded{border-radius:8px}.spicySkeleton:after{content:"";background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--skSkeletonColor,var(--skBgSecondaryColor,#e0e0e0)) 50%, transparent), transparent);animation:1.5s infinite skeleton-shimmer;position:absolute;inset:0}@keyframes skeleton-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.spicySlider{flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex}.spicySliderLabel{margin-bottom:5px;font-size:16px}.spicySliderInput{width:100%}.hidden{border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.spicyTabs{width:inherit;background-color:var(--skBgColor);flex-direction:column;display:flex;position:relative}.spicyTabsHeader{background-color:var(--skBgSecondaryColor);justify-content:space-between;align-items:center;display:flex;position:relative}.spicyOverflowButton{cursor:pointer;color:var(--skTextColor);background:0 0;background-color:var(--skBgColor);border:none;flex-shrink:0;height:100%;padding:0 10px;font-size:18px;transition:color .25s;top:0}.spicyOverflowButton.left{left:0}.spicyOverflowButton.right{right:0}.tabsWrapper{white-space:nowrap;scrollbar-width:none;-ms-overflow-style:none;flex:1;display:flex;overflow-x:auto}.tabsWrapper::-webkit-scrollbar{display:none}.spicyTabButton{cursor:pointer;color:var(--skTextColor);background:0 0;border:none;flex-shrink:0;padding:10px;font-size:16px;transition:color .25s}.spicyTabButton.active{color:var(--skPrimaryColor);font-weight:700}.spicyTabsContent{flex-direction:column;display:flex}.fade-enter-active,.fade-leave-active{transition:opacity .2s}.fade-enter-from,.fade-leave-to{opacity:0}.spicyTextArea{box-sizing:border-box;outline:none;width:100%;transition:border-color .2s}.spicyTextArea::placeholder{color:var(--skTextColor,#969696)}.spicyTextArea:focus{border-color:var(--spicyFocusColor,var(--skPrimaryColor,#811faf))}.spicyTextArea.isDisabled,.spicyTextArea:disabled{opacity:.5;cursor:not-allowed}.spicyTextArea.isDisabled::placeholder,.spicyTextArea:disabled::placeholder{color:#969696}.spicyInputWrapper{flex-direction:column;justify-content:center;width:100%;padding-top:22px;display:flex;position:relative}.spicyInputWrapper .spicyInput:focus{border-color:var(--skPrimaryColor);outline:none}.spicyInputLabel{z-index:1;color:var(--skTextColor);pointer-events:none;transition:top .25s,transform .25s,font-size .25s,color .25s;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.spicyInputWrapper:not(.hasValue):not(.hasFocus) .spicyInputLabel{white-space:nowrap;text-overflow:ellipsis;bottom:-4px;left:6px;right:14px;overflow:hidden}.spicyInputContainer{align-items:center;width:100%;display:flex;position:relative}.spicyInputPrefix{color:var(--skTextColor);pointer-events:none}.spicyInput{border:none;border-bottom:1px solid var(--skBorderColor,#515353);box-sizing:border-box;width:100%;color:var(--skTextColor);background-color:#0000;flex:1;padding:10px;font-size:16px;transition:border-color .25s}.spicyInput[type=number]::-webkit-inner-spin-button{opacity:.5;background-color:var(--skBgSecondaryColor,transparent);cursor:pointer;border-radius:3px;width:16px;height:24px}.spicyInput[type=number]::-webkit-outer-spin-button{opacity:.5;background-color:var(--skBgSecondaryColor,transparent);cursor:pointer;border-radius:3px;width:16px;height:24px}.spicyInput[type=number]:hover::-webkit-inner-spin-button{opacity:1}.spicyInput[type=number]:hover::-webkit-outer-spin-button{opacity:1}.clearButton{cursor:pointer;color:var(--skTextColor,#969696);background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:14px}.clearButton:hover{color:var(--skErrorColor,red)}.outlined .spicyInput{border:1px solid var(--skBorderColor,#515353);border-radius:4px}.filled .spicyInput{border:none;border-bottom:1px solid var(--skBorderColor,#515353)}.text .spicyInput{border:none}.hasValue .spicyInputLabel,.hasFocus .spicyInputLabel,.hasPlaceholder .spicyInputLabel{color:var(--skPrimaryColor);font-size:16px;font-weight:700;top:0;transform:translateY(0)}.hasError .spicyInput{border-color:var(--skErrorColor,red)}.spicyInputError{color:var(--skErrorColor,red);font-size:12px}.spicyInputWrapper:not(.hasValue):not(.hasFocus):not(.hasPlaceholder) .spicyInput::placeholder{color:#0000}.isDisabled .spicyInput{opacity:.5;cursor:not-allowed}.isDisabled .spicyInputLabel{opacity:.5}.spicyToggleLabel{flex-direction:column;align-items:center;gap:4px;font-size:14px;display:inline-flex}.spicyToggleLabel.disabled .spicyToggle{cursor:not-allowed;opacity:.3}.spicyToggle{background-color:var(--skBgSecondaryColor,#424344);cursor:pointer;border-radius:30px;outline:none;align-items:center;width:50px;height:24px;padding:2px;transition:background-color .2s;display:inline-flex}.spicyToggle.isActive{background-color:var(--activeColor,var(--skPrimaryColor))}.spicyToggle.isActive .spicyToggleKnob{transform:translate(30px)}.spicyToggle.outlined{border:2px solid var(--skBorderColor,#515353);background-color:#0000}.spicyToggle.outlined.isActive{background-color:var(--activeColor,var(--skPrimaryColor));border-color:var(--activeColor,var(--skPrimaryColor))}.spicyToggle:focus{box-shadow:0 0 0 2px #0003}.spicyToggle.disabled{pointer-events:none}.spicyToggle:not(.isActive):hover{background-color:var(--hoverColor,#555)}.spicyToggleKnob{background-color:#fff;border-radius:50%;width:20px;height:20px;transition:transform .2s;box-shadow:0 2px 4px #0003}.spicyToastContainer{z-index:9999;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed}.spicyToastContainer.top-right{top:16px;right:16px}.spicyToastContainer.top-left{top:16px;left:16px}.spicyToastContainer.bottom-right{bottom:16px;right:16px}.spicyToastContainer.bottom-left{bottom:16px;left:16px}.spicyToastContainer.top-center{top:16px;left:50%;transform:translate(-50%)}.spicyToastContainer.bottom-center{bottom:16px;left:50%;transform:translate(-50%)}.spicyToast{color:#fff;pointer-events:auto;border-radius:8px;justify-content:space-between;align-items:center;gap:12px;min-width:280px;max-width:400px;padding:12px 16px;font-size:14px;display:flex;box-shadow:0 4px 12px #0000004d}.spicyToast.info{background-color:var(--skPrimaryColor,#811faf)}.spicyToast.success{background-color:#2e7d32}.spicyToast.warning{background-color:#f57c00}.spicyToast.error{background-color:var(--skErrorColor,#d32f2f)}.spicyToastMessage{flex:1;line-height:1.4}.spicyToastClose{cursor:pointer;color:#ffffffb3;background:0 0;border:none;border-radius:4px;flex-shrink:0;padding:2px 4px;font-size:12px}.spicyToastClose:hover{color:#fff}.spicyToast-enter-active,.spicyToast-leave-active{transition:all .3s}.spicyToast-enter-from{opacity:0;transform:translate(100%)}.spicyToast-leave-to{opacity:0;transform:scale(.9)}.spicyTooltip{z-index:9999;background-color:var(--tooltipBgColor,var(--skBgColor));color:var(--tooltipTextColor,var(--skTextColor));border:1px solid var(--skBorderColor);border-radius:4px;justify-content:center;align-items:center;padding:8px;font-size:15px;display:flex}.spicyTooltipIcon{font-size:18px}.spicyTooltip-enter-active,.spicyTooltip-leave-active{transition:opacity .15s,transform .15s}.spicyTooltip-enter-from,.spicyTooltip-leave-to{opacity:0;transform:scale(.95)}.spicyTree ul{margin:0;padding-left:20px;list-style-type:none}.spicyTree li{margin:5px 0;position:relative}.spicyTreeNode{cursor:pointer;transition:background-color .3s}.spicyTreeNode:focus-within{outline:2px solid #007bff}.spicyTreeNodeIcon{width:24px;height:24px;margin-right:8px}.spicyToggleIcon{margin-left:10px;font-size:14px}.spicyTreeNodeItem{margin-left:16px;list-style:none}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.spicyInputWrapper{flex-direction:column;justify-content:center;width:100%;display:flex;position:relative}.spicyInputWrapper .spicyInput:focus{border-color:var(--skPrimaryColor);outline:none}.spicyInputLabel{z-index:1;color:var(--skTextColor);pointer-events:none;transition:top .25s,transform .25s,font-size .25s,color .25s;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.spicyInputWrapper:not(.hasValue):not(.hasFocus) .spicyInputLabel{white-space:nowrap;text-overflow:ellipsis;bottom:-4px;left:6px;right:14px;overflow:hidden}.spicyInputContainer{align-items:center;width:100%;display:flex;position:relative}.spicyInputPrefix{color:var(--skTextColor);pointer-events:none}.spicyInput{border:none;border-bottom:1px solid var(--skBorderColor,#515353);box-sizing:border-box;width:100%;color:var(--skTextColor);background-color:#0000;flex:1;padding:10px;font-size:16px;transition:border-color .25s}.spicyInput[type=number]::-webkit-inner-spin-button{opacity:.5;background-color:var(--skBgSecondaryColor,transparent);cursor:pointer;border-radius:3px;width:16px;height:24px}.spicyInput[type=number]::-webkit-outer-spin-button{opacity:.5;background-color:var(--skBgSecondaryColor,transparent);cursor:pointer;border-radius:3px;width:16px;height:24px}.spicyInput[type=number]:hover::-webkit-inner-spin-button{opacity:1}.spicyInput[type=number]:hover::-webkit-outer-spin-button{opacity:1}.clearButton{cursor:pointer;color:var(--skTextColor,#969696);background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:14px}.clearButton:hover{color:var(--skErrorColor,red)}.outlined .spicyInput{border:1px solid var(--skBorderColor,#515353);border-radius:4px}.filled .spicyInput{border:none;border-bottom:1px solid var(--skBorderColor,#515353)}.text .spicyInput{border:none}.hasValue .spicyInputLabel,.hasFocus .spicyInputLabel,.hasPlaceholder .spicyInputLabel{color:var(--skPrimaryColor);font-size:16px;font-weight:700;top
|
|
1
|
+
.spicyInputWrapper{flex-direction:column;justify-content:center;width:100%;padding-top:22px;display:flex;position:relative}.spicyInputWrapper .spicyInput:focus{border-color:var(--skPrimaryColor);outline:none}.spicyInputLabel{z-index:1;color:var(--skTextColor);pointer-events:none;transition:top .25s,transform .25s,font-size .25s,color .25s;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.spicyInputWrapper:not(.hasValue):not(.hasFocus) .spicyInputLabel{white-space:nowrap;text-overflow:ellipsis;bottom:-4px;left:6px;right:14px;overflow:hidden}.spicyInputContainer{align-items:center;width:100%;display:flex;position:relative}.spicyInputPrefix{color:var(--skTextColor);pointer-events:none}.spicyInput{border:none;border-bottom:1px solid var(--skBorderColor,#515353);box-sizing:border-box;width:100%;color:var(--skTextColor);background-color:#0000;flex:1;padding:10px;font-size:16px;transition:border-color .25s}.spicyInput[type=number]::-webkit-inner-spin-button{opacity:.5;background-color:var(--skBgSecondaryColor,transparent);cursor:pointer;border-radius:3px;width:16px;height:24px}.spicyInput[type=number]::-webkit-outer-spin-button{opacity:.5;background-color:var(--skBgSecondaryColor,transparent);cursor:pointer;border-radius:3px;width:16px;height:24px}.spicyInput[type=number]:hover::-webkit-inner-spin-button{opacity:1}.spicyInput[type=number]:hover::-webkit-outer-spin-button{opacity:1}.clearButton{cursor:pointer;color:var(--skTextColor,#969696);background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:14px}.clearButton:hover{color:var(--skErrorColor,red)}.outlined .spicyInput{border:1px solid var(--skBorderColor,#515353);border-radius:4px}.filled .spicyInput{border:none;border-bottom:1px solid var(--skBorderColor,#515353)}.text .spicyInput{border:none}.hasValue .spicyInputLabel,.hasFocus .spicyInputLabel,.hasPlaceholder .spicyInputLabel{color:var(--skPrimaryColor);font-size:16px;font-weight:700;top:0;transform:translateY(0)}.hasError .spicyInput{border-color:var(--skErrorColor,red)}.spicyInputError{color:var(--skErrorColor,red);font-size:12px}.spicyInputWrapper:not(.hasValue):not(.hasFocus):not(.hasPlaceholder) .spicyInput::placeholder{color:#0000}.isDisabled .spicyInput{opacity:.5;cursor:not-allowed}.isDisabled .spicyInputLabel{opacity:.5}
|
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Sato",
|
|
6
6
|
"private": false,
|
|
7
|
-
"version": "0.9.
|
|
7
|
+
"version": "0.9.6",
|
|
8
8
|
"main": "dist/spicykatsu.umd.js",
|
|
9
9
|
"module": "dist/index.js",
|
|
10
10
|
"types": "dist/types/index.d.ts",
|
|
@@ -156,7 +156,7 @@
|
|
|
156
156
|
"jsdom": "^29.1.1",
|
|
157
157
|
"prettier": "^3.9.4",
|
|
158
158
|
"typescript": "^6.0.3",
|
|
159
|
-
"vite": "^8.1.
|
|
159
|
+
"vite": "^8.1.3",
|
|
160
160
|
"vite-plugin-lib-inject-css": "^2.2.2",
|
|
161
161
|
"vitepress": "^1.6.4",
|
|
162
162
|
"vitest": "^4.1.9",
|