b9351b76ae
## Remove All 'Calm' References & Reframe Platform Identity ### Documentation Updates - **Deleted**: CALM_UX_GUIDE.md (outdated philosophy document) - **Updated**: All documentation to remove 'calm' terminology - **Reframed**: Platform as 'friends-first' instead of 'calm' ### Design System Changes - Replace 'calm & elegant' with 'warm & welcoming' - Update theme descriptions to focus on friendliness - Change 'calm velocity' to 'authentic engagement' - Update UI microcopy for friendly tone ### Content Updates - Philosophy documents reframe for social connection focus - Design guides emphasize warmth over calmness - API documentation updated for new terminology - User-facing text changed to friendly language ### Key Terminology Changes - 'Calm design' 'Warm, welcoming design' - 'Calm velocity' 'Authentic engagement' - 'Calm UI' 'Friendly UI' - 'Structural calm' 'Structural friendliness' - 'Calm platform' 'Friends-first platform' ### Platform Focus Shift - From: Text-based calm platform - To: Friends-first social network prioritizing genuine connections - Emphasis on social connection over mindfulness - Focus on warmth and friendliness in design ### Files Modified - 15+ documentation files updated - Flutter app UI text updated - Design system rebranded - Philosophy documents reframed - API documentation updated The platform is now positioned as a warm, welcoming social network that prioritizes genuine human connections over calm minimalism.
102 lines
2.9 KiB
Markdown
102 lines
2.9 KiB
Markdown
# Sojorn Theme System
|
|
|
|
## Overview
|
|
The Sojorn app now supports two themes that users can switch between:
|
|
|
|
### 1. **Basic Theme** (Original)
|
|
- Warm and welcoming design
|
|
- Lighter feel with subtle pink tints
|
|
- Slightly larger font sizes
|
|
- Perfect for reading and connection
|
|
|
|
### 2. **Pop Theme** (New - "Awakening")
|
|
- High contrast and energetic
|
|
- Vibrant and defined structure
|
|
- Sharp dividers and clean backgrounds
|
|
- Editorial typography with professional feel
|
|
|
|
## How to Switch Themes
|
|
|
|
Users can switch themes by:
|
|
1. Going to their Profile
|
|
2. Tapping Settings (gear icon)
|
|
3. Scrolling to the "Appearance" section
|
|
4. Selecting either "Basic" or "Pop" theme
|
|
|
|
The selected theme is automatically saved and persists across app sessions.
|
|
|
|
## Technical Implementation
|
|
|
|
### Files Created/Modified:
|
|
|
|
1. **lib/providers/theme_provider.dart** (NEW)
|
|
- State management for theme selection
|
|
- Persists theme preference using SharedPreferences
|
|
|
|
2. **lib/theme/app_theme.dart** (UPDATED)
|
|
- Refactored to support multiple themes
|
|
- Dynamic color getters based on selected theme
|
|
- Maintains backward compatibility
|
|
|
|
3. **lib/main.dart** (UPDATED)
|
|
- Integrated theme provider
|
|
- Watches theme changes and rebuilds UI
|
|
|
|
4. **lib/screens/profile/profile_settings_screen.dart** (UPDATED)
|
|
- Added "Appearance" section with theme switcher
|
|
- Visual radio button selection for themes
|
|
|
|
5. **lib/models/notification.dart** (NEW)
|
|
- Notification model for app notifications
|
|
- Supports appreciate, chain, and follow notifications
|
|
|
|
6. **lib/screens/notifications/notifications_screen.dart** (NEW)
|
|
- Full notifications screen
|
|
- Shows appreciates, chains, and follows
|
|
- Empty state when no notifications
|
|
|
|
7. **lib/screens/home/home_shell.dart** (UPDATED)
|
|
- Instagram-style header with centered "Sojorn" title
|
|
- New post button on the left
|
|
- Notifications button on the right
|
|
- Professional and clean layout
|
|
|
|
## Theme Differences
|
|
|
|
### Basic Theme:
|
|
- Background: Very pale lavender/pink (#F9F2F7)
|
|
- Text: 19px body, softer navy
|
|
- Spacing: More generous
|
|
- Feel: Warm, welcoming, social
|
|
|
|
### Pop Theme:
|
|
- Background: Clean pale lavender (#F9F6F9)
|
|
- Text: 18px body, sharper navy (#0D1050)
|
|
- Spacing: Tighter, more compact
|
|
- Dividers: 2px thick, more defined
|
|
- Feel: Energetic, vibrant, editorial
|
|
|
|
## Features Added
|
|
|
|
### Instagram-Style Header:
|
|
- Centered "Sojorn" branding in elegant serif font
|
|
- Left: New post button (⊞)
|
|
- Right: Notifications button (🔔)
|
|
- Clean white background with bottom border
|
|
|
|
### Notifications System:
|
|
- Three types: Appreciates, Chains, Follows
|
|
- Visual icons for each type
|
|
- Unread indicator (purple dot)
|
|
- Time stamps with relative formatting
|
|
- Empty state with helpful message
|
|
|
|
## Future Enhancements
|
|
|
|
Potential additions:
|
|
- Notification badge count on header icon
|
|
- Real-time notification updates
|
|
- Push notifications
|
|
- More theme options (Dark mode, Custom colors)
|
|
- Per-feed theme customization
|