Theme controls toggle capsule behavior and icons #282

New issue

Closed

opened 2026-02-08 21:16:06 +00:00 by jjalangtry · 0 comments

jjalangtry commented 2026-02-08 21:16:06 +00:00 (Migrated from github.com)

Copy link

Summary:

• Use an expandable capsule with clear theme/style/font icons.

Context/Resolution:

• Implemented hover/click expand, mobile collapse, and icon changes.

Acceptance Criteria:

• Capsule expands on hover (desktop) and tap (mobile).
• Font toggle shows T (sans/serif), style toggle uses shapes.
• Collapse after toggle on mobile.

Files:

• next/components/common/ThemeControlsToggle.tsx

Summary: - Use an expandable capsule with clear theme/style/font icons. Context/Resolution: - Implemented hover/click expand, mobile collapse, and icon changes. Acceptance Criteria: - Capsule expands on hover (desktop) and tap (mobile). - Font toggle shows T (sans/serif), style toggle uses shapes. - Collapse after toggle on mobile. Files: - next/components/common/ThemeControlsToggle.tsx

Sign in to join this conversation.

No Branch/Tag specified

Branches Tags

main

development

fix/event-calendar-pcard-submission

dependabot/npm_and_yarn/main/radix-ui/react-toggle-1.1.16

dependabot/npm_and_yarn/main/aws-sdk/client-s3-3.1094.0

dependabot/npm_and_yarn/main/radix-ui/react-progress-1.1.14

dependabot/npm_and_yarn/main/radix-ui/react-checkbox-1.3.9

dependabot/npm_and_yarn/main/radix-ui/react-popover-1.1.21

dependabot/npm_and_yarn/main/radix-ui/react-select-2.3.5

dependabot/npm_and_yarn/main/test-tooling-bc9680511c

dependabot/npm_and_yarn/main/lint-tooling-5bdfcf2836

dependabot/npm_and_yarn/main/root-types-05e7a1191d

dependabot/npm_and_yarn/main/next-react-5dcd6daa8e

feature/migrate-to-pnpm

dependabot/npm_and_yarn/next/development/prisma-7.8.0

dependabot/npm_and_yarn/next/development/diff-9.0.0

fix/524-remove-election-accepted-badges

dependabot/npm_and_yarn/next/main/tailwindcss-4.3.2

dependabot/npm_and_yarn/next/main/aws-sdk/s3-request-presigner-3.1085.0

dependabot/npm_and_yarn/next/main/knip-6.26.0

dependabot/npm_and_yarn/next/main/react-is-19.2.7

dependabot/npm_and_yarn/next/main/sass-1.101.0

dependabot/npm_and_yarn/next/main/autoprefixer-10.5.2

dependabot/npm_and_yarn/next/development/lint-tooling-209fa34ebb

dependabot/npm_and_yarn/next/main/nodemailer-9.0.3

worktree-dynamic-content-cms

546-feature-company-talk-interest-form-page

dynamic-content-cms

feat/public-nominate-form

photo-upload-requests

optimize-photos-gallery

vp-reveal-slide

skip-legacy-membership-import

feature/officer-photo-library

db-import

feature/primary-elections

fix/schedule-gate-and-avatar-unify

amendment-app-auth-dev

feature/constitution-amendments

fix/open-issues-431-441-442-443

amendments

bug/favicon

feature/public-headcount-presigned-upload

feature/feat/library-cover-upload-validation

feature/fix/csp-s3-origins

feature/fix/library-empty-catalog-icon-routing

feature/csp-nonce-aws-auth

chore/discord-ci-failure-notifier

dev/test-discord-webhook

dev/403-409-dev-qol-changes

dev/402-add-setup-dev-command

fix/355-365-sydney-refinements

feat/tech-committee-applications

fix/346-security-hardening

epic-340-input-validation-data-integrity

epic-331-auth-rbac

worktree-epic-331-auth-rbac

fix/361-story-fix-attendance-membership-award-timing-and-early-check-in-gating

test/test_overhaul

docs/documentation_overhaul

fix/library-dependencies

dev/credits-api-fix

dev/credits-page

dev/library

dev/pagination_and_api_blocking

dev/unified_auth_gateway

couple-ishs

dockerfile_and_server_changing

payload-cms

mentoring

profile-picture-and-alumni-improvements

color-pallette

dev/aws_migration

ui-enhancements

dev/mentorschedule

250-user-profile

dev/fix_vulnerabilities

dev/adding_frontpage_mentoring_hours

user_profile

crudable-events

binder-badge-patch-1

copilot/sub-pr-264

feature/main-layout

role-base-oauth-scopes

dev/track_migrations

copilot/sub-pr-260

purchase-order-form

feature/alumni-leadership-improvements

feature/jakob/shadcn

weekly-coding-challenges

dev/issue-252-person-refactor

dev/officer_dashboard

lab-tab-and-lab-album

247-bug-project-modal-description-scrollbars

245-bug-overflow-on-header-for-leaderboard

dev/232-membership-leaderboard

dev/alumni_page_quote_fix

dev/alumni-page

dev/sponsors

206-task-add-open-source-process-documentation

qdb_seachbar

dev/issue-229-golink-fix

dev/leadership_page

dev/google-calendar-events-homepage

dev/qdb-staging

dev/qdb

fix/project-empty-fields

deploy/local-testing

dev/centralized_info

quickfix/general_info

bug/events-filter-mobile

dev/HTTP-fixes

dev/new-qdb

release1

general-fixes-1

dev/events-api-id-change

project-bug-fixes-1

dev/nextauth-token-env

dev/officer-crud

dev/mentor-page

dev/events-fix

dev/go-links-bugfix

dev/events-api

dev/per-user-auth

dev/project-seed-fix

mentor-schedule-combined-route

dev/projects

dev/hotfix

owensConPage

origin/streamline-navbar

origin/hero-daisy-ui

150-Fetch_Officers

168-task-events-api

fixed-build

escape-quote-characters

dev/typewriter

dev/api-self-validation

dev/winterball-springfling

bio-dev

dev/user-profile-image

dev/golinks/pinned-container

v0.1.0-prod

v0.1.0

Labels

Clear labels   

accessibility

Accessibility improvements

  

api

  

auth.js

Issues involving Auth.js authentication

  

backend

  

copy

Writing tasks

  

database

  

defect

Something is not as it should be

  

dependencies

  

design

Task related to UI/UX wireframing and style

  

discussion

  

documentation

Improvements or additions to documentation

  

duplicate

This issue or pull request already exists

  

enhancement

New feature or request

  

epic

Track a larger initiative made up of stories

  

feature

  

front-end

  

good first issue

Good for newcomers

  

help wanted

Extra attention is needed

  

invalid

This doesn't seem right

  

next.js

Issues involving Next.js

  

noscript

Related to noscript / no-JS fallback support

  

on hold

This is being put on hold for now...

  

operations

  

optimization

  

postgresql

Issues involving PostgreSQL

  

prisma

Issues involving the Prisma ORM

  

prototype

Creating spike deliverables or prototypes

  

question

Further information is requested

  

react

Issue involving react

  

spike

Learning material

  

stale

This is old and should be reviewed for closure.

  

story

Track a user-facing or system-facing story

  

tailwind

Issues involving Tailwind CSS

  

vulnerability

Addressing a security vulnerability

  

wontfix

This will not be worked on

No labels

accessibility

api

auth.js

backend

copy

database

defect

dependencies

design

discussion

documentation

duplicate

enhancement

epic

feature

front-end

good first issue

help wanted

invalid

next.js

noscript

on hold

operations

optimization

postgresql

prisma

prototype

question

react

spike

stale

story

tailwind

vulnerability

wontfix

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

SSE/WebsiteTheSSEquel#282

No description provided.