Untitled
unknown
plain_text
2 years ago
10 kB
3
Indexable
<!DOCTYPE html> <html> <head> <title>Sandbox</title> <meta charset="UTF-8" /> <link rel="stylesheet" href="src/styles.css" /> </head> <body> <div id="shipwallet-container" style="min-height: 350px"> <style> #ingrid-loader { min-height: 350px; padding: 32px 12px 12px 12px; border: 1px solid #e6e6e6; border-radius: 6px; background-color: white; } ._ingrid-skeleton { background-color: #ededed; position: relative; overflow: hidden; -webkit-mask-image: -webkit-radial-gradient(white, black); } ._ingrid-skeleton::before { content: ""; background-image: linear-gradient( 90deg, #ededed 0px, #f8f8f8 80px, #ededed 160px ); animation: transform 1.8s ease-out infinite; transform-origin: 0 0; width: 100vw; height: 100%; left: -160px; position: absolute; display: block; } ._ingrid-skeleton-text { height: 10px; } ._ingrid-skeleton-shipping-indicator { height: 45px; width: 100%; } ._ingrid-skeleton-shipping-indicator-label { margin-bottom: 20px; width: 100px; } ._ingrid-skeleton-delivery-categories-wrapper { display: flex; flex-direction: column; width: 100%; padding-bottom: 9px; } ._ingrid-skeleton-shipping-option-first-row { display: flex; align-items: center; width: 100%; } ._ingrid-skeleton-checkbox { width: 20px; height: 20px; border-radius: 10px; margin-right: 8px; } ._ingrid-skeleton-flex-1 { flex: 1; } ._ingrid-skeleton-shipping-option-name { width: 60%; } ._ingrid-skeleton-price { width: 30px; margin-right: 12px; } ._ingrid-skeleton-shipping-option-second-row { display: flex; width: 100%; } ._ingrid-skeleton-delivery-description { width: 35%; } ._ingrid-skeleton-delivery-logo { width: 32px; height: 32px; border-radius: 50%; } ._ingrid-skeleton-delivery-categories-label { width: 200px; } ._ingrid-skeleton-delivery-category-wrapper { padding-bottom: 16px; } @keyframes transform { to { transform: translateX(120%); } } ._ingrid-skeleton-zipcode-label { width: 70px; margin-bottom: 12px; } ._ingrid-skeleton-zipcode-input { height: 50px; width: 100%; margin-bottom: 28px; } </style> <div id="ingrid-loader"> <div style="width: 100%"> <div> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-zipcode-label" ></div> <div class="_ingrid-skeleton _ingrid-skeleton-zipcode-input"></div> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-shipping-indicator-label" ></div> <div class="_ingrid-skeleton-delivery-categories-wrapper"> <div class="_ingrid-skeleton-delivery-category-wrapper"> <div class="_ingrid-skeleton-shipping-option-first-row"> <div class="_ingrid-skeleton _ingrid-skeleton-checkbox"></div> <div class="_ingrid-skeleton-flex-1"> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-shipping-option-name" ></div> </div> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-price" ></div> <div class="_ingrid-skeleton _ingrid-skeleton-delivery-logo" ></div> </div> <div class="_ingrid-skeleton-shipping-option-second-row"> <div class="_ingrid-skeleton-checkbox"></div> <div class="_ingrid-skeleton-flex-1"> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-delivery-description" ></div> </div> </div> </div> <div class="_ingrid-skeleton-delivery-category-wrapper"> <div class="_ingrid-skeleton-shipping-option-first-row"> <div class="_ingrid-skeleton _ingrid-skeleton-checkbox"></div> <div class="_ingrid-skeleton-flex-1"> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-shipping-option-name" ></div> </div> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-price" ></div> <div class="_ingrid-skeleton _ingrid-skeleton-delivery-logo" ></div> </div> <div class="_ingrid-skeleton-shipping-option-second-row"> <div class="_ingrid-skeleton-checkbox"></div> <div class="_ingrid-skeleton-flex-1"> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-delivery-description" ></div> </div> </div> </div> <div class="_ingrid-skeleton-delivery-category-wrapper"> <div class="_ingrid-skeleton-shipping-option-first-row"> <div class="_ingrid-skeleton _ingrid-skeleton-checkbox"></div> <div class="_ingrid-skeleton-flex-1"> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-shipping-option-name" ></div> </div> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-price" ></div> <div class="_ingrid-skeleton _ingrid-skeleton-delivery-logo" ></div> </div> <div class="_ingrid-skeleton-shipping-option-second-row"> <div class="_ingrid-skeleton-checkbox"></div> <div class="_ingrid-skeleton-flex-1"> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-delivery-description" ></div> </div> </div> </div> <div class="_ingrid-skeleton-shipping-option-first-row"> <div class="_ingrid-skeleton _ingrid-skeleton-checkbox"></div> <div class="_ingrid-skeleton-flex-1"> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-shipping-option-name" ></div> </div> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-price" ></div> <div class="_ingrid-skeleton _ingrid-skeleton-delivery-logo" ></div> </div> <div class="_ingrid-skeleton-shipping-option-second-row"> <div class="_ingrid-skeleton-checkbox"></div> <div class="_ingrid-skeleton-flex-1"> <div class="_ingrid-skeleton _ingrid-skeleton-text _ingrid-skeleton-delivery-description" ></div> </div> </div> </div> </div> </div> </div> </div> <!-- Your HTML content --> <script> let counter = 0; setTimeout(() => { if (counter == 0) { counter++; location.reload(); } else { } }, 2000); window.onload = function () { (function (window, instanceId, containerId, document) { window[instanceId] = window[instanceId] || function () { (window[instanceId].q = window[instanceId].q || []).push( arguments ); }; var bootstrapURL = "https://cdn-stage.ingrid.com/checkout-widget/553f1d1/bootstrap.js"; var bootstrapFallbackURL = ""; if (/MSIE|Trident/.test(window.navigator.userAgent)) { bootstrapURL = bootstrapFallbackURL; } window[instanceId].config = { container: document.getElementById(containerId), bootstrapURL: bootstrapURL, bootstrapFallbackURL: bootstrapFallbackURL, features: { // Your features here }, instanceId: instanceId, locale: "sv-SE", logging: "https://c7a68a2a3cfe4024bf719e6485aa8751@sentry.io/141995", status: "", style: null, session: "VM2-417d15049cb94ff397fba4ffca775f5a", token: "Y2xpZW50dHdvOjNmZjBhYWIwN2NlNTQ2N2Y4NzllNDk3ZWExNDgzMTcz", version: "72be568e", loaderId: "ingrid-loader", }; var container = document.getElementById(containerId); var bootstrapScript = document.createElement("script"); bootstrapScript.async = true; bootstrapScript.src = bootstrapURL; bootstrapScript.className = "ingrid-bootstrap-script"; bootstrapScript.addEventListener("load", function (e) { if (typeof _ingrid_initializeWidgetInstance === "function") { _ingrid_initializeWidgetInstance(instanceId); } }); container.appendChild(bootstrapScript); })(window, "_sw", "shipwallet-container", document); }; </script> </body> </html>
Editor is loading...
Leave a Comment