libra/docs/stories/story-10.5-logo-assets-upda...

6.3 KiB

Story 10.5: Logo and SVG Assets Update

Story

As a developer I want to update all logo files and SVG assets to match the new brand So that the application displays the correct LIBRA for Rights logo everywhere

Acceptance Criteria

AC1: Primary Logo Updated

Given public/images/logo.svg contains the old Scales of Justice logo with gold colors When I update or replace the logo Then the new botanical/wheat logo is displayed with correct colors:

  • Primary artwork: Deep Black (#1A1A1A) or Charcoal (#4A4A42)
  • For use on light backgrounds

AC2: Reversed Logo Updated

Given public/images/logo-reversed.svg is for dark backgrounds When I update or replace the logo Then the logo displays correctly on Charcoal backgrounds:

  • Artwork: Off-White (#E8E4DC) or Warm Gray (#C9C4BA)

AC3: Monochrome Logo Updated

Given public/images/logo-mono.svg exists for single-color applications When I update or replace the logo Then the logo uses appropriate single color from new palette

AC4: PNG Logo Updated

Given public/images/logo.png is used in some contexts When I update or replace the logo Then the PNG matches the new SVG logo

AC5: Favicon Updated

Given the application has a favicon When I review favicon files Then they are updated to match new brand (if applicable)

AC6: Logo Component References Correct Files

Given resources/views/components/logo.blade.php references logo files When I review the component Then it uses the correct logo variant based on context (light/dark background)

AC7: Logo Displays Correctly Throughout App

Given the logo appears in multiple locations When logos are updated Then they display correctly in:

  • Navigation header
  • Footer
  • Auth pages (login, password reset, etc.)
  • Email headers
  • PDF exports
  • Mobile views

AC8: Logo Clear Space Maintained

Given brand guidelines specify clear space around logo When logo is displayed Then minimum padding/margin is maintained as per docs/brand.md

Technical Notes

Files to Update/Replace

Logo Files:

  • public/images/logo.svg - Primary full-color logo
  • public/images/logo-reversed.svg - For dark backgrounds
  • public/images/logo-mono.svg - Single-color version
  • public/images/logo.png - PNG fallback

Favicon (if exists):

  • public/favicon.ico
  • public/favicon.svg
  • Any other favicon variants

Component:

  • resources/views/components/logo.blade.php

New Logo Requirements (from docs/brand.md)

The new logo features:

  • Stylized botanical illustration
  • Central plant with symmetrical leaves
  • Wheat stalks and water droplets
  • Decorative border with traditional patterns
  • Woodcut/linocut aesthetic
  • High contrast black on neutral background

Logo Color Variants

Variant Background Logo Color
Primary Light (Off-White) Deep Black (#1A1A1A)
Reversed Dark (Charcoal) Off-White (#E8E4DC)
Monochrome Any Single color from palette

Implementation Options

Option A: Replace SVG files entirely

  • Obtain new SVG logo files from brand assets
  • Replace existing files with same names

Option B: Update existing SVG colors

  • If logo shape remains similar, update color values in SVG
  • Change gradients from gold/navy to new palette

Logo Sizing

Per docs/brand.md:

  • Minimum size: 40px height (digital), 15mm (print)
  • Clear space: Equal to height of one water droplet element

Dev Checklist

  • Obtain or create new logo SVG files
  • Update/replace logo.svg
  • Update/replace logo-reversed.svg
  • Update/replace logo-mono.svg
  • Update/replace logo.png
  • Review and update favicon files
  • Update logo.blade.php component if needed
  • Verify logo in navigation header
  • Verify logo in footer
  • Verify logo on auth pages
  • Verify logo in emails
  • Verify logo in PDF exports
  • Test logo on mobile views
  • Verify clear space is maintained

Estimation

Complexity: Low-Medium Risk: Medium - Logo files may need to be provided by client/designer

Dependencies

  • New logo asset files should be provided or approved
  • Coordinate with client on final logo design

Open Questions

  1. Are new logo SVG files available, or should existing SVGs be color-updated?
  2. Should the tagline text ("LAW FIRM") be updated or removed?
  3. Are favicon updates required?

Dev Agent Record

Status: Ready for Review

Agent Model Used

Claude Opus 4.5 (claude-opus-4-5-20251101)

Debug Log References

None

Completion Notes

  • Created new botanical logo SVGs based on brand.md guidelines (plant with leaves, wheat stalks, water droplets, decorative border)
  • Updated tagline from "LAW FIRM" to "for Rights" per new brand identity
  • Primary logo uses Deep Black (#1A1A1A) for light backgrounds
  • Reversed logo uses Off-White (#E8E4DC) for dark backgrounds
  • Monochrome logo uses Charcoal (#4A4A42) as single color
  • Updated favicon.svg with botanical icon design
  • Updated logo.blade.php component to support variant prop (full/reversed/mono)
  • Updated app-logo.blade.php and app-logo-icon.blade.php with new botanical design
  • Changed alt text from "Libra Law Firm" to "LIBRA for Rights"
  • Updated LogoComponentTest.php to expect new brand name
  • Note: logo.png and favicon.ico require manual regeneration from SVG (no conversion tools available)

File List

Modified:

  • public/images/logo.svg - New botanical logo with Deep Black (#1A1A1A)
  • public/images/logo-reversed.svg - New botanical logo with Off-White (#E8E4DC)
  • public/images/logo-mono.svg - New botanical logo with Charcoal (#4A4A42)
  • public/favicon.svg - New botanical favicon icon
  • resources/views/components/logo.blade.php - Added variant prop, updated alt text
  • resources/views/components/app-logo.blade.php - Updated alt text and displayed text
  • resources/views/components/app-logo-icon.blade.php - New botanical SVG icon
  • tests/Feature/Components/LogoComponentTest.php - Updated expectations for new brand name

Requires Manual Update:

  • public/images/logo.png - Needs regeneration from logo.svg
  • public/favicon.ico - Needs regeneration from favicon.svg

Change Log

Date Change Author
2026-01-03 Initial implementation of new botanical logo assets Dev Agent