infiplot/infiplot-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(play): increase dialogue and choice font sizes by 3px

Browse Source 
Bump all in-game text sizes for better readability:
- Dialogue body: 16/13/15px → 19/16/18px
- Narration: 15/12/14px → 18/15/17px
- Speaker name: 13/11/12px → 16/14/15px
- Choice label: 15/13/14px → 18/16/17px
- Choice index: 13/11px → 16/14px
- Freeform input: 14px → 17px
- Freeform button: 13px → 16px

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
yuanzonghao
2026-06-24 18:59:21 +08:00
parent ae4d9f8873
commit 94050b82c5
1 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/PlayCanvas.tsx
+7 -7
View File
@@ -148,13 +148,13 @@ function ChoiceButton({
/> />
<span className="relative flex items-baseline gap-2"> <span className="relative flex items-baseline gap-2">
<span <span
className={`shrink-0 font-serif num ${vertical ? "text-[13px]" : "text-[11px]"}`} className={`shrink-0 font-serif num ${vertical ? "text-[16px]" : "text-[14px]"}`}
style={{ color: "rgba(195,155,75,0.9)" }} style={{ color: "rgba(195,155,75,0.9)" }}
> >
{index + 1}. {index + 1}.
</span> </span>
<span <span
className={`font-serif leading-snug ${vertical ? "text-[15px]" : "text-[13px] md:text-[14px]"}`} className={`font-serif leading-snug ${vertical ? "text-[18px]" : "text-[16px] md:text-[17px]"}`}
style={{ color: "rgba(245,235,210,0.95)" }} style={{ color: "rgba(245,235,210,0.95)" }}
> >
{label} {label}
@@ -518,7 +518,7 @@ export function PlayCanvas({
placeholder={t("play.freeform.placeholder")} placeholder={t("play.freeform.placeholder")}
maxLength={50} maxLength={50}
autoFocus autoFocus
className="flex-1 min-w-0 bg-transparent border-none outline-none font-serif text-[14px] placeholder:text-[rgba(200,185,155,0.50)]" className="flex-1 min-w-0 bg-transparent border-none outline-none font-serif text-[17px] placeholder:text-[rgba(200,185,155,0.50)]"
style={{ color: "rgba(245,235,210,0.95)" }} style={{ color: "rgba(245,235,210,0.95)" }}
/> />
<button <button
@@ -593,7 +593,7 @@ export function PlayCanvas({
style={{ color: "rgba(195,155,75,0.60)" }} style={{ color: "rgba(195,155,75,0.60)" }}
/> />
<span <span
className="font-serif text-[13px]" className="font-serif text-[16px]"
style={{ color: "rgba(200,185,155,0.70)" }} style={{ color: "rgba(200,185,155,0.70)" }}
> >
{t("play.freeform.title")} {t("play.freeform.title")}
@@ -644,7 +644,7 @@ export function PlayCanvas({
{beat.speaker && ( {beat.speaker && (
<p <p
className={`font-serif smallcaps mb-[0.6em] ${ className={`font-serif smallcaps mb-[0.6em] ${
portrait ? "text-[13px]" : "text-[11px] md:text-[12px]" portrait ? "text-[16px]" : "text-[14px] md:text-[15px]"
}`} }`}
style={{ color: "rgba(205,165,90,0.92)" }} style={{ color: "rgba(205,165,90,0.92)" }}
> >
@@ -659,7 +659,7 @@ export function PlayCanvas({
{beat.speaker && beat.narration && ( {beat.speaker && beat.narration && (
<p <p
className={`font-serif leading-[1.85] mb-[0.6em] ${ className={`font-serif leading-[1.85] mb-[0.6em] ${
portrait ? "text-[15px]" : "text-[12px] md:text-[14px]" portrait ? "text-[18px]" : "text-[15px] md:text-[17px]"
}`} }`}
style={{ color: "rgba(228,218,196,0.88)" }} style={{ color: "rgba(228,218,196,0.88)" }}
> >
@@ -669,7 +669,7 @@ export function PlayCanvas({
<p <p
className={`font-serif leading-[1.85] ${ className={`font-serif leading-[1.85] ${
portrait ? "text-[16px]" : "text-[13px] md:text-[15px]" portrait ? "text-[19px]" : "text-[16px] md:text-[18px]"
}`} }`}
style={{ color: "rgba(245,235,210,0.95)" }} style={{ color: "rgba(245,235,210,0.95)" }}
> >