Enhance ThreeLinePoemActivity comment UI styling - #29
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Important Installation incomplete: to start using Gemini Code Assist, please ask the organization owner(s) to visit the Gemini Code Assist Admin Console and sign the Terms of Services. |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 5b5d13df03
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| border: 1px solid color-mix(in oklab, var(--primary) 35%, transparent); | ||
| background: linear-gradient(135deg, color-mix(in oklab, var(--primary) 10%, var(--card-bg)) 0%, var(--card-bg) 60%); | ||
| position: relative; | ||
| overflow: hidden; |
There was a problem hiding this comment.
src/styles/twikoo.css:154-159 already documents that .card-base must keep overflow: visible so Twikoo's emoji UI can expand correctly. This change overrides that with overflow: hidden on the activity card, and ThreeLinePoemActivity still renders Twikoo's OwO/emoji trigger, so the absolutely positioned emoji panel will now be clipped to the card bounds on this page, making larger emoji packs partially unusable.
Useful? React with 👍 / 👎.
| .twikoo-host :global(.tk-preview-container), | ||
| .twikoo-host :global(.tk-comment) { | ||
| border: 1px solid color-mix(in oklab, var(--primary) 14%, transparent); | ||
| border-radius: 1rem; | ||
| background: color-mix(in oklab, white 92%, var(--card-bg) 8%); |
There was a problem hiding this comment.
In dark mode, src/styles/twikoo.css:1-13 switches Twikoo text to the light --tk-text color, and .tk-comments applies that color to comment content. These new local rules force comment/preview cards to an almost-white background with no dark-mode override, so on html.dark the activity page ends up rendering light gray text on very light cards, which is difficult to read for anyone using the site's dark theme.
Useful? React with 👍 / 👎.
1 participant
Motivation
Description
src/components/ThreeLinePoemActivity.astro页面结构，新增浮光圆球、活动信息卡格和更清晰的标题/徽章区以提升页面层次感。board-shell（带高光层）并新增board-head与board-badge以突出活动识别与样式化容器。:global()选择器）重绘 Twikoo 的输入、文本域、提交区、按钮、评论卡片与回复样式，采用玻璃拟态、分层渐变与交互态高亮以达到更高端的视觉效果。Testing
pnpm prettier --write src/components/ThreeLinePoemActivity.astro（失败，因为当前环境下 Prettier 未识别.astro解析器）。pnpm check（失败，检查中断并报告仓库中与本次改动无关的现有错误：Duplicate identifier 'ThreeLinePoemEntry'于src/pages/[...page].astro）。Codex Task