Skip to content

Commit 93a0782

Browse files
committed
fix(ui): update icons and styles for step notices and modal
Replace exclamation-circle with a simpler exclamation icon and add top margin in the previous steps incomplete notice to improve alignment. Increase size and change color from green to teal on the check-circle icon in the tests passed notice for better visibility. Swap emoji warning in the incomplete modal with a consistent SVG icon to maintain visual consistency and improve styling control.
1 parent d861c2a commit 93a0782

File tree

3 files changed

+3
-5
lines changed

3 files changed

+3
-5
lines changed

app/components/course-page/course-stage-step/tests-passed-notice.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
>
77
<div class="flex items-center flex-wrap gap-4">
88
<div class="flex items-center gap-2">
9-
{{svg-jar "check-circle" class="w-6 h-6 fill-green-500"}}
9+
{{svg-jar "check-circle" class="w-8 h-8 fill-teal-500"}}
1010

1111
<div class="prose prose-sm prose-green dark:prose-invert">
1212
<p>All tests passed!</p>

app/components/course-page/previous-steps-incomplete-modal.hbs

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
<ModalBody @allowManualClose={{false}} @onClose={{@onClose}} data-test-previous-steps-incomplete-modal class="max-w-xl" ...attributes>
22
<div class="flex flex-col items-center w-full max-w-2xs">
3-
<div class="text-[60px] text-center">
4-
⚠️
5-
</div>
3+
{{svg-jar "exclamation" class="w-16 h-16 mb-3 fill-yellow-500"}}
64

75
<div class="mb-3 font-bold text-2xl text-gray-700 dark:text-gray-100 text-center">
86
Previous steps incomplete!

app/components/course-page/previous-steps-incomplete-notice.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
>
66
<div class="flex items-center flex-wrap gap-4">
77
<div class="flex items-center gap-2">
8-
{{svg-jar "exclamation-circle" class="w-8 h-8 fill-yellow-500"}}
8+
{{svg-jar "exclamation" class="w-8 h-8 fill-yellow-500 mt-1"}}
99

1010
<div class="prose prose-sm prose-yellow dark:prose-invert">
1111
<p>Complete previous steps to access this stage.</p>

0 commit comments

Comments
 (0)