SmartWave Motorized Dual Drapery

SmartWave Shades Verified independent store

→

/* Card UI - scoped to this component */ #sw-width-calculator .sw-card{ border-radius: 16px; background: #fff; border: 1px solid rgba(0,0,0,.08); box-shadow: 0 10px 30px rgba(0,0,0 ,.06); padding: 18px; } #sw-width-calculator .sw-header{ display:flex; align-items:flex-start; justify-content:space-between; gap: 12px; margin-bottom: 14px; } #sw-width-calculator .sw-title{ margin:0; font-size: 25px; line-height: 1.2; letter-spacing: -0.2px; } #sw-width-calculator .sw-sub{ margin-top: 6px; margin-bottom: 0; font-size: 16px; opacity: .7; } #sw-width-calculator .sw-grid{ display:grid; grid-template-columns: 1fr; gap: 14px; } @media (min-width: 760px){ #sw-width-calculator .sw-grid{ grid-template-columns: 1.2fr 0.8fr; align-items: stretch; } } #sw-width-calculator .sw-field{ border-radius: 14px; border: 1px solid rgba(0,0,0,.10); padding: 14px; background: rgba(0,0,0,.02); } #sw-width-calculator label{ display:block; font-weight: 600; font-size: 16px; margin-bottom: 8px; } #sw-width-calculator .sw-input{ width: 100%; max-width: 360px; padding: 12px 12px; border-radius: 12px; border: 1px solid rgba(0,0,0,.20); background: #fff; font-size: 16px; outline: none; transition: box-shadow .15s ease, border-color .15s ease; } #sw-width-calculator .sw-input:focus{ border-color: rgba(71,157,204,.55); box-shadow: 0 0 0 4px rgba(71,157,204,.15); } #sw-width-calculator .sw-hint{ margin: 10px 0 0; font-size: 13px; opacity: .65; } #sw-width-calculator .sw-result{ border-radius: 14px; border: 1px solid rgba(71,157,204,.25); background: rgba(71,157,204,.06); padding: 14px; display:flex; flex-direction: column; justify-content: center; gap: 6px; min-height: 118px; } #sw-width-calculator .sw-result-label{ font-size: 16px; font-weight: 600; opacity: .85; } #sw-width-calculator .sw-result-value{ font-weight: 800; color: #479dcc; font-size: 25px; line-height: 1.05; letter-spacing: -0.6px; } #sw-width-calculator .sw-result-unit{ font-size: 13px; opacity: .7; margin-left: 6px; font-weight: 600; } #sw-width-calculator .sw-empty{ opacity: .5; font-weight: 700; } /* Added info section styles */ #sw-width-calculator .sw-info{ margin-top: 16px; border-top: 1px solid rgba(0,0,0,.08); padding-top: 14px; } #sw-width-calculator .sw-info h3{ margin: 0 0 8px; font-size: 18px; line-height: 1.25; letter-spacing: -0.1px; } #sw-width-calculator .sw-info p{ margin: 8px 0; font-size: 15px; line-height: 1.55; opacity: .85; } #sw-width-calculator .sw-examples{ margin-top: 12px; display: grid; grid-template-columns: 1fr; gap: 12px; } @media (min-width: 760px){ #sw-width-calculator .sw-examples{ grid-template-columns: 1fr 1fr; } } #sw-width-calculator .sw-example-card{ border-radius: 14px; border: 1px solid rgba(0,0,0,.10); background: rgba(0,0,0,.02); padding: 14px; } #sw-width-calculator .sw-example-title{ margin: 0 0 10px; font-size: 16px; font-weight: 700; line-height: 1.25; } #sw-width-calculator .sw-kv{ margin: 0; padding: 0; list-style: none; } #sw-width-calculator .sw-kv li{ display:flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-top: 1px solid rgba(0,0,0,.06); font-size: 14px; line-height: 1.4; } #sw-width-calculator .sw-kv li:first-child{ border-top: none; padding-top: 0; } #sw-width-calculator .sw-k{ opacity: .75; font-weight: 600; } #sw-width-calculator .sw-v{ font-weight: 700; text-align: right; white-space: nowrap; } #sw-width-calculator .sw-note{ margin-top: 10px; font-size: 14px; line-height: 1.5; opacity: .85; } Ensure Full Window Visibility When Opened If you want the window fully visible when the drapes are open, enter your window width below to get a recommended order width. Window Width (inches) Tip: You can enter decimals (e.g., 60.25). Minimum Recommended Order Width — in Minimum Recommended Order Width (for full window clearance when opened) The calculated width is the minimum recommended order width to keep the window fully visible when the drapes are open. If you order below this width, the side fabric stacks may cover the window edges. You can also adjust the order width based on your wall space and design preference. Example 1 (Order based on space and design preference) Total wall width200" Window width140" Minimum recommended order width184 1/8" You can order the minimum recommended width of 184 1/8" for full window clearance when opened. If you prefer a cleaner, seamless look by covering the entire wall, you may also order 200" instead. Example 2 (Wall width limits full clearance) Total wall width200" Window width170" Minimum recommended order width217 1/4" Since your wall width is 200", the maximum you can order is 200". In this case, about 9" on each side of the window opening may remain partially covered when the drapes are fully open. (function () { // ====== Constants (cm) used internally ====== var FIXED_STACK_CM = 62; var CARRIER_BLOCK_CM = 40; var PITCH_CM = 13.6; var PER_CARRIER_CM = 1.6; var EXTRA_CM = 10; var N_MIN = 1; function safeNumber(v) { var n = Number(v); return Number.isFinite(n) ? n : null; } function roundToNearestEighth(inches) { return Math.round(inches * 8) / 8; } function toEighthFraction(inches) { var sign = inches < 0 ? "-" : ""; inches = Math.abs(inches); var whole = Math.floor(inches + 1e-9); var eighths = Math.round((inches - whole) * 8); if (eighths === 8) { whole += 1; eighths = 0; } var map = ["", "1/8", "1/4", "3/8", "1/2", "5/8", "3/4", "7/8"]; var frac = map[eighths] || ""; if (!frac) return sign + String(whole); if (whole === 0) return sign + frac; return sign + whole + " " + frac; } function calc(W_in) { // Convert inches to cm for original formula var W_cm = W_in * 2.54; // N = ceil((Wcm − 40)/13.6 + 1) var rawN = (W_cm - CARRIER_BLOCK_CM) / PITCH_CM + 1; var N = Math.ceil(rawN); if (N < N_MIN) N = N_MIN; // Ordercm = Wcm + 62 + N×1.6 + 10 var order_cm = W_cm + FIXED_STACK_CM + (N * PER_CARRIER_CM) + EXTRA_CM; // Convert to inches and round to nearest 1/8" var order_in = order_cm / 2.54; var order_rounded = roundToNearestEighth(order_in); return { order_rounded: order_rounded }; } var input = document.getElementById('sw_w_in'); var out = document.getElementById('sw_order'); if (!input || !out) return; function renderEmpty() { out.textContent = "—"; out.classList.add('sw-empty'); } function renderValue(text) { out.textContent = text; out.classList.remove('sw-empty'); } function update() { var W = safeNumber(input.value); if (W === null || W Show more