Icons and colour roles; محفوظ شدہ and پسندیدہ لکھاری #71

Closed
anas wants to merge 0 commits from feature/icons-palette into main
Owner

Owner request: icons, and a palette that tells log out, actions, text and rich text apart, with fewer words in navigation and buttons.

Icons

  • An Icon component with Lucide shapes (ISC licence), drawn inline; no new dependency.
  • Icons take the control's colour. They are decorative: each control keeps its words in aria-label and title, so screen readers and tooltips still say what it does.

Colour roles (light and dark)

  • --action: primary action, filled dark blue.
  • --ok: confirming (approve, publish), green.
  • --danger: destructive (log out, delete, reject), red.
  • Secondary actions stay gold-outlined pills. Reading text and links keep their own colours, so content and controls look different.
  • Classes: .btn, .btn.primary, .btn.ok, .btn.danger and round .icon-btn.

Where

  • Header: admin, moderation, saved, word book, account (or sign in), font and theme are icon buttons with tooltips, plus a red log-out button.
  • Review: save and send are filled; approve and publish are green; return is plain; reject is red; all with icons.
  • Account: save (filled), log out (red), change password, delete account (red).
  • Reading pages: edit, history (icon only), arrange and tag.
  • E-books: add (filled), download, cover buttons; the PDF reader's previous/next (arrows pointing the way the book turns), full screen and page bookmark.

Names (owner request)

  • نشانات is now محفوظ شدہ in the tabs, page title and tooltips.
  • Favourite writers have their own page, پسندیدہ لکھاری (/writers, a tab beside محفوظ شدہ and ذخیرۂ الفاظ), and are no longer mixed into saved texts.

Header follow-ups

  • The font is a list (نسخ / نستعلیق), now inside the display settings.
  • The word-book icon has an Urdu ع instead of a Latin A, laid over the book as text so Safari draws it the same as other browsers.
  • Log out lines up with the other icons.

Colour palettes (owner request: less sepia, more colourful but calm)

  • Sepia stays the default. Added فیروزی (turquoise), نیلگوں (lapis blue), سبز (Mughal-garden green) and گلابی (soft rose), each with a light and a dark version.
  • One settings button in the header (sliders icon) opens a panel with:
    • font: نسخ / نستعلیق;
    • colour: swatches;
    • light/dark/automatic.
  • The panel replaces the separate font and theme controls, so the header has one control fewer.
  • Choices are remembered and applied before the page draws, so there is no flash of the old colours.

Checked with headless Chrome screenshots (light and dark) as an admin: header, poem page, account, a review page, the PDF reader and پسندیدہ لکھاری. The test account was removed.

🤖 Generated with Claude Code

Owner request: icons, and a palette that tells log out, actions, text and rich text apart, with fewer words in navigation and buttons. **Icons** - An `Icon` component with Lucide shapes (ISC licence), drawn inline; no new dependency. - Icons take the control's colour. They are decorative: each control keeps its words in `aria-label` and `title`, so screen readers and tooltips still say what it does. **Colour roles** (light and dark) - `--action`: primary action, filled dark blue. - `--ok`: confirming (approve, publish), green. - `--danger`: destructive (log out, delete, reject), red. - Secondary actions stay gold-outlined pills. Reading text and links keep their own colours, so content and controls look different. - Classes: `.btn`, `.btn.primary`, `.btn.ok`, `.btn.danger` and round `.icon-btn`. **Where** - **Header:** admin, moderation, saved, word book, account (or sign in), font and theme are icon buttons with tooltips, plus a **red log-out** button. - **Review:** save and send are filled; approve and publish are green; return is plain; reject is red; all with icons. - **Account:** save (filled), log out (red), change password, delete account (red). - **Reading pages:** edit, history (icon only), arrange and tag. - **E-books:** add (filled), download, cover buttons; the PDF reader's previous/next (arrows pointing the way the book turns), full screen and page bookmark. **Names** (owner request) - **نشانات** is now **محفوظ شدہ** in the tabs, page title and tooltips. - Favourite writers have their own page, **پسندیدہ لکھاری** (`/writers`, a tab beside محفوظ شدہ and ذخیرۂ الفاظ), and are no longer mixed into saved texts. **Header follow-ups** - The font is a list (نسخ / نستعلیق), now inside the display settings. - The word-book icon has an Urdu **ع** instead of a Latin A, laid over the book as text so Safari draws it the same as other browsers. - Log out lines up with the other icons. **Colour palettes** (owner request: less sepia, more colourful but calm) - Sepia stays the default. Added **فیروزی** (turquoise), **نیلگوں** (lapis blue), **سبز** (Mughal-garden green) and **گلابی** (soft rose), each with a light and a dark version. - One **settings** button in the header (sliders icon) opens a panel with: - **font:** نسخ / نستعلیق; - **colour:** swatches; - **light/dark/automatic.** - The panel replaces the separate font and theme controls, so the header has one control fewer. - Choices are remembered and applied before the page draws, so there is no flash of the old colours. **Checked** with headless Chrome screenshots (light and dark) as an admin: header, poem page, account, a review page, the PDF reader and پسندیدہ لکھاری. The test account was removed. 🤖 Generated with [Claude Code](https://claude.com/claude-code)
anas added 1 commit 2026-10-09 13:23:08 +00:00
- Icon component (Lucide shapes, ISC), currentColor, decorative (the control keeps its words in aria-label/title).
- Colour roles: --action (primary, filled), --ok (approve, publish), --danger (log out, delete, reject); .btn variants
  and .icon-btn; light and dark.
- Header: admin, moderation, saved, word book, account/sign in, font, theme as icons; log out in red.
- Review: save/send filled, approve/publish green, return plain, reject red, with icons. Account: save, log out, password,
  delete. Reading pages: edit, history, arrange, tag. E-books: add, download, covers; the reader's controls as icons.
- نشانات is now محفوظ شدہ; favourite writers have their own page, پسندیدہ لکھاری (/writers).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
anas added 1 commit 2026-10-09 13:27:33 +00:00
anas added 1 commit 2026-10-09 13:29:30 +00:00
anas added 1 commit 2026-10-09 13:31:19 +00:00
anas added 1 commit 2026-10-09 13:34:40 +00:00
anas closed this pull request 2026-10-09 13:58:49 +00:00

Pull request closed

Sign in to join this conversation.
No reviewers
No Milestone
No project
No Assignees
1 Participants
Notifications
Due Date
The due date is invalid or out of range. Please use the format 'yyyy-mm-dd'.

No due date set.

Dependencies

No dependencies set.

Reference: anas/divan#71
No description provided.