icons
1 year ago
authorizenet.scss
4 years ago
currencyswitcher.scss
4 years ago
feerecovery.scss
4 years ago
ffm.scss
4 years ago
form.scss
3 years ago
legacy-consumer.scss
1 year ago
mixins.scss
4 years ago
newsletter.scss
4 years ago
paypal-commerce.scss
4 years ago
receipt.scss
3 years ago
recurring.scss
4 years ago
square.scss
4 years ago
tributes.scss
3 years ago
util.scss
4 years ago
ffm.scss
239 lines
| 1 | /* stylelint-disable */ |
| 2 | .ffm-field-container { |
| 3 | position: relative; |
| 4 | |
| 5 | fieldset { |
| 6 | padding: 0 !important; |
| 7 | } |
| 8 | |
| 9 | .give-label { |
| 10 | display: block !important; |
| 11 | |
| 12 | .give-tooltip:not(.give-required-indicator + .give-tooltip) { |
| 13 | padding-left: 5px; |
| 14 | } |
| 15 | } |
| 16 | } |
| 17 | |
| 18 | /*--------------------------------- |
| 19 | RTL styles |
| 20 | -----------------------------------*/ |
| 21 | |
| 22 | html[dir='rtl']='rtl'] { |
| 23 | .ffm-field-container[data-field-type='checkbox']='checkbox'] { |
| 24 | label { |
| 25 | top: 6px; |
| 26 | |
| 27 | &::before { |
| 28 | right: 0; |
| 29 | } |
| 30 | |
| 31 | &::after { |
| 32 | top: -3px; |
| 33 | right: 0; |
| 34 | margin-right: 1px; |
| 35 | } |
| 36 | } |
| 37 | } |
| 38 | |
| 39 | .ffm-field-container[data-field-type='radio']='radio'] { |
| 40 | label { |
| 41 | padding-right: 32px !important; |
| 42 | |
| 43 | &::before { |
| 44 | right: 0; |
| 45 | } |
| 46 | |
| 47 | &::after { |
| 48 | right: 6px; |
| 49 | } |
| 50 | } |
| 51 | } |
| 52 | } |
| 53 | |
| 54 | /*--------------------------------- |
| 55 | Backward compatibility ffm css. we can remove this code in future. |
| 56 | FFM version > 1.6.0 uses field api to render custom field which does not require below style. |
| 57 | -----------------------------------*/ |
| 58 | .choose-amount { |
| 59 | #give-ffm-section { |
| 60 | margin: 20px !important; |
| 61 | } |
| 62 | } |
| 63 | |
| 64 | .give-ffm-form-row-responsive { |
| 65 | .give-label { |
| 66 | display: block !important; |
| 67 | position: absolute; |
| 68 | font-size: 14px; |
| 69 | } |
| 70 | } |
| 71 | |
| 72 | fieldset { |
| 73 | .give-ffm-form-row-responsive { |
| 74 | position: relative; |
| 75 | } |
| 76 | } |
| 77 | |
| 78 | .ffm-checkbox-field { |
| 79 | label { |
| 80 | font-weight: 500; |
| 81 | font-size: 16px; |
| 82 | line-height: 1.4; |
| 83 | padding: 0 0 2px 32px; |
| 84 | width: 100%; |
| 85 | margin-left: 0; |
| 86 | color: #333; |
| 87 | display: inline-block; |
| 88 | |
| 89 | &::before { |
| 90 | content: ' '; |
| 91 | position: absolute; |
| 92 | top: calc(50% - 12px); |
| 93 | left: 0; |
| 94 | width: 20px; |
| 95 | height: 20px; |
| 96 | border: 1px solid #b4b9be; |
| 97 | background-color: #fff; |
| 98 | box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25); |
| 99 | } |
| 100 | |
| 101 | &::after { |
| 102 | transition: clip-path 0.2s ease, -webkit-clip-path 0.2s ease; |
| 103 | border-radius: 11px; |
| 104 | width: 20px; |
| 105 | height: 20px; |
| 106 | position: absolute; |
| 107 | top: calc(50% - 10px); |
| 108 | left: 0; |
| 109 | content: ' '; |
| 110 | display: block; |
| 111 | background-image: url("data:image/svg+xml,%3Csvg width='15' height='11' viewBox='0 0 15 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.73047 10.7812C6.00391 11.0547 6.46875 11.0547 6.74219 10.7812L14.7812 2.74219C15.0547 2.46875 15.0547 2.00391 14.7812 1.73047L13.7969 0.746094C13.5234 0.472656 13.0859 0.472656 12.8125 0.746094L6.25 7.30859L3.16016 4.24609C2.88672 3.97266 2.44922 3.97266 2.17578 4.24609L1.19141 5.23047C0.917969 5.50391 0.917969 5.96875 1.19141 6.24219L5.73047 10.7812Z' fill='%231E8CBE'/%3E%3C/svg%3E%0A"); |
| 112 | background-repeat: no-repeat; |
| 113 | background-position: center; |
| 114 | clip-path: polygon(0 0, 11% 0, 0 100%, 0 55%); |
| 115 | -webkit-clip-path: polygon(0 0, 11% 0, 0 100%, 0 55%); |
| 116 | } |
| 117 | |
| 118 | &.checked { |
| 119 | &::after { |
| 120 | clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); |
| 121 | -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); |
| 122 | } |
| 123 | } |
| 124 | } |
| 125 | } |
| 126 | .ffm-radio-field { |
| 127 | input[type='radio']='radio'] { |
| 128 | opacity: 0 !important; |
| 129 | position: absolute !important; |
| 130 | } |
| 131 | |
| 132 | label { |
| 133 | font-weight: 500; |
| 134 | font-size: 16px; |
| 135 | line-height: 1.4; |
| 136 | padding: 0 0 0 32px; |
| 137 | width: 100%; |
| 138 | margin-left: 0; |
| 139 | color: #333; |
| 140 | display: inline-block; |
| 141 | |
| 142 | &::before { |
| 143 | content: ' '; |
| 144 | position: absolute; |
| 145 | top: calc(50% - 12px); |
| 146 | left: 0; |
| 147 | width: 20px; |
| 148 | height: 20px; |
| 149 | border-radius: 50%; |
| 150 | border: 1px solid #b4b9be; |
| 151 | background-color: #fff; |
| 152 | box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25); |
| 153 | } |
| 154 | |
| 155 | &::after { |
| 156 | transform: scale3d(0, 0, 0); |
| 157 | transition: transform 0.2s ease; |
| 158 | border-radius: 12px; |
| 159 | width: 10px; |
| 160 | height: 10px; |
| 161 | position: absolute; |
| 162 | top: calc(50% - 6px); |
| 163 | left: 6px; |
| 164 | content: ' '; |
| 165 | display: block; |
| 166 | background: #333; |
| 167 | } |
| 168 | |
| 169 | &.selected { |
| 170 | &::after { |
| 171 | transform: scale3d(1, 1, 1); |
| 172 | } |
| 173 | } |
| 174 | } |
| 175 | } |
| 176 | |
| 177 | .ffm-attachment-upload-filelist { |
| 178 | background: #fff; |
| 179 | border: 1px solid #b8b8b8; |
| 180 | box-sizing: border-box; |
| 181 | box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.152289); |
| 182 | border-radius: 4px !important; |
| 183 | font-weight: 400; |
| 184 | font-size: 14px; |
| 185 | line-height: 1; |
| 186 | color: #8d8e8e; |
| 187 | padding: 0; |
| 188 | position: relative; |
| 189 | display: flex; |
| 190 | overflow: hidden; |
| 191 | |
| 192 | a.file-selector { |
| 193 | display: inline-block; |
| 194 | height: 100%; |
| 195 | top: 0; |
| 196 | padding: 14px; |
| 197 | border-radius: 0; |
| 198 | border-right: 1px solid #b8b8b8; |
| 199 | font-size: 14px; |
| 200 | line-height: 20px; |
| 201 | color: #333; |
| 202 | background: #f1f1f1; |
| 203 | text-decoration: none; |
| 204 | |
| 205 | &:focus { |
| 206 | outline: none; |
| 207 | } |
| 208 | } |
| 209 | } |
| 210 | |
| 211 | html[dir='rtl']='rtl'] { |
| 212 | .ffm-checkbox-field { |
| 213 | label { |
| 214 | top: 6px; |
| 215 | &::before { |
| 216 | right: 0; |
| 217 | } |
| 218 | |
| 219 | &::after { |
| 220 | top: -3px; |
| 221 | right: 0; |
| 222 | margin-right: 1px; |
| 223 | } |
| 224 | } |
| 225 | } |
| 226 | .ffm-radio-field { |
| 227 | label { |
| 228 | padding-right: 32px !important; |
| 229 | &::before { |
| 230 | right: 0; |
| 231 | } |
| 232 | |
| 233 | &::after { |
| 234 | right: 6px; |
| 235 | } |
| 236 | } |
| 237 | } |
| 238 | } |
| 239 |