figura-test
Version:
## Disclaimer This library is currently in production/testing and is strictly a pre-release version. ## Description Figura is a powerful library of React components designed to simplify form handling, validation, and submission. It offers an easy-to-use
1 lines • 1.71 kB
CSS
.form-style{padding:1vw;width:25vw}.input-container{display:flex;flex-direction:column;margin-bottom:1vw}.input-style{border:2px solid #0284c7;border-radius:.5vw;font-size:1.3vw;font-weight:400;line-height:2vw;outline:none;padding:.75vw .75vw .75vw 1vw;transition:all .3s ease-in-out}.input-style:focus{border:2px solid #38bdf8}.input-container-inline{align-items:center;display:flex;flex-direction:row}.input-style-inline{margin-right:1vw}.label-style{font-size:1.5vw;font-weight:400;margin-left:.2vw}.error-style{animation:fade .6s ease-in-out;color:#eb2a57;font-size:1.5vw}.title-style{font-size:3vw;font-weight:600;text-align:center}.reset-button{background-color:#c7c8d2;border:none;border-radius:.5vw;cursor:pointer;font-size:1.5vw;margin-bottom:.5vw;margin-top:1vw;outline:none;padding:1vw;transition:all .4s ease-in-out;width:100%}.reset-button:hover{background-color:#9c9eac}.submit-button{background:linear-gradient(90deg,#38bdf8,#0284c7,#38bdf8);background-position:0;background-size:200%;border:none;border-radius:.5vw;cursor:pointer;font-size:1.5vw;margin-bottom:.5vw;margin-top:2vw;outline:none;padding:1vw;transition:all .4s ease-in-out;width:100%}.submit-button:hover{background-position:100%}.color-picker-container{align-items:center;border-radius:9999px;display:flex;height:1.5rem;justify-content:center;margin-right:1vw;overflow:hidden;position:relative;width:1.5rem}.color-picker-style{background:transparent;border:none;border-radius:9999px;cursor:pointer;height:4rem;outline:none;position:absolute;width:4rem}.button-group-background{background-color:rgba(2,133,199,.249)}.button-group-spacer{background-color:initial;margin-bottom:.3vw}@keyframes fade{0%{opacity:0}to{opacity:1}}