合宿の参加登録・参加取り消しボタンの新デザインの実装

[kitsne241]

#146

まずこっちのボタンのないシンプルな形式を実装してみてもらえるとよいかも

• 高さは 60px
• アイコンは v-icon を使うとよさそうです

[lachite168]

今日ちょっとやろうと思ったんですけど，components配下のコンポーネントの構成がよくわからなくてできません...

[kitsne241]

初 Issue なので全然問題ないです！ よければ以下概要を参考にしてください

• この Issue は ユーザー情報ページ の上部の参加登録ボタンを新しいものに置き換えるというものです
• ユーザー情報ページのコンポーネントは src/views/UserInfoView.vue です
• <register-camp-button> と <unregister-camp-button> という要素があり、これらが旧ボタンのコンポーネントです
• ユーザー情報ページに含まれるコンポーネントは全て src/components/information ディレクトリ内にあります
• 新しく実装したいコンポーネントも src/components/information の中に適当な名前で用意してください

以下補足

ユーザー情報ページ上部の領域は時期と状況によって表示するものが変わるので、<div v-if="..."> のようなのが何層にもなっています

• 参加登録受け付け中なら
  • ページを見ている人がすでに参加登録済みなら → UnregisterCampButton（参加登録解除）ボタンを設置
  • ページを見ている人がまだ参加登録をしていないなら → RegisterCampButton（参加登録）ボタンを設置
• 部屋割りが公開されているなら → RoomInfo コンポーネント（合宿における自分の部屋の番号とメンバー）を設置
• それ以外なら → PaymentInfo を設置

が、この Issue は最終的にこの部分をほぼ丸ごと消し去ることになるのでそんなに気にしなくて大丈夫です
まず一旦機能的な話を無視して、手元で npm run dev してユーザー情報ページを表示させたときに添付の画像に近い様子が表示されるように UserInfoView.vue を書き換えてほしいです！

何をどう破壊しても問題ないです、困ったことがあったらまたなんでも聞いてください 👍

[lachite168]

見た目はできたのですが、金額の埋め込みがよくわかりません。