入力画面の関数を修正する
ローカルサーバー側へ正しく送られるか確認する

重要度atom高・中・低３つを作成

molecules: icon+iconWithText

【やりたいこと】

• todoリストの並び順を指定しておきたい
• updateのタイムスタンプも追加したい
• todoを編集できるようにしたい

onAuthStateChanged の設定？

すでにある関数は消さずに保持する

<div class="h-full w-full flex-grow-1"> <div class=""> <TopBarText title={"Goal"}/> <TopBarBorder/> </div> <div class="h-full relative"> <div class="bg-gray1 rounded-lg w-3/4 h-3/4 top-1/2 left-1/2 absolute -translate-x-1/2 -translate-y-1/2"> <p class="text-black1 text-base font-semibold">一連の流れ</p> <img src={BookPoint} alt="BookPoint" /> <img src={Leaf} alt="Leaf" /> {/* <img src={Note} alt="Note" /> */} <img src={Women} alt="Women" /> <Link to="/goal/setting-start"> <ButtonPurple4 content={"戻る"} /> </Link> <Link to="/goal/step1-5"> <ButtonPurple4 content={"次へ"} /> </Link> </div> </div> </div>
このh-fullの中にh-fullがあったりするので、そのせいで下に余白ができている。
前のissueで直そうとしたが、Goalの白ブロックの大きさを全体の縦の75％にしてたので、それを考慮せずいじるとバラバラになってしまうので、このissueで直すことにする。

入力がはみ出すときには「…」を後ろに表示する

• step1の入力 lifeGoal setLifeGoal のuseState
• 初期値 ""
• 入力なので、useRefを使う
• 左側は、現在入力してるやつをすぐさま反映させるのではなく、次のstepに行くと入力されてるようにする。
• 次の画面ではuseEffectでstoreから取ってきて左側に反映？

ほー

フラグマークにON OFF表示切り替え機能をつけて実装する

• homeに表示されるtodoとfirebaseにあるtodoを一致させる
• todoの編集を可能にする

それっぽくする

atom に　TimeText DateText 作成（ハリボテ）
フラグマークの紫を指定し直し
1タスクのコンポーネントを作る

色指定に加えて、importでheroiconsを使うように変更する

フラグマークを押した時、元データも変更したい

nameTag(タスク名)とnameTagWithAt(リスト名)とする
どちらも色はwhite2を指定する
childrenで名前の受け取りをする

tailwind configの設定

1つのタスクに対して当てていくが、完了・未完了の表示の区別は検討する必要あり

「ひとつひとつの引数」を「一つのタスク」としてまとめて、さらにそれを「全てのタスク」にまとめる