Skip to content

Docs landing page: three grain-themed design directions#25

Closed
Copilot wants to merge 3 commits intomainfrom
copilot/improve-docs-page-design
Closed

Docs landing page: three grain-themed design directions#25
Copilot wants to merge 3 commits intomainfrom
copilot/improve-docs-page-design

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 11, 2026

Current docs hero is a cartoon superhero grain mascot with emoji-heavy feature tiles and the entire README dumped below the fold. Replacing with modern, grain-themed, Tailwind-inspired options with high-contrast feature cards.

Three standalone VitePress pages added — accessible via Design Directions nav dropdown. Original index.md untouched until a direction is chosen.

Direction A — Golden Harvest

Elegant wheat ear illustration with kernels on a stalk. Amber→green gradient hero name. "Harvest the Power of Fine-Grained Reactivity"

Direction B — Super Grain

Heroic grain kernel with red cape, energy rings, and animated sparkles. Amber→red gradient. "Your Store Has Superpowers"

Direction C — Grain Field

Golden wheat field with multiple rows of stalks, sunset sun, and floating grain particles. Golden→green gradient. "A Field of Reactive State"

Common across all three

  • Grain/wheat/farm-themed hero SVGs and copy throughout (stalks, harvest, silo, field, etc.)
  • Bold gradient hero text (Tailwind-inspired aesthetic)
  • High-contrast feature cards with warm gradient backgrounds, amber hover borders, and lift-on-hover
  • Feature titles in dark brown (light mode) / golden (dark mode) for strong contrast
  • Grain-themed emoji icons on feature cards
  • Full dark mode styling with separate color tokens
  • No README dump — hero + feature grid only, fits above the fold
Light Dark
A
B
C

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Co-authored-by: scottmessinger <100121+scottmessinger@users.noreply.github.com>
Copilot AI changed the title [WIP] Update documentation page for modern design Docs landing page: three design directions Mar 11, 2026
@scottmessinger
Copy link
Copy Markdown
Member

@copilot The designs are really awful. This is named super GRAIN. The designs should play into grain, farms, food, etc. Also, the feature callouts are pedestrian and boring with low contrast. I need something that feels like it shares the tailwind aesthetic at the minimum, if something interesting is out of reach

… high-contrast features

Co-authored-by: scottmessinger <100121+scottmessinger@users.noreply.github.com>
Copy link
Copy Markdown
Contributor Author

Copilot AI commented Mar 12, 2026

@copilot The designs are really awful. This is named super GRAIN. The designs should play into grain, farms, food, etc. Also, the feature callouts are pedestrian and boring with low contrast. I need s...

Completely redesigned all three directions around the grain/wheat/farm theme in d314dbc.

A — Golden Harvest: Wheat ear illustration, amber→green gradient, "Harvest the Power of Fine-Grained Reactivity"
A dark

B — Super Grain: Heroic grain kernel with cape and energy rings, amber→red, "Your Store Has Superpowers"
B dark

C — Grain Field: Golden wheat field with sun and floating particles, "A Field of Reactive State"
C dark

All three now have: grain-themed SVGs, bold gradient hero text, high-contrast feature cards with warm backgrounds and hover lift effects, grain metaphor copy throughout (stalks, harvest, silo, etc.), and proper dark/light mode tokens.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

  • tailwindcss.com
    • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node /home/REDACTED/work/_temp/ghcca-node/node/bin/node --enable-source-maps /home/REDACTED/work/_temp/copilot-developer-action-main/dist/index.js (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

Copilot AI changed the title Docs landing page: three design directions Docs landing page: three grain-themed design directions Mar 12, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants