-
Notifications
You must be signed in to change notification settings - Fork 358
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add dark theme #676
base: v2
Are you sure you want to change the base?
Add dark theme #676
Conversation
@nagineko PRありがとうございます!1点コメントさせて頂きましたので、ご確認いただけますでしょうか? |
@nagineko 一通り動作確認させて頂きました。以下の2点の修正をお願いできますでしょうか?
|
@Yukinobu-Mine |
bodyClass.remove('dark'); | ||
} | ||
}, [globalState.theme]); | ||
|
||
return <>{children}</>; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
RadioButton
と Select
の Ladle story におけるダークモード表示が実際のアプリと異なるので調べたところ、
実際のアプリでは、親コンポーネントとなる AppContent
で以下のようにテキストの色が指定されていました。
<div id="main" className="text-aws-font-color-light dark:text-aws-font-color-dark">
<Outlet />
</div>
Ladle でも同様の状態にするには、この部分 (return <>{children}</>;
) を以下のようにすれば良いのではないかと考えたのですが、問題なさそうでしょうか?
return (
<div className="text-aws-font-color-light dark:text-aws-font-color-dark">
{children}
</div>
);
問題ないようでしたら、変更して頂けますと幸いです。
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@Yukinobu-Mine
Ladleとアプリ側の表示を一致させるより、既存コードの処理に変更を加えないことを優先する方針かと考えていましたが、
既存コードの処理に変更を加えてでもLadleとアプリ側の表示を一致させたいという方針だったのですね。
改めてライトテーマとダークテーマ両方の表示をLadleとアプリ側両方で確認して、処理の変更が発生する箇所出てきてしまうかもしれませんがコミットしたいと思います。
@nagineko 修正対応ありがとうございます!Ladle でのダークモード表示について1点コメントしましたので、ご確認頂けますでしょうか? |
Issue #, if available:
#10
Description of changes:
By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.