diff --git a/packages/pixel-profile/src/theme.ts b/packages/pixel-profile/src/theme.ts index a1ffccd..b460388 100644 --- a/packages/pixel-profile/src/theme.ts +++ b/packages/pixel-profile/src/theme.ts @@ -7,9 +7,13 @@ type Theme = Record< > export const THEME: Theme = { - monica: { + summer: { color: 'white', - background: 'linear-gradient(to bottom right, #0c7bb3, #f2bae8)' + background: 'linear-gradient(to bottom right, #74dcc4, #4597e9)' + }, + blue_chill: { + color: 'white', + background: 'linear-gradient(to bottom right, #5580eb, #2aeeff)' }, rainbow: { color: 'white', @@ -19,13 +23,9 @@ export const THEME: Theme = { '#79c300 57.12%, #1961ae 57.12%, #1961ae 71.4%, #31137c 71.4%, ' + '#31137c 85.24%, #61007d 85.24%, #61007d 100%)' }, - summer: { - color: 'white', - background: 'linear-gradient(to bottom right, #74dcc4, #4597e9)' - }, - blue_chill: { + monica: { color: 'white', - background: 'linear-gradient(to bottom right, #5580eb, #2aeeff)' + background: 'linear-gradient(to bottom right, #0c7bb3, #f2bae8)' } } diff --git a/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-blue-chill-theme-1-snap.png b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-blue-chill-theme-1-snap.png new file mode 100644 index 0000000..babb44a Binary files /dev/null and b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-blue-chill-theme-1-snap.png differ diff --git a/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-monica-theme-1-snap.png b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-monica-theme-1-snap.png new file mode 100644 index 0000000..f60155b Binary files /dev/null and b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-monica-theme-1-snap.png differ diff --git a/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-rainbow-theme-1-snap.png b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-rainbow-theme-1-snap.png new file mode 100644 index 0000000..c159c64 Binary files /dev/null and b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-rainbow-theme-1-snap.png differ diff --git a/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-1-snap.png b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-1-snap.png new file mode 100644 index 0000000..3d033c7 Binary files /dev/null and b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-1-snap.png differ diff --git a/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-and-custom-background-1-snap.png b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-and-custom-background-1-snap.png new file mode 100644 index 0000000..be92d75 Binary files /dev/null and b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-and-custom-background-1-snap.png differ diff --git a/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-and-custom-color-1-snap.png b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-and-custom-color-1-snap.png new file mode 100644 index 0000000..82bbe8d Binary files /dev/null and b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-and-custom-color-1-snap.png differ diff --git a/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-and-screen-effect-1-snap.png b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-and-screen-effect-1-snap.png new file mode 100644 index 0000000..8cf7165 Binary files /dev/null and b/packages/pixel-profile/test/__image_snapshots__/theme-test-ts-packages-pixel-profile-test-theme-test-ts-theme-render-card-with-summer-theme-and-screen-effect-1-snap.png differ diff --git a/packages/pixel-profile/test/theme.test.ts b/packages/pixel-profile/test/theme.test.ts new file mode 100644 index 0000000..de3bc9d --- /dev/null +++ b/packages/pixel-profile/test/theme.test.ts @@ -0,0 +1,68 @@ +import { renderStats } from '../src' +// @ts-expect-error ... +import { toMatchImageSnapshot } from 'jest-image-snapshot' +import { describe, expect, it } from 'vitest' + +declare global { + // eslint-disable-next-line @typescript-eslint/no-namespace + namespace jest { + interface Matchers { + toMatchImageSnapshot(): R + } + } +} + +expect.extend({ toMatchImageSnapshot }) + +const stats = { + name: 'User Name', + username: 'username', + totalStars: 999, + totalCommits: 99999, + totalIssues: 99, + totalPRs: 9, + contributedTo: 9999, + avatarUrl: '', + rank: { + level: 'S', + percentile: 0, + score: 0 + } +} + +describe('Theme', () => { + it('Render card with summer theme and custom color', async () => { + const png = await renderStats(stats, { theme: 'summer', color: 'yellow' }) + expect(png).toMatchImageSnapshot() + }) + + it('Render card with summer theme and custom background', async () => { + const png = await renderStats(stats, { theme: 'summer', background: 'black' }) + expect(png).toMatchImageSnapshot() + }) + + it('Render card with summer theme and screen effect', async () => { + const png = await renderStats(stats, { theme: 'summer', screenEffect: true }) + expect(png).toMatchImageSnapshot() + }) + + it('Render card with summer theme', async () => { + const png = await renderStats(stats, { theme: 'summer' }) + expect(png).toMatchImageSnapshot() + }) + + it('Render card with blue_chill theme', async () => { + const png = await renderStats(stats, { theme: 'blue_chill' }) + expect(png).toMatchImageSnapshot() + }) + + it('Render card with rainbow theme', async () => { + const png = await renderStats(stats, { theme: 'rainbow' }) + expect(png).toMatchImageSnapshot() + }) + + it('Render card with monica theme', async () => { + const png = await renderStats(stats, { theme: 'monica' }) + expect(png).toMatchImageSnapshot() + }) +})