{"compiledCode":"\"use strict\";Object.defineProperty(exports, \"__esModule\", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var _react = require('react'); var _react2 = _interopRequireDefault(_react);\n\n function ToolsPage() {\n  return (\n    _react2.default.createElement('div', { className: \"pd-page pd-tools reading-picdrome\"  ,}\n      , _react2.default.createElement('style', null, \"\\n.reading-picdrome{--reading-ground:var(--c1gb4l3-runtime-bg, #f6f1e8);--reading-ink:var(--c1gb4l3-runtime-text, #2d3834);--reading-accent:var(--c1gb4l3-runtime-accent, #536956);--reading-soft:var(--c1gb4l3-runtime-panel, #e1e7d9);max-width:1120px!important;width:100%;margin:0 auto!important;padding:26px 40px 80px!important;background:var(--reading-ground)!important;color:var(--reading-ink)!important;font:16px/1.75 var(--c1gb4l3-font-body, Arial, sans-serif)!important;overflow-wrap:anywhere}\\n.reading-picdrome,.reading-picdrome *{box-sizing:border-box;min-width:0}\\n.reading-picdrome .reading-masthead{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:0 0 24px;margin:0 0 44px;border-bottom:1px solid var(--reading-accent)}\\n.reading-picdrome .reading-brand{font:24px/1.25 var(--c1gb4l3-font-heading, Georgia, serif);letter-spacing:-.5px;text-decoration:none;color:var(--reading-ink)!important}\\n.reading-picdrome .reading-navigation{display:flex;gap:12px 24px;flex-wrap:wrap;font-size:13px}.reading-picdrome .reading-navigation a{padding:10px 0}\\n.reading-picdrome a{color:var(--reading-accent);text-underline-offset:4px;text-decoration-thickness:1px}\\n.reading-picdrome :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--reading-accent)!important;outline-offset:4px}\\n.reading-picdrome h1{font:clamp(34px,4.8vw,56px)/1.12 var(--c1gb4l3-font-heading, Georgia, serif)!important;color:var(--reading-ink)!important;letter-spacing:-1.5px;max-width:23ch;margin:0 0 25px!important;overflow-wrap:normal}\\n.reading-picdrome h2{font:clamp(25px,3vw,34px)/1.22 var(--c1gb4l3-font-heading, Georgia, serif)!important;color:var(--reading-ink)!important;letter-spacing:-.6px;margin:42px 0 18px!important}\\n.reading-picdrome h3{font-size:19px!important;line-height:1.4!important;color:var(--reading-ink);margin:20px 0 10px}\\n.reading-picdrome p{max-width:78ch;line-height:1.8!important;margin-bottom:18px}\\n.reading-picdrome :is(.lead,.lede,.intro){font-size:18px!important;line-height:1.75!important;max-width:70ch}\\n.reading-picdrome :is(ul,ol){line-height:1.8;padding-left:24px}.reading-picdrome li{margin:7px 0}\\n.reading-picdrome .reading-hero{background:var(--reading-soft)!important;border-radius:4px!important;border:0!important;padding:40px 34px!important;margin-bottom:38px!important}.reading-picdrome .reading-hero h1{max-width:23ch}.reading-picdrome :is(section,article,nav){scroll-margin-top:24px}.reading-picdrome > section{margin-top:34px!important}\\n.reading-picdrome :is(pre,code){font-family:ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.reading-picdrome pre{padding:20px;overflow:auto;background:var(--reading-soft);border-radius:4px}\\n.reading-picdrome .reading-table{overflow-x:auto;max-width:100%;margin:24px 0;border:1px solid var(--reading-accent);border-radius:4px}.reading-picdrome .reading-table table{width:100%;min-width:560px;margin:0!important;border-collapse:collapse!important;font-size:14px;line-height:1.6}.reading-picdrome :is(th,td){text-align:left;padding:14px 16px!important;border-bottom:1px solid var(--reading-soft);vertical-align:top}.reading-picdrome th{background:var(--reading-soft)!important;color:var(--reading-ink)!important;font-weight:700}\\n.reading-picdrome :is(button,summary){min-height:44px;cursor:pointer;font:inherit}.reading-picdrome summary{padding:12px 0;font-weight:600}.reading-picdrome details{border-top:1px solid var(--reading-accent);padding:8px 0;margin:10px 0}\\n.reading-picdrome :is(input,select,textarea){max-width:100%;min-height:44px;font:inherit;line-height:1.5;padding:11px 12px;border:1px solid var(--reading-accent);border-radius:4px;background:var(--reading-ground);color:var(--reading-ink)}\\n.reading-picdrome a[style*=\\\"background\\\"]{display:inline-flex!important;align-items:center;justify-content:center;min-height:44px;padding:12px 18px!important;background:var(--reading-ink)!important;color:var(--reading-ground)!important;border-color:var(--reading-ink)!important;border-radius:4px!important;font-size:14px!important;text-decoration:none!important;line-height:1.5!important}\\n.reading-picdrome :is(img,svg,video,iframe){max-width:100%}.reading-picdrome .reading-navigation a:hover{text-decoration-thickness:2px}\\n@media(max-width:720px){.reading-picdrome{padding:22px 22px 56px!important;font-size:16px!important}.reading-picdrome .reading-masthead{align-items:flex-start;gap:20px;margin-bottom:34px}.reading-picdrome .reading-brand{font-size:21px;max-width:12ch}.reading-picdrome .reading-navigation{justify-content:flex-end;gap:4px 14px;max-width:170px;font-size:12px}.reading-picdrome h1{font-size:36px!important;letter-spacing:-.8px}.reading-picdrome h2{font-size:28px!important;margin-top:32px!important}.reading-picdrome section[style*=\\\"grid\\\"],.reading-picdrome div[style*=\\\"grid-template-columns\\\"]{grid-template-columns:1fr!important}.reading-picdrome section[style*=\\\"padding\\\"],.reading-picdrome article[style*=\\\"padding\\\"]{padding-left:18px!important;padding-right:18px!important}}\\n\\n.reading-picdrome a:is([class*=\\\"btn\\\"],[class*=\\\"button\\\"],[class*=\\\"cta\\\"]){background:var(--c1gb4l3-runtime-text, #2d3834)!important;color:var(--c1gb4l3-runtime-bg, #f6f1e8)!important;border-color:var(--c1gb4l3-runtime-text, #2d3834)!important;min-height:44px;display:inline-flex;align-items:center;padding:12px 18px;text-decoration:none}\\n\\n.reading-picdrome{width:100%;max-width:100%!important;min-width:0;box-sizing:border-box} .reading-picdrome .reading-masthead,.reading-picdrome .masthead{display:none} .reading-picdrome .reading-brand{font-family:var(--c1gb4l3-font-heading,Arial,sans-serif)} .reading-picdrome h1{font-weight:750!important;letter-spacing:-.045em} .reading-picdrome h2{font-weight:650!important} .reading-picdrome :is(code,pre,.eyebrow,.number){font-family:var(--c1gb4l3-font-mono,monospace)}\\n\")\n      , _react2.default.createElement('header', { className: \"reading-masthead\",}, _react2.default.createElement('a', { className: \"reading-brand\", href: \"/\",}, \"Picdrome\"), _react2.default.createElement('nav', { className: \"reading-navigation\", 'aria-label': \"Reading navigation\" ,}, _react2.default.createElement('a', { href: \"/\",}, \"Home\"), _react2.default.createElement('a', { href: \"/use-cases\",}, \"Start reading\" ), _react2.default.createElement('a', { href: \"/ai-image-disclosure\",}, \"Standards\")))\n\n      , _react2.default.createElement('style', null, \".reading-picdrome.pd-tools .pd-callout{border-left:4px solid var(--reading-accent);background:var(--reading-soft);padding:16px 18px;border-radius:4px;margin:20px 0}.reading-picdrome.pd-tools .pd-callout p{margin:0}\\n.reading-picdrome{width:100%;max-width:100%!important;min-width:0;box-sizing:border-box} .reading-picdrome .reading-masthead,.reading-picdrome .masthead{display:none} .reading-picdrome .reading-brand{font-family:var(--c1gb4l3-font-heading,Arial,sans-serif)} .reading-picdrome h1{font-weight:750!important;letter-spacing:-.045em} .reading-picdrome h2{font-weight:650!important} .reading-picdrome :is(code,pre,.eyebrow,.number){font-family:var(--c1gb4l3-font-mono,monospace)}\\n\")\n      , _react2.default.createElement('header', { className: \"reading-hero\",}\n        , _react2.default.createElement('h1', null, \"Website image workflow reference\"   )\n        , _react2.default.createElement('p', { className: \"pd-lede\",}, \"Reader-run methods for selecting an image, sizing it, writing useful alt text, and recording its source license.\"                )\n      )\n      , _react2.default.createElement('p', null, \"This page is a written workflow rather than an interactive tool or API reference. Picdrome originals have separate image pages and license terms. Work with an image from a source you have independently approved, and treat that source's current license as controlling.\"                                         )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"who-this-is-for\",}\n        , _react2.default.createElement('h2', { id: \"who-this-is-for\",}, \"Who this is for\"   )\n        , _react2.default.createElement('p', null, \"Solo founders and small-business owners choosing images without a designer, people using no-code or AI website builders, and developers designing their own metadata workflow. If your job is to put a suitable, accessible image on a page while keeping a record of its source and rights, use this reference.\"                                                )\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"the-workflow\",}\n        , _react2.default.createElement('h2', { id: \"the-workflow\",}, \"The workflow\" )\n        , _react2.default.createElement('ol', null\n          , _react2.default.createElement('li', null, \"Write the intended section, audience, style, focal point, and text-safe-area needs before you look at any image.\"                )\n          , _react2.default.createElement('li', null, \"Compare only images from approved sources against those requirements.\"        )\n          , _react2.default.createElement('li', null, \"Record the source URL, license version or retrieval date, intended use, attribution rule, modification rule, and redistribution limit.\"                 )\n          , _react2.default.createElement('li', null, \"Read the receiving component's current documentation and export responsive sizes without enlarging a weak source.\"              )\n          , _react2.default.createElement('li', null, \"Write alt text for the image's relevant content and purpose; use empty alt text for a purely decorative image.\"                  )\n        )\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"licensing-boundary\",}\n        , _react2.default.createElement('h2', { id: \"licensing-boundary\",}, \"Licensing boundary\" )\n        , _react2.default.createElement('div', { className: \"pd-callout\",}, _react2.default.createElement('p', null, \"This reference does not supply images, interpret a license, collect input, or grant rights. If the actual source license does not clearly cover the intended use, do not use the asset without qualified advice.\"                                 ))\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"guides-for-each-step\",}\n        , _react2.default.createElement('h2', { id: \"guides-for-each-step\",}, \"Guides for each step\"   )\n        , _react2.default.createElement('ul', null\n          , _react2.default.createElement('li', null, _react2.default.createElement('a', { href: \"/blog/choose-the-right-image-framework\",}, \"Choose the right image for a page\"      ), \" — turn a page section into three answers before you look at images.\"             )\n          , _react2.default.createElement('li', null, _react2.default.createElement('a', { href: \"/blog/website-image-sizes-cheat-sheet\",}, \"Image sizes cheat sheet\"   ), \" — common dimensions and aspect ratios for heroes, cards, headers, and social previews.\"             )\n          , _react2.default.createElement('li', null, _react2.default.createElement('a', { href: \"/blog/write-alt-text-for-images\",}, \"How to write alt text for images\"      ), \" — a write-and-check method for clear, useful alt text.\"         )\n          , _react2.default.createElement('li', null, _react2.default.createElement('a', { href: \"/blog/image-rights-pre-publish-check\",}, \"Pre-publish image rights check\"   ), \" — what to confirm about a license before an image goes live.\"            )\n        )\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"frequently-asked-questions\", className: \"pd-faq\",}\n        , _react2.default.createElement('h2', { id: \"frequently-asked-questions\",}, \"Frequently asked questions\"  )\n        , _react2.default.createElement('h3', null, \"Does this page provide interactive tools?\"     )\n        , _react2.default.createElement('p', null, \"No. It provides a complete written workflow only.\"       )\n        , _react2.default.createElement('h3', null, \"Can I use the method on mobile?\"      )\n        , _react2.default.createElement('p', null, \"Yes. Use any device that lets you inspect the image and its source's current license accurately.\"               )\n        , _react2.default.createElement('h3', null, \"Do I need an account?\"    )\n        , _react2.default.createElement('p', null, \"No account is needed to read this workflow. Developers can use the \"            , _react2.default.createElement('a', { href: \"/developers\",}, \"integration design guide\"  ), \" to model source, accessibility, provenance, and license fields in their own systems.\"            )\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"in-plain-language\", className: \"pd-summary\",}\n        , _react2.default.createElement('h2', { id: \"in-plain-language\",}, \"In plain language\"  )\n        , _react2.default.createElement('p', null, \"Define the slot, check the actual source license, size from the receiving component's documentation, write contextual alt text, preserve provenance, and stop when rights are unclear. This reference is a written workflow. Picdrome originals are separately available under the Picdrome License.\"                                        )\n      )\n    )\n  );\n} exports.default = ToolsPage;"}