Add tasks

This commit is contained in:
Kalle 2026-01-11 11:51:05 +02:00
parent f6493f2507
commit 4ea7b43c7c
21 changed files with 571 additions and 1 deletions

View File

@ -0,0 +1,40 @@
---
# sendou.ink-1kb8
title: Show times on mobile My Calendar panel
status: todo
type: task
created_at: 2026-01-11T09:48:18Z
updated_at: 2026-01-11T09:48:18Z
parent: sendou.ink-6eko
---
## Summary
The mobile My Calendar panel currently only shows tournament names without any time information. Add day headers and event times to help players know when things are happening.
## Current state
Panel shows a flat list of tournaments with just:
- Tournament logo
- Tournament name
## Proposed design
Group events by day with headers, then show time per event:
```
Today
3:00 PM PICNIC #2
7:00 PM In The Zone 22
Tomorrow
2:00 PM Paddling Pool 253
5:00 PM Swim or Sink 101
```
## Checklist
- [ ] Add day header groupings (Today, Tomorrow, weekday names, or dates)
- [ ] Show event start time next to each entry
- [ ] Ensure times display in user's local timezone
- [ ] Test with events spanning multiple days

View File

@ -0,0 +1,34 @@
---
# sendou.ink-1l22
title: CSS rework for modern practices and theming accessibility
status: in-progress
type: epic
priority: normal
created_at: 2026-01-11T09:33:26Z
updated_at: 2026-01-11T09:34:23Z
---
## Why
The existing CSS architecture needed modernization to support:
1. **Consistency** - Standardized design tokens and variable naming conventions
2. **Modern CSS practices** - Leveraging newer CSS features for better maintainability
3. **Accessibility for user-defined themes** - Making it easy for users to customize themes while maintaining readability and contrast requirements
## What's been done
- Redefined all styles in `vars.css` with a consistent naming convention
- Established design tokens for colors, spacing, typography, and other properties
- Created a foundation that supports user theme customization while preserving accessibility
## Goals
- All components use CSS variables from `vars.css` consistently
- Theme customization is straightforward and accessible
- Color contrast and other accessibility requirements are maintained across all themes
- Reduced CSS specificity conflicts and improved maintainability
## Completion criteria
All child tickets resolved and the new CSS variable system is fully adopted across the codebase.

View File

@ -0,0 +1,27 @@
---
# sendou.ink-1qfh
title: Fix notification button and indicator dot overlay
status: todo
type: bug
created_at: 2026-01-11T09:37:03Z
updated_at: 2026-01-11T09:37:03Z
parent: sendou.ink-6eko
---
## Problem
The notification bell icon and the unread indicator dot are displayed side by side instead of the dot being overlayed on top of the bell icon.
## Screenshot
The blue notification dot appears next to the bell icon rather than positioned as an overlay badge on the icon.
## Expected behavior
The notification indicator dot should be positioned as an overlay on the bell icon (typically top-right corner), following standard notification badge UI patterns.
## Acceptance criteria
- Notification dot is positioned as an overlay on the bell icon
- Dot placement follows common UI conventions (e.g., top-right corner)
- Works correctly on both desktop sidebar and mobile layouts

View File

@ -0,0 +1,23 @@
---
# sendou.ink-255r
title: Friends feature
status: draft
type: epic
created_at: 2026-01-11T09:27:40Z
updated_at: 2026-01-11T09:27:40Z
---
## Overview
Friends functionality for sendou.ink. Currently friends are mocked with placeholder data in the sidebar.
## Current State
- Friends list displays in sidebar (desktop) and mobile panel
- Data is mocked in `app/features/sidebar/routes/sidebar.ts` with placeholder avatars
- Friend items have empty `to=""` links - clicking them does nothing
- No real data integration exists
## Scope
TBD - needs design and requirements definition.

View File

@ -0,0 +1,28 @@
---
# sendou.ink-36pm
title: Add weapon mega menu to mobile design
status: todo
type: task
created_at: 2026-01-11T09:31:09Z
updated_at: 2026-01-11T09:31:09Z
parent: sendou.ink-6eko
---
## Problem
The desktop layout has a weapon mega menu in the top navigation bar that allows users to quickly access weapon-specific pages. This menu is missing from the mobile design, which uses bottom tab navigation instead.
## Context
Mobile users currently lack quick access to weapon-related content that desktop users have via the top menu bar category dropdowns.
## Possible approaches
- Add weapon navigation to the mobile menu modal
- Create a dedicated weapons section accessible from mobile tabs
- Integrate weapon categories into the existing mobile menu structure
## Acceptance criteria
- Mobile users can access the same weapon navigation options as desktop users
- Navigation is intuitive and follows the established mobile design patterns

View File

@ -0,0 +1,45 @@
---
# sendou.ink-3qrp
title: Improve mobile menu grid alignment and prevent label wrapping
status: todo
type: bug
created_at: 2026-01-11T09:42:29Z
updated_at: 2026-01-11T09:42:29Z
parent: sendou.ink-6eko
---
## Problem
On mobile, the menu grid has alignment issues and some page labels are breaking into two or three lines, creating an inconsistent and cluttered appearance.
## Screenshot
Labels breaking to multiple lines:
- "Build Analyzer" (2 lines)
- "User Search" (2 lines)
- "Top Search" (2 lines)
- "Tier List Maker" (3 lines)
- "Plus Server" (2 lines)
- "Leaderboards" wrapping
Meanwhile other labels like "Settings", "SendouQ", "Builds", "Scrims", "LFG" etc. fit on one line.
## Expected behavior
- Menu items should be consistently aligned
- Labels should ideally fit on a single line
- If wrapping is unavoidable, it should be limited to two lines maximum
## Possible solutions
- Reduce number of columns to give more horizontal space per item
- Use shorter label names where possible
- Adjust font size for labels
- Use text truncation with ellipsis for long labels
## Acceptance criteria
- Menu grid is visually balanced and aligned
- No labels break to three lines
- Minimize two-line labels where possible
- Consistent spacing between menu items

View File

@ -5,7 +5,9 @@ status: in-progress
type: epic
priority: normal
created_at: 2026-01-11T08:58:29Z
updated_at: 2026-01-11T09:19:14Z
updated_at: 2026-01-11T09:34:23Z
blocking:
- sendou.ink-1l22
---
## Why

View File

@ -0,0 +1,30 @@
---
# sendou.ink-6i41
title: Move Settings to same row as user avatar in mobile user tab
status: todo
type: bug
created_at: 2026-01-11T09:40:48Z
updated_at: 2026-01-11T09:40:48Z
parent: sendou.ink-6eko
---
## Problem
On mobile, in the user tab modal, the Settings option is positioned at the bottom of the panel. It should instead be on the same row as the user avatar and name.
## Current behavior
- User avatar + name (Sendou) on one row
- Notifications section
- Settings at the bottom (separate location)
## Expected behavior
- User avatar + name + Settings on the same row
- Notifications section below
## Acceptance criteria
- Settings button/link is positioned on the same row as the user avatar and name
- Layout is balanced and visually clean
- Settings remains easily accessible

View File

@ -0,0 +1,31 @@
---
# sendou.ink-bti2
title: Fix duplicate Notifications header in mobile user tab
status: todo
type: bug
created_at: 2026-01-11T09:39:53Z
updated_at: 2026-01-11T09:39:53Z
parent: sendou.ink-6eko
---
## Problem
On mobile, the user tab modal shows the "Notifications" header twice in a row - once as a section header and again immediately below it with a refresh button.
## Screenshot
The "You" modal displays:
- User profile (Sendou)
- 🔔 Notifications (first instance)
- 🔔 Notifications + refresh button (second instance)
- Notification list items
## Expected behavior
The Notifications header should only appear once.
## Acceptance criteria
- Only one Notifications header is displayed in the mobile user tab
- Refresh functionality is preserved
- Layout remains clean and properly structured

View File

@ -0,0 +1,21 @@
---
# sendou.ink-eb17
title: Add ad slots to new layout
status: draft
type: task
created_at: 2026-01-11T09:29:25Z
updated_at: 2026-01-11T09:29:25Z
parent: sendou.ink-6eko
---
## Task
Define and implement ad slot placements for the new sidebar/mobile layout.
## To Define
- Where should ads appear? (sidebar, content area, mobile panels?)
- Ad sizes and formats
- How do ads interact with sidebar collapse?
- Mobile-specific ad placements
- Integration with existing ad provider

View File

@ -0,0 +1,35 @@
---
# sendou.ink-jopf
title: 'Decide on front page content: proper feed or restore old layout'
status: todo
type: task
created_at: 2026-01-11T09:47:05Z
updated_at: 2026-01-11T09:47:05Z
parent: sendou.ink-6eko
---
## Summary
The front page needs attention - either build out a proper activity feed or restore the previous front page content for now.
## Options
### Option A: Build proper feed
- Design and implement a real activity feed with relevant content
- Would include things like: recent tournament results, friend activity, team updates, community highlights
- More work but provides value
### Option B: Restore old front page
- Bring back the previous front page content/layout
- Quick solution to have something meaningful on the homepage
- Can revisit feed implementation later
## Decision needed
Decide which approach to take based on timeline and priorities.
## Checklist
- [ ] Decide on approach (feed vs restore old)
- [ ] Implement chosen solution
- [ ] Test on desktop and mobile

View File

@ -0,0 +1,29 @@
---
# sendou.ink-kw6u
title: Show scrims in My calendar
status: todo
type: task
created_at: 2026-01-11T09:44:26Z
updated_at: 2026-01-11T09:44:26Z
parent: sendou.ink-6eko
---
## Summary
Display scrims (both scheduled and looking-for-match) in the sidebar's "My calendar" section.
## Details
The My calendar section currently shows tournament calendar entries. It should also include:
1. **Scheduled scrims** - Scrims where the user's team has a confirmed match scheduled
2. **Looking-for-match scrims** - Active scrim postings where user's team is still searching for opponents
This gives competitive players visibility into their upcoming scrim commitments directly from the sidebar, reducing the need to navigate to a separate scrims page.
## Checklist
- [ ] Identify where scrim data is fetched/stored
- [ ] Add scrim entries to My calendar data source
- [ ] Distinguish between scheduled vs looking-for-match scrims visually
- [ ] Test with various scrim states

View File

@ -0,0 +1,30 @@
---
# sendou.ink-n3wk
title: Rename mobile menu tab from Calendar to avoid confusion
status: todo
type: bug
created_at: 2026-01-11T09:38:36Z
updated_at: 2026-01-11T09:38:36Z
parent: sendou.ink-6eko
---
## Problem
On mobile, the bottom tab bar has a calendar icon labeled "Calendar" that opens the menu/navigation modal. This is confusing because there is an actual Calendar page in the app, and users may expect tapping "Calendar" to navigate there.
## Screenshot
The bottom tab shows a calendar icon with "Calendar" label, but it functions as the menu button.
## Expected behavior
The menu tab should have a label that clearly indicates it opens navigation/menu, not the Calendar page.
## Possible solutions
- Rename to "My Calendar" (check if fits)
## Acceptance criteria
- Mobile menu tab label clearly communicates its function
- No confusion with the actual Calendar page

View File

@ -0,0 +1,29 @@
---
# sendou.ink-om3i
title: My calendar page
status: draft
type: epic
created_at: 2026-01-11T09:45:51Z
updated_at: 2026-01-11T09:45:51Z
---
## Summary
A dedicated page for viewing the user's personal calendar with all their commitments.
## Why
While the sidebar shows a quick glance at upcoming events, players need a full page view to see their complete schedule at a glance
## Scope
TBD - This is a placeholder epic for future planning.
## Potential features
- Calendar view (week/month) of all user events
- Tournament matches and check-in times
- Scheduled scrims
- SendouQ sessions
- Team practice times
- Integration with external calendars (Google, etc.)

View File

@ -0,0 +1,27 @@
---
# sendou.ink-reks
title: Define sidebar loading behavior
status: todo
type: task
created_at: 2026-01-11T09:27:48Z
updated_at: 2026-01-11T09:27:48Z
parent: sendou.ink-6eko
---
## Problem
Currently the sidebar shows empty/nothing while data loads, making the page appear broken briefly.
## Task
Define how the sidebar should behave when loading data:
- Should we show skeleton loaders?
- Should we show the previous cached data while fetching fresh data?
- Should we show a loading spinner?
- What about error states if the fetch fails?
## Current Implementation
- Sidebar uses a fetcher to load data on mount (`app/components/layout/index.tsx`)
- No loading or error states are shown
- If fetcher fails, error is silently ignored

View File

@ -0,0 +1,22 @@
---
# sendou.ink-s83f
title: Restore Sendou blue+pink and white+pink themes
status: todo
type: task
created_at: 2026-01-11T09:49:34Z
updated_at: 2026-01-11T09:49:34Z
parent: sendou.ink-1l22
---
## Summary
Re-add the classic Sendou themes for the CSS rework:
1. **Blue + Pink** - The signature Sendou.ink dark theme
2. **White + Pink** - Light theme variant
## Checklist
- [ ] Define theme CSS variables for blue+pink theme
- [ ] Define theme CSS variables for white+pink theme
- [ ] Verify accessibility/contrast requirements are met

View File

@ -0,0 +1,27 @@
---
# sendou.ink-tq5i
title: Fix bracket lines and match timer color contrast
status: todo
type: bug
created_at: 2026-01-11T09:36:11Z
updated_at: 2026-01-11T09:36:11Z
parent: sendou.ink-1l22
---
## Problem
On the tournament bracket page, the bracket connector lines and match timer badge blend together because they use the same or very similar colors. This makes it difficult to visually distinguish the timer from the bracket structure.
## Screenshot
The timer showing "0m" and the bracket lines are both a similar gray/muted color, reducing visual clarity.
## Expected behavior
The bracket lines and match timer should have distinct colors so they're easily distinguishable at a glance.
## Acceptance criteria
- Bracket connector lines and match timer have sufficient color contrast between them
- Both elements remain accessible and readable
- Fits within the new CSS variable system in `vars.css`

View File

@ -0,0 +1,27 @@
---
# sendou.ink-utog
title: Update user-pickable themes to use new CSS vars
status: todo
type: task
created_at: 2026-01-11T09:49:34Z
updated_at: 2026-01-11T09:49:34Z
parent: sendou.ink-1l22
---
## Summary
User profile pages and team pages allow custom theme colors. These need to be updated to work with the new CSS variable system from the CSS rework.
## Affected areas
- **User pages** - Profile customization with user-selected colors
- **Team pages** - Team branding colors
## Checklist
- [ ] Audit current user theme implementation
- [ ] Map old theme values to new CSS variable system
- [ ] Update user page theme application logic
- [ ] Update team page theme application logic
- [ ] Test custom themes don't break with new CSS structure
- [ ] Ensure theme picker UI works correctly

View File

@ -0,0 +1,26 @@
---
# sendou.ink-wn5o
title: Define sidebar data update strategy
status: todo
type: task
created_at: 2026-01-11T09:27:58Z
updated_at: 2026-01-11T09:27:58Z
parent: sendou.ink-6eko
---
## Problem
Currently the sidebar fetches fresh data every time the Layout mounts. Need to define when and how sidebar data should be updated.
## Questions to Answer
- When should sidebar data be refreshed? (On every navigation? On a timer? Only on specific actions?)
- Should we use polling for real-time updates (e.g., friend online status, new tournaments)?
- What data needs to stay fresh vs. can be cached longer?
- How do we invalidate the cache when user takes actions (e.g., joins a tournament)?
## Current Implementation
- Sidebar fetches on mount via `useFetcher` (`app/components/layout/index.tsx:76-86`)
- No cache invalidation strategy exists
- Could cause excessive requests on rapid navigation

View File

@ -0,0 +1,27 @@
---
# sendou.ink-yg4i
title: Implement sidebar collapse/expand
status: todo
type: task
created_at: 2026-01-11T09:28:55Z
updated_at: 2026-01-11T09:28:55Z
parent: sendou.ink-6eko
---
## Feature
Allow users to collapse the sidebar to show icons only, giving more horizontal space to content.
## Behavior
- Collapsed state shows just icons for each section (profile, calendar, friends, streams)
- User can toggle between collapsed and expanded states
- Should persist preference (localStorage or user settings)
## Considerations
- Toggle button placement (in sidebar header? floating?)
- Animation/transition when collapsing
- Tooltip on hover for collapsed icons
- Keyboard shortcut to toggle?
- Mobile: does this apply or is mobile handled differently?

10
.claude/settings.json Normal file
View File

@ -0,0 +1,10 @@
{
"hooks": {
"SessionStart": [
{ "hooks": [{ "type": "command", "command": "beans prime" }] }
],
"PreCompact": [
{ "hooks": [{ "type": "command", "command": "beans prime" }] }
]
}
}