Padding and alignments of buttons, etc are weird when using styled + tailwind
还没有人认领这个 Issue。
评估
- 难度
- 4/5
- 预计耗时
- 3-5 天
- 新手友好度
- 35/100
- Issue 类型
- 缺陷
- 描述清晰度
- 基本清楚
- 活跃度
- 停滞
- 技术栈
- nextjs, react, tailwindcss, typescript, vite
调研方向
从 vite-styled-tailwind/src/index.css 开始，将其中的 font-size 和 line-height 值与 primereact.org/button/ 上的 Button 组件文档进行比较。在 Vite 和 Next.js 示例中复现样式，然后验证 button 和 input 的 padding，以及图标和 radio 的对齐方式是否与文档所示的外观一致。
由索引模型根据 Issue 内容生成。
描述
When using Prime React with Styled + Tailwind options (Vite and Nextjs, for example), the padding on the button and the alignment of the icons/ other components is different than what is shown on the documentation page.
When using the original values in vite-styled-tailwind/src/index.css:
font-size: 16px;
line-height: 24px;
The button and the input field have excessive padding, the icon in the cutton is too low, radio buttons look normal.
Now I change the values in in vite-styled-tailwind/src/index.css:
font-size: 14px;
line-height: 18px;
to match font size: 14px used the Button Component documentation page (https://primereact.org/button/). line-height is not used there, interestingly enough.
As one can see, the buttons look different, also the alignment of the radio buttons and the icon inside the button is off:
There seems to be some issue here where Tailwind is interfering with the layout, can anyone help out? Thanks.
- 主要语言
- TypeScript
- 星标
- 140
- 派生
- 106
- PR 合并指标
- 30 天内没有已合并 PR
环境准备
这个项目没有提供开发容器、Dockerfile 或贡献指南，环境需要你自己搭建：先看它的 README，通用步骤见我们的新手贡献指南。
从这里开始
- 先读完整个 Issue，再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库，在一个分支上完成修改。
- 提交 Pull Request，并在描述里引用这个 Issue 编号。
primefaces/primereact-examples 的其他 Issue
-
难度 5/5 一周以上 新手友好度 30/100
-
难度 2/5 1-3 小时 新手友好度 45/100
查看 primefaces/primereact-examples 的全部 Issue
相似的 Issue
-
难度 2/5 1-3 小时 新手友好度 75/100
code-yeongyu/senpi#5262 ·
维护者通常 1 天内回复
-
community first-timers-only good first issue hacktoberfest help wanted low hanging fruit up-for-grabs
难度 1/5 1 小时以内 新手友好度 90/100
lingdojo/kana-dojo#33420 · 1 条评论 · 5 个 reaction ·
维护者通常 1 天内回复
-
[BUG] inspect_schema matches named container case-insensitively without preferring exact match可能已有人在做 @Maaz2212 今天认领。 未关闭bug
难度 2/5 1-3 小时 新手友好度 88/100
libredb/libredb-studio#2128 · 1 条评论 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 82/100
Yeachan-Heo/gajae-code#7474 · 1 条评论 ·
维护者通常 1 天内回复
-
status: needs triage
难度 2/5 1-3 小时 新手友好度 85/100
mastra-ai/mastra#29108 · 1 条评论 ·
维护者通常 1 天内回复