@uqds/form 0.1.0-alpha.2 → 0.1.0-alpha.4
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/css/main.css +1 -1
- package/package.json +4 -4
- package/src/scss/_component.scss +22 -21
package/dist/css/main.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
form,fieldset,legend,label,input,select,textarea,.uq-error-summary,.uq-error-message,.uq-success-message,.uq-inline-help{box-sizing:border-box;font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}fieldset::before,fieldset::after,fieldset *,fieldset *::before,fieldset *::after,legend::before,legend::after,legend *,legend *::before,legend *::after,label::before,label::after,label *,label *::before,label *::after,input::before,input::after,input *,input *::before,input *::after,select::before,select::after,select *,select *::before,select *::after,textarea::before,textarea::after,textarea *,textarea *::before,textarea *::after{box-sizing:border-box}fieldset{border:0;padding:0;margin:0}label,legend{color:#3b383e;display:block;font-size:.875rem;font-weight:500}legend{margin-bottom:1rem;line-height:1.2;padding:0}legend.uq-legend--error{color:#d62929}legend .uq-legend__required{color:#d62929}label{cursor:pointer;line-height:1}label.uq-label--inline{align-items:center;display:inline-flex;font-size:1rem;line-height:1.5;margin-bottom:1.5rem}label.uq-label--inline input:not([type=checkbox]):not([type=radio]):not([type=submit]),label.uq-label--inline select,label.uq-label--inline textarea,label.uq-label--inline+input:not([type=checkbox]):not([type=radio]):not([type=submit]),label.uq-label--inline+select,label.uq-label--inline+textarea{max-width:none;min-width:200px;margin-left:1rem;margin-right:1.5rem;width:auto}label.uq-label--inline input:not([type=checkbox]):not([type=radio]):not([type=submit]),label.uq-label--inline select,label.uq-label--inline textarea{margin-top:0;margin-bottom:0}label.uq-label--disabled,label.uq-label--readonly{color:#d1d0d2}label.uq-label--disabled{cursor:not-allowed}label.uq-label--error{color:#d62929}label.uq-label--success{color:#4aa74e}label input:not([type=checkbox]):not([type=radio]),label select,label textarea,label+input:not([type=checkbox]):not([type=radio]),label+select,label+textarea{margin-top:.5rem}label input[type=radio]+*:not(input):not(select):not(textarea),label input[type=checkbox]+*:not(input):not(select):not(textarea){display:inline-block;font-size:1rem;font-weight:400;line-height:20px;margin-bottom:1rem;margin-left:.5rem;margin-right:1rem;padding-top:.25rem;padding-left:1.5rem;vertical-align:top}label input[type=radio][disabled]+*:not(input):not(select):not(textarea),label input[type=checkbox][disabled]+*:not(input):not(select):not(textarea){color:#d1d0d2}label .uq-label__required{color:#d62929}input[disabled],select[disabled],textarea[disabled]{cursor:not-allowed}input:not([type=checkbox]):not([type=radio]):not([type=submit]),select,textarea{background-color:#fff;max-width:100%;min-width:100%;padding:.75rem 1rem;border:1px solid #d1d0d2;border-radius:2px;font-size:1rem;color:#3b383e;line-height:1;margin-bottom:1.5rem}input:not([type=checkbox]):not([type=radio]):not([type=submit]):focus,select:focus,textarea:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd inset;outline:none}input:not([type=checkbox]):not([type=radio]):not([type=submit])[disabled],select[disabled],textarea[disabled]{color:#d1d0d2}input:not([type=checkbox]):not([type=radio]):not([type=submit])[readonly]:focus,select[readonly]:focus,textarea[readonly]:focus{border-color:#d1d0d2;box-shadow:0 0 0 1px #d1d0d2 inset}input:not([type=checkbox]):not([type=radio]):not([type=submit])::placeholder,select::placeholder,textarea::placeholder{color:#d1d0d2}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--error,input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--success,select.uq-input--error,select.uq-input--success,textarea.uq-input--error,textarea.uq-input--success{border-radius:2px}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--error:focus,input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--success:focus,select.uq-input--error:focus,select.uq-input--success:focus,textarea.uq-input--error:focus,textarea.uq-input--success:focus{border-color:#0d6dcd;box-shadow:0 2px 0 0 #0d6dcd,0 0 0 1px #0d6dcd inset}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--error,select.uq-input--error,textarea.uq-input--error{border-color:#d62929;box-shadow:0 2px 0 0 #d62929}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--success,select.uq-input--success,textarea.uq-input--success{border-color:#4aa74e;box-shadow:0 2px 0 0 #4aa74e}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--large,select.uq-input--large,textarea.uq-input--large{padding:1.15625rem 1.5rem;border-radius:.25rem}input:not([type=checkbox]):not([type=radio]):not([type=submit])+.uq-error-message,input:not([type=checkbox]):not([type=radio]):not([type=submit])+.uq-success-message,select+.uq-error-message,select+.uq-success-message,textarea+.uq-error-message,textarea+.uq-success-message{margin-top:-1.5rem;border-radius:0 0 2px 2px}select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m7 10 5 5 5-5' stroke='%2351247a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right .25rem center;padding-right:2.5rem;cursor:pointer;line-height:1.2;width:100%}select:focus{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m7 10 5 5 5-5' stroke='%230d6dcd' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e")}select[multiple]{height:auto;background-image:none}select[multiple]:focus{background-image:none}select[disabled]{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m7 10 5 5 5-5' stroke='%23a3a1a4' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e")}textarea{height:10rem}input[type=radio],input[type=checkbox]{appearance:none;-webkit-appearance:none;display:inline-block;border:1px solid #d1d0d2;cursor:pointer;height:20px;width:20px;vertical-align:top;position:absolute}input[type=radio]:focus,input[type=checkbox]:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd;outline:none}input[type=radio]+label,input[type=checkbox]+label{display:inline-block;font-size:1rem;font-weight:400;line-height:1.2;margin-bottom:1rem;margin-left:.5rem;margin-right:1rem;padding-top:.125rem;padding-left:1.5rem;vertical-align:top}input[type=radio]:checked,input[type=checkbox]:checked{border-color:#0d6dcd}input[type=radio]:checked:focus,input[type=checkbox]:checked:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd}input[type=radio].uq-input--error,input[type=checkbox].uq-input--error{border-color:#d62929}input[type=radio].uq-input--error:focus,input[type=checkbox].uq-input--error:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd}input[type=radio].uq-input--error:checked,input[type=checkbox].uq-input--error:checked{border-color:#d62929}input[type=radio].uq-input--error:checked:focus,input[type=checkbox].uq-input--error:checked:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd}input[type=radio][disabled],input[type=checkbox][disabled]{cursor:not-allowed;border-color:#d1d0d2;background-color:#f3f3f4}input[type=radio][disabled]+label,input[type=checkbox][disabled]+label{color:#d1d0d2}input[type=radio][disabled]:checked,input[type=checkbox][disabled]:checked{background-color:#d1d0d2}input[type=checkbox]{border-radius:4px}input[type=checkbox]::after{content:"";display:block;position:absolute;background-repeat:no-repeat;background-position:center center;top:1px;left:1px;height:16px;width:16px}input[type=checkbox]:checked{background-color:#0d6dcd}input[type=checkbox]:checked::after{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M5 13.3 8.9 18 19 6' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e");padding:0px}input[type=checkbox].uq-input--error:checked{background-color:#d62929}input[type=radio]{border-radius:50%}input[type=radio]:checked{border-width:2px}input[type=radio]:checked::after{border-radius:50%;background-color:#0d6dcd;content:"";display:block;position:absolute;top:3px;left:3px;height:10px;width:10px}input[type=radio][disabled]:checked{background-color:#f3f3f4}input[type=radio][disabled]:checked::after{background-color:#d1d0d2}input[type=radio].uq-input--error:checked{border-color:#d62929}input[type=radio].uq-input--error:checked::after{background-color:#d62929}[type=submit]{appearance:none}.uq-error-summary{background-color:#fff;border:1px solid #d62929;border-left-width:.25rem;padding:1rem;margin-bottom:1.5rem}.uq-error-summary__title{color:#3b383e;font-size:1.125rem;font-weight:500;line-height:1.2;margin:0 0 1rem 0}.uq-error-summary_body{color:#3b383e;font-size:1rem}.uq-error-summary__list{color:#3b383e;font-size:1rem;margin:0;padding-left:1.5rem}.uq-error-summary__list__item{margin-bottom:.25rem;line-height:1.5}.uq-error-summary__list a{color:#d62929;text-decoration:underline;font-weight:400}.uq-error-summary__list a:hover,.uq-error-summary__list a:focus{color:#c32727}.uq-error-message,.uq-success-message{color:#fff;display:block;font-size:1rem;font-style:normal;font-weight:400;line-height:1.5;margin-bottom:1.5rem;padding:calc(0.5rem - 1px) 1rem .5rem 3rem;position:relative}.uq-error-message::before,.uq-success-message::before{content:"";display:block;background-position:center;background-repeat:no-repeat;background-size:contain;height:1.25rem;left:1rem;margin-right:.5rem;margin-top:calc(-0.625rem - 1px);position:absolute;top:50%;width:1.25rem}.uq-error-message{background-color:#d62929}.uq-error-message::before{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M20.127 18.545a1.18 1.18 0 0 1-1.055 1.706H4.929a1.18 1.18 0 0 1-1.055-1.706l7.072-14.143a1.179 1.179 0 0 1 2.109 0l7.072 14.143Z' stroke='%23fff' stroke-width='1.5'%3e%3c/path%3e%3cpath d='M12 9v4' stroke='%23fff' stroke-width='1.5' stroke-linecap='round'%3e%3c/path%3e%3ccircle cx='11.9' cy='16.601' r='1.1' fill='%23fff'%3e%3c/circle%3e%3c/svg%3e")}.uq-success-message{background-color:#4aa74e}.uq-success-message::before{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='12' cy='12' r='9.25' stroke='%23fff' stroke-width='1.5'%3e%3c/circle%3e%3cpath d='M7 12.867 9.6 16l6.733-8' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e")}.uq-inline-help{display:block;font-size:.75rem;margin:0 0 1rem}
|
|
1
|
+
form,fieldset,legend,label,input,select,textarea,.uq-error-summary,.uq-error-message,.uq-success-message,.uq-inline-help{box-sizing:border-box;font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}fieldset::before,fieldset::after,fieldset *,fieldset *::before,fieldset *::after,legend::before,legend::after,legend *,legend *::before,legend *::after,label::before,label::after,label *,label *::before,label *::after,input::before,input::after,input *,input *::before,input *::after,select::before,select::after,select *,select *::before,select *::after,textarea::before,textarea::after,textarea *,textarea *::before,textarea *::after{box-sizing:border-box}fieldset{border:0;padding:0;margin:0}label,legend{color:#3b383e;display:block;font-size:.875rem;font-weight:500}legend{margin-bottom:1rem;line-height:1.2;padding:0}legend.uq-legend--error{color:#d62929}legend .uq-legend__required{color:#d62929}label{cursor:pointer;line-height:1}label.uq-label--inline{align-items:center;display:inline-flex;font-size:1rem;line-height:1.6;margin-bottom:1.5rem}label.uq-label--inline input:not([type=checkbox]):not([type=radio]):not([type=submit]),label.uq-label--inline select,label.uq-label--inline textarea,label.uq-label--inline+input:not([type=checkbox]):not([type=radio]):not([type=submit]),label.uq-label--inline+select,label.uq-label--inline+textarea{max-width:none;min-width:200px;margin-left:1rem;margin-right:1.5rem;width:auto}label.uq-label--inline input:not([type=checkbox]):not([type=radio]):not([type=submit]),label.uq-label--inline select,label.uq-label--inline textarea{margin-top:0;margin-bottom:0}label.uq-label--disabled,label.uq-label--readonly{color:#d1d0d2}label.uq-label--disabled{cursor:not-allowed}label.uq-label--error{color:#d62929}label.uq-label--success{color:#4aa74e}label input:not([type=checkbox]):not([type=radio]),label select,label textarea,label+input:not([type=checkbox]):not([type=radio]),label+select,label+textarea{margin-top:.5rem}label input[type=radio]+*:not(input):not(select):not(textarea),label input[type=checkbox]+*:not(input):not(select):not(textarea){display:inline-block;font-size:1rem;font-weight:400;line-height:20px;margin-bottom:1rem;margin-left:.5rem;margin-right:1rem;padding-top:.25rem;padding-left:1.5rem;vertical-align:top}label input[type=radio][disabled]+*:not(input):not(select):not(textarea),label input[type=checkbox][disabled]+*:not(input):not(select):not(textarea){color:#d1d0d2}label .uq-label__required{color:#d62929}input[disabled],select[disabled],textarea[disabled]{cursor:not-allowed}input:not([type=checkbox]):not([type=radio]):not([type=submit]),select,textarea{background-color:#fff;max-width:100%;min-width:100%;padding:.75rem 1rem;border:1px solid #d1d0d2;border-radius:2px;font-size:1rem;color:#3b383e;line-height:1;margin-bottom:1.5rem}input:not([type=checkbox]):not([type=radio]):not([type=submit]):focus,select:focus,textarea:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd inset;outline:none}input:not([type=checkbox]):not([type=radio]):not([type=submit])[disabled],select[disabled],textarea[disabled]{color:#d1d0d2}input:not([type=checkbox]):not([type=radio]):not([type=submit])[readonly]:focus,select[readonly]:focus,textarea[readonly]:focus{border-color:#d1d0d2;box-shadow:0 0 0 1px #d1d0d2 inset}input:not([type=checkbox]):not([type=radio]):not([type=submit])::placeholder,select::placeholder,textarea::placeholder{color:#d1d0d2}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--error,input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--success,select.uq-input--error,select.uq-input--success,textarea.uq-input--error,textarea.uq-input--success{border-radius:2px}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--error:focus,input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--success:focus,select.uq-input--error:focus,select.uq-input--success:focus,textarea.uq-input--error:focus,textarea.uq-input--success:focus{border-color:#0d6dcd;box-shadow:0 2px 0 0 #0d6dcd,0 0 0 1px #0d6dcd inset}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--error,select.uq-input--error,textarea.uq-input--error{border-color:#d62929;box-shadow:0 2px 0 0 #d62929}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--success,select.uq-input--success,textarea.uq-input--success{border-color:#4aa74e;box-shadow:0 2px 0 0 #4aa74e}input:not([type=checkbox]):not([type=radio]):not([type=submit]).uq-input--large,select.uq-input--large,textarea.uq-input--large{padding:1.15625rem 1.5rem;border-radius:.25rem}input:not([type=checkbox]):not([type=radio]):not([type=submit])+.uq-error-message,input:not([type=checkbox]):not([type=radio]):not([type=submit])+.uq-success-message,select+.uq-error-message,select+.uq-success-message,textarea+.uq-error-message,textarea+.uq-success-message{margin-top:-1.5rem;border-radius:0 0 2px 2px}select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m7 10 5 5 5-5' stroke='%2351247a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right .25rem center;padding-right:2.5rem;cursor:pointer;line-height:1.2;width:100%}select:focus{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m7 10 5 5 5-5' stroke='%230d6dcd' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e")}select[multiple]{height:auto;background-image:none}select[multiple]:focus{background-image:none}select[disabled]{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m7 10 5 5 5-5' stroke='%23a3a1a4' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e")}textarea{height:10rem}input[type=radio],input[type=checkbox]{appearance:none;-webkit-appearance:none;display:inline-block;border:1px solid #d1d0d2;cursor:pointer;height:20px;width:20px;vertical-align:top;position:absolute}input[type=radio]:focus,input[type=checkbox]:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd;outline:none}input[type=radio]+label,input[type=checkbox]+label{display:inline-block;font-size:1rem;font-weight:400;line-height:1.2;margin-bottom:1rem;margin-left:.5rem;margin-right:1rem;padding-top:.125rem;padding-left:1.5rem;vertical-align:top}input[type=radio]:checked,input[type=checkbox]:checked{border-color:#0d6dcd}input[type=radio]:checked:focus,input[type=checkbox]:checked:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd}input[type=radio].uq-input--error,input[type=checkbox].uq-input--error{border-color:#d62929}input[type=radio].uq-input--error:focus,input[type=checkbox].uq-input--error:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd}input[type=radio].uq-input--error:checked,input[type=checkbox].uq-input--error:checked{border-color:#d62929}input[type=radio].uq-input--error:checked:focus,input[type=checkbox].uq-input--error:checked:focus{border-color:#0d6dcd;box-shadow:0 0 0 1px #0d6dcd}input[type=radio][disabled],input[type=checkbox][disabled]{cursor:not-allowed;border-color:#d1d0d2;background-color:#f3f3f4}input[type=radio][disabled]+label,input[type=checkbox][disabled]+label{color:#d1d0d2}input[type=radio][disabled]:checked,input[type=checkbox][disabled]:checked{background-color:#d1d0d2}input[type=checkbox]{border-radius:4px}input[type=checkbox]::after{content:"";display:block;position:absolute;background-repeat:no-repeat;background-position:center center;top:1px;left:1px;height:16px;width:16px}input[type=checkbox]:checked{background-color:#0d6dcd}input[type=checkbox]:checked::after{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M5 13.3 8.9 18 19 6' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e");padding:0px}input[type=checkbox].uq-input--error:checked{background-color:#d62929}input[type=radio]{border-radius:50%}input[type=radio]:checked{border-width:2px}input[type=radio]:checked::after{border-radius:50%;background-color:#0d6dcd;content:"";display:block;position:absolute;top:3px;left:3px;height:10px;width:10px}input[type=radio][disabled]:checked{background-color:#f3f3f4}input[type=radio][disabled]:checked::after{background-color:#d1d0d2}input[type=radio].uq-input--error:checked{border-color:#d62929}input[type=radio].uq-input--error:checked::after{background-color:#d62929}[type=submit]{appearance:none}.uq-error-summary{background-color:#fff;border:1px solid #d62929;border-left-width:.25rem;padding:1rem;margin-bottom:1.5rem}.uq-error-summary__title{color:#3b383e;font-size:1.125rem;font-weight:500;line-height:1.2;margin:0 0 1rem 0}.uq-error-summary_body{color:#3b383e;font-size:1rem}.uq-error-summary__list{color:#3b383e;font-size:1rem;margin:0;padding-left:1.5rem}.uq-error-summary__list__item{margin-bottom:.25rem;line-height:1.6}.uq-error-summary__list a{color:#d62929;text-decoration:underline;font-weight:400}.uq-error-summary__list a:hover,.uq-error-summary__list a:focus{color:#c32727}.uq-error-message,.uq-success-message{color:#fff;display:block;font-size:1rem;font-style:normal;font-weight:400;line-height:1.6;margin-bottom:1.5rem;padding:calc(0.5rem - 1px) 1rem .5rem 3rem;position:relative}.uq-error-message::before,.uq-success-message::before{content:"";display:block;background-position:center;background-repeat:no-repeat;background-size:contain;height:1.25rem;left:1rem;margin-right:.5rem;margin-top:calc(-0.625rem - 1px);position:absolute;top:50%;width:1.25rem}.uq-error-message{background-color:#d62929}.uq-error-message::before{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M20.127 18.545a1.18 1.18 0 0 1-1.055 1.706H4.929a1.18 1.18 0 0 1-1.055-1.706l7.072-14.143a1.179 1.179 0 0 1 2.109 0l7.072 14.143Z' stroke='%23fff' stroke-width='1.5'%3e%3c/path%3e%3cpath d='M12 9v4' stroke='%23fff' stroke-width='1.5' stroke-linecap='round'%3e%3c/path%3e%3ccircle cx='11.9' cy='16.601' r='1.1' fill='%23fff'%3e%3c/circle%3e%3c/svg%3e")}.uq-success-message{background-color:#4aa74e}.uq-success-message::before{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='12' cy='12' r='9.25' stroke='%23fff' stroke-width='1.5'%3e%3c/circle%3e%3cpath d='M7 12.867 9.6 16l6.733-8' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3c/path%3e%3c/svg%3e")}.uq-inline-help{display:block;font-size:.75rem;margin:0 0 1rem}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uqds/form",
|
|
3
|
-
"version": "0.1.0-alpha.
|
|
3
|
+
"version": "0.1.0-alpha.4",
|
|
4
4
|
"description": "Form element style rules",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"uqds",
|
|
@@ -42,8 +42,8 @@
|
|
|
42
42
|
"url": "https://github.com/uq-its-ss/design-system/issues"
|
|
43
43
|
},
|
|
44
44
|
"dependencies": {
|
|
45
|
-
"@uqds/core": "^1.2.0-alpha.
|
|
46
|
-
"@uqds/icon": "^0.0.15-alpha.
|
|
45
|
+
"@uqds/core": "^1.2.0-alpha.1",
|
|
46
|
+
"@uqds/icon": "^0.0.15-alpha.5"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
49
|
"@svgdotjs/svg.js": "^3.0.16",
|
|
@@ -54,5 +54,5 @@
|
|
|
54
54
|
"svgdom": "0.1.14",
|
|
55
55
|
"svgo": "^1.3.2"
|
|
56
56
|
},
|
|
57
|
-
"gitHead": "
|
|
57
|
+
"gitHead": "3b41c2842c6e11853d433f37392e5dae72566555"
|
|
58
58
|
}
|
package/src/scss/_component.scss
CHANGED
|
@@ -44,7 +44,7 @@ $use-encapsulation: false !default;
|
|
|
44
44
|
|
|
45
45
|
label,
|
|
46
46
|
legend {
|
|
47
|
-
color: core.$
|
|
47
|
+
color: core.$grey-900;
|
|
48
48
|
display: block;
|
|
49
49
|
font-size: $form-label-size;
|
|
50
50
|
font-weight: core.$font-weight-bold;
|
|
@@ -169,13 +169,13 @@ $use-encapsulation: false !default;
|
|
|
169
169
|
border: $form-border-width solid core.$grey-300;
|
|
170
170
|
border-radius: $form-border-radius;
|
|
171
171
|
font-size: $form-text-size;
|
|
172
|
-
color: core.$
|
|
172
|
+
color: core.$grey-900;
|
|
173
173
|
line-height: core.$line-height-ui;
|
|
174
174
|
margin-bottom: core.$space-l;
|
|
175
175
|
|
|
176
176
|
&:focus {
|
|
177
|
-
border-color: core.$
|
|
178
|
-
box-shadow: 0 0 0 1px core.$
|
|
177
|
+
border-color: core.$utility-500;
|
|
178
|
+
box-shadow: 0 0 0 1px core.$utility-500 inset;
|
|
179
179
|
outline: none;
|
|
180
180
|
}
|
|
181
181
|
|
|
@@ -199,8 +199,9 @@ $use-encapsulation: false !default;
|
|
|
199
199
|
border-radius: $form-border-radius;
|
|
200
200
|
|
|
201
201
|
&:focus {
|
|
202
|
-
border-color: core.$
|
|
203
|
-
box-shadow: 0 2px 0 0 core.$
|
|
202
|
+
border-color: core.$utility-500;
|
|
203
|
+
box-shadow: 0 2px 0 0 core.$utility-500,
|
|
204
|
+
0 0 0 1px core.$utility-500 inset;
|
|
204
205
|
}
|
|
205
206
|
}
|
|
206
207
|
|
|
@@ -243,7 +244,7 @@ $use-encapsulation: false !default;
|
|
|
243
244
|
&:focus {
|
|
244
245
|
background-image: url(icon.get-icon(
|
|
245
246
|
"standard--chevron-down-sml",
|
|
246
|
-
core.$
|
|
247
|
+
core.$utility-500
|
|
247
248
|
));
|
|
248
249
|
}
|
|
249
250
|
|
|
@@ -281,8 +282,8 @@ $use-encapsulation: false !default;
|
|
|
281
282
|
position: absolute;
|
|
282
283
|
|
|
283
284
|
&:focus {
|
|
284
|
-
border-color: core.$
|
|
285
|
-
box-shadow: 0 0 0 1px core.$
|
|
285
|
+
border-color: core.$utility-500;
|
|
286
|
+
box-shadow: 0 0 0 1px core.$utility-500;
|
|
286
287
|
outline: none;
|
|
287
288
|
}
|
|
288
289
|
|
|
@@ -300,11 +301,11 @@ $use-encapsulation: false !default;
|
|
|
300
301
|
}
|
|
301
302
|
|
|
302
303
|
&:checked {
|
|
303
|
-
border-color: core.$
|
|
304
|
+
border-color: core.$utility-500;
|
|
304
305
|
|
|
305
306
|
&:focus {
|
|
306
|
-
border-color: core.$
|
|
307
|
-
box-shadow: 0 0 0 1px core.$
|
|
307
|
+
border-color: core.$utility-500;
|
|
308
|
+
box-shadow: 0 0 0 1px core.$utility-500;
|
|
308
309
|
}
|
|
309
310
|
}
|
|
310
311
|
|
|
@@ -312,16 +313,16 @@ $use-encapsulation: false !default;
|
|
|
312
313
|
border-color: core.$error-500;
|
|
313
314
|
|
|
314
315
|
&:focus {
|
|
315
|
-
border-color: core.$
|
|
316
|
-
box-shadow: 0 0 0 1px core.$
|
|
316
|
+
border-color: core.$utility-500;
|
|
317
|
+
box-shadow: 0 0 0 1px core.$utility-500;
|
|
317
318
|
}
|
|
318
319
|
|
|
319
320
|
&:checked {
|
|
320
321
|
border-color: core.$error-500;
|
|
321
322
|
|
|
322
323
|
&:focus {
|
|
323
|
-
border-color: core.$
|
|
324
|
-
box-shadow: 0 0 0 1px core.$
|
|
324
|
+
border-color: core.$utility-500;
|
|
325
|
+
box-shadow: 0 0 0 1px core.$utility-500;
|
|
325
326
|
}
|
|
326
327
|
}
|
|
327
328
|
}
|
|
@@ -357,7 +358,7 @@ $use-encapsulation: false !default;
|
|
|
357
358
|
}
|
|
358
359
|
|
|
359
360
|
&:checked {
|
|
360
|
-
background-color: core.$
|
|
361
|
+
background-color: core.$utility-500;
|
|
361
362
|
|
|
362
363
|
&::after {
|
|
363
364
|
background-image: url(icon.get-icon("standard--check", core.$white));
|
|
@@ -380,7 +381,7 @@ $use-encapsulation: false !default;
|
|
|
380
381
|
|
|
381
382
|
&::after {
|
|
382
383
|
border-radius: 50%;
|
|
383
|
-
background-color: core.$
|
|
384
|
+
background-color: core.$utility-500;
|
|
384
385
|
content: "";
|
|
385
386
|
display: block;
|
|
386
387
|
position: absolute;
|
|
@@ -423,7 +424,7 @@ $use-encapsulation: false !default;
|
|
|
423
424
|
margin-bottom: core.$space-l;
|
|
424
425
|
|
|
425
426
|
&__title {
|
|
426
|
-
color: core.$
|
|
427
|
+
color: core.$grey-900;
|
|
427
428
|
font-size: core.$font-size-l;
|
|
428
429
|
font-weight: core.$font-weight-bold;
|
|
429
430
|
line-height: core.$line-height-h;
|
|
@@ -431,12 +432,12 @@ $use-encapsulation: false !default;
|
|
|
431
432
|
}
|
|
432
433
|
|
|
433
434
|
&_body {
|
|
434
|
-
color: core.$
|
|
435
|
+
color: core.$grey-900;
|
|
435
436
|
font-size: core.$space-m;
|
|
436
437
|
}
|
|
437
438
|
|
|
438
439
|
&__list {
|
|
439
|
-
color: core.$
|
|
440
|
+
color: core.$grey-900;
|
|
440
441
|
font-size: core.$space-m;
|
|
441
442
|
margin: core.$space-none;
|
|
442
443
|
padding-left: core.$space-l;
|