Prompt Library

Read AGENTS.md and SKILLS.md, then look at src/config/config.toml,
src/pages/[...lang]/index.astro, src/content/homepage/english/-index.md, and
src/content/sections/english/banner-agency.md. Summarize in 10 bullet points how this Astro theme
is organized: where text lives, how a page picks its sections, how a named block in a page's
frontmatter overrides a section, where the block names come from, how options.layout works, and
which collections npm run astro-check actually validates. Don't change any files yet.

Here is my studio. Use it for every copywriting request in this conversation:
- Name: [STUDIO OR YOUR NAME]
- What we make: [ONE SENTENCE]
- Who it is for: [AUDIENCE]
- Services: [3 TO 6 SERVICES]
- Tone: confident, concrete, no buzzwords.
Never invent client names, testimonials, awards, follower counts, or prices. If you need one,
leave the sample value and list it for me.
Confirm with one line, and don't change any files yet.

Change the brand from "Folex" to "[NAME]". In src/config/config.toml update [site] title and
logoText, and [seo] author. Then set the tagline and description in `site` in every
src/i18n/<language>.json, and search src/content and src/config for any remaining "Folex" in
visible text and replace it. Don't rename files or code identifiers.

My brand color is [HEX] and my accent color is [HEX]. In src/styles/theme.css update
--color-primary and --color-accent, and adjust --color-secondary, --color-theme-light, and
--color-theme-dark to match. Keep at least 4.5:1 contrast for text on --color-body and on
--color-theme-dark. Don't add arbitrary color values anywhere else, and don't touch the
typography tokens. List the values you chose.

Replace Poppins with [GOOGLE FONT] for --font-primary and Unbounded with [GOOGLE FONT] for
--font-secondary in src/config/fonts.json. Keep the cssVariable names, the weights, the
fallbacks, and the IBM Plex Sans Arabic entry (it is loaded only on Arabic pages). Don't edit any
CSS file. Remind me to restart npm run dev. Unbounded is a wide display font: after the change,
tell me which headings to check at 375 px.

I added my logo at src/assets/images/[FILE].svg and a light version at
src/assets/images/[FILE]-light.svg. In src/config/config.toml set [site] logo and logoAlternate
to those paths, adjust logoWidth and logoHeight to keep their proportions, and set logoText to
[NAME OR ""]. Also set image under [site.favicon] to the main file, and tell me to run
npm run generate-favicons.

I want the [creative agency | startup agency | personal portfolio] homepage as my main homepage.
Replace the sections of src/pages/[...lang]/index.astro with the ones in
src/pages/[...lang]/[creative-agency | startup-agency | personal-portfolio].astro, and copy the
named blocks from src/content/homepage/english/[FILE].md into
src/content/homepage/english/-index.md (same for french and arabic). Then delete the other
homepage routes and their content files, and remove them from the menus in every
src/config/menu.<language>.json. Run npm run astro-check.

Rewrite the English homepage text for my studio. The homepage is
src/pages/[...lang]/index.astro. Edit the named blocks in
src/content/homepage/english/-index.md and the section files it uses in
src/content/sections/english/. Keep every key, option, icon name, image path, and the number of
items in each list. Only change text values. Then write the french and arabic versions, with
identical keys.

On the homepage (src/pages/[...lang]/index.astro), move [SECTION] above [SECTION] and remove
[SECTION]. Only edit the route file: don't delete any content files, and remove imports that are
no longer used. Then run npm run astro-check.

On [PAGE, for example /about/], change [WHAT] for that page only. Add or edit the matching named
block in that page's frontmatter in src/content/[about-us | pricing | faq | contact]/english/
-index.md, using a block name that exists in src/sections.schema.ts. Leave the file in
src/content/sections/english/ alone so the other pages keep the current text. Do the same for
french and arabic.

Change the [portfolio | services | team | testimonial] section to the "[VALUE]" layout. Set
options.layout in src/content/sections/english/[FILE].md, and use one of the values from the
comment next to it. Make the same change in the french and arabic copies, then run
npm run astro-check and tell me which pages use that section.

On [PAGE ROUTE in src/pages/[...lang]/], use footer layout "[footer-1 | footer-2 | footer-3]" and
[a dark | a light] header over the banner. Set the footerLayout, headerPosition, and
hasHeaderDarkBackground props on <Base> in that route file only. Don't change Base.astro.

In every src/config/menu.<language>.json: keep only links to the pages I use ([LIST]), and set
"enable": false on the rest in headerPrimary, footerPrimary, footerSecondary, and
footerTertiary. Keep the JSON shape, the weight values, and the same items in every language.
Then check the header on desktop, with the keyboard, and in the mobile menu.

Turn the "[MENU NAME]" item in headerPrimary into a mega menu in every
src/config/menu.<language>.json. Use hasMegaMenu: true with menus as groups of
{ enable, name, description, icon, url, weight }, following the shape documented in AGENTS.md
under "Menus and Mega Menu". Add the cta card with [DETAILS] and the bottom bar with
[TEXT, LABEL, URL]. The bar also shows the phone number from [settings.contactInfo] in
config.toml.

Create a page at /[slug]/ with these sections: [ServicesSection, Stats, Testimonial,
CallToAction]. Follow the "Add a new page" skill in SKILLS.md: copy src/pages/[...lang]/
about.astro, keep its getStaticPaths, and compose it from the section components. Put the page's
own copy in named blocks in a new content file, using block names from src/sections.schema.ts.
Add "[slug]" to headerPrimary in every src/config/menu.<language>.json, then run
npm run astro-check.

I don't need these pages: [LIST, for example /faq/, /pricing/, /team/]. For each one, delete its
route file in src/pages/[...lang]/ and its content folder in src/content/, remove it from
src/lib/utils/aiContent.ts if it is listed there, then remove every link to it from each
src/config/menu.<language>.json and from content files (search for the URL). Run
npm run astro-check and npm run build, and fix anything they report.

I only need English. Set enable = false under [settings.multilingual] in src/config/config.toml.
Don't delete any files yet. Then tell me exactly what npm run toml:watch and
npm run remove-multilingual would do, and which lines I should remove from netlify.toml.

Add [LANGUAGE] (code "[xx]", folder "[name]", locale "[xx-XX]", social locale "[xx_XX]") and keep
the other languages. Follow the "Add or remove a language" skill in SKILLS.md: run
npm run generate-multilingual-content with those values, add a /[xx]/* block to netlify.toml, and
add a font entry to src/config/fonts.json if the script needs its own font. Then translate the
copied content folders, src/config/menu.[xx].json, and src/i18n/[xx].json, keeping every key,
icon name, URL, and number. If it is a right-to-left language, say so and use --dir rtl.

The [Arabic | French] content is machine translated. Review src/content/[FOLDER]/
[arabic | french] and src/i18n/[ar | fr].json and rewrite the text so it reads naturally. Keep every key,
number, URL, and icon name exactly as it is, and don't change the English files. For Arabic, keep
numbers, emails, and URLs left to right.

Connect the contact form to [Formspree with form ID xxxx | formsubmit.co with [EMAIL] | Netlify
Forms]. Update contactFormAction and contactFormProvider in src/config/config.toml, following the
comments next to them. Don't change the form fields.

The contact form should ask for: [LIST OF FIELDS]. Edit the fields in
src/content/sections/english/contact-section.md, and make the same change in the french and
arabic copies. Don't edit widgets/ContactForm.astro. Keep the existing field shape and the
required flags, and keep the labels translated per language.

My details are: address [ADDRESS], phone [PHONE], email [EMAIL]. Put the phone and email in
[settings.contactInfo] in src/config/config.toml, and the address in contactInfo.address in every
src/i18n/<language>.json (it may contain a <br /> for the line break). Also update the social
links in src/config/social.json ([LIST OF URLS]) and set "enable": false on the networks I
don't use.

For each page's -index.md in src/content/*/english/ and each file in src/content/pages/english/,
write a metaDescription of 140-160 characters based on that page's real content. Only add or
change metaDescription. Then do the french and arabic versions.

Review this site before launch and list what is still demo content. Check: baseUrl in [site] in
src/config/config.toml (it ships as https://example.com), contactFormAction, formAction under
[settings.subscription], [settings.contactInfo], contactInfo.address in every
src/i18n/<language>.json, social links in src/config/social.json, every price in
src/content/sections/*/pricing-section.md, the sample projects in src/content/portfolio/, the
sample team in src/content/team/, the legal pages in src/content/pages/, any "#" or example.com
links in the menus and content, and any remaining "Folex" in visible text. Don't change files:
list the file and the line for each item.

npm run [dev | build | astro-check] fails with this error:
[PASTE THE FULL ERROR]
Explain the cause in one sentence, then fix it with the smallest change. Don't change unrelated
files.

I changed [WHAT] in [FILE] but the page [URL] still shows the old version. Find where that page
gets this text: check the named block in the page's frontmatter, whether that block name is a key
of sectionsSchema in src/sections.schema.ts, and the section file in
src/content/sections/english/. Tell me which one wins and why. Don't change anything yet.

On [PAGE] at /ar/, [WHAT LOOKS WRONG]. Follow the RTL Rules in AGENTS.md: replace physical
classes with logical ones, add rtl: handling for translate-x, transform origins, and gradients,
and add any direction-bearing icon to the rtlFlipIcons list in
src/layouts/helpers/Icons.astro rather than at the call site. Custom reveal effects live in
src/styles/animation.css with their mirror in rtl.css. Then tell me what to check at /ar/.