新UI #239

longsizhuo · 2026-01-06T19:44:10Z

No description provided.

vercel · 2026-01-06T19:44:15Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
involutionhell-github-io	Ready	Preview, Comment	Jan 7, 2026 5:36pm
website-preview	Ready	Preview, Comment	Jan 7, 2026 5:36pm

Copilot

Pull request overview

This pull request implements a comprehensive UI redesign with a "newsprint" or newspaper-inspired design system. The changes transform the visual aesthetic from a modern, rounded interface to a stark, brutalist design with sharp edges, monospace typography, and a black-and-white color scheme with red accents.

Key Changes:

Complete visual redesign implementing newsprint/newspaper aesthetic with zero border-radius, stark borders, and serif typography
New theme system with custom CSS properties for fonts (Playfair Display, Lora, Inter, JetBrains Mono) and design tokens
Component restructuring including Hero layout transformation, ActivityTicker conversion from carousel to horizontal ticker, and simplified styling across all components

Reviewed changes

Copilot reviewed 12 out of 13 changed files in this pull request and generated 18 comments.

Show a summary per file

File	Description
tsconfig.json	Changed JSX transform from "preserve" to "react-jsx" and added Next.js dev types path
app/layout.tsx	Added inline font loading and theme script, swapped RootProvider/ThemeProvider nesting order, removed sky background element
app/globals.css	Complete CSS rewrite implementing newsprint design tokens, utility classes, and starry background animation with forced zero border-radius
app/components/ZoteroFeed.tsx	Redesigned reading list with newspaper-style layout, removed expand/collapse functionality while keeping unused state
app/components/LicenseNotice.tsx	Updated copyright to 2026, redesigned with monospace typography and smaller icon sizes with abbreviated alt text
app/components/Hero.tsx	Major restructure with newspaper-style layout, large serif typography, new grid-based categories section, and integrated ActivityTicker
app/components/Header.tsx	Newspaper masthead design with static edition info, redesigned navigation and icon buttons
app/components/Footer.tsx	Expanded footer with newspaper-style columns, removed accessible labels from social icons
app/components/Features.tsx	Redesigned feature cards with newspaper aesthetic, icon cloning with className merge logic
app/components/Contribute.tsx	Simplified button styling with conflicting onClick/DialogTrigger behavior
app/components/Community.tsx	Redesigned community section with inverted CTA box and newspaper-style grid cards
app/components/BrandMark.tsx	Updated brand typography to serif, bold, uppercase, italic style
app/components/ActivityTicker.tsx	Converted from image carousel to horizontal scrolling text ticker with event information

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

app/globals.css

Copilot · 2026-01-06T19:58:24Z

app/layout.tsx

+        <ThemeProvider defaultTheme="dark" storageKey="ih-theme">
+          <RootProvider
+            search={{
+              // 使用静态索引，兼容 next export 与本地开发
+              options: { type: "static", api: "/search.json" },
+            }}
+          >
            <main id="main-content" className="relative z-10">
              {children}
            </main>
-          </ThemeProvider>
-        </RootProvider>
+          </RootProvider>
+        </ThemeProvider>


The RootProvider and ThemeProvider have been swapped in their nesting order. This is a significant architectural change that could affect how theming works throughout the application. Ensure that both providers still function correctly with this new order and that theme values are accessible within the search functionality.

app/layout.tsx

Copilot · 2026-01-06T19:58:25Z

app/components/Header.tsx

+          <div className="hidden md:block font-mono text-[10px] uppercase tracking-widest text-neutral-500">
+            Vol. 1 | No. 128 | Beijing Edition


The hardcoded text "Vol. 1 | No. 128 | Beijing Edition" appears to be static content. If this is meant to be dynamic or configurable, it should be extracted to a configuration file or constant. If the issue/volume numbers are supposed to update, this will require manual code changes each time.

Copilot · 2026-01-06T19:58:27Z

app/globals.css

+    line-height: 1;
+    font-family: var(--font-serif);
+    margin-right: 0.5rem;
+    color: #cc0000;


The drop-cap first letter styling uses a hardcoded red color (#cc0000) instead of the CSS custom property (--color-accent). For consistency with the design system, use var(--color-accent) which is already defined in the theme tokens.

Suggested change

color: #cc0000;

color: var(--color-accent);

Copilot · 2026-01-06T19:58:27Z

app/components/Features.tsx

+                      {React.cloneElement(feature.icon, {
+                        className: cn("h-8 w-8", feature.icon.props.className),
+                      })}


The icon is being cloned with React.cloneElement and its className is being merged. However, the current code always replaces the className rather than properly merging it. The cn() function is called with the hardcoded class and the existing className, but the feature.icon.props.className may already contain important styling like color classes (e.g., "text-sky-500"). This could break the icon colors. Ensure the color classes from the original icon definition are preserved.

Copilot · 2026-01-06T19:58:28Z

app/components/Footer.tsx

              <a
                href="https://github.com/involutionhell"
                target="_blank"
                rel="noopener noreferrer"
-                aria-label="访问 Involution Hell 的 GitHub"
-                title="访问 GitHub"
-                className="inline-flex h-11 w-11 items-center justify-center rounded-lg bg-card border border-border hover:bg-accent hover:scale-110 transition-all duration-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                className="w-12 h-12 flex items-center justify-center border border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] transition-all text-[var(--foreground)]"
              >
-                <Github className="h-5 w-5" aria-hidden="true" />
-                <span className="sr-only">访问 GitHub</span>
+                <Github className="h-5 w-5" />
              </a>
              <a
                href="https://discord.com/invite/6CGP73ZWbD"
                target="_blank"
                rel="noopener noreferrer"
-                aria-label="加入 Discord 社区"
-                title="加入 Discord"
-                className="inline-flex h-11 w-11 items-center justify-center rounded-lg bg-card border border-border hover:bg-accent hover:scale-110 transition-all duration-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                className="w-12 h-12 flex items-center justify-center border border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] transition-all text-[var(--foreground)]"
              >
-                <MessageCircle className="h-5 w-5" aria-hidden="true" />
-                <span className="sr-only">加入 Discord 社区</span>
+                <MessageCircle className="h-5 w-5" />
              </a>
            </div>


The accessible labels and titles have been removed from the social media link buttons. The previous implementation included aria-label, title, and sr-only span elements for screen reader users. Now these buttons only have icons without any text alternative, making them inaccessible to screen reader users. Restore the sr-only spans or aria-label attributes to maintain accessibility.

Copilot · 2026-01-06T19:58:28Z

app/globals.css

-    }
+@layer base {
+  * {
+    border-radius: 0px !important;


All border-radius values are being forced to 0px with !important. This heavy-handed approach using !important on all elements could cause issues with third-party components or libraries that expect rounded corners. Consider using a more targeted approach or documenting this as a known limitation of the design system.

Suggested change

border-radius: 0px !important;

Copilot · 2026-01-06T19:58:28Z

app/globals.css

+.site-bg {
+  position: fixed;
+  inset: 0;
+  z-index: -1;


The z-index has been changed from 0 to -1 for the background element. This change could cause the starry background to be positioned behind other elements with default z-index values. Verify that the background still appears correctly and doesn't get hidden behind the body or other containers.

Suggested change

z-index: -1;

z-index: 0;

Crokily

LGTM

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

longsizhuo added 4 commits January 7, 2026 02:26

chore: 更新UI

178dfd2

chore: 加入黑夜模式

c56a915

chore: 加入黑夜模式

574437c

chore: 加入黑夜模式

194ec0b

fix: 避免闪烁

4d41c2b

vercel bot had a problem deploying to Preview – website-preview January 6, 2026 19:46 Failure

fix: eslint报错

01a0e96

vercel bot deployed to Preview – involutionhell-github-io January 6, 2026 19:51 View deployment

longsizhuo requested review from Crokily and Copilot and removed request for Copilot January 6, 2026 19:51

Copilot started reviewing on behalf of longsizhuo January 6, 2026 19:52 View session

vercel bot deployed to Preview – website-preview January 6, 2026 19:54 View deployment

Copilot AI reviewed Jan 6, 2026

View reviewed changes

Crokily approved these changes Jan 6, 2026

View reviewed changes

longsizhuo and others added 2 commits January 7, 2026 22:51

fix: 不要！important

da2de80

Update app/layout.tsx

82cc456

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

vercel bot deployed to Preview – website-preview January 7, 2026 15:42 View deployment

vercel bot deployed to Preview – involutionhell-github-io January 7, 2026 15:45 View deployment

longsizhuo added 2 commits January 8, 2026 01:30

fix: 模拟时间戳

34a5383

Merge remote-tracking branch 'origin/new_layout' into new_layout

57504fc

vercel bot deployed to Preview – involutionhell-github-io January 7, 2026 17:34 View deployment

vercel bot deployed to Preview – website-preview January 7, 2026 17:36 View deployment

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

新UI #239

新UI #239

Uh oh!

longsizhuo commented Jan 6, 2026

Uh oh!

vercel bot commented Jan 6, 2026 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Copilot AI Jan 6, 2026

Uh oh!

Uh oh!

Uh oh!

Copilot AI Jan 6, 2026

Uh oh!

Copilot AI Jan 6, 2026

Uh oh!

Copilot AI Jan 6, 2026

Uh oh!

Copilot AI Jan 6, 2026

Uh oh!

Copilot AI Jan 6, 2026

Uh oh!

Copilot AI Jan 6, 2026

Uh oh!

Crokily left a comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

		<div className="hidden md:block font-mono text-[10px] uppercase tracking-widest text-neutral-500">
		Vol. 1 \| No. 128 \| Beijing Edition

新UI #239

Are you sure you want to change the base?

新UI #239

Uh oh!

Conversation

longsizhuo commented Jan 6, 2026

Uh oh!

vercel bot commented Jan 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Copilot AI Jan 6, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Copilot AI Jan 6, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 6, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 6, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 6, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 6, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 6, 2026

Choose a reason for hiding this comment

Uh oh!

Crokily left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

vercel bot commented Jan 6, 2026 •

edited

Loading