feat(saju): 사주풀이 5 컴포넌트 + useSajuReading hook
This commit is contained in:
26
src/pages/saju/components/MonthlyFlow.jsx
Normal file
26
src/pages/saju/components/MonthlyFlow.jsx
Normal file
@@ -0,0 +1,26 @@
|
||||
import React from 'react';
|
||||
|
||||
const LABEL_COLOR = {
|
||||
'성장': '#4B7065',
|
||||
'안정': '#D4A574',
|
||||
'변동': '#6A5285',
|
||||
'도전': '#C58F76',
|
||||
'정체': '#888',
|
||||
};
|
||||
|
||||
export default function MonthlyFlow({ flow }) {
|
||||
if (!flow || flow.length === 0) return null;
|
||||
return (
|
||||
<div className="saju-monthly-flow">
|
||||
{flow.map((m) => (
|
||||
<div key={m.month} className="saju-monthly-flow__cell">
|
||||
<span className="saju-monthly-flow__month">{m.month}월</span>
|
||||
<span className="saju-monthly-flow__score" style={{ color: LABEL_COLOR[m.label] }}>
|
||||
{m.score}
|
||||
</span>
|
||||
<span className="saju-monthly-flow__label">{m.label}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user