{"id":165,"date":"2026-07-04T20:21:38","date_gmt":"2026-07-04T20:21:38","guid":{"rendered":"https:\/\/cartlanka.lk\/?page_id=165"},"modified":"2026-07-04T20:21:38","modified_gmt":"2026-07-04T20:21:38","slug":"passport-photo","status":"publish","type":"page","link":"https:\/\/cartlanka.lk\/index.php\/passport-photo\/","title":{"rendered":"passport photo"},"content":{"rendered":"\n\t<style>\n\t\t.pstc-wrap {\n\t\t\t--pstc-primary: #2563eb;\n\t\t\t--pstc-primary-dark: #1d4ed8;\n\t\t\t--pstc-border: #e2e8f0;\n\t\t\t--pstc-bg: #f8fafc;\n\t\t\t--pstc-text: #1e293b;\n\t\t\t--pstc-muted: #64748b;\n\t\t\tfont-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\n\t\t\tcolor: var(--pstc-text);\n\t\t\tmax-width: 880px;\n\t\t\tmargin: 1.5em auto;\n\t\t\tbackground: #fff;\n\t\t\tborder: 1px solid var(--pstc-border);\n\t\t\tborder-radius: 14px;\n\t\t\tpadding: 28px;\n\t\t\tbox-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);\n\t\t\tbox-sizing: border-box;\n\t\t}\n\t\t.pstc-wrap * { box-sizing: border-box; }\n\t\t.pstc-title { font-size: 22px; font-weight: 700; margin: 0 0 6px; }\n\t\t.pstc-sub { font-size: 14px; color: var(--pstc-muted); margin: 0 0 22px; }\n\n\t\t.pstc-grid {\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-columns: 1fr 1fr;\n\t\t\tgap: 16px;\n\t\t\tmargin-bottom: 18px;\n\t\t}\n\t\t@media (max-width: 640px) {\n\t\t\t.pstc-grid { grid-template-columns: 1fr; }\n\t\t}\n\n\t\t.pstc-field label {\n\t\t\tdisplay: block;\n\t\t\tfont-size: 13px;\n\t\t\tfont-weight: 600;\n\t\t\tmargin-bottom: 6px;\n\t\t\tcolor: var(--pstc-text);\n\t\t}\n\t\t.pstc-field select,\n\t\t.pstc-field input[type=\"file\"] {\n\t\t\twidth: 100%;\n\t\t\tpadding: 10px 12px;\n\t\t\tfont-size: 14px;\n\t\t\tborder: 1px solid var(--pstc-border);\n\t\t\tborder-radius: 8px;\n\t\t\tbackground: var(--pstc-bg);\n\t\t\tcolor: var(--pstc-text);\n\t\t\ttransition: border-color .15s ease, box-shadow .15s ease;\n\t\t}\n\t\t.pstc-field select:focus,\n\t\t.pstc-field input[type=\"file\"]:focus {\n\t\t\toutline: none;\n\t\t\tborder-color: var(--pstc-primary);\n\t\t\tbox-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);\n\t\t}\n\t\t.pstc-size-hint { font-size: 12px; color: var(--pstc-muted); margin-top: 6px; }\n\n\t\t.pstc-zoom-row { margin: 4px 0 20px; }\n\t\t.pstc-zoom-row input[type=\"range\"] { width: 100%; }\n\n\t\t.pstc-preview-area {\n\t\t\tdisplay: flex;\n\t\t\tflex-wrap: wrap;\n\t\t\tgap: 24px;\n\t\t\talign-items: flex-start;\n\t\t\tmargin-bottom: 22px;\n\t\t\tpadding: 18px;\n\t\t\tbackground: var(--pstc-bg);\n\t\t\tborder: 1px dashed var(--pstc-border);\n\t\t\tborder-radius: 10px;\n\t\t}\n\t\t.pstc-crop-box {\n\t\t\tposition: relative;\n\t\t\twidth: 220px;\n\t\t\theight: 220px;\n\t\t\toverflow: hidden;\n\t\t\tbackground: #e2e8f0 url(\"data:image\/svg+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' width='40' height='40'><text x='6' y='24' font-size='12' fill='%2394a3b8'>No photo<\/text><\/svg>\") center\/contain no-repeat;\n\t\t\tborder-radius: 8px;\n\t\t\tborder: 1px solid var(--pstc-border);\n\t\t\ttouch-action: none;\n\t\t\tcursor: grab;\n\t\t}\n\t\t.pstc-crop-box:active { cursor: grabbing; }\n\t\t.pstc-crop-box canvas { position: absolute; top: 0; left: 0; }\n\t\t.pstc-crop-caption { font-size: 12px; color: var(--pstc-muted); margin-top: 8px; max-width: 220px; }\n\n\t\t.pstc-sheet-preview {\n\t\t\tflex: 1;\n\t\t\tmin-width: 220px;\n\t\t\ttext-align: center;\n\t\t}\n\t\t.pstc-sheet-preview canvas,\n\t\t.pstc-sheet-preview img {\n\t\t\tmax-width: 100%;\n\t\t\theight: auto;\n\t\t\tborder: 1px solid var(--pstc-border);\n\t\t\tborder-radius: 6px;\n\t\t\tbackground: #fff;\n\t\t\tbox-shadow: 0 2px 8px rgba(15,23,42,0.08);\n\t\t}\n\n\t\t.pstc-actions {\n\t\t\tdisplay: flex;\n\t\t\tflex-wrap: wrap;\n\t\t\tgap: 12px;\n\t\t\tmargin-bottom: 22px;\n\t\t}\n\t\t.pstc-btn {\n\t\t\tappearance: none;\n\t\t\tborder: none;\n\t\t\tcursor: pointer;\n\t\t\tfont-size: 14px;\n\t\t\tfont-weight: 600;\n\t\t\tpadding: 12px 20px;\n\t\t\tborder-radius: 8px;\n\t\t\ttransition: transform .05s ease, background-color .15s ease;\n\t\t}\n\t\t.pstc-btn:active { transform: translateY(1px); }\n\t\t.pstc-btn-primary { background: var(--pstc-primary); color: #fff; }\n\t\t.pstc-btn-primary:hover { background: var(--pstc-primary-dark); }\n\t\t.pstc-btn-secondary { background: #fff; color: var(--pstc-text); border: 1px solid var(--pstc-border); }\n\t\t.pstc-btn-secondary:hover { background: var(--pstc-bg); }\n\t\t.pstc-btn:disabled { opacity: .5; cursor: not-allowed; }\n\n\t\t.pstc-status { font-size: 13px; color: var(--pstc-muted); min-height: 18px; margin-bottom: 6px; }\n\t\t.pstc-status.pstc-error { color: #b91c1c; }\n\t\t.pstc-status.pstc-ok { color: #15803d; }\n\n\t\t.pstc-ad-slot {\n\t\t\tmargin-top: 26px;\n\t\t\tpadding: 14px;\n\t\t\tborder: 1px dashed #cbd5e1;\n\t\t\tborder-radius: 10px;\n\t\t\tbackground: #f1f5f9;\n\t\t\ttext-align: center;\n\t\t\tfont-size: 12px;\n\t\t\tcolor: var(--pstc-muted);\n\t\t}\n\t\t.pstc-ad-slot span {\n\t\t\tdisplay: inline-block;\n\t\t\tmargin-bottom: 8px;\n\t\t\tfont-weight: 600;\n\t\t\tletter-spacing: .03em;\n\t\t\ttext-transform: uppercase;\n\t\t\tfont-size: 11px;\n\t\t\tcolor: #94a3b8;\n\t\t}\n\t<\/style>\n\n\t<div class=\"pstc-wrap\">\n\t\t<h2 class=\"pstc-title\">Passport &amp; Visa Photo Size Converter<\/h2>\n\t\t<p class=\"pstc-sub\">Upload a photo, pick your country's official size, and download a single photo or a ready-to-print sheet. Everything runs in your browser \\u2014 your photo is never uploaded anywhere.<\/p>\n\n\t\t<div class=\"pstc-grid\">\n\t\t\t<div class=\"pstc-field\">\n\t\t\t\t<label for=\"pstc-file\">1. Upload your photo<\/label>\n\t\t\t\t<input type=\"file\" id=\"pstc-file\" accept=\"image\/*\" \/>\n\t\t\t<\/div>\n\t\t\t<div class=\"pstc-field\">\n\t\t\t\t<label for=\"pstc-country\">2. Country \/ photo size<\/label>\n\t\t\t\t<select id=\"pstc-country\"><\/select>\n\t\t\t\t<div class=\"pstc-size-hint\" id=\"pstc-size-hint\"><\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t<div class=\"pstc-grid\">\n\t\t\t<div class=\"pstc-field\">\n\t\t\t\t<label for=\"pstc-copies\">3. Copies per print sheet<\/label>\n\t\t\t\t<select id=\"pstc-copies\">\n\t\t\t\t\t<option value=\"2\">2 photos<\/option>\n\t\t\t\t\t<option value=\"4\" selected>4 photos<\/option>\n\t\t\t\t\t<option value=\"8\">8 photos<\/option>\n\t\t\t\t<\/select>\n\t\t\t<\/div>\n\t\t\t<div class=\"pstc-field\">\n\t\t\t\t<label for=\"pstc-zoom\">4. Adjust zoom \/ position (drag photo to reposition)<\/label>\n\t\t\t\t<div class=\"pstc-zoom-row\">\n\t\t\t\t\t<input type=\"range\" id=\"pstc-zoom\" min=\"100\" max=\"300\" value=\"100\" step=\"1\" \/>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t<div class=\"pstc-preview-area\">\n\t\t\t<div>\n\t\t\t\t<div class=\"pstc-crop-box\" id=\"pstc-crop-box\">\n\t\t\t\t\t<canvas id=\"pstc-crop-canvas\" width=\"220\" height=\"220\"><\/canvas>\n\t\t\t\t<\/div>\n\t\t\t\t<p class=\"pstc-crop-caption\">Live crop preview \\u2014 drag inside the box to reposition your face, use the zoom slider to adjust.<\/p>\n\t\t\t<\/div>\n\t\t\t<div class=\"pstc-sheet-preview\">\n\t\t\t\t<canvas id=\"pstc-sheet-canvas\" width=\"1\" height=\"1\"><\/canvas>\n\t\t\t\t<p class=\"pstc-crop-caption\" id=\"pstc-sheet-caption\">Your print sheet preview will appear here after you upload a photo.<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t<div class=\"pstc-status\" id=\"pstc-status\"><\/div>\n\n\t\t<div class=\"pstc-actions\">\n\t\t\t<button type=\"button\" class=\"pstc-btn pstc-btn-primary\" id=\"pstc-download-single\" disabled>Download Single Photo<\/button>\n\t\t\t<button type=\"button\" class=\"pstc-btn pstc-btn-primary\" id=\"pstc-download-sheet\" disabled>Download Print Sheet<\/button>\n\t\t\t<button type=\"button\" class=\"pstc-btn pstc-btn-secondary\" id=\"pstc-print-sheet\" disabled>Print Sheet<\/button>\n\t\t<\/div>\n\n\t\t<!-- ============================================================ -->\n\t\t<!-- ADSENSE PLACEHOLDER \\u2014 paste your Google AdSense responsive  -->\n\t\t<!-- ad unit code inside this div.                                 -->\n\t\t<!-- ============================================================ -->\n\t\t<div class=\"pstc-ad-slot\" id=\"pstc-adsense-slot\">\n\t\t\t<span>Advertisement<\/span>\n\t\t\t<!-- PASTE YOUR GOOGLE ADSENSE CODE HERE -->\n\t\t<\/div>\n\n\t<\/div>\n\n\t\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-165","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/cartlanka.lk\/index.php\/wp-json\/wp\/v2\/pages\/165","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cartlanka.lk\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cartlanka.lk\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cartlanka.lk\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cartlanka.lk\/index.php\/wp-json\/wp\/v2\/comments?post=165"}],"version-history":[{"count":1,"href":"https:\/\/cartlanka.lk\/index.php\/wp-json\/wp\/v2\/pages\/165\/revisions"}],"predecessor-version":[{"id":166,"href":"https:\/\/cartlanka.lk\/index.php\/wp-json\/wp\/v2\/pages\/165\/revisions\/166"}],"wp:attachment":[{"href":"https:\/\/cartlanka.lk\/index.php\/wp-json\/wp\/v2\/media?parent=165"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}