diff --git a/form.css b/form.css index 082b910..0b90698 100644 --- a/form.css +++ b/form.css @@ -1,3 +1,3 @@ -/*! style-forge.form v4.0.3 | MIT License | https://github.com/Style-Forge/form */ +/*! style-forge.form v4.0.4 | MIT License | https://github.com/Style-Forge/form */ :root{--sf-form-ff:system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';--sf-form-fz:0.95rem;--sf-form-fz-small:0.75rem;--sf-gap:0.5em;--sf-disabled:0.4;--sf-form-radius:0.5em;--sf-form-p-input-block:0.5em;--sf-form-p-input-inline:0.5em;--sf-form-switch-size:1rem;--sf-form-c-white:0 0% 100%;--sf-form-c-info:200 100% 60%;--sf-form-c-error:0 100% 60%;--sf-form-c-success:0 100% 60%;--sf-form-c-warning:39 100% 50%;--sf-form-c-bg:0 0% 100%;--sf-form-c-bd:0 0% 10%;--sf-form-c-loading:0 0% 10%;--sf-form-c-txt:0 0% 10%;--sf-form-dark-c-white:0 0% 100%;--sf-form-dark-c-info:219 79% 66%;--sf-form-dark-c-error:0 100% 65%;--sf-form-dark-c-success:0 100% 65%;--sf-form-dark-c-warning:39 100% 60%;--sf-form-dark-c-bg:0 0% 20%;--sf-form-dark-c-bd:0 0% 100%;--sf-form-dark-c-loading:0 0% 100%;--sf-form-dark-c-txt:0 0% 90%}:root:where([data-theme='dark'],.dark){color-scheme:dark;--sf-form-c-white:var(--sf-form-dark-c-white);--sf-form-c-bg:var(--sf-form-dark-c-bg);--sf-form-c-error:var(--sf-form-dark-c-error);--sf-form-c-success:var(--sf-form-dark-c-success);--sf-form-c-warning:var(--sf-form-dark-c-warning);--sf-form-c-info:var(--sf-form-dark-c-info);--sf-form-c-bd:var(--sf-form-dark-c-bd);--sf-form-c-loading:var(--sf-form-dark-c-loading);--sf-form-c-txt:var(--sf-form-dark-c-txt)}@media (prefers-color-scheme:dark){:root:where([data-theme='auto'],.auto){color-scheme:light dark;--sf-form-c-white:var(--sf-form-dark-c-white);--sf-form-c-bg:var(--sf-form-dark-c-bg);--sf-form-c-error:var(--sf-form-dark-c-error);--sf-form-c-success:var(--sf-form-dark-c-success);--sf-form-c-warning:var(--sf-form-dark-c-warning);--sf-form-c-info:var(--sf-form-dark-c-info);--sf-form-c-bd:var(--sf-form-dark-c-bd);--sf-form-c-loading:var(--sf-form-dark-c-loading);--sf-form-c-txt:var(--sf-form-dark-c-txt)}}input.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image']){box-sizing:border-box}input.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image']) *,input.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image']) *::before,input.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image']) *::after{box-sizing:inherit}input.sf-input:is([type='image'],[type='range']){cursor:pointer}input:is(.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image'],[type='range'])){cursor:text;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;touch-action:manipulation;font-size:var(--sf-form-fz);font-family:var(--sf-form-ff);font-weight:400;line-height:1;text-transform:none;color:hsl(var(--sf-form-c-txt));background:hsl(var(--sf-form-c-bg)/20%);border:1px solid;border-color:transparent transparent hsl(var(--sf-form-c-bd)/20%);border-radius:0;outline:none;width:100%;padding:var(--sf-form-p-input-block) var(--sf-form-p-input-inline);transition:border 0.1s ease-out}input.sf-input:is([type='time'],[type='week'],[type='month'],[type='date'],[type='datetime-local']){-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:start;height:37px}input.sf-input:is([type='time'],[type='week'],[type='month'],[type='date'],[type='datetime-local'])::-webkit-date-and-time-value{text-align:start}input.sf-input:focus-visible::-webkit-calendar-picker-indicator{cursor:pointer;outline:none}input:is(.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image'],[type='range']))::-moz-placeholder{color:hsl(var(--sf-form-c-txt)/40%)}input:is(.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image'],[type='range']))::placeholder{color:hsl(var(--sf-form-c-txt)/40%)}input:is(.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image'],[type='range'])):-moz-placeholder-shown{border-color:hsl(var(--sf-form-c-bd)/20%);border-radius:var(--sf-form-radius)}input:is(.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image'],[type='range'])):placeholder-shown{border-color:hsl(var(--sf-form-c-bd)/20%);border-radius:var(--sf-form-radius)}input:is(.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'],[type='image'],[type='range'])):focus{border-color:transparent transparent hsl(var(--sf-form-c-info));border-radius:0;outline:none}input.sf-input:is([type='color'],[type='image'],[type='range']):focus-visible{outline:2px solid hsl(var(--sf-form-c-info));outline-offset:2px;border-radius:var(--sf-form-radius)}input:is(.sf-input:not([type='radio'],[type='checkbox'],[type='color'],[type='file'])):disabled{cursor:not-allowed;-webkit-tap-highlight-color:transparent;opacity:var(--sf-disabled)}.sf-button:is(a,button,input[type='button'],input[type='submit'],input[type='reset']){box-sizing:border-box}.sf-button:is(a,button,input[type='button'],input[type='submit'],input[type='reset']) *,.sf-button:is(a,button,input[type='button'],input[type='submit'],input[type='reset']) *::before,.sf-button:is(a,button,input[type='button'],input[type='submit'],input[type='reset']) *::after{box-sizing:inherit}.sf-button:is(button,input[type='button'],input[type='submit'],input[type='reset']){-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;touch-action:manipulation}.sf-button:where(a,button,input[type='button'],input[type='submit'],input[type='reset']){cursor:pointer}.sf-button:is(a,button,input[type='button'],input[type='submit'],input[type='reset']),.sf-button:is(a,button,input[type='button'],input[type='submit'],input[type='reset']):hover{display:inline-block;font-size:var(--sf-form-fz);font-family:var(--sf-form-ff);font-weight:400;line-height:1;color:hsl(var(--sf-form-c-txt));background:hsl(var(--sf-form-c-bg)/20%);border:1px solid hsl(var(--sf-form-c-bd)/20%);text-align:center;text-decoration:none;text-transform:none;border-radius:var(--sf-form-radius);padding:var(--sf-form-p-input-block) var(--sf-form-p-input-inline)}a.sf-button:not([href]){cursor:not-allowed;text-decoration:none;opacity:var(--sf-disabled);-webkit-tap-highlight-color:transparent}a.sf-button:not([href]):hover{color:inherit}.sf-button:where(button,input[type='button'],input[type='submit'],input[type='reset']):disabled{cursor:not-allowed;-webkit-tap-highlight-color:transparent;opacity:var(--sf-disabled)}.sf-button:where(a,button,input[type='button'],input[type='submit'],input[type='reset']):focus-visible{outline:1px solid hsl(var(--sf-form-c-info));outline-offset:-1px}label.sf-radio,label.sf-checkbox{box-sizing:border-box}label.sf-radio *,label.sf-radio *::before,label.sf-radio *::after,label.sf-checkbox *,label.sf-checkbox *::before,label.sf-checkbox *::after{box-sizing:inherit}label.sf-radio,label.sf-checkbox{display:flex;flex-flow:wrap row;align-items:center;gap:var(--sf-gap);font-size:var(--sf-form-fz);font-family:var(--sf-form-ff);font-weight:400;line-height:1;text-transform:none}label.sf-radio input[type='radio'],label.sf-checkbox input[type='checkbox'],label.sf-radio input[type='radio']::before,label.sf-checkbox input[type='checkbox']::before{width:1em;height:1em}label.sf-radio input[type='radio']~*,label.sf-checkbox input[type='checkbox']~*{cursor:pointer}label.sf-radio input[type='radio'],label.sf-checkbox input[type='checkbox']{-webkit-appearance:none;-moz-appearance:none;appearance:none;touch-action:manipulation;position:relative;font-size:var(--sf-form-fz);font-family:var(--sf-form-ff);font-weight:400;line-height:1;border:0;background:none;padding:0;margin:0}label.sf-radio input[type='radio']::before,label.sf-checkbox input[type='checkbox']::before{top:0;left:0;position:absolute;width:1em;height:1em;content:'';background:hsl(var(--sf-form-c-bg)/20%);border:1px solid hsl(var(--sf-form-c-bd)/20%)}label.sf-radio input[type='radio']::after,label.sf-checkbox input[type='checkbox']::after{top:3px;left:3px;right:3px;bottom:3px;position:absolute;content:''}label.sf-radio input[type='radio']:checked::before,label.sf-checkbox input[type='checkbox']:checked::before{border-color:hsl(var(--sf-form-c-info))}label.sf-radio input[type='radio']:checked::after,label.sf-checkbox input[type='checkbox']:checked::after{background:hsl(var(--sf-form-c-info))}label.sf-radio input[type='radio']::before,label.sf-radio input[type='radio']::after{border-radius:50%}label.sf-radio input[type='radio']:disabled,label.sf-radio input[type='radio']:disabled~*,label.sf-checkbox input[type='checkbox']:disabled,label.sf-checkbox input[type='checkbox']:disabled~*{cursor:not-allowed;-webkit-tap-highlight-color:transparent;opacity:var(--sf-disabled)}.sf-radio input:focus-visible,.sf-checkbox input:focus-visible{border-color:transparent;outline:2px solid hsl(var(--sf-form-c-info));outline-offset:2px}.sf-radio input:focus-visible{border-radius:50%}select.sf-select{box-sizing:border-box}select.sf-select *,select.sf-select *::before,select.sf-select *::after{box-sizing:inherit}select.sf-select,select.sf-select option{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;touch-action:manipulation;font-size:var(--sf-form-fz);font-family:var(--sf-form-ff);font-weight:400;line-height:1;text-transform:none;padding:var(--sf-form-p-input-block) var(--sf-form-p-input-inline)}select.sf-select option{padding:calc(var(--sf-form-p-input-block) / 2) calc(var(--sf-form-p-input-inline) / 2)}select.sf-select optgroup{padding:calc(var(--sf-form-p-input-block) / 2) 0}select.sf-select{cursor:pointer;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;touch-action:manipulation;color:hsl(var(--sf-form-c-txt));background:hsl(var(--sf-form-c-bg)/20%);border:1px solid hsl(var(--sf-form-c-bd)/20%);width:100%;border-radius:var(--sf-form-radius);overflow:auto}select.sf-select:focus-visible{outline:1px solid hsl(var(--sf-form-c-info));outline-offset:-1px}select.sf-select:disabled{cursor:not-allowed;-webkit-tap-highlight-color:transparent;opacity:var(--sf-disabled)}textarea.sf-textarea{box-sizing:border-box}textarea.sf-textarea *,textarea.sf-textarea *::before,textarea.sf-textarea *::after{box-sizing:inherit}textarea.sf-textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;touch-action:manipulation;display:block;font-size:var(--sf-form-fz);font-family:var(--sf-form-ff);font-weight:400;line-height:1.499535;color:hsl(var(--sf-form-c-txt));background:hsl(var(--sf-form-c-bg)/20%);border:1px solid hsl(var(--sf-form-c-bd)/20%);width:100%;min-height:calc((1.499535em + 2px + var(--sf-form-p-input-block)) * 4);padding:var(--sf-form-p-input-block) var(--sf-form-p-input-inline);border-radius:var(--sf-form-radius);resize:vertical;overflow:auto}textarea.sf-textarea:disabled{cursor:not-allowed;-webkit-tap-highlight-color:transparent;resize:none;opacity:var(--sf-disabled)}textarea.sf-textarea:focus-visible{outline:1px solid hsl(var(--sf-form-c-info));outline-offset:-1px}input.sf-input[type='color']{box-sizing:border-box}input.sf-input[type='color'] *,input.sf-input[type='color'] *::before,input.sf-input[type='color'] *::after{box-sizing:inherit}input.sf-input[type='color']{cursor:pointer;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;touch-action:manipulation;--sf-form-color-size:2.125em;font-size:var(--sf-form-fz);font-family:var(--sf-form-ff);font-weight:400;line-height:1;width:var(--sf-form-color-size);height:var(--sf-form-color-size);padding:0;background:hsl(var(--sf-form-c-info));background:conic-gradient(from 0,yellow,darkorange,red,fuchsia,blue,cyan,lime,yellowgreen,yellow);border:0;border-radius:50%}input.sf-input[type='color']::-webkit-color-swatch-wrapper{padding:3px}input.sf-input[type='color']::-webkit-color-swatch{border:2px solid hsl(var(--sf-form-c-white));border-radius:50%}input.sf-input[type='color']::-moz-color-swatch{border:2px solid hsl(var(--sf-form-c-white));border-radius:50%}input.sf-input[type='color']:disabled{cursor:not-allowed;-webkit-tap-highlight-color:transparent;opacity:var(--sf-disabled)}input.sf-input[type='file']{box-sizing:border-box}input.sf-input[type='file'] *,input.sf-input[type='file'] *::before,input.sf-input[type='file'] *::after{box-sizing:inherit}input.sf-input[type='file']{cursor:pointer;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;touch-action:manipulation;display:inline-block;font-size:var(--sf-form-fz);font-family:var(--sf-form-ff);font-weight:400;line-height:1;padding:0;margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}input.sf-input[type='file']::file-selector-button{cursor:pointer;display:inline-block;text-transform:none;text-align:center;text-decoration:none;color:hsl(var(--sf-form-c-txt));background:hsl(var(--sf-form-c-bg)/20%);border:1px solid hsl(var(--sf-form-c-bd)/20%);padding:var(--sf-form-p-input-block) var(--sf-form-p-input-inline);border-radius:var(--sf-form-radius)}input.sf-input[type='file']:focus-visible{outline:none}input.sf-input[type='file']:focus-visible::file-selector-button{outline:1px solid hsl(var(--sf-form-c-info));outline-offset:-1px}input.sf-input[type='file']:disabled{opacity:var(--sf-disabled)}input.sf-input[type='file']:disabled,input.sf-input[type='file']:disabled::file-selector-button{cursor:not-allowed;-webkit-tap-highlight-color:transparent}.sf-switch{box-sizing:border-box}.sf-switch.multiple *,.sf-switch.multiple *::before,.sf-switch.multiple *::after{box-sizing:inherit}.sf-switch{display:flex;flex-flow:wrap row;align-items:center;gap:var(--sf-gap);font-size:var(--sf-form-fz);font-family:var(--sf-form-ff);font-weight:400;line-height:1;text-transform:none}label.sf-switch input[type='checkbox']{position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:none;padding:0;margin:0;width:calc(var(--sf-form-switch-size) * 2);height:var(--sf-form-switch-size);vertical-align:middle}label.sf-switch input[type='checkbox']::before{cursor:pointer;top:0;left:0;position:absolute;width:calc(var(--sf-form-switch-size) * 2);height:var(--sf-form-switch-size);content:'';background:hsl(var(--sf-form-c-bd)/20%);border-radius:calc(var(--sf-form-switch-size) / 2)}label.sf-switch input[type='checkbox']::after{cursor:pointer;top:2px;left:2px;position:absolute;width:calc(var(--sf-form-switch-size) - 2px * 2);height:calc(var(--sf-form-switch-size) - 2px * 2);content:'';background:hsl(var(--sf-form-c-white));border-radius:calc(var(--sf-form-switch-size) / 2);box-shadow:0 0 0 1px hsl(var(--sf-form-c-white));transition:transform 0.05s ease-in}label.sf-switch input[type='checkbox']:checked::before{background:hsl(var(--sf-form-c-info))}label.sf-switch input[type='checkbox']:checked::after{transform:translate3d(var(--sf-form-switch-size),0,0)}label.sf-switch input[type='radio']~*,label.sf-switch input[type='checkbox']~*{cursor:pointer}.sf-switch.multiple .sf-switch-toggle{display:flex;flex-flow:row;background:hsl(var(--sf-form-c-bg)/20%);box-shadow:1px 2px 8px 0 hsl(var(--sf-form-c-bd)/15%)}.sf-switch.multiple .sf-switch-toggle label{position:relative}.sf-switch.multiple .sf-switch-toggle span{display:block;font-size:var(--sf-form-fz-small);text-align:center;min-width:2rem;padding:calc(var(--sf-form-p-input-block) * 1.25) calc(var(--sf-form-p-input-inline) * 1.25);background:hsl(var(--sf-form-c-bd)/5%)}.sf-switch.multiple input:where([type='checkbox'],[type='radio']){cursor:pointer;top:0;left:0;right:0;bottom:0;position:absolute;z-index:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;padding:0;margin:0;border:0}.sf-switch.multiple input:where([type='checkbox'],[type='radio'])::before,.sf-switch.multiple input:where([type='checkbox'],[type='radio'])::after{content:none}.sf-switch.multiple input:where([type='checkbox'],[type='radio']):checked~span{color:hsl(var(--sf-form-c-white));background:hsl(var(--sf-form-c-info))}.sf-switch.multiple.vert .sf-switch-toggle{flex-flow:column}.sf-switch.multiple .sf-switch-description{font-size:var(--sf-form-fz-small);margin:0}.sf-switch input[type='checkbox']:disabled,.sf-switch input[type='checkbox']:disabled::after,.sf-switch input[type='checkbox']:disabled::before,.sf-switch input[type='checkbox']:disabled~*,.sf-switch.multiple input:where([type='checkbox'],[type='radio']):disabled,.sf-switch.multiple input:where([type='checkbox'],[type='radio']):disabled~*{cursor:not-allowed;-webkit-tap-highlight-color:transparent}.sf-switch input[type='checkbox']:disabled,.sf-switch input[type='checkbox']:disabled~*,.sf-switch.multiple input:where([type='checkbox'],[type='radio']):disabled~*{opacity:var(--sf-disabled)}.sf-switch input:where([type='checkbox'],[type='radio']):focus-visible{border-color:transparent;outline:2px solid hsl(var(--sf-form-c-info))}.sf-switch:not(.multiple) input:where([type='checkbox'],[type='radio']):focus-visible{border-radius:calc(var(--sf-form-switch-size) / 2)}@keyframes Loading{from{background-position:0 0}to{background-position:28px 0}}a.sf-loading.sf-button:not([href]),.sf-loading:disabled,.sf-loading:is(.sf-button,.sf-input:not([type='color'])):disabled{--c1:transparent;--c2:hsl(var(--sf-form-c-loading)/5%);background:hsl(var(--sf-form-c-info));background:repeating-linear-gradient(45deg,var(--c1),var(--c1) 10px,var(--c2) 10px,var(--c2) 20px);background-size:28px 100%;animation:Loading .3s linear infinite}:where(.sf-description,.sf-invalid,.sf-valid){display:none;color:hsl(var(--sf-form-c-txt)/40%);font-size:var(--sf-form-fz-small);font-family:var(--sf-form-ff);font-weight:400;line-height:1;text-transform:none;margin:0 0 var(--sf-gap)}.validates+:where(.sf-description,.sf-invalid,.sf-valid){margin:0 0 var(--sf-gap)}.sf-description{display:block}:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-description,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-valid+.sf-description,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-invalid+.sf-description,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-valid+.sf-invalid+.sf-description,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-invalid+.sf-valid+.sf-description,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-invalid,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-valid+.sf-invalid,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-description+.sf-invalid,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-valid+.sf-description+.sf-invalid,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-description+.sf-valid+.sf-invalid,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-valid,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-invalid+.sf-valid,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-description+.sf-valid,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-invalid+.sf-description+.sf-valid,:not(.d\:f,.d\:f\:x,.d\:f\:y,.d\:g,.d\:g\:x,.d\:g\:y)>:where(.validates,.error)+.sf-description+.sf-invalid+.sf-valid{margin:var(--sf-gap) 0}.sf-invalid{color:hsl(var(--sf-form-c-error))}.sf-valid:not(.sf-description){color:hsl(var(--sf-form-c-txt))}.show:is(.sf-description,.sf-invalid,.sf-valid){display:block}.hide:is(.sf-description,.sf-invalid,.sf-valid){display:none}.error:not(:disabled)+.sf-invalid,.error:not(:disabled)+.sf-valid+.sf-invalid,.error:not(:disabled)+.sf-description+.sf-invalid,.error:not(:disabled)+.sf-valid+.sf-description+.sf-invalid,.error:not(:disabled)+.sf-description+.sf-valid+.sf-invalid{display:block}.error+.sf-valid,.error+.sf-invalid+.sf-valid,.error+.sf-description+.sf-valid,.error+.sf-invalid+.sf-description+.sf-valid,.error+.sf-description+.sf-invalid+.sf-valid,.error+.sf-description,.error+.sf-valid+.sf-description,.error+.sf-invalid+.sf-description,.error+.sf-valid+.sf-invalid+.sf-description,.error+.sf-invalid+.sf-valid+.sf-description{display:none}.validates:where(:invalid:focus,:invalid:not(:-moz-placeholder-shown))+.sf-invalid, .validates:where(:invalid:focus,:invalid:not(:-moz-placeholder-shown))+.sf-valid+.sf-invalid, .validates:where(:invalid:focus,:invalid:not(:-moz-placeholder-shown))+.sf-description+.sf-invalid, .validates:where(:invalid:focus,:invalid:not(:-moz-placeholder-shown))+.sf-valid+.sf-description+.sf-invalid, .validates:where(:invalid:focus,:invalid:not(:-moz-placeholder-shown))+.sf-description+.sf-valid+.sf-invalid, .validates:where(:valid:focus,:valid:not(:-moz-placeholder-shown))+.sf-valid, .validates:where(:valid:focus,:valid:not(:-moz-placeholder-shown))+.sf-invalid+.sf-valid, .validates:where(:valid:focus,:valid:not(:-moz-placeholder-shown))+.sf-description+.sf-valid, .validates:where(:valid:focus,:valid:not(:-moz-placeholder-shown))+.sf-invalid+.sf-description+.sf-valid, .validates:where(:valid:focus,:valid:not(:-moz-placeholder-shown))+.sf-description+.sf-invalid+.sf-valid, .validates:where(:valid:focus,:valid:not(:-moz-placeholder-shown))+.sf-description.sf-valid, .validates:where(:valid:focus,:valid:not(:-moz-placeholder-shown))+.sf-invalid+.sf-description.sf-valid{display:block}.validates:where(:invalid:focus,:invalid:not(:placeholder-shown))+.sf-invalid,.validates:where(:invalid:focus,:invalid:not(:placeholder-shown))+.sf-valid+.sf-invalid,.validates:where(:invalid:focus,:invalid:not(:placeholder-shown))+.sf-description+.sf-invalid,.validates:where(:invalid:focus,:invalid:not(:placeholder-shown))+.sf-valid+.sf-description+.sf-invalid,.validates:where(:invalid:focus,:invalid:not(:placeholder-shown))+.sf-description+.sf-valid+.sf-invalid,.validates:where(:valid:focus,:valid:not(:placeholder-shown))+.sf-valid,.validates:where(:valid:focus,:valid:not(:placeholder-shown))+.sf-invalid+.sf-valid,.validates:where(:valid:focus,:valid:not(:placeholder-shown))+.sf-description+.sf-valid,.validates:where(:valid:focus,:valid:not(:placeholder-shown))+.sf-invalid+.sf-description+.sf-valid,.validates:where(:valid:focus,:valid:not(:placeholder-shown))+.sf-description+.sf-invalid+.sf-valid,.validates:where(:valid:focus,:valid:not(:placeholder-shown))+.sf-description.sf-valid,.validates:where(:valid:focus,:valid:not(:placeholder-shown))+.sf-invalid+.sf-description.sf-valid{display:block}.validates:where(:focus,:not(:-moz-placeholder-shown))+.sf-description, .validates:where(:focus,:not(:-moz-placeholder-shown))+.sf-invalid+.sf-description, .validates:where(:focus,:not(:-moz-placeholder-shown))+.sf-valid+.sf-description, .validates:where(:focus,:not(:-moz-placeholder-shown))+.sf-invalid+.sf-valid+.sf-description, .validates:where(:focus,:not(:-moz-placeholder-shown))+.sf-valid+.sf-invalid+.sf-description{display:none}.validates:where(:focus,:not(:placeholder-shown))+.sf-description,.validates:where(:focus,:not(:placeholder-shown))+.sf-invalid+.sf-description,.validates:where(:focus,:not(:placeholder-shown))+.sf-valid+.sf-description,.validates:where(:focus,:not(:placeholder-shown))+.sf-invalid+.sf-valid+.sf-description,.validates:where(:focus,:not(:placeholder-shown))+.sf-valid+.sf-invalid+.sf-description{display:none}.validates input[type='checkbox']~.sf-description{display:none}.validates input[type='checkbox']:invalid~.sf-invalid{display:block}.validates input[type='checkbox']:valid~.sf-valid{display:block}.validates:invalid:required:not(:focus,:disabled){border-color:hsl(var(--sf-form-c-warning))}.validates input:is([type='radio'],[type='checkbox']):invalid::before{border-color:hsl(var(--sf-form-c-error))}.error:not(:disabled),.validates:invalid:focus{border-color:hsl(var(--sf-form-c-error));outline:none}input.error.sf-input:is(:focus,:not(:disabled):not(:-moz-placeholder-shown)), input.validates.sf-input:invalid:is(:-moz-placeholder-shown:focus,:not(:-moz-placeholder-shown)){border-color:transparent transparent hsl(var(--sf-form-c-error))}input.error.sf-input:is(:focus,:not(:disabled):not(:placeholder-shown)),input.validates.sf-input:invalid:is(:placeholder-shown:focus,:not(:placeholder-shown)){border-color:transparent transparent hsl(var(--sf-form-c-error))}label.validates:is(.sf-switch,.sf-checkbox) :is(.sf-description,.sf-valid,.sf-invalid){width:100%;line-height:1}form.validates:invalid .sf-button[type='submit']{cursor:not-allowed;text-decoration:none;opacity:var(--sf-disabled);-webkit-text-fill-color:hsl(var(--sf-form-c-txt))} diff --git a/package.json b/package.json index 2c16727..9c37cf9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "style-forge.form", - "version": "4.0.3", + "version": "4.0.4", "description": "Style-Forge.Form: versatile library for easy form creation, validation, styling, and submission in web apps.", "type": "module", "main": "form.css",