1(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,94013,e=>{"use strict";var t=e.i(43476),a=e.i(71645),r=e.i(27423);function s(){let{theme:e,setTheme:s,resolvedTheme:n}=(0,r.useTheme)(),[o,i]=(0,a.useState)(!1);return(0,a.useEffect)(()=>{i(!0)},[]),(0,t.jsx)("button",{onClick:()=>{"system"===e?s("dark"===n?"light":"dark"):"light"===e?s("dark"):s("light")},className:"flex items-center gap-1.5 text-sm text-muted hover:text-foreground transition-colors","aria-label":"Toggle theme",title:o?`Current: ${"system"===e?`System (${n})`:e}`:void 0,children:o&&"dark"!==n?(0,t.jsx)("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"})}):(0,t.jsx)("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"})})})}e.s(["ThemeToggle",()=>s])},2049,e=>{"use strict";var t=e.i(43476),a=e.i(85149),r=e.i(21724),s=e.i(12320);function n({isOpen:e,onClose:n,toolName:o="tool"}){return e?(0,t.jsx)("div",{className:"fixed inset-0 z-50 flex items-center justify-center p-4 bg-background/80 backdrop-blur-sm animate-in fade-in duration-200",children:(0,t.jsxs)("div",{className:"max-w-md w-full bg-card border border-border rounded-2xl p-6 sm:p-8 shadow-2xl animate-in zoom-in-95 duration-200",children:[(0,t.jsx)("div",{className:"w-12 h-12 rounded-full bg-gradient-to-br from-accent to-accent-secondary flex items-center justify-center mb-4 mx-auto",children:(0,t.jsx)("span",{className:"text-2xl",children:"â¨"})}),(0,t.jsx)("h3",{className:"text-xl sm:text-2xl font-semibold text-center mb-3",children:"Love this tool?"}),(0,t.jsx)("p",{className:"text-muted text-center mb-6 leading-relaxed",children:"Get the Chrome extension for instant access to all tools + the ability to capture and track your pages over time."}),(0,t.jsxs)("div",{className:"flex flex-col gap-3",children:[(0,t.jsxs)("a",{href:a.CHROME_STORE_URL,target:"_blank",rel:"noopener noreferrer",onClick:()=>{(0,r.track)("post_tool_prompt_click",{tool_name:o,action:"get_extension"}),(0,s.trackGAEvent)("post_tool_prompt_click",{tool_name:o,action:"get_extension"}),n()},className:"inline-flex items-center justify-center gap-2 px-6 py-3 bg-foreground text-background rounded-full font-medium hover:opacity-90 transition-opacity",children:["Get Chrome Extension",(0,t.jsx)("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})})]}),(0,t.jsx)("button",{onClick:()=>{(0,r.track)("post_tool_prompt_click",{tool_name:o,action:"continue"}),(0,s.trackGAEvent)("post_tool_prompt_click",{tool_name:o,action:"continue"}),n()},className:"px-6 py-3 border border-border rounded-full font-medium hover:bg-card/80 transition-colors",children:"Continue"})]}),(0,t.jsx)("p",{className:"text-xs text-muted/60 text-center mt-4",children:"Free forever ⢠No credit card required"})]})}):null}e.s(["PostToolPrompt",()=>n])},25665,e=>{"use strict";var t=e.i(43476),a=e.i(71645),r=e.i(26732),s=e.i(21724),n=e.i(12320),o=e.i(22016),i=e.i(57688),l=e.i(94013),d=e.i(2049),c=e.i(85149);let m={none:null,gradient1:"linear-gradient(135deg, #667eea 0%, #764ba2 100%)",gradient2:"linear-gradient(135deg, #f093fb 0%, #f5576c 100%)",gradient3:"linear-gradient(135deg, #4facfe 0%, #00f2fe 100%)",gradient4:"linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)",gradient5:"linear-gradient(135deg, #fa709a 0%, #fee140 100%)",gradient6:"linear-gradient(135deg, #a8edea 0%, #fed6e3 100%)",gradient7:"linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%)",gradient8:"linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%)","solid-dark":"#1a1a2e","solid-light":"#f5f5f7"},u={gradient1:[{pos:0,color:"#667eea"},{pos:1,color:"#764ba2"}],gradient2:[{pos:0,color:"#f093fb"},{pos:1,color:"#f5576c"}],gradient3:[{pos:0,color:"#4facfe"},{pos:1,color:"#00f2fe"}],gradient4:[{pos:0,color:"#43e97b"},{pos:1,color:"#38f9d7"}],gradient5:[{pos:0,color:"#fa709a"},{pos:1,color:"#fee140"}],gradient6:[{pos:0,color:"#a8edea"},{pos:1,color:"#fed6e3"}],gradient7:[{pos:0,color:"#ff9a9e"},{pos:1,color:"#fecfef"}],gradient8:[{pos:0,color:"#ffecd2"},{pos:1,color:"#fcb69f"}]},h={none:null,soft:{blur:30,opacity:.15},medium:{blur:50,opacity:.25},hard:{blur:80,opacity:.4}},x={auto:null,"16:9":16/9,"9:16":9/16,"1.91:1":1.91,"1:1":1,"4:5":.8,"16:10":1.6},g={twitter:{gradient:"gradient1",padding:48,radius:12,shadow:"medium",aspectRatio:"16:9",targetSize:{width:1200,height:675}},linkedin:{gradient:"solid-light",padding:40,radius:8,shadow:"soft",aspectRatio:"1.91:1",targetSize:{width:1200,height:628}},instagram:{gradient:"gradient5",padding:40,radius:16,shadow:"medium",aspectRatio:"1:1",targetSize:{width:1080,height:1080}},whatsapp:{gradient:"gradient2",padding:60,radius:16,shadow:"medium",aspectRatio:"9:16",targetSize:{width:1080,height:1920}},youtube:{gradient:"gradient4",padding:48,radius:12,shadow:"hard",aspectRatio:"16:9",targetSize:{width:1280,height:720}},producthunt:{gradient:"gradient3",padding:48,radius:12,shadow:"medium",aspectRatio:"16:10",targetSize:{width:1270,height:760}}};function p(){let{data:e,status:p}=(0,r.useSession)(),f="authenticated"===p,b=e?.user?.plan==="pro"||e?.user?.plan==="early_supporter",[v,w]=(0,a.useState)(null),[j,k]=(0,a.useState)({width:0,height:0}),[y,N]=(0,a.useState)({gradient:"gradient1",customColor:"#667eea",customGradient:{start:"#667eea",end:"#764ba2"},randomGradient:{start:"#667eea",end:"#764ba2"},padding:40,radius:12,shadow:"medium",aspectRatio:"auto",watermark:!0,targetSize:null}),[C,M]=(0,a.useState)(!1),[S,L]=(0,a.useState)(!1),[_,R]=(0,a.useState)(!1),[z,G]=(0,a.useState)(!1),[$,B]=(0,a.useState)(!1),[W,H]=(0,a.useState)(!1),[T,E]=(0,a.useState)({x:0,y:0}),[P,A]=(0,a.useState)(1),[F,I]=(0,a.useState)(!1),[O,U]=(0,a.useState)({x:0,y:0}),V=(0,a.useRef)(null),D=(0,a.useRef)(null),X=!f||y.watermark;(0,a.useEffect)(()=>{"authenticated"===p&&b&&N(e=>({...e,watermark:!1}))},[p,b]);let Y=(0,a.useCallback)(()=>{let e,t,a,r,s,n,o=j.width,i=j.height,l=y.padding,d=x[y.aspectRatio],c=y.targetSize;if(c&&o&&i){e=c.width,t=c.height;let d=e-2*l,m=t-2*l,u=Math.min(d/o,m/i),h=Math.round((a=Math.round(o*u))*P),x=Math.round((r=Math.round(i*u))*P);
1return{canvasWidth:e,canvasHeight:t,imgX:s=l+Math.round((d-h)/2)+T.x,imgY:n=l+Math.round((m-x)/2)+T.y,imgW:h,imgH:x}}if(d&&o&&i){let s=o+2*l,n=i+2*l;s/n>d?t=Math.round((e=s)/d):e=Math.round((t=n)*d),a=o,r=i}else e=o+2*l,t=i+2*l,a=o,r=i;let m=Math.round(a*P),u=Math.round(r*P);return s=Math.round((e-m)/2)+T.x,n=Math.round((t-u)/2)+T.y,{canvasWidth:e,canvasHeight:t,imgX:s,imgY:n,imgW:m,imgH:u}},[j,y.padding,y.aspectRatio,y.targetSize,P,T]),{canvasWidth:K,canvasHeight:q}=Y(),J=(0,a.useCallback)(e=>{if(!e.type.startsWith("image/"))return void alert("Please upload an image file");let t=new FileReader;t.onload=e=>{let t=e.target?.result,a=new window.Image;a.onload=()=>{k({width:a.naturalWidth,height:a.naturalHeight}),w(t),A(1),E({x:0,y:0}),(0,s.track)("beautify_upload",{source:"file"})},a.src=t},t.readAsDataURL(e)},[]);(0,a.useEffect)(()=>{let e=e=>{let t=e.clipboardData?.items;if(t){for(let e of t)if(e.type.startsWith("image/")){let t=e.getAsFile();t&&(J(t),(0,s.track)("beautify_upload",{source:"paste"}));break}}};return document.addEventListener("paste",e),()=>document.removeEventListener("paste",e)},[J]),(0,a.useEffect)(()=>{let e=sessionStorage.getItem("beautify_image_data");if(e){sessionStorage.removeItem("beautify_image_data");let t=new window.Image;t.onload=()=>{k({width:t.naturalWidth,height:t.naturalHeight}),w(e),A(1),E({x:0,y:0}),(0,s.track)("beautify_upload",{source:"capture"})},t.onerror=()=>{console.error("Failed to load image from capture")},t.src=e}},[]);let Q=(0,a.useCallback)(e=>{e.preventDefault(),M(!1);let t=e.dataTransfer.files[0];t&&(J(t),(0,s.track)("beautify_upload",{source:"drop"}))},[J]),Z=(0,a.useCallback)(async()=>{if(!v||!V.current)return null;let e=V.current,t=e.getContext("2d");if(!t)return null;let a=y.radius,r=h[y.shadow],{canvasWidth:s,canvasHeight:n,imgX:o,imgY:i,imgW:l,imgH:d}=Y();if(e.width=s,e.height=n,"none"===y.gradient)t.clearRect(0,0,s,n);else if("custom"===y.gradient)t.fillStyle=y.customColor,t.fillRect(0,0,s,n);else if("custom-gradient"===y.gradient){let e=t.createLinearGradient(0,0,s,n);e.addColorStop(0,y.customGradient.start),e.addColorStop(1,y.customGradient.end),t.fillStyle=e,t.fillRect(0,0,s,n)}else if("random-gradient"===y.gradient){let e=t.createLinearGradient(0,0,s,n);e.addColorStop(0,y.randomGradient.start),e.addColorStop(1,y.randomGradient.end),t.fillStyle=e,t.fillRect(0,0,s,n)}else if("solid-dark"===y.gradient||"solid-light"===y.gradient)t.fillStyle=m[y.gradient],t.fillRect(0,0,s,n);else if(u[y.gradient]){let e=u[y.gradient],a=t.createLinearGradient(0,0,s,n);e.forEach(e=>a.addColorStop(e.pos,e.color)),t.fillStyle=a,t.fillRect(0,0,s,n)}let c=new window.Image;if(c.crossOrigin="anonymous",await new Promise((e,t)=>{c.onload=()=>e(),c.onerror=t,c.src=v}),r&&(t.save(),t.shadowColor=`rgba(0, 0, 0, ${r.opacity})`,t.shadowBlur=r.blur,t.shadowOffsetX=0,t.shadowOffsetY=r.blur/4,t.beginPath(),t.roundRect(o,i,l,d,a),t.fillStyle="white",t.fill(),t.restore()),t.save(),t.beginPath(),t.roundRect(o,i,l,d,a),t.clip(),t.drawImage(c,o,i,l,d),t.restore(),X){let e="Made with PageThen.com",a=Math.max(10,Math.min(14,Math.round(s/100))),r=Math.round(.7*a),o=Math.round(.4*a),i=Math.round(.3*a);t.save(),t.font=`500 ${a}px -apple-system, BlinkMacSystemFont, sans-serif`;let l=t.measureText(e).width+2*r,d=a+2*o,c=s-l-8,m=n-d-8;t.fillStyle="rgba(0, 0, 0, 0.6)",t.beginPath(),t.roundRect(c,m,l,d,i),t.fill(),t.fillStyle="rgba(255, 255, 255, 0.9)",t.textAlign="left",t.textBaseline="middle",t.fillText(e,c+r,m+d/2),t.restore()}return e},[v,Y,y,X]),ee=(0,a.useCallback)(async()=>{L(!0),(0,s.track)("beautify_export",{gradient:y.gradient,watermark:y.watermark}),(0,n.trackGAEvent)("tool_export",{tool:"beautify",gradient:y.gradient});try{let e=await Z();if(!e)return;let t=document.createElement("a");t.download=`pagethen-beautified-${Date.now()}.png`,t.href=e.toDataURL("image/png"),t.click(),setTimeout(()=>R(!0),500)}catch(e){console.error("Export error:",e),alert("Failed to export image. Please try again.")}finally{L(!1)}},[Z,y]),et=(0,a.useCallback)(async()=>{G(!0),(0,s.track)("beautify_copy",{gradient:y.gradient,watermark:y.watermark}),(0,n.trackGAEvent)("tool_copy",{tool:"beautify",gradient:y.gradient});try{let e=await Z();if(!e)return;e.toBlob(async e=>{if(!e)throw Error("Failed to create blob");await navigator.clipboard.write([new ClipboardItem({"image/png":e})]),B(!0),setTimeout(()=>B(!1),2e3)},"image/png")}catch(e){console.error("Copy error:",e),alert("Failed to copy image. Please try downloading instead.")}finally{G(!1)}},[Z,y]),ea=e=>{e.preventDefault(),I(!0),U({x:e.clientX,y:e.clientY})},er=(0,a.useCallback)(e=>{if(!F)return;let{canvasWidth:t}=Y(),a=Math.min(Math.min(window.innerWidth-400,800)/t,1),r=(e.clientX-O.x)/a,s=(e.clientY-O.y)/a;E(e=>({x:e.x+r,y:e.y+s})),U({x:e.clientX,y:e.clientY})},[F,O,Y]),es=(0,a.useCallback)(()=>{I(!1)},[]);return(0,a.useEffect)(()=>(F&&(window.addEventListener("mousemove",er),window.addEventListener("mouseup",es)),()=>{window.removeEventListener("mousemove",er),window.removeEventListener("mouseup",es)}),[F,er,es]),(0,t.jsxs)("div",{className:"h-screen bg-background flex flex-col overflow-hidden",children:[(0,t.jsx)(d.PostToolPrompt,{isOpen:_,onClose:()=>R(!1),toolName:"Screenshot Beautifier"}),(0,t.jsx)("canvas",{ref:V,className:"hidden"}),(0,t.jsxs)("header",{className:"flex-shrink-0 h-12 sm:h-14 border-b border-border bg-background/80 backdrop-blur-sm flex items-center justify-between px-2 sm:px-4",children:[(0,t.jsxs)("div",{className:"flex items-center gap-1 sm:gap-2 min-w-0",children:[(0,t.jsxs)(o.default,{href:"/",className:"flex items-center gap-2 shrink-0",children:[(0,t.jsx)(i.default,{src:"/favicon-32x32.png",alt:"PageThen",width:24,height:24,className:"w-5 h-5 sm:w-6 sm:h-6"}),(0,t.jsx)("span",{className:"font-medium hidden sm:inline",children:"PageThen"})]}),(0,t.jsx)("span",{className:"text-muted hidden sm:inline",children:"/"}),(0,t.jsx)(o.default,{href:"/tools",className:"text-muted hover:text-foreground transition-colors hidden sm:inline",children:"Free Tools"}),(0,t.jsx)("span",{className:"text-muted hidden sm:inline",children:"/"}),(0,t.jsx)("h1",{className:"text-muted text-xs sm:text-sm truncate font-normal",children:"Screenshot Beautifier"})]}),(0,t.jsxs)("div",{className:"flex items-center gap-1 sm:gap-3",children:[v&&(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)("span",{className:"text-xs text-muted hidden md:block",children:[K," Ã ",q]}),(0,t.jsxs)("button",{onClick:et,disabled:z,className:"hidden sm:flex px-2 sm:px-3 py-1.5 rounded-lg border border-border hover:bg-card transition-colors text-sm items-center gap-1.5 disabled:opacity-50",children:[$?(0,t.jsx)("svg",{className:"w-4 h-4 text-green-500",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})}):(0,t.jsx)("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"})}),(0,t.jsx)("span",{className:"hidden md:inline",children:$?"Copied!":"Copy"})]}),(0,t.jsxs)("button",{onClick:ee,disabled:S,className:"px-2 sm:px-3 py-1.5 rounded-lg bg-foreground text-background hover:opacity-90 transition-opacity text-xs sm:text-sm flex items-center gap-1 sm:gap-1.5 disabled:opacity-50",children:[(0,t.jsx)("svg",{className:"w-3.5 h-3.5 sm:w-4 sm:h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"})}),(0,t.jsx)("span",{children:S?"...":"Save"})]})]}
1),"loading"!==p&&(f?(0,t.jsx)(o.default,{href:"/app",className:"hidden sm:flex items-center gap-2 text-sm text-muted hover:text-foreground transition-colors",children:(0,t.jsxs)("div",{className:"relative",children:[e?.user?.image?(0,t.jsx)(i.default,{src:e.user.image,alt:"",width:24,height:24,className:"w-6 h-6 rounded-full"}):(0,t.jsx)("div",{className:"w-6 h-6 rounded-full bg-accent/20 flex items-center justify-center text-xs font-medium text-accent",children:e?.user?.email?.charAt(0).toUpperCase()}),(0,t.jsx)("div",{className:"absolute -bottom-0.5 -right-0.5 w-2.5 h-2.5 bg-green-500 rounded-full border border-background"})]})}):(0,t.jsx)(o.default,{href:"/login?callbackUrl=/tools/screenshot-beautifier",className:"hidden sm:block text-sm text-muted hover:text-foreground transition-colors",onClick:()=>(0,s.track)("beautify_header_signin_click"),children:"Sign in"})),(0,t.jsx)(l.ThemeToggle,{}),(0,t.jsxs)("div",{className:"relative group hidden sm:block",children:[(0,t.jsxs)("button",{className:"flex items-center gap-1.5 text-sm text-muted hover:text-foreground transition-colors",onClick:()=>{navigator.share&&navigator.share({title:"Screenshot Beautifier",text:"Free screenshot beautifier - add gradients, shadows & rounded corners instantly. No signup, runs locally in your browser.",url:"https://pagethen.com/tools/beautify"})},children:[(0,t.jsx)("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M8.684 13.342C8.886 12.938 9 12.482 9 12c0-.482-.114-.938-.316-1.342m0 2.684a3 3 0 110-2.684m0 2.684l6.632 3.316m-6.632-6l6.632-3.316m0 0a3 3 0 105.367-2.684 3 3 0 00-5.367 2.684zm0 9.316a3 3 0 105.368 2.684 3 3 0 00-5.368-2.684z"})}),(0,t.jsx)("span",{className:"hidden sm:inline",children:"Share"})]}),(0,t.jsxs)("div",{className:"absolute right-0 top-full mt-1 w-48 py-1 bg-card border border-border rounded-lg shadow-lg opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all z-50",children:[(0,t.jsxs)("a",{href:`https://twitter.com/intent/tweet?text=${encodeURIComponent("Free screenshot beautifier - add gradients, shadows & rounded corners instantly. No signup needed ð¨")}&url=${encodeURIComponent("https://pagethen.com/tools/beautify")}`,target:"_blank",rel:"noopener noreferrer",className:"flex items-center gap-2 px-3 py-2 text-sm text-muted hover:text-foreground hover:bg-accent/5 transition-colors",onClick:()=>(0,s.track)("share_click",{platform:"twitter",page:"beautify"}),children:[(0,t.jsx)("svg",{className:"w-4 h-4",fill:"currentColor",viewBox:"0 0 24 24",children:(0,t.jsx)("path",{d:"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"})}),"Share on X"]}),(0,t.jsxs)("a",{href:`https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent("https://pagethen.com/tools/beautify")}`,target:"_blank",rel:"noopener noreferrer",className:"flex items-center gap-2 px-3 py-2 text-sm text-muted hover:text-foreground hover:bg-accent/5 transition-colors",onClick:()=>(0,s.track)("share_click",{platform:"linkedin",page:"beautify"}),children:[(0,t.jsx)("svg",{className:"w-4 h-4",fill:"currentColor",viewBox:"0 0 24 24",children:(0,t.jsx)("path",{d:"M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"})}),"Share on LinkedIn"]}),(0,t.jsxs)("button",{onClick:()=>{navigator.clipboard.writeText("https://pagethen.com/tools/beautify"),(0,s.track)("share_click",{platform:"copy",page:"beautify"})},className:"flex items-center gap-2 px-3 py-2 text-sm text-muted hover:text-foreground hover:bg-accent/5 transition-colors w-full text-left",children:[(0,t.jsx)("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"})}),"Copy link"]})]})]}),(0,t.jsx)("a",{href:c.CHROME_STORE_URL,target:"_blank",rel:"noopener noreferrer",onClick:()=>(0,n.trackGAEvent)("extension_click",{location:"beautify_header"}),className:"text-sm text-muted hover:text-foreground transition-colors hidden sm:block",children:"Get Chrome Extension"})]})]}),(0,t.jsx)("main",{className:"flex-1 flex flex-col lg:flex-row overflow-hidden",children:v?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:"flex-1 flex items-center justify-center p-2 sm:p-4 min-h-[200px] lg:min-h-0 overflow-auto",children:(()=>{let{canvasWidth:e,canvasHeight:a,imgX:r,imgY:s,imgW:n,imgH:o}=Y(),i=window.innerWidth<1024,l=Math.min(window.innerHeight-(i?300:180),i?400:600),d=Math.min((i?window.innerWidth-32:Math.min(window.innerWidth-400,800))/e,l/a,1),c=e*d,u=a*d,x=y.radius*d,g="none"!==y.shadow?h[y.shadow].blur*d:0,p="none"!==y.shadow?h[y.shadow].opacity:0;return(0,t.jsxs)("div",{className:"relative rounded-lg flex-shrink-0",style:{background:"none"===y.gradient?"repeating-conic-gradient(#404040 0% 25%, #333 0% 50%) 50%/20px 20px":"custom"===y.gradient?y.customColor:"custom-gradient"===y.gradient?`linear-gradient(135deg, ${y.customGradient.start} 0%, ${y.customGradient.end} 100%)`:"random-gradient"===y.gradient?`linear-gradient(135deg, ${y.randomGradient.start} 0%, ${y.randomGradient.end} 100%)`:m[y.gradient]||y.customColor,width:c,height:u},children:[W&&(0,t.jsxs)("div",{className:"absolute inset-0 pointer-events-none z-10",children:[(0,t.jsx)("div",{className:"absolute inset-0",style:{backgroundImage:` 2 linear-gradient(rgba(0,0,0,0.3) 1px, transparent 1px), 3 linear-gradient(90deg, rgba(0,0,0,0.3) 1px, transparent 1px) 4 `,backgroundSize:`${c/3}px ${u/3}px`}}),(0,t.jsx)("div",{className:"absolute inset-0",style:{backgroundImage:` 5 linear-gradient(rgba(255,255,255,0.4) 1px, transparent 1px), 6 linear-gradient(90deg, rgba(255,255,255,0.4) 1px, transparent 1px) 7 `,backgroundSize:`${c/3}px ${u/3}px`,backgroundPosition:"1px 1px"}}),(0,t.jsx)("div",{className:"absolute left-1/2 top-0 bottom-0 w-0.5 bg-black/50",style:{marginLeft:-1}}),(0,t.jsx)("div",{className:"absolute top-1/2 left-0 right-0 h-0.5 bg-black/50",style:{marginTop:-1}}),(0,t.jsx)("div",{className:"absolute left-1/2 top-0 bottom-0 w-px bg-white/70"}),(0,t.jsx)("div",{className:"absolute top-1/2 left-0 right-0 h-px bg-white/70"})]}),(0,t.jsx)("img",{src:v,alt:"Preview",className:"absolute select-none",draggable:!1,onMouseDown:ea,style:{left:r*d,top:s*d,width:n*d,height:o*d,borderRadius:x,boxShadow:"none"!==y.shadow?`0 ${g/4}px ${g}px rgba(0,0,0,${p})`:"none",cursor:F?"grabbing":"grab"}}),X&&(0,t.jsx)("div",{className:"absolute bottom-1 right-1 px-1 py-0.5 bg-black/60 text-white/90 text-[8px] rounded font-medium pointer-events-none",children:"Made with PageThen.com"})]})})()}
7),(0,t.jsxs)("div",{className:"lg:w-80 xl:w-[360px] flex-shrink-0 border-t lg:border-t-0 lg:border-l border-border bg-card/50 p-3 sm:p-5 flex flex-col gap-4 sm:gap-5 overflow-y-auto max-h-[50vh] sm:max-h-[45vh] lg:max-h-none",children:[(0,t.jsxs)("div",{children:[(0,t.jsx)("label",{className:"text-[10px] sm:text-xs font-medium text-muted uppercase tracking-wider mb-1.5 sm:mb-2 block",children:"Presets"}),(0,t.jsx)("div",{className:"flex flex-wrap gap-1",children:Object.keys(g).map(e=>(0,t.jsx)("button",{onClick:()=>{let t;return t=g[e],void(N(e=>({...e,gradient:t.gradient,padding:t.padding,radius:t.radius,shadow:t.shadow,aspectRatio:t.aspectRatio,targetSize:t.targetSize})),A(1),E({x:0,y:0}),(0,s.track)("beautify_preset",{preset:e}))},className:"px-2 sm:px-3 py-1 sm:py-1.5 text-[10px] sm:text-xs rounded-md border border-border hover:border-accent hover:bg-accent/5 transition-all capitalize",children:e},e))})]}),(0,t.jsxs)("div",{children:[(0,t.jsx)("label",{className:"text-[10px] sm:text-xs font-medium text-muted uppercase tracking-wider mb-1.5 sm:mb-2 block",children:"Backgroun
7d"}),(0,t.jsxs)("div",{className:"flex flex-wrap gap-1 sm:gap-1.5",children:[Object.entries(m).map(([e,a])=>(0,t.jsx)("button",{onClick:()=>{let t=u[e],r="solid-dark"===e||"solid-light"===e?a:null;N(a=>({...a,gradient:e,...t&&{customGradient:{start:t[0].color,end:t[1].color}},...r&&{customColor:r,customGradient:{start:r,end:r}}}))},className:`w-6 h-6 sm:w-7 sm:h-7 rounded-md border-2 transition-all ${y.gradient===e?"border-accent scale-110":"border-transparent hover:scale-105"}`,style:{background:"none"===e?"repeating-conic-gradient(#666 0% 25%, #888 0% 50%) 50%/6px 6px":a},title:e},e)),(0,t.jsxs)("label",{className:"relative w-7 h-7 cursor-pointer",children:[(0,t.jsx)("input",{type:"color",value:y.customColor,onChange:e=>N(t=>({...t,gradient:"custom",customColor:e.target.value})),className:"absolute inset-0 w-full h-full opacity-0 cursor-pointer",title:"Custom solid color"}),(0,t.jsx)("div",{className:`w-7 h-7 rounded-md border-2 transition-all flex items-center justify-center pointer-events-none ${"custom"===y.gradient?"border-accent scale-110":"border-border hover:scale-105"}`,style:{background:y.customColor},children:(0,t.jsx)("svg",{className:"w-3.5 h-3.5 text-white drop-shadow-sm",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M7 21a4 4 0 01-4-4V5a2 2 0 012-2h4a2 2 0 012 2v12a4 4 0 01-4 4zm0 0h12a2 2 0 002-2v-4a2 2 0 00-2-2h-2.343M11 7.343l1.657-1.657a2 2 0 012.828 0l2.829 2.829a2 2 0 010 2.828l-8.486 8.485M7 17h.01"})})})]}),(0,t.jsxs)("div",{className:`flex h-7 rounded-md border-2 transition-all ${"custom-gradient"===y.gradient?"border-accent scale-110":"border-border hover:scale-105"}`,children:[(0,t.jsxs)("label",{className:"relative w-5 h-full cursor-pointer",children:[(0,t.jsx)("input",{type:"color",value:y.customGradient.start,onChange:e=>N(t=>({...t,gradient:"custom-gradient",customGradient:{...t.customGradient,start:e.target.value}})),className:"absolute inset-0 w-full h-full opacity-0 cursor-pointer"}),(0,t.jsx)("div",{className:"w-full h-full rounded-l-[4px]",style:{background:y.customGradient.start}})]}),(0,t.jsxs)("label",{className:"relative w-5 h-full cursor-pointer",children:[(0,t.jsx)("input",{type:"color",value:y.customGradient.end,onChange:e=>N(t=>({...t,gradient:"custom-gradient",customGradient:{...t.customGradient,end:e.target.value}})),className:"absolute inset-0 w-full h-full opacity-0 cursor-pointer"}),(0,t.jsx)("div",{className:"w-full h-full rounded-r-[4px]",style:{background:y.customGradient.end}})]})]}),(0,t.jsx)("button",{onClick:()=>{let e=()=>"#"+Math.floor(0xffffff*Math.random()).toString(16).padStart(6,"0"),t=e(),a=e();N(e=>({...e,gradient:"random-gradient",randomGradient:{start:t,end:a},customGradient:{start:t,end:a}}))},className:`w-7 h-7 rounded-md border-2 transition-all flex items-center justify-center ${"random-gradient"===y.gradient?"border-accent scale-110":"border-border bg-card hover:bg-muted hover:scale-105"}`,style:{background:"random-gradient"===y.gradient?`linear-gradient(135deg, ${y.randomGradient.start} 0%, ${y.randomGradient.end} 100%)`:void 0},title:"Random gradient",children:(0,t.jsx)("svg",{className:"w-3.5 h-3.5 text-white drop-shadow-sm",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"})})})]})]}),(0,t.jsxs)("div",{className:"grid grid-cols-2 gap-3 sm:gap-4",children:[(0,t.jsxs)("div",{children:[(0,t.jsxs)("label",{className:"text-[10px] sm:text-xs font-medium text-muted uppercase tracking-wider mb-1.5 sm:mb-2 flex justify-between",children:[(0,t.jsx)("span",{children:"Padding"}),(0,t.jsxs)("span",{className:"text-foreground",children:[y.padding,"px"]})]}),(0,t.jsx)("input",{type:"range",min:"0",max:"100",value:y.padding,onChange:e=>N(t=>({...t,padding:parseInt(e.target.value)})),className:"w-full accent-accent h-1.5"})]}),(0,t.jsxs)("div",{children:[(0,t.jsxs)("label",{className:"text-[10px] sm:text-xs font-medium text-muted uppercase tracking-wider mb-1.5 sm:mb-2 flex justify-between",children:[(0,t.jsx)("span",{children:"Corners"}),(0,t.jsxs)("span",{className:"text-foreground",children:[y.radius,"px"]})]}),(0,t.jsx)("input",{type:"range",min:"0",max:"32",value:y.radius,onChange:e=>N(t=>
7({...t,radius:parseInt(e.target.value)})),className:"w-full accent-accent h-1.5"})]})]}),(0,t.jsxs)("div",{children:[(0,t.jsx)("label",{className:"text-[10px] sm:text-xs font-medium text-muted uppercase tracking-wider mb-1.5 sm:mb-2 block",children:"Shadow"}),(0,t.jsx)("div",{className:"grid grid-cols-4 gap-1 sm:gap-1.5",children:Object.keys(h).map(e=>(0,t.jsx)("button",{onClick:()=>N(t=>({...t,shadow:e})),className:`px-1.5 sm:px-2 py-1 sm:py-1.5 text-[10px] sm:text-xs rounded-md border transition-all ${y.shadow===e?"border-accent bg-accent/10 text-accent":"border-border hover:border-muted"}`,children:e.charAt(0).toUpperCase()+e.slice(1)},e))})]}),(0,t.jsxs)("div",{children:[(0,t.jsx)("label",{className:"text-[10px] sm:text-xs font-medium text-muted uppercase tracking-wider mb-1.5 sm:mb-2 block",children:"Aspect Ratio"}),(0,t.jsx)("div",{className:"flex flex-wrap gap-1",children:Object.keys(x).map(e=>(0,t.jsx)("button",{onClick:()=>N(t=>({...t,aspectRatio:e,targetSize:null})),className:`px-2 sm:px-3 py-1 sm:py-1.5 text-[10px] sm:text-xs rounded-md border transition-all ${y.aspectRatio===e?"border-accent bg-accent/10 text-accent":"border-border hover:border-muted"}`,children:"auto"===e?"Auto":e},e))})]}),(0,t.jsxs)("div",{className:"flex items-center gap-2 sm:gap-4 pt-2 sm:pt-3 border-t border-border",children:[(0,t.jsxs)("div",{className:"flex-1",children:[(0,t.jsxs)("label",{className:"text-[10px] sm:text-xs font-medium text-muted uppercase tracking-wider mb-1.5 sm:mb-2 flex justify-between",children:[(0,t.jsx)("span",{children:"Scale"}),(0,t.jsxs)("span",{className:"text-foreground",children:[Math.round(100*P),"%"]})]}),(0,t.jsx)("input",{type:"range",min:"0.5",max:"2",step:"0.05",value:P,onChange:e=>A(parseFloat(e.target.value)),className:"w-full accent-accent h-1.5"})]}),(0,t.jsx)("button",{onClick:()=>H(!W),className:`p-2 rounded-md border transition-all ${W?"border-accent bg-accent/10 text-accent":"border-border hover:border-muted text-muted"}`,title:"Toggle grid",children:(0,t.jsx)("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 5a1 1 0 011-1h14a1 1 0 011 1v14a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 9h16M4 15h16M9 4v16M15 4v16"})})}),(0,t.jsx)("button",{onClick:()=>{A(1),E({x:0,y:0})},className:"p-2 rounded-md border border-border hover:border-muted text-muted hover:text-foreground transition-all",title:"Reset position",children:(0,t.jsx)("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"})})})]}),(0,t.jsx)("div",{className:"py-2 sm:py-3 border-t border-border space-y-2 sm:space-y-3",children:"loading"===p?(0,t.jsxs)("div",{className:"flex items-center gap-2 text-sm text-muted",children:[(0,t.jsx)("div",{className:"animate-spin w-4 h-4 border-2 border-accent border-t-transparent rounded-full"}),(0,t.jsx)("span",{children:"Checking account..."})]}):f?(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsxs)("div",{className:"flex items-center gap-2 sm:gap-3",children:[(0,t.jsx)("span",{className:"text-[10px] sm:text-xs font-medium text-muted uppercase tracking-wider",children:"Watermark"}),(0,t.jsx)("button",{onClick:()=>N(e=>({...e,watermark:!e.watermark})),className:`relative w-9 h-5 rounded-full transition-colors ${y.watermark?"bg-accent":"bg-muted/30"}`,children:(0,t.jsx)("div",{className:`absolute top-0.5 w-4 h-4 bg-white rounded-full transition-all ${y.watermark?"left-4":"left-0.5"}`})})]}),(0,t.jsx)("div",{className:"flex items-center gap-2",children:(0,t.jsxs)("div",{className:"relative",children:[e?.user?.image?(0,t.jsx)(i.default,{src:e.user.image,alt:"",width:20,height:20,className:"w-5 h-5 rounded-full"}):(0,t.jsx)("div",{className:"w-5 h-5 rounded-full bg-accent/20 flex items-center justify-center text-[10px] font-medium text-accent",children:e?.user?.email?.charAt(0).toUpperCase()}),(0,t.jsx)("div",{className:"absolute -bottom-0.5 -right-0.5 w-2.5 h-2.5 bg-green-500 rounded-full border border-background"})]})})]}):(0,t.jsxs)("div",{className:"space-y-1.5 sm:space-y-2",children:[(0,t.jsx)("div",{className:"flex items-center justify-between",children:(0,t.jsxs)("div",{className:"flex items-center gap-2 sm:gap-3",children:[(0,t.jsx)("span",{className:"text-[10px] sm:text-xs font-medium text-muted uppercase tracking-wider",children:"Watermark"}),(0,t.jsx)("div",{className:"relative w-9 h-5 rounded-full bg-accent/50 cursor-not-allowed opacity-60",title:"Sign in to toggle",children:(0,t.jsx)("div",{className:"absolute top-0.5 left-4 w-4 h-4 bg-white/80 rounded-full"})})]})}),(0,t.jsxs)(o.default,{href:"/login?callbackUrl=/tools/screenshot-beautifier",className:"text-[11px] text-muted/70 hover:text-accent transition-colors flex items-center gap-1",onClick:()=>(0,s.track)("beautify_signin_click"),children:[(0,t.jsx)("svg",{className:"w-2.5 h-2.5",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"})}),"Sign in to remove"]})]})}),(0,t.jsxs)("div",{className:"flex items-center justify-between text-[10px] sm:text-xs text-muted pt-1.5 sm:pt-2",children:[(0,t.jsxs)("button",{onClick:()=>{w(null),k({width:0,height:0}),A(1),E({x:0,y:0})},className:"hover:text-red-500 transition-colors flex items-center gap-1.5",children:[(0,t.jsx)("svg",{className:"w-3.5 h-3.5",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"})}),"Reset"]}),(0,t.jsxs)("span",{className:"flex items-center gap-1.5 text-muted/50",children:[(0,t.jsx)("svg",{className:"w-3 h-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"})}),"100% local"]})]})]})]}):(0,t.jsx)("div",{className:"flex-1 flex items-center justify-center p-4 sm:p-6",children:(0,t.jsxs)("div",{className:`w-full max-w-2xl border-2 border-dashed rounded-2xl p-6 sm:p-12 text-center transition-all duration-300 ${C?"border-accent bg-accent/5":"border-border hover:border-muted"}`,onDragOver:e=>{e.preventDefault(),M(!0)},onDragLeave:()=>M(!1),onDrop:Q,children:[(0,t.jsx)("input",{ref:D,type:"file",accept:"image/*",onChange:e=>{let t=e.target.files?.[0];t&&J(t)},className:"hidden"}),(0,t.jsxs)("div",{className:"space-y-4",children:[(0,t.jsx)("div",{className:"w-16 h-16 mx-auto rounded-xl bg-accent/10 flex items-center justify-center",children:(0,t.jsx)("svg",{className:"w-8 h-8 text-accent",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"})})}),(0,t.jsxs)("div",{children:[(0,t.jsx)("p",{className:"text-lg font-medium mb-1",children:"Drop screenshot here"}),(0,t.jsx)("p",{className:"text-sm text-muted mb-4",children:"or paste from clipboard (Cmd+V)"}),(0,t.jsx)("button",{onClick:()=>D.current?.click(),className:"px-5 py-2.5 bg-foreground text-background rounded-full text-sm font-medium hover:scale-105 transition-transform",children:"Choose File"})]}),(0,t.jsx)("p",{className:"text-xs text-muted/60",children:"PNG, JPG, WebP"}),(0,t.jsxs)("p",{className:"text-xs text-muted/40 flex items-center justify-center gap-1.5 mt-3",children:[(0,t.jsx)("svg",{className:"w-3 h-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,t.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"})}),"Runs locally in your browser. Nothing uploaded."]})]})]})})})]})}e.s(["default",()=>p])}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.