Fix: Adding dark mode support for recipe modal (#2853)

This commit is contained in:
Rizel Scarlett
2025-06-10 18:44:43 -04:00
committed by GitHub
parent 511c18f600
commit 0cfad81898
2 changed files with 3 additions and 3 deletions

View File

@@ -38,7 +38,7 @@ export default function RecipeExpandableInfo({
</label>
</div>
<div className="relative rounded-lg bg-white text-textStandard">
<div className="relative rounded-lg bg-bgApp text-textStandard">
{infoValue && (
<>
<div
@@ -78,7 +78,7 @@ export default function RecipeExpandableInfo({
onClick={() => setValueExpanded(!isValueExpanded)}
aria-label={isValueExpanded ? 'Collapse content' : 'Expand content'}
title={isValueExpanded ? 'Collapse' : 'Expand'}
className="bg-gray-100 hover:bg-gray-200 p-2 rounded text-black hover:text-blue-800 transition-colors"
className="bg-bgSubtle hover:bg-bgStandard p-2 rounded text-textStandard hover:text-textProminent transition-colors"
>
<ChevronDown
className={`w-6 h-6 transition-transform duration-300 ${

View File

@@ -41,7 +41,7 @@ export default function RecipeInfoModal({
<div className="flex flex-col flex-grow overflow-y-auto space-y-8">
<textarea
ref={textareaRef}
className="w-full flex-grow resize-none min-h-[300px] max-h-[calc(100vh-300px)] border border-borderSubtle rounded-lg p-3 text-textStandard focus:outline-none focus:ring-2 focus:border-borderSubtle"
className="w-full flex-grow resize-none min-h-[300px] max-h-[calc(100vh-300px)] border border-borderSubtle rounded-lg p-3 text-textStandard bg-bgApp focus:outline-none focus:ring-1 focus:ring-borderProminent focus:border-borderProminent"
value={value}
onChange={(e) => setValue(e.target.value)}
placeholder={`Enter ${infoLabel.toLowerCase()}...`}