libra/docs/stories/story-12.6-documentation-up...

194 lines
6.0 KiB
Markdown

# Story 12.6: Brand Documentation and Cleanup
## Story
**As a** developer/designer
**I want to** update brand documentation to reflect the new logo and olive green color scheme
**So that** future development maintains consistent branding
## Acceptance Criteria
### AC1: Brand Guide Updated
**Given** `docs/brand.md` contains old color palette and logo description
**When** I update the document
**Then** it reflects the new branding:
**Updated Color Palette:**
| Color | Hex Code | Usage |
|-------|----------|-------|
| Olive Green | `#8AB357` | Primary brand color, backgrounds, accents |
| Darker Olive | `#7AA347` | Hover states |
| Dark Olive | `#6A9337` | Active states, headings |
| Light Olive | `#A5C87A` | Secondary backgrounds, borders |
| Pale Olive | `#C5D9A5` | Subtle backgrounds |
| Off-White | `#E8E4DC` | Light backgrounds |
| Deep Black | `#1A1A1A` | Text, headings |
**Updated Logo Description:**
- Square format featuring Palestinian tatreez (embroidery) patterns
- Central botanical/olive motif
- "LIBRA FOR RIGHTS" text integrated into design
- Palestinian flag accent
- Cultural heritage elements
### AC2: Logo Generation Instructions Updated
**Given** `docs/logo-generation-instructions.md` describes horizontal logo generation
**When** I update the document
**Then** it reflects square logo format:
- Update dimensions to square format
- Update file naming conventions
- Remove references to horizontal aspect ratio
- Update tool instructions for square export
### AC3: CLAUDE.md Updated
**Given** `CLAUDE.md` contains color scheme reference
**When** I review and update if needed
**Then** the design requirements section reflects:
- New olive green color palette
- Square logo format
- Palestinian tatreez design elements
### AC4: Architecture Documentation Updated
**Given** architecture docs may reference brand colors
**When** I review architecture documentation
**Then** any color references are updated to olive palette
### AC5: Old Logo Files Archived/Removed
**Given** old SVG logo files exist in the repository
**When** documentation is complete
**Then** old files are handled appropriately:
- `public/images/logo.svg` - Remove or archive
- `public/images/logo-reversed.svg` - Remove or archive
- `public/images/logo-mono.svg` - Remove or archive
- `public/favicon.svg` - Remove or archive
**Note:** Keep git history for reference; no need to purge from history
### AC6: Logo Folder Cleanup
**Given** logo files were generated in `logo/` folder
**When** deployment is complete
**Then** the `logo/` folder is removed (files moved to `public/`)
### AC7: README Updated (if applicable)
**Given** README may contain branding information
**When** I review README.md
**Then** any visual/branding references are current
### AC8: Test Assertions Updated
**Given** tests may contain color value assertions
**When** I review test files
**Then** color assertions use new olive palette values:
- `AccessibilityComplianceTest.php`
- Any component tests with color assertions
- Email template tests
- PDF template tests
## Technical Notes
### Files to Update
**Documentation:**
- `docs/brand.md` - Full brand guide update
- `docs/logo-generation-instructions.md` - Update for square format
- `CLAUDE.md` - Update design requirements section
**Tests to Review:**
- `tests/Feature/AccessibilityComplianceTest.php`
- `tests/Feature/Components/` - Any color assertions
- `tests/Feature/Mail/EmailTemplateColorsTest.php`
- `tests/Feature/Admin/PdfBrandColorsTest.php`
### New Brand Guide Content
```markdown
## Color Palette
| Color | Hex Code | Usage |
|-------|----------|-------|
| Olive Green | `#8AB357` | Primary brand color |
| Darker Olive | `#7AA347` | Hover states |
| Dark Olive | `#6A9337` | Active states |
| Light Olive | `#A5C87A` | Secondary accents |
| Pale Olive | `#C5D9A5` | Subtle backgrounds |
| Off-White | `#E8E4DC` | Light backgrounds |
| Deep Black | `#1A1A1A` | Text, headings |
## Logo
### Description
The logo features a square design incorporating Palestinian tatreez (traditional embroidery)
patterns with a central botanical/olive motif. The design represents:
- **Tatreez Patterns:** Palestinian cultural heritage and identity
- **Olive Branch:** Peace, dignity, and connection to the land
- **"LIBRA FOR RIGHTS":** Organization name and mission
- **Palestinian Flag:** National identity accent
### Logo Style
- Square format
- Traditional embroidery-inspired patterns
- Botanical/organic central element
- Deep black and olive green color scheme
- Cultural authenticity with modern presentation
```
### Files to Remove
```bash
# Old logo files to remove after verification
rm public/images/logo.svg
rm public/images/logo-reversed.svg
rm public/images/logo-mono.svg
rm public/favicon.svg
# Temporary logo folder to remove
rm -rf logo/
```
### Test Color Value Updates
```php
// Old assertions
$this->assertStringContainsString('#4A4A42', $content);
$this->assertStringContainsString('#C9C4BA', $content);
// New assertions
$this->assertStringContainsString('#8AB357', $content);
$this->assertStringContainsString('#A5C87A', $content);
```
## Dev Checklist
- [ ] Update `docs/brand.md` with new color palette
- [ ] Update `docs/brand.md` with new logo description
- [ ] Update `docs/logo-generation-instructions.md` for square format
- [ ] Review and update `CLAUDE.md` design requirements
- [ ] Review architecture documentation for color references
- [ ] Update `AccessibilityComplianceTest.php` color assertions
- [ ] Update `EmailTemplateColorsTest.php` color assertions
- [ ] Update `PdfBrandColorsTest.php` color assertions
- [ ] Review and update any other test color assertions
- [ ] Remove old SVG logo files from `public/images/`
- [ ] Remove old `public/favicon.svg`
- [ ] Remove temporary `logo/` folder
- [ ] Verify all tests pass with new color values
- [ ] Final visual review of documentation
## Estimation
**Complexity:** Low
**Risk:** Low - Documentation and cleanup tasks
## Dependencies
- All other Epic 12 stories should be completed before final cleanup
- This story should be completed last in the epic