29 lines
1.4 KiB
Markdown
29 lines
1.4 KiB
Markdown
|
# Theme polish: requirements
|
||
|
|
|
||
|
|
Status: in progress, on branch `feature/theme-polish` (based on `develop`).
|
||
|
|
Scope: the Keycloak login theme and the web app's short messages. Follows `web-redesign`.
|
||
|
|
|
||
|
|
## Goals
|
||
|
|
|
||
|
|
The login pages and the web app's messages look like the rest of the app in each of its three themes (Ceviz, Gece,
|
||
|
|
Yeşim), and messages appear where they are noticed without covering the game.
|
||
|
|
|
||
|
|
## Requirements
|
||
|
|
|
||
|
|
### R1. Login pages
|
||
|
|
- R1.1 The login, registration, password reset and other Keycloak login pages use the web redesign's look: its colors,
|
||
|
|
font, logo, rounded cards, pill buttons and the app's name ("Mancala", in Turkish "Köçürme").
|
||
|
|
- R1.2 They use the theme the player chose in the web app on the same device, also right after changing it.
|
||
|
|
- R1.3 Without a chosen theme (e.g. a first visit straight to the login page), they follow the system's color scheme:
|
||
|
|
Ceviz when it is dark, Yeşim when it is light.
|
||
|
|
- R1.4 Errors, info messages and the language select stay readable in every theme; the pages work at phone width
|
||
|
|
without horizontal scrolling.
|
||
|
|
|
||
|
|
### R2. Messages in the web app
|
||
|
|
- R2.1 Short messages (e.g. "Opponent's turn", "Connection lost") use the theme's colors and font.
|
||
|
|
- R2.2 They appear at the top centre, just below the header, not in the bottom right corner.
|
||
|
|
- R2.3 Several messages stack without covering the header; each goes away by itself or when clicked.
|
||
|
|
|
||
|
|
## Out of scope (TODO)
|
||
|
|
- Keycloak's email theme (password reset emails).
|