| @@ -1,245 +1 @@ | ||
| 1 | -.ablocks-block--form-builder { | |
| 2 | - padding: 20px; | |
| 3 | - border: 2px solid gray; | |
| 4 | - background: #FFFFFF; | |
| 5 | - border-radius: 5px; | |
| 6 | -} | |
| 7 | - | |
| 8 | -.ablocks-block--form-builder .block-editor-button-block-appender { | |
| 9 | - height: 60px; | |
| 10 | - margin: 10px 0; | |
| 11 | -} | |
| 12 | - | |
| 13 | -.ablocks-block--form-builder .block-list-appender { | |
| 14 | - position: static; | |
| 15 | -} | |
| 16 | -.ablocks-block--form-builder form{ | |
| 17 | - display: flex; | |
| 18 | - flex-wrap: wrap; | |
| 19 | - row-gap: 2px; | |
| 20 | - column-gap: 8px; | |
| 21 | -} | |
| 22 | - | |
| 23 | -.ablocks-form-builder .ablocks-form-builder__fields { | |
| 24 | - width: 100%; | |
| 25 | -} | |
| 26 | - | |
| 27 | -.ablocks-form-builder .ablocks-form-builder__submit-button { | |
| 28 | - margin-top: 5px; | |
| 29 | -} | |
| 30 | - | |
| 31 | -/* Default Button */ | |
| 32 | -.ablocks-form-builder .ablocks-form-builder__submit-button { | |
| 33 | - cursor: pointer; | |
| 34 | - border: none; | |
| 35 | -} | |
| 36 | -.ablocks-form-builder .ablocks-form-builder__submit-button--default { | |
| 37 | - padding: 6px 14px; | |
| 38 | - font-size: 14px; | |
| 39 | - width: 20%; | |
| 40 | - border-radius: 8px; | |
| 41 | - background: #13191B; | |
| 42 | - color: white; | |
| 43 | - font-family: Roboto; | |
| 44 | - font-size: 16px; | |
| 45 | - font-style: normal; | |
| 46 | - font-weight: 500; | |
| 47 | - line-height: 150%; | |
| 48 | -} | |
| 49 | -/* Small Button */ | |
| 50 | -.ablocks-form-builder .ablocks-form-builder__submit-button--small { | |
| 51 | - padding: 8px 16px; | |
| 52 | - font-size: 14px; | |
| 53 | - width: 20%; | |
| 54 | - border-radius: 8px; | |
| 55 | - background: #13191B; | |
| 56 | - color: white; | |
| 57 | - font-family: Roboto; | |
| 58 | - font-size: 16px; | |
| 59 | - font-style: normal; | |
| 60 | - font-weight: 500; | |
| 61 | - line-height: 150%; | |
| 62 | -} | |
| 63 | - | |
| 64 | -/* Medium Button */ | |
| 65 | -.ablocks-form-builder .ablocks-form-builder__submit-button--medium { | |
| 66 | - padding: 12px 24px; | |
| 67 | - font-size: 16px; | |
| 68 | - width: 30%; | |
| 69 | - border-radius: 8px; | |
| 70 | - background: #13191B; | |
| 71 | - color: white; | |
| 72 | - font-family: Roboto; | |
| 73 | - font-size: 16px; | |
| 74 | - font-style: normal; | |
| 75 | - font-weight: 500; | |
| 76 | - line-height: 150%; | |
| 77 | -} | |
| 78 | - | |
| 79 | -/* Large Button */ | |
| 80 | -.ablocks-form-builder .ablocks-form-builder__submit-button--large { | |
| 81 | - padding: 16px 32px; | |
| 82 | - font-size: 18px; | |
| 83 | - width: 50%; | |
| 84 | - border-radius: 8px; | |
| 85 | - background: #13191B; | |
| 86 | - color: white; | |
| 87 | - font-family: Roboto; | |
| 88 | - font-size: 16px; | |
| 89 | - font-style: normal; | |
| 90 | - font-weight: 500; | |
| 91 | - line-height: 150%; | |
| 92 | -} | |
| 93 | - | |
| 94 | -/* Extra Large Button */ | |
| 95 | -.ablocks-form-builder .ablocks-form-builder__submit-button--extra-large { | |
| 96 | - padding: 18px 36px; | |
| 97 | - font-size: 20px; | |
| 98 | - width: 60%; | |
| 99 | - border-radius: 8px; | |
| 100 | - background: #13191B; | |
| 101 | - color: white; | |
| 102 | - font-family: Roboto; | |
| 103 | - font-size: 16px; | |
| 104 | - font-style: normal; | |
| 105 | - font-weight: 500; | |
| 106 | - line-height: 150%; | |
| 107 | -} | |
| 108 | - | |
| 109 | -/* Full Width Button */ | |
| 110 | -.ablocks-form-builder .ablocks-form-builder__submit-button--full-width { | |
| 111 | - padding: 14px 28px; | |
| 112 | - font-size: 16px; | |
| 113 | - width: 100%; | |
| 114 | - border-radius: 8px; | |
| 115 | - background: #13191B; | |
| 116 | - color: white; | |
| 117 | - font-family: Roboto; | |
| 118 | - font-size: 16px; | |
| 119 | - font-style: normal; | |
| 120 | - font-weight: 500; | |
| 121 | - line-height: 150%; | |
| 122 | -} | |
| 123 | - | |
| 124 | -/* Label styling */ | |
| 125 | -.ablocks-form-builder__label { | |
| 126 | - color: #0F0E16; | |
| 127 | - font-family: Roboto; | |
| 128 | - font-size: 16px; | |
| 129 | - font-style: normal; | |
| 130 | - font-weight: 400; | |
| 131 | - line-height: 150%; | |
| 132 | -} | |
| 133 | - | |
| 134 | -.ablocks-form-builder input.ablocks-form-builder__input { | |
| 135 | - width: 100%; | |
| 136 | - /* padding: 10px 16px; */ | |
| 137 | - box-sizing: border-box; | |
| 138 | - height: 49px; | |
| 139 | - /* border: 1px solid #A7AAAD; */ | |
| 140 | - /* border-radius: 5px; */ | |
| 141 | - color: #0F0E16; | |
| 142 | -} | |
| 143 | - | |
| 144 | -.ablocks-form-builder input.ablocks-form-builder__input::placeholder { | |
| 145 | - color: #A7AAAD; | |
| 146 | - font-family: Roboto; | |
| 147 | - font-style: normal; | |
| 148 | - font-weight: 400; | |
| 149 | - line-height: 150%; | |
| 150 | -} | |
| 151 | - | |
| 152 | -input.ablocks-form-builder__input:focus { | |
| 153 | - /* border: 5px solid #007cba !important; */ | |
| 154 | - outline: none; | |
| 155 | - box-shadow: none; | |
| 156 | -} | |
| 157 | - | |
| 158 | -.ablocks-feedback-messag .error-msg { | |
| 159 | - color: #f70404; | |
| 160 | -} | |
| 161 | - | |
| 162 | -.ablocks-feedback-messag .success-msg { | |
| 163 | - color: rgb(14, 255, 14); | |
| 164 | -} | |
| 165 | - | |
| 166 | -.ablocks-form-builder button[type="submit"].loading { | |
| 167 | - position: relative; | |
| 168 | - pointer-events: none; | |
| 169 | - /* Prevent clicking the button again while loading */ | |
| 170 | -} | |
| 171 | - | |
| 172 | -.ablocks-form-builder button[type="submit"].loading::after { | |
| 173 | - content: ""; | |
| 174 | - position: absolute; | |
| 175 | - top: 40%; | |
| 176 | - left: 50%; | |
| 177 | - width: 20px; | |
| 178 | - height: 20px; | |
| 179 | - border: 3px solid #fff; | |
| 180 | - border-top: 3px solid transparent; | |
| 181 | - border-radius: 50%; | |
| 182 | - animation: spin 1s linear infinite; | |
| 183 | - transform: translate(-50%, -50%); | |
| 184 | -} | |
| 185 | - | |
| 186 | -.ablocks-form-builder-toobar-button--active { | |
| 187 | - color: white; | |
| 188 | -} | |
| 189 | - | |
| 190 | -.ablocks-form-builder-toobar-button--active::before { | |
| 191 | - background-color: #007cba; | |
| 192 | - /* Example color */ | |
| 193 | - border: 1px solid black; | |
| 194 | -} | |
| 195 | -@keyframes spin { | |
| 196 | - 0% { | |
| 197 | - transform: rotate(0deg); | |
| 198 | - } | |
| 199 | - | |
| 200 | - 100% { | |
| 201 | - transform: rotate(360deg); | |
| 202 | - } | |
| 203 | -} | |
| 204 | -.ablocks-form-builder-block-variation-picker .block-editor-block-variation-picker__variations>li{ | |
| 205 | - height: 170px; | |
| 206 | -} | |
| 207 | -.ablocks-form-builder-block-variation-picker .block-editor-block-variation-picker__variations{ | |
| 208 | - margin-top: 70px; | |
| 209 | - margin-bottom: 0; | |
| 210 | - margin-right: 0; | |
| 211 | - margin-left: 0; | |
| 212 | -} | |
| 213 | -.ablocks-form-builder-block-variation-picker .block-editor-block-variation-picker__variations span{ | |
| 214 | - margin-top: 50px; | |
| 215 | - font-size: 13px; | |
| 216 | - font-weight: 700; | |
| 217 | -} | |
| 218 | -.ablocks-block--form-builder__navigator{ | |
| 219 | - padding-top: 20px; | |
| 220 | - padding-left: 24px; | |
| 221 | - font-size: 16px; | |
| 222 | -} | |
| 223 | -.ablocks-block--form-builder__navigator a{ | |
| 224 | - text-decoration: none; | |
| 225 | -} | |
| 226 | -.ablocks-block--form-builder__navigator .ablocks-block--form-builder__navigator-redirect-page a{ | |
| 227 | - padding: 5px; | |
| 228 | -} | |
| 229 | - | |
| 230 | -.ablocks-block--form-builder__feedback-message{ | |
| 231 | - margin-top: 10px; | |
| 232 | - font-size: 16px; | |
| 233 | - text-align: center; | |
| 234 | - border-radius: 5px; | |
| 235 | - padding: 20px 10px; | |
| 236 | -} | |
| 237 | -.ablocks-block--form-builder__arrow-icon{ | |
| 238 | - width: 14px; | |
| 239 | - padding-right: 5px; | |
| 240 | - fill: gray; | |
| 241 | -} | |
| 242 | -.ablocks-block--form-builder__feedback-message p{ | |
| 243 | - margin: 0; | |
| 244 | - padding: 0; | |
| 245 | -} | |
| 1 | +.ablocks-block--form-builder{background:#fff;border:2px solid gray;border-radius:5px;padding:20px}.ablocks-block--form-builder .ablocks-form-builder__fields{column-gap:8px;display:flex;flex-wrap:wrap;row-gap:16px}@media (max-width:450px){.ablocks-block--form-builder .ablocks-form-builder__fields{gap:5px;row-gap:10px}}.ablocks-block--form-builder .block-editor-button-block-appender{height:60px;margin:10px 0}.ablocks-block--form-builder .block-list-appender{position:static;width:100%}.ablocks-block--form-builder form{column-gap:8px;display:flex;row-gap:16px}.ablocks-form-builder__field .ablocks-block-error-msg{position:absolute;visibility:hidden}@media (max-width:560px){.ablocks-block--form-builder form{column-gap:0;display:flex;flex-wrap:wrap;row-gap:14px}}.ablocks-form-builder .ablocks-form-builder__fields{width:100%}.ablocks-form-builder .ablocks-form-builder__submit-button{border:none;cursor:pointer;text-wrap-mode:nowrap}.ablocks-form-builder .ablocks-form-builder__submit-button--default{background:#13191b;border-radius:8px;color:#fff;font-size:14px;font-size:16px;font-style:normal;font-weight:500;line-height:150%;padding:6px 90px}.ablocks-form-builder .ablocks-form-builder__submit-button--small{background:#13191b;border-radius:8px;color:#fff;font-size:14px;font-size:16px;font-style:normal;font-weight:500;line-height:150%;padding:8px 90px}.ablocks-form-builder .ablocks-form-builder__submit-button--medium{background:#13191b;border-radius:8px;color:#fff;font-size:16px;font-style:normal;font-weight:500;line-height:150%;padding:12px 130px}.ablocks-form-builder .ablocks-form-builder__submit-button--large{background:#13191b;border-radius:8px;color:#fff;font-size:18px;font-size:16px;font-style:normal;font-weight:500;line-height:150%;padding:16px 230px}.ablocks-form-builder .ablocks-form-builder__submit-button--extra-large{background:#13191b;border-radius:8px;color:#fff;font-size:20px;font-size:16px;font-style:normal;font-weight:500;line-height:150%;padding:18px 280px}.ablocks-form-builder .ablocks-form-builder__submit-button--full-width{background:#13191b;border-radius:8px;color:#fff;font-size:16px;font-style:normal;font-weight:500;line-height:150%;padding:14px 28px;width:100%}.ablocks-form-builder__label{color:#0f0e16;display:block;font-size:16px;font-style:normal;font-weight:400;line-height:150%;text-transform:capitalize}.ablocks-form-builder .ablocks-form-builder__input{box-sizing:border-box;color:#0f0e16;padding:10px;width:100%}.ablocks-form-builder input.ablocks-form-builder__input{padding:15px 10px}.ablocks-form-builder input.ablocks-form-builder__input::placeholder{color:#a7aaad;opacity:.8}input.ablocks-form-builder__input:focus{box-shadow:none;outline:none}.ablocks-feedback-messag .error-msg{color:#f70404}.ablocks-feedback-messag .success-msg{color:#0eff0e}.ablocks-form-builder button[type=submit].loading{pointer-events:none;position:relative}.ablocks-form-builder button[type=submit].loading:after{animation:spin 1s linear infinite;border:3px solid #fff;border-radius:50%;border-top-color:transparent;content:"";height:20px;left:50%;margin-top:-10px;position:absolute;top:50%;transform:translate(-50%,-50%);width:20px}.ablocks-form-builder-toobar-button--active{color:#fff}.ablocks-form-builder-toobar-button--active:before{background-color:#007cba;border:1px solid #000}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ablocks-form-builder-block-variation-picker .block-editor-block-variation-picker__variations>li{height:170px}.ablocks-form-builder-block-variation-picker .block-editor-block-variation-picker__variations{margin:70px 0 0}.ablocks-form-builder-block-variation-picker .block-editor-block-variation-picker__variations span{font-size:13px;font-weight:700;margin-top:50px}.ablocks-block--form-builder__navigator{font-size:16px;padding-left:24px;padding-top:20px}.ablocks-block--form-builder__navigator a{text-decoration:none}.ablocks-block--form-builder__navigator .ablocks-block--form-builder__navigator-redirect-page a{padding:5px}.ablocks-block--form-builder__feedback-message{border-radius:5px;font-size:16px;margin-top:10px;padding:20px 10px;text-align:center}.ablocks-block--form-builder__arrow-icon{fill:gray;padding-right:5px;width:14px}.ablocks-block--form-builder__feedback-message p{margin:0;padding:0}.ablocks-form-builder__field__content{align-items:center;display:flex}.ablocks-form-builder__field__content .ablocks-form-builder__label{cursor:pointer;margin-top:10px;padding-left:2px}.ablocks-form-builder__checkbox .ablocks-form-builder__helper-text{color:hsl(from #1E1E1E h s l/.65);display:block;font-size:13px;font-weight:400;margin-top:-14px;padding-left:19px}.ablocks-block-block-wrap{height:16px}.ablocks-form-builder__field .ablocks-form-builder__helper-text{color:hsl(from #1E1E1E h s l/.65);display:block;font-size:13px;font-weight:400}.ablocks-form-builder__field.error-msg .ablocks-form-builder-input{border-color:red}.ablocks-form-builder__input-icon{font-size:18px;left:10px;position:absolute;top:75%;transform:translateY(-50%)}.ablocks-form-builder__input-toggle--hide-password,.ablocks-form-builder__input-toggle--show-password{visibility:hidden}.components-popover__content>.components-accessible-toolbar>.block-editor-block-toolbar>.components-toolbar-group>.block-editor-block-toolbar__slot>.components-toolbar-group>.components-button:hover{color:var(--ablocks-primary-color)}.ablocks-block--form-multi-step{padding:20px 10px;width:100%}.ablocks-form-multi-step__btns{align-items:center;display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.ablocks-form-multi-step__btns button{background-color:#000;border:none;border-radius:5px;box-sizing:border-box;color:#fff;max-width:100%;outline:none;padding:10px 30px}.ablocks-form-multi-step__btns button:first-of-type{background-color:#fff;border:1px solid #707070;color:#000;margin-right:auto}.ablocks-form-multi-step__btns button:nth-of-type(2){margin-left:auto}.ablocks-form-multi-step__btns .ablocks-form-builder__submit-button{max-width:100%;min-width:0;padding-left:30px;padding-right:30px;white-space:normal;text-wrap-mode:wrap}.ablocks-form-multi-step-child{display:none}.ablocks-form-multi-step-child--active{display:flex;flex-wrap:wrap}.ablocks-form-multi-step__progress{margin-bottom:20px}.ablocks-form-multi-step__progress,.ablocks-form-multi-step__step-wrapper{align-items:center;display:flex;justify-content:center}.ablocks-form-multi-step__step{align-items:center;display:flex}.ablocks-form-multi-step__step-number{align-items:center;background-color:#fff;border:1px solid #ccc;border-radius:50%;display:flex;height:24px;justify-content:center;margin-right:5px;width:24px}.ablocks-form-multi-step__step-title{color:#000}.ablocks-form-multi-step__divider{color:#ccc;margin:0 8px}.ablocks-form-multi-step__step-wrapper:last-child .ablocks-form-multi-step__divider{display:none}.ablocks-form-multi-step__step--active .ablocks-form-multi-step__step-number{background-color:#000;border:none;color:#fff}.ablocks-editor-multi-step__wrapper{align-items:center;cursor:pointer;display:flex;gap:20px;justify-content:space-between;padding:10px}.ablocks-block--form-multi-step .block-editor-block-list__block.ablocks-block.is-selected>.ablocks-editor-block-control-wrap{display:none!important}.ablocks-editor-multi-step{border:1px solid #ddd;border-radius:4px;margin:10px 0}.ablocks-editor-multi-step__content-wrapper{align-items:center;display:flex;flex:1;gap:10px}.ablocks-editor-multi-step__inner-content{padding:10px}.ablocks-editor-multi-step__new-option input{border:1px solid #1b1b1b;border-radius:5px;outline:none;padding:10px;width:100%}.ablocks-editor-multi-step__new-option input:focus{border:1px solid #1b1b1b;box-shadow:none;outline:none}.ablocks-editor-multi-step__new-option button{background-color:#fff;border:1px solid #1b1b1b;border-radius:5px;cursor:pointer;margin:10px 0;padding:10px 15px;width:100%}.ablocks-block-form-custom-input .ablocks-block-container>.block-editor-inner-blocks>.block-editor-block-list__layout{display:flex;width:100%}:not(.block-editor-block-list__block).ablocks-block-form-custom-input--is-root.alignfull{margin-left:calc(-50vw + 50%)!important;margin-right:calc(-50vw + 50%)!important;max-width:100vw;width:100vw}.ablocks-block-form-custom-input{box-sizing:border-box!important;max-width:min(100%,100%);padding:var(--ablocks-container-padding);width:100%}.ablocks-block-form-custom-input--is-root{margin-left:auto!important;margin-right:auto!important}:not(.block-editor-block-list__block).ablocks-block-form-custom-input>.ablocks-block-container{display:flex}.ablocks-form-builder-input{width:100%}.ablocks-form-builder__label--required:after{color:red;content:"*"}.ablocks-form-builder__input-show-icon{padding:10px 40px}.ablocks-block--form-password .ablocks-form-builder__helper-text{color:hsl(from #1E1E1E h s l/.65);display:block;font-size:13px;font-weight:400}.ablocks-form-builder__input-toggle--hide-password,.ablocks-form-builder__input-toggle--show-password{background:transparent;border:none;color:#007cba;cursor:pointer;font-size:14px;opacity:0;padding:0;position:absolute;right:10px;top:63%;transform:translateY(-50%);transition:color .3s;visibility:none}.ablocks-form-builder__input-toggle--hide-password--active,.ablocks-form-builder__input-toggle--show-password--active{opacity:1;visibility:visible}.ablocks-form-builder__radio-all-options{display:flex;flex-wrap:wrap}.ablocks-form-builder__radio-option{align-items:center;border:1px solid hsl(from #1e1e1e h s l/.25);border-radius:6px;color:#1e1e1e;cursor:pointer;display:flex;font-size:16px;font-weight:400;gap:8px;justify-content:space-between;margin:4px;padding:10px 12px}.ablocks-form-builder__radio-content{align-items:center;display:flex;gap:5px}.ablocks-form-builder__radio-content .ablocks-icon-wrap{font-size:20px}.ablocks-form-builder__radio-option{background-color:#fff}.ablocks-form-builder__radio-option.checked{background-color:green}.ablocks-form-builder__radio-field .ablocks-form-builder__helper-text{color:hsl(from #1E1E1E h s l/.65);display:block;font-size:13px;font-weight:400;margin-bottom:2px;margin-top:-6px}.ablocks-editor-radio__wrapper{align-items:center;cursor:pointer;display:flex;gap:20px;justify-content:space-between;padding:10px}.ablocks-editor-radio{border:1px solid #ddd;border-radius:4px;margin:10px 0}.ablocks-editor-radio__content-wrapper{align-items:center;display:flex;flex:1;gap:10px}.ablocks-editor-radio__inner-content{padding:10px}.ablocks-editor-radio__new-option input{border:1px solid #1b1b1b;border-radius:5px;outline:none;padding:10px;width:100%}.ablocks-editor-radio__new-option input:focus{border:1px solid #1b1b1b;box-shadow:none;outline:none}.ablocks-editor-radio__new-option button{background-color:#fff;border:1px solid #1b1b1b;border-radius:5px;cursor:pointer;margin:10px 0;padding:10px 15px;width:100%}.ablocks-form-builder__field .ablocks-form-builder__select{max-width:100%;padding:8px 16px;width:100%}.ablocks-form-builder__field{box-sizing:border-box;width:100%}.ablocks-form-builder__field.error-msg .ablocks-form-builder__field__text{border-color:red}.ablocks-form-builder__field.error-msg .ablocks-block-error-msg{color:#dc2626;font-size:12px;font-weight:500;visibility:visible}.ablocks-form-builder-textarea .ablocks-form-builder__helper-text{color:hsl(from #1E1E1E h s l/.65);display:block;font-size:13px;font-weight:400;margin-bottom:2px;margin-top:-14px}.ablocks-form-builder__field__label{display:block;text-transform:capitalize}.ablocks-form-builder__field__text{display:flex}textarea.ablocks-form-builder__field__text{border:1px solid rgba(0,0,0,.493);border-radius:3px;box-sizing:border-box;outline:none;padding:12px;resize:vertical;width:100%}.ablocks-form-builder__field__text textarea::placeholder{opacity:.8}.ablocks-form-builder__field__text textarea:focus{border:none;outline:none} | |
