Skip to content

Commit 76efae4

Browse files
committed
ui improved
1 parent af6fe0d commit 76efae4

File tree

8 files changed

+191
-99
lines changed

8 files changed

+191
-99
lines changed

app/pods/components/choice-editor/template.hbs

Lines changed: 27 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,41 @@
11
<div class="row {{if isCorrect 'correct'}}">
2-
<div class="col-6">
2+
<div class="col-8">
33
{{#if isEditing}}
4-
<h3> {{input type="text" value=choice.title}} </h3>
5-
<p>
6-
{{textarea type="text" value=choice.description}}
7-
</p>
4+
<div class="row justify-content-center align-items-center">
5+
<div class="col-2">
6+
<label>Choice Title:</label>
7+
</div>
8+
<div class="col-5 input-group">
9+
<h3> {{input type="text" class="input-text" value=choice.title}} </h3>
10+
</div>
11+
<div class="col-5">
12+
{{markdown-to-html choice.title}}
13+
</div>
14+
</div>
15+
<div class="row justify-content-center align-items-center">
16+
<div class="col-2">
17+
<label>Choice Description:</label>
18+
</div>
19+
<div class="col-5 input-group">
20+
<p>
21+
{{textarea type="text" class="input-text py-4" value=choice.description}}
22+
</p>
23+
</div>
24+
<div class="col-5">
25+
{{markdown-to-html choice.description}}
26+
</div>
27+
</div>
828
{{else}}
929
<h3>{{choice.title}}</h3>
1030
<p>
1131
{{choice.description}}
1232
</p>
1333
{{/if}}
1434
</div>
15-
<div class="col-6 choice-actions">
35+
<div class="col-4 choice-actions">
1636
{{#if isEditing}}
1737
<span {{action 'saveChoice'}}>
18-
Save
38+
Save
1939
<i class="far fa-save"></i>
2040
</span>
2141
{{else}}

app/pods/components/nav-bar/template.hbs

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
</span>
1111

1212
<ul class="nav-list">
13-
13+
1414
{{#if (eq currentUser.user.role 'ADMIN')}}
1515
{{#link-to 'questions'}}
1616
<li class="nav-items pointer">
@@ -30,8 +30,9 @@
3030
<li class="nav-items pointer">
3131
ONLINE COURSES
3232
</li>
33-
</a> --}} {{#if session.isAuthenticated}} Hi
34-
<mark>{{currentUser.user.firstname}}</mark>,
33+
</a> --}} {{#if session.isAuthenticated}}<li class="nav-items pointer">
34+
Hi,<mark>{{currentUser.user.firstname}}</mark>
35+
</li>
3536
<li class="nav-items pointer">
3637
<div class="button-solid">
3738
<a class="white">
Lines changed: 44 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,34 @@
1-
<div class="container">
2-
<h1>
3-
{{#if isEditing}}
4-
{{input type="text" value=question.title}}
5-
{{else}}
6-
{{question.title}}
7-
{{/if}}
8-
<i class="far fa-edit" {{action 'toggleEditing'}}></i>
9-
</h1>
10-
11-
<p>
12-
{{#if isEditing}}
13-
{{textarea type="text" value=question.description}}
14-
{{else}}
15-
{{question.description}}
16-
{{/if}}
17-
</p>
1+
<div class="container pt-5">
2+
<div class="row">
3+
<div class="col-4"></div>
4+
<div class="col-8">
5+
<h1>Add a new Question:</h1>
6+
</div>
7+
</div>
8+
9+
<div class="row justify-content-center align-items-center">
10+
<div class="col-2">
11+
<label>Question Title:</label>
12+
</div>
13+
<div class="col-5 input-group">
14+
{{input type="text" class="input-text" value=question.title}}
15+
</div>
16+
<div class="col-5">
17+
{{markdown-to-html question.title}}
18+
</div>
19+
</div>
20+
21+
<div class="row justify-content-center align-items-center">
22+
<div class="col-2">
23+
<label>Question Description:</label>
24+
</div>
25+
<div class="col-5 input-group">
26+
{{textarea type="text" class="input-text py-4" value=question.description}}
27+
</div>
28+
<div class="col-5">
29+
{{markdown-to-html question.description}}
30+
</div>
31+
</div>
1832

1933
{{#unless question.isNew}}
2034

@@ -25,9 +39,9 @@
2539
</div>
2640
<ul>
2741
{{#each question.choices as |choice|}}
28-
<li>
29-
{{choice-editor
30-
choice=choice
42+
<li class="justify-content-center">
43+
{{choice-editor
44+
choice=choice
3145
isCorrect=(includes correctChoices choice.id)
3246
onFlagChange=(action 'markChoice')
3347
}}
@@ -41,13 +55,16 @@
4155

4256

4357
<div class="row">
44-
<div class="button-solid">
45-
<a class="white">
46-
<button {{action 'saveQuestion'}}>
47-
Save Question
48-
</button>
49-
</a>
58+
<div class="col-5"></div>
59+
<div class="col-7">
60+
<div class="button-solid">
61+
<a class="white">
62+
<button {{action 'saveQuestion'}}>
63+
Save Question
64+
</button>
65+
</a>
66+
</div>
5067
</div>
5168
</div>
52-
69+
5370
</div>
Lines changed: 35 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,30 @@
11
<div class="container">
22
<div class="row">
3+
<div class="col-4"></div>
4+
<div class="col-6">
5+
<h1>Add new Quiz:</h1>
6+
</div>
7+
</div>
8+
<div class="row justify-content-center align-items-center">
39
<div class="col-2">
410
<label>Title</label>
511
</div>
6-
<div class="col-6">
7-
{{input type="text" value=quiz.title}}
12+
<div class="col-6 input-group">
13+
{{input type="text" class="input-text" value=quiz.title}}
14+
</div>
15+
<div class="col-3">
16+
{{markdown-to-html quiz.title}}
817
</div>
918
</div>
10-
<div class="row">
19+
<div class="row justify-content-center align-items-center">
1120
<div class="col-2">
1221
<label>Description</label>
1322
</div>
14-
<div class="col-6">
15-
{{textarea type="text" value=quiz.description}}
23+
<div class="col-6 input-group">
24+
{{textarea type="text" class="input-text py-4" value=quiz.description}}
25+
</div>
26+
<div class="col-3">
27+
{{markdown-to-html quiz.description}}
1628
</div>
1729
</div>
1830
{{#unless quiz.isNew}}
@@ -22,39 +34,39 @@
2234
</div>
2335
<div class="col-6">
2436
{{#power-select-multiple
25-
search=(perform questionFilterTask)
37+
search=(perform questionFilterTask)
2638
selected=quiz.questions
27-
onchange=(action (mut quiz.questions ))
39+
onchange=(action (mut quiz.questions ))
2840
as |question|}}
2941
{{question.title}}
3042
{{/power-select-multiple}}
3143
</div>
3244
</div>
3345
{{/unless}}
3446

35-
<div class="row">
47+
<div class="row justify-content-center align-items-center">
3648
<div class="col-2">
3749
<label>Image Url:</label>
3850
</div>
39-
<div class="col-6">
40-
{{input type="text" value=quiz.image}}
51+
<div class="col-6 input-group">
52+
{{input type="text" class="input-text" value=quiz.image}}
4153
</div>
4254
</div>
4355

44-
<div class="row">
56+
<div class="row justify-content-center align-items-center">
4557
<div class="col-2">
4658
<label>Duration </label>
4759
</div>
48-
<div class="col-6">
49-
{{input type="text" value=quiz.duration}}
60+
<div class="col-6 input-group">
61+
{{input type="text" class="input-text" value=quiz.duration}}
5062
</div>
5163
</div>
52-
<div class="row">
64+
<div class="row justify-content-center align-items-center">
5365
<div class="col-2">
5466
<label>Max Attempts</label>
5567
</div>
56-
<div class="col-6">
57-
{{input type="text" value=quiz.maxAttempts}}
68+
<div class="col-6 input-group">
69+
{{input type="text" class="input-text" value=quiz.maxAttempts}}
5870
</div>
5971
</div>
6072
<div class="row">
@@ -77,8 +89,13 @@
7789
</div>
7890
</div>
7991

80-
<div class="button-solid">
81-
<button {{action 'save'}}>Save Changes</button>
92+
<div class="row">
93+
<div class="col-4"></div>
94+
<div class="col-6">
95+
<div class="button-solid">
96+
<button {{action 'save'}}>Save Changes</button>
97+
</div>
98+
</div>
8299
</div>
83100
</div>
84101

app/pods/questions/index/template.hbs

Lines changed: 39 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,26 @@
1-
<div class="container">
2-
<div>
3-
<div class="button-solid">
4-
{{#link-to 'questions.new' class="white"}}
5-
<button>+ Add Question</button>
6-
{{/link-to}}
1+
<div class="container pt-5">
2+
<div class="row">
3+
<div class="col-5"></div>
4+
<div class="col-6">
5+
<label class="col-6">Filter the Question:</label>
76
</div>
8-
<br>
9-
<div class="row justify-content-center">
10-
<p class="card-title">Filter By Question Name: </p> {{input type="text" class="form-control" placeholder="Enter Question Name" key-up=(perform searchTask) value=searchString}}
7+
</div>
8+
<div class="row justify-content-center">
9+
<div class="input-search nav-search col-8 justify-content-center">
10+
{{input type="text" placeholder="Enter Question Name" key-up=(perform searchTask) value=searchString}}
11+
<img src="http://online.codingblocks.com/images/searchicon-06d8faf96de7c883b5440b6594e39eda.png" alt="search">
1112
</div>
13+
</div>
14+
<div class="row">
15+
<div class="col-5"></div>
16+
<div class="col-6">
17+
<div class="button-solid">
18+
{{#link-to 'questions.new' class="white"}}
19+
<button>+ Add Questions</button>
20+
{{/link-to}}
21+
</div>
1222
</div>
23+
</div>
1324
{{#each questions as |question|}}
1425
<div class="row">
1526
<div class="card">
@@ -18,18 +29,25 @@
1829
<p class="card-text">
1930
{{question.description}}
2031
</p>
21-
<div class="button-solid">
22-
{{#confirm-dialog
23-
dialogClass="custom-confirm-dialog"
24-
title="Delete Question"
25-
text="Are you sure you want to delete this question?"}}
26-
<button {{action "deleteQuestion" question}}>Delete</button>
27-
{{/confirm-dialog}}
28-
</div>
29-
<div class="button-solid">
30-
{{#link-to 'questions.id' question.id class="white"}}
31-
<button>Edit</button>
32-
{{/link-to}}
32+
<div class="row">
33+
<div class="col-7"></div>
34+
<div class="col-2">
35+
<div class="button-solid">
36+
{{#confirm-dialog
37+
dialogClass="custom-confirm-dialog"
38+
title="Delete Question"
39+
text="Are you sure you want to delete this question?"}}
40+
<button {{action "deleteQuestion" question}}>Delete</button>
41+
{{/confirm-dialog}}
42+
</div>
43+
</div>
44+
<div class="col-2">
45+
<div class="button-solid">
46+
{{#link-to 'questions.id' question.id class="white"}}
47+
<button>Edit</button>
48+
{{/link-to}}
49+
</div>
50+
</div>
3351
</div>
3452
</div>
3553
</div>

0 commit comments

Comments
 (0)