Skip to content

feat(ui): add automatic dark mode from system preference #174

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
vaind merged 4 commits into from
Aug 26, 2026
Merged

feat(ui): add automatic dark mode from system preference #174

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
c3bd589
feat(ui): add automatic dark mode from system preference
sentry-junior[bot] Aug 25, 2026
48953f0
fix(ui): keep accent CTAs high-contrast in dark mode
sentry-junior[bot] Aug 25, 2026
92a6c8c
fix(ui): repair invalid projectAwards background token
sentry-junior[bot] Aug 25, 2026
3e4ffb9
fix(ui): theme translucent voting and award cards
sentry-junior[bot] Aug 25, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="theme-color" content="#130f1c" />
<meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)" />
<meta name="theme-color" content="#130f1c" media="(prefers-color-scheme: dark)" />
<meta
name="description"
content="Hackweek — a week for building ambitious ideas together."
Expand Down
6 changes: 3 additions & 3 deletions src/app/components/AppLayout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import {useState, type ReactNode} from 'react';
import {Link, useRoute} from 'wouter';

import type {SessionUser, SessionViewMode} from '../../shared/api';
import sentrySymbol from '../../assets/logos/logo-sentry-symbol.svg';
import {SentrySymbol} from './SentrySymbol';
import {UserAvatar} from './UserAvatar';

export function AppLayout({
Expand Down Expand Up @@ -38,7 +38,7 @@ export function AppLayout({
href="/years"
aria-label="Sentry Hackweek archives"
>
<img src={sentrySymbol} alt="" />
<SentrySymbol />
<strong>#HACKWEEK</strong>
</Link>
<nav aria-label="Primary navigation">
Expand Down Expand Up @@ -88,7 +88,7 @@ export function AppLayout({
{children}
<footer className="siteFooter">
<Link className="footerWordmark" href="/years">
<img src={sentrySymbol} alt="" />
<SentrySymbol />
<span>#HACKWEEK</span>
</Link>
<span>made at Sentry</span>
Expand Down
19 changes: 19 additions & 0 deletions src/app/components/SentrySymbol.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
export function SentrySymbol({className}: {className?: string}) {
return (
<svg
className={className}
width="24"
height="22"
viewBox="0 0 24 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
focusable="false"
>
<path
d="M13.8849 1.57163C13.6939 1.24015 13.4194 0.964903 13.0888 0.773544C12.7582 0.582184 12.3832 0.481445 12.0015 0.481445C11.6198 0.481445 11.2449 0.582184 10.9143 0.773544C10.5837 0.964903 10.3091 1.24015 10.1181 1.57163L7.01735 6.95903L7.80837 7.41446C9.98264 8.67583 11.8116 10.4577 13.132 12.6009C14.4524 14.7441 15.2231 17.182 15.3752 19.6968H13.1983C13.0476 17.5633 12.3775 15.4995 11.2466 13.6863C10.1158 11.873 8.55873 10.3657 6.71202 9.29647L5.92101 8.84263L3.03224 13.8809L3.82325 14.3363C4.7819 14.9012 5.59996 15.6773 6.21554 16.6059C6.83112 17.5346 7.22811 18.5915 7.37648 19.6968H2.40417C2.34056 19.6978 2.27781 19.6819 2.22235 19.6506C2.16689 19.6194 2.1207 19.5739 2.08852 19.5188C2.05633 19.4638 2.0393 19.4012 2.03917 19.3373C2.03904 19.2735 2.05581 19.2108 2.08777 19.1556L3.47362 16.7484C3.0055 16.3525 2.46941 16.0455 1.8916 15.8423L0.51998 18.2448C0.329241 18.5765 0.228889 18.9527 0.229004 19.3356C0.229119 19.7185 0.329698 20.0947 0.520636 20.4263C0.711574 20.7579 0.986146 21.0332 1.31677 21.2246C1.64739 21.4161 2.02242 21.5169 2.40417 21.5169H9.24643V20.6076C9.24688 19.1698 8.90657 17.7525 8.25357 16.4726C7.60056 15.1927 6.65358 14.0868 5.4907 13.2462L6.57913 11.3546C8.06947 12.3894 9.28772 13.7709 10.1297 15.3809C10.9716 16.991 11.4122 18.7816 11.4138 20.5997V21.5105H17.2119V20.6013C17.2093 17.763 16.5015 14.9701 15.1524 12.4751C13.8033 9.98017 11.8556 7.86181 9.48531 6.31159L11.6859 2.48249C11.7174 2.42779 11.7628 2.38238 11.8173 2.35081C11.8719 2.31924 11.9338 2.30262 11.9968 2.30262C12.0598 2.30262 12.1217 2.31924 12.1762 2.35081C12.2308 2.38238 12.2761 2.42779 12.3076 2.48249L21.9042 19.1556C21.9362 19.2108 21.9529 19.2735 21.9528 19.3373C21.9527 19.4012 21.9356 19.4638 21.9035 19.5188C21.8713 19.5739 21.8251 19.6194 21.7696 19.6506C21.7142 19.6819 21.6514 19.6978 21.5878 19.6968H19.3429C19.3714 20.3045 19.3745 20.9123 19.3429 21.5185H21.5957C21.9775 21.5185 22.3525 21.4177 22.6831 21.2262C23.0137 21.0348 23.2883 20.7594 23.4792 20.4279C23.6702 20.0963 23.7708 19.7201 23.7709 19.3372C23.771 18.9543 23.6706 18.5781 23.4799 18.2464L13.8849 1.57163Z"
fill="currentColor"
/>
</svg>
);
}
Loading
Loading