Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commite7436f1

Browse files
authored
feat: add styles in /ja/09.workspace/01.todo-list (#286)
1 parentdb880b5 commite7436f1

File tree

10 files changed

+10
-10
lines changed

10 files changed

+10
-10
lines changed

‎content/ja/09.workspace/01.todo-list/02.reactivity-1/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,6 @@ userNameを`ref`を使ってリアクティブな値にし、値の変化を検
9898

9999
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
100100

101-
:ButtonShowSolution
101+
:ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
102102

103103
ref を使い、データの変更が自動的に画面に反映されるようになりました！

‎content/ja/09.workspace/01.todo-list/03.list-rendering/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,6 @@ Vueでは `v-for` ディレクティブを使って配列に基づいて項目
6161

6262
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
6363

64-
:ButtonShowSolution
64+
:ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
6565

6666
`v-for` を使うことで動的なデータ表示がとても簡単になりましたね！

‎content/ja/09.workspace/01.todo-list/04.conditional/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,6 @@ Vueでは `v-if` ディレクティブを使って、ブロックを条件に応
7171

7272
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
7373

74-
:ButtonShowSolution
74+
:ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
7575

7676
`v-if` と`v-else` を使うことで、状態に応じた柔軟なUIが実現できます！

‎content/ja/09.workspace/01.todo-list/05.componentization-1/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ import Child from './Child.vue'
4444

4545
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
4646

47-
:ButtonShowSolution
47+
:ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
4848

4949
app.vueがすっきりとしました。
5050

‎content/ja/09.workspace/01.todo-list/05.componentization-2/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -149,6 +149,6 @@ const emit = defineEmits<{
149149

150150
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
151151

152-
:ButtonShowSolution
152+
:ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
153153

154154
コンポーネント化され、メンテナンスしやすいスッキリした構造になりました！

‎content/ja/09.workspace/01.todo-list/06.v-model/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,7 @@ const showUnDoneOnly = ref(false)
118118
そうすることで、`v-model` だけで、バインドとイベント監視の指定がなくても、値が自動的に同期されるようになります。
119119

120120
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
121-
:ButtonShowSolution
121+
:ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
122122

123123
##実装後の効果
124124

‎content/ja/09.workspace/01.todo-list/07.reactivity-2/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -128,7 +128,7 @@ const doubled = computed({
128128
1,2 で実装した`filteredTodos` を`TodoList` コンポーネントの`todos` propsに渡してみましょう。
129129

130130
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
131-
:ButtonShowSolution
131+
::ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
132132

133133
##実装後の効果
134134

‎content/ja/09.workspace/01.todo-list/08.componentization-3/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -240,6 +240,6 @@ TODOリストに、新規タスクを追加するために、
240240

241241
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
242242

243-
:ButtonShowSolution
243+
:ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
244244

245245
親・子コンポーネント間で`isCreateModalOpen` を双方向に同期できるようになりました！

‎content/ja/09.workspace/01.todo-list/09.slot/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -250,6 +250,6 @@ ogImage: true
250250

251251
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
252252

253-
:ButtonShowSolution
253+
::ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
254254

255255
これで、コンポーネントの任意の箇所に、HTMLやコンポーネント等を差し込むことができました！

‎content/ja/09.workspace/01.todo-list/10.retrospective/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ function handleSubmit(e: Event) {
5151

5252
もし行き詰まったら、以下のボタンをクリックして解答を見ることができます。
5353

54-
:ButtonShowSolution
54+
:ButtonShowSolution{.bg-faded.px4.py2.mb3.rounded.border.border-base.hover:bg-active.hover:text-primary.hover:border-primary:50}
5555

5656
---
5757

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp