@odus/checkout 0.13.0 → 0.14.0-beta.0
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/checkout.d.ts +28 -2
- package/dist/checkout.es.js +3730 -1748
- package/dist/index.css +1 -1
- package/dist/package.json +4 -1
- package/package.json +4 -1
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.form-container{display:flex;flex-direction:column;gap:24px;padding:4px;position:relative;min-height:340px;max-width:100%;text-align:left}.form-container>*{font-family:inherit}.card-details{display:flex}.error-messages-container>*{display:none}.error-messages-container>*:first-child{display:block}
|
|
1
|
+
.form-container{display:flex;flex-direction:column;gap:24px;padding:4px;position:relative;min-height:340px;max-width:100%;text-align:left}.form-container>*{font-family:inherit}.card-details{display:flex}.error-messages-container>*{display:none}.error-messages-container>*:first-child{display:block}.input-wrapper{display:flex;flex-direction:column;width:100%;min-width:0;flex-grow:1;flex-basis:0;box-sizing:border-box;align-items:stretch}.input-wrapper *{box-sizing:border-box}.form-input{opacity:1;font-weight:400;letter-spacing:.02em;transition:box-shadow .1s ease-in,border-radius .2s ease-in;box-shadow:0 0 0 1px #e0e0e0,0 2px 4px #00000012,0 1px 1.5px #0000000d;background:#fff;padding:8px 12px;border:none;outline:none;line-height:1.5;z-index:0;box-sizing:border-box;min-height:0;flex:1}.form-input-error{color:#dc2727}.form-input::placeholder{color:#717173;opacity:.3}.form-input:focus{box-shadow:0 0 0 1px #3297d3b3,0 1px 1px #00000012,0 0 0 4px #3297d34d;z-index:2}.form-helper-text{color:#dc2727;font-size:12px;font-weight:500;margin-top:4px;display:block;overflow:hidden;max-height:100px;transition:max-height .3s ease-in-out,opacity .3s ease-in-out,margin .3s ease-in-out}.form-helper-text-hidden{max-height:0;opacity:0;margin-top:0;overflow:hidden}.input-label{margin-bottom:6px}.card-element{position:relative;height:38.5px;transition:box-shadow .1s ease-in;box-shadow:0 0 0 1px #e0e0e0,0 2px 4px #00000012,0 1px 1.5px #0000000d;padding:0;border:none;background:#fff;border-radius:inherit;box-sizing:border-box}.card-element iframe{width:100%;min-width:0;display:block}.card-element-focus{box-shadow:0 0 0 1px #3297d3b3,0 1px 1px #00000012,0 0 0 4px #3297d34d}.card-icon{width:16px;transition:opacity .6s ease-in;opacity:1}.card-icon img{max-width:100%;display:block;height:auto}.cards-position{position:absolute;z-index:10;right:20px;top:33px;display:flex;align-items:center;gap:8px;pointer-events:none}.loading{position:relative}.loading:after{content:"";position:absolute;inset:0;height:100%;width:100%;background-color:#fff;border-radius:inherit}@media only screen and (min-width: 600px){.card-icon{width:20px}}.skeleton-container{display:flex;flex-direction:column;gap:12px;padding:4px;position:relative;height:49px;max-width:100%;text-align:left;inset:0;width:100%}.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;border-radius:8px;animation:shimmer 1.5s ease-in-out infinite;position:relative;overflow:hidden}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton-field{display:flex;flex-direction:column;gap:8px}.skeleton-label{height:16px;width:80px;border-radius:4px}.skeleton-input,.skeleton-payment-method{height:35px;width:100%;border-radius:8px}.skeleton-card-row{display:flex;gap:12px}.skeleton-card-row .skeleton-field{flex:1}.skeleton-submit-button{height:35px;width:100%;border-radius:8px}.skeleton-separator-text{height:14px;width:100px;border-radius:4px}.payment-separator_container{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}.paypal{background-color:#ffc439;color:#253b80;font-weight:700;padding:8px 16px;box-shadow:0 2px 4px #0000001a;text-transform:none;cursor:pointer;border-radius:4px}.paypal:hover{background-color:#ffc439;filter:brightness(.95)}.paypal-icon-container{display:flex;align-items:center;justify-content:center}.paypal-icon-container img{width:69px;height:22px}.payment-separator{width:100%;display:flex;align-items:center;justify-content:space-between;margin:12px 0 -16px}.payment-separator__line{height:1.3px;flex-grow:1;background:#9f9f9f}.payment-separator__text{font-size:14px;color:#0d0d0d;padding:0 16px;margin:0;font-weight:400}.button{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:8px 16px;font-size:14px;font-weight:500;line-height:1.5;text-align:center;cursor:pointer;transition:all .2s ease;font-weight:700;border:none;outline:none;white-space:nowrap;height:min-content;width:100%}.disabled{pointer-events:none}.valid{outline:none;overflow:hidden;transition:all .3s ease}.valid:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:left .5s;animation:glowSlide 6s infinite}@keyframes glowSlide{0%{left:-100%}50%{left:100%}to{left:100%}}.valid:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 25%,rgba(255,255,255,.3) 50%,rgba(255,255,255,.1) 75%,transparent 100%);transform:translate(-100%);animation:smoothGlow 7s infinite}@keyframes smoothGlow{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.error-alert{background-color:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:16px;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;animation:slideIn .3s ease-out}.error-alert-content{display:flex;align-items:flex-start;gap:12px}.error-alert-icon-container{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;background-color:#fee2e2;border-radius:50%;color:#dc2626}.error-alert-icon{color:#dc2626}.error-alert-text-container{flex:1;min-width:0}.error-alert-title{margin:0 0 4px;font-size:14px;font-weight:600;color:#991b1b;line-height:1.4}.error-alert-message{margin:0;font-size:14px;color:#7f1d1d;line-height:1.5;word-break:break-word}.blur-bg{position:absolute;inset:0;height:100%;width:100%;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(3.5px);z-index:9999}.loader{width:64px;height:64px;border-radius:50%;background:conic-gradient(from 270deg,#134e4a 0deg,#0f766e 90deg,#0d9488 180deg,#5eaba3 240deg,rgba(13,148,136,.2) 300deg,transparent 330deg);animation:spin 1s linear infinite;position:relative}.loader:before{content:"";position:absolute;inset:6px;border-radius:50%;background:#fff}@keyframes spin{to{transform:rotate(360deg)}}.title{margin-top:20px;font-size:18px;color:#4f4f4f;animation:fadeIn 1s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
|
package/dist/package.json
CHANGED
package/package.json
CHANGED