Skip to content

Commit fe3afab

Browse files
afonsojramosafonsojramos
committed
feat(theme): apply Glass to controls, list rows, and overlays
1 parent 9b3df25 commit fe3afab

9 files changed

Lines changed: 332 additions & 50 deletions

File tree

‎src/renderer/App.css‎

Lines changed: 278 additions & 33 deletions
Large diffs are not rendered by default.

‎src/renderer/components/notifications/NotificationRow.tsx‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { type FC, useState } from 'react';
1+
import { type CSSProperties, type FC, useState } from 'react';
22

33
import { BellSlashIcon, CheckIcon, ReadIcon } from '@primer/octicons-react';
44

@@ -72,6 +72,14 @@ export const NotificationRow: FC<NotificationRowProps> = ({
7272
const NotificationIcon = notification.display.icon.type;
7373
const isNotificationRead = !notification.unread;
7474

75+
// How many action buttons the HoverGroup below actually renders. Exposed as a
76+
// CSS var so the Glass hover-fade (App.css) sizes to the buttons instead of a
77+
// fixed width, which would over-fade rows that show fewer than three.
78+
const enabledActionCount =
79+
Number(!isNotificationRead) +
80+
Number(isMarkAsDoneFeatureSupported(notification.account) && notification.unread) +
81+
Number(isUnsubscribeThreadSupported(notification.account));
82+
7583
return (
7684
<div
7785
className={cn(
@@ -83,6 +91,7 @@ export const NotificationRow: FC<NotificationRowProps> = ({
8391
isNotificationRead && Opacity.READ,
8492
)}
8593
id={notification.id}
94+
style={{ '--gitify-actions': enabledActionCount } as CSSProperties}
8695
>
8796
<Stack align="center" className="gitify-row-content" direction="horizontal" gap="condensed">
8897
<Tooltip direction="e" text={notification.display.type}>

‎src/renderer/components/notifications/__snapshots__/AccountNotifications.test.tsx.snap‎

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/renderer/components/notifications/__snapshots__/NotificationRow.test.tsx.snap‎

Lines changed: 4 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/renderer/components/settings/AppearanceSettings.tsx‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,14 @@ export const AppearanceSettings: FC = () => {
102102
unsafeDisableTooltip={true}
103103
/>
104104

105-
<Button aria-label="Zoom percentage" disabled size="small">
105+
{/* Value display, not a control: styled like the group but inert
106+
* (no disabled wash, no pointer interaction, no tab stop). */}
107+
<Button
108+
aria-label="Zoom percentage"
109+
className="pointer-events-none"
110+
size="small"
111+
tabIndex={-1}
112+
>
106113
{zoomPercentage.toFixed(0)}%
107114
</Button>
108115

‎src/renderer/components/settings/NotificationSettings.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -111,7 +111,13 @@ export const NotificationSettings: FC = () => {
111111
unsafeDisableTooltip={true}
112112
/>
113113

114-
<Button aria-label="Fetch interval" disabled size="small">
114+
{/* Value display, not a control: styled like the group but inert. */}
115+
<Button
116+
aria-label="Fetch interval"
117+
className="pointer-events-none"
118+
size="small"
119+
tabIndex={-1}
120+
>
115121
{formatDuration({
116122
minutes: millisecondsToMinutes(fetchInterval),
117123
})}

‎src/renderer/components/settings/SystemSettings.tsx‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -226,7 +226,13 @@ export const SystemSettings: FC = () => {
226226
size="small"
227227
unsafeDisableTooltip={true}
228228
/>
229-
<Button aria-label="Global shortcut" disabled size="small">
229+
{/* Value display, not a control: styled like the group but inert. */}
230+
<Button
231+
aria-label="Global shortcut"
232+
className="pointer-events-none"
233+
size="small"
234+
tabIndex={-1}
235+
>
230236
<Text as="strong" className="text-gitify-caution">
231237
{recordingShortcut
232238
? hasLiveModifiers
@@ -282,7 +288,13 @@ export const SystemSettings: FC = () => {
282288
unsafeDisableTooltip={true}
283289
/>
284290

285-
<Button aria-label="Volume percentage" disabled size="small">
291+
{/* Value display, not a control: styled like the group but inert. */}
292+
<Button
293+
aria-label="Volume percentage"
294+
className="pointer-events-none"
295+
size="small"
296+
tabIndex={-1}
297+
>
286298
{notificationVolume.toFixed(0)}%
287299
</Button>
288300

‎src/renderer/routes/__snapshots__/Settings.test.tsx.snap‎

Lines changed: 8 additions & 8 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎vite.config.ts‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -111,10 +111,7 @@ export default defineConfig({
111111
// vite-plugin-electron v1 starts Electron with `cwd: server.config.root`.
112112
// Our Vite root is `src/renderer`, so we must override `cwd` back to the
113113
// repository root or Electron will try to boot from `src/renderer`.
114-
// `--log-level=3` (FATAL only) silences Chromium-internal ERROR spam in dev
115-
// (e.g. `SetApplicationIsDaemon` paramErr from renderer processes), which is
116-
// upstream noise we cannot act on. App/electron-log output is unaffected.
117-
await startup(['.', '--no-sandbox', '--log-level=3'], {
114+
await startup(undefined, {
118115
cwd: fileURLToPath(new URL('.', import.meta.url)),
119116
});
120117
},

0 commit comments

Comments
 (0)