Skip to content

Commit 1b32c9e

Browse files
committed
style admin link
1 parent 0ce62ee commit 1b32c9e

File tree

7 files changed

+158
-42
lines changed

7 files changed

+158
-42
lines changed

public/scripts/add-remove-choices.js

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,11 @@ $(document).ready(function() {
55
$(".add-choice-button").on("click", function(event) {
66
event.stopPropagation();
77
if ($( "li" ).length <= 6) {
8-
$( "#ul_choices" ).append(`<li class="choice"><label for="choice">
9-
Choice : </label><input type="text" name="choice" class="create-form"> Description:
10-
<input type="text" name="desc" class="create-form" ></li>`);
8+
$( "#ul_choices" ).append(`
9+
<li class="choice">
10+
<input type="text" name="choice[]" placeholder="CHOICE">
11+
<input type="text" name="desc[]" placeholder="CHOICE DESCRIPTION" value=" ">
12+
</li>`);
1113
$("li.choice").focus().select();
1214
}
1315
});

public/scripts/create_poll_errors.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,6 @@ $(document).ready(function() {
44
let $form = $(this);
55
let $errors = $(".create-errors");
66
$errors.empty();
7-
console.log($("#poll_title").val());
8-
console.log($("#poll_description").val());
97
if (!$("#poll_title").val()) {
108
$errors.append("<p>Title fields is empty</p>");
119
return;

styles/_adminpoll.scss

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,54 @@
11
body.admin-page {
22
background-color: $lightPinky;
3+
.admin-text {
4+
padding-top: 3rem;
5+
.poll-title {
6+
font-family: $bigFont, cursive;
7+
text-shadow: -4px 3px 0 $pinky, -10px 7px 0 #cc706a;
8+
color: white;
9+
}
10+
.poll-description {
11+
font-style: italic;
12+
}
13+
.links-title {
14+
font-family: $bigFont, cursive;
15+
text-shadow: -4px 3px 0 $pinky, -10px 7px 0 #cc706a;
16+
color: white;
17+
margin-bottom: 1rem;
18+
}
19+
a {
20+
color: $tealish;
21+
}
22+
table {
23+
width: 100%;
24+
margin-bottom: 1rem;
25+
}
26+
button {
27+
color: white;
28+
background-color: $lightPinky;
29+
border: 3px solid white;
30+
height: 4rem;
31+
width: 6rem;
32+
margin-bottom: 1rem;
33+
&:hover {
34+
background-color: $tealish;
35+
}
36+
37+
}
38+
}
39+
40+
}
41+
42+
header.your-polls-header {
43+
h1 {
44+
display: none;
45+
}
46+
button {
47+
color: white;
48+
background-color: $lightPinky;
49+
border: 3px solid white;
50+
height: 4rem;
51+
margin: 0.5rem;
52+
width: 6rem;
53+
}
354
}

styles/_create-poll.scss

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
main.create-page {
2+
.row {
3+
padding-top: 4rem;
4+
.inputs-and-buttons {
5+
.buttons {
6+
width: 80%;
7+
margin-bottom: 1rem;
8+
font-size: 12px;
9+
display: flex;
10+
justify-content: center;
11+
button {
12+
width: 50%;
13+
padding: 1rem;
14+
border: 2px solid $pinky;
15+
overflow: hidden;
16+
&:hover {
17+
background-color: $pinky;
18+
color: white;
19+
}
20+
}
21+
}
22+
.create-input {
23+
width: 80%;
24+
padding: 1rem;
25+
border: 2px solid black;
26+
font-size: 12px;
27+
&:hover {
28+
border: 2px solid $tealish;
29+
}
30+
}
31+
ul {
32+
list-style-type: none;
33+
padding:0px;
34+
padding-bottom: 1rem;
35+
margin: 0px;
36+
width: 80%;
37+
display: flex;
38+
justify-content: center;
39+
li {
40+
input {
41+
font-size: 12px;
42+
border: 2px solid black;
43+
padding: 1rem;
44+
45+
46+
}
47+
}
48+
}
49+
}
50+
.title-and-text {
51+
font-family: $bigFont, cursive;
52+
}
53+
}
54+
}

styles/_show_polls.scss

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
.your-polls-title {
22
margin-top: 3rem;
33
margin-bottom: 0px;
4-
//border-bottom: 1px solid $lightGrey;
54
width: 100%;
65
font-family: $bigFont, cursive;
76
display: none;
@@ -58,7 +57,7 @@ body.your-polls {
5857
background-color: $lightPinky;
5958
}
6059

61-
header.your-polls-header {
60+
header.admin-page-header {
6261
h1 {
6362
display: none;
6463
}

views/poll-new.ejs

Lines changed: 27 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -9,24 +9,33 @@
99
<header>
1010
<% include partials/_header.ejs %>
1111
</header>
12-
<main>
13-
14-
<h1>CREATE A POLL</h1>
15-
<button class="add-choice-button">Add another choice</button>
16-
<button class="remove-choice-button">Remove choice</button>
17-
<form class="create-form" action="/poll/create" method="POST">
18-
<label for="title">Title:</label><input id="poll_title" type="text" name="title" class="create-form title-field">
19-
<label for="description">Description:</label><input id="poll_description" type="text" name="description" class="create-form" placeholder="Write a brief explanation of what this poll is about.">
20-
21-
<ul id="ul_choices">
22-
<li class="choice"><label for="choice"> Choice : </label><input type=" text" name="choice[]" class="create-form"> Description: <input type="text " name="desc[]" value=" " class="create-form" ></li>
23-
</ul>
24-
<div class = "create-errors"></div>
25-
<button type="submit" class="create-button">CREATE</button>
26-
27-
</form>
28-
<div>
29-
<a href="/poll/:pollid" <section class="poll-preview"><section></section></a>
12+
<main class="create-page">
13+
<div class="row">
14+
<div class="inputs-and-buttons col-md-8">
15+
<div class="buttons">
16+
<button class="add-choice-button">ADD ANOTHER CHOICE</button>
17+
<button class="remove-choice-button">REMOVE CHOICE</button>
18+
</div>
19+
<form class="create-form" action="/poll/create" method="POST">
20+
<div class="form-group">
21+
<input id="poll_title" type="text" name="title" class="create-input" placeholder="POLL TITLE">
22+
</div>
23+
<div class="form-group">
24+
<input id="poll_description" type="text" name="description" class="create-input" placeholder="POLL DESCRIPTION">
25+
</div>
26+
<ul id="ul_choices">
27+
<li class="choice">
28+
<input type="text" name="choice[]" placeholder="CHOICE">
29+
<input type="text " name="desc[]" placeholder="CHOICE DESCRIPTION" value=" " >
30+
</li>
31+
</ul>
32+
<div class = "create-errors"></div>
33+
<button type="submit" class="create-button">CREATE</button>
34+
</form>
35+
</div>
36+
<div class="title-and-text col-md-4">
37+
<h1>create a poll</h1>
38+
</div>
3039
</div>
3140
</main>
3241

views/poll-pollid.ejs

Lines changed: 20 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,36 +6,39 @@
66
</head>
77

88
<body class="admin-page">
9-
<header>
9+
<header class="admin-page-header">
1010
<% include partials/_header.ejs %>
1111
</header>
12-
<main>
13-
<form class="login-form" action="/login" method="POST">
14-
email: <input type ="email" name="email">
15-
<br>
16-
password: <input type ="password" name="password">
17-
<br>
18-
<button type="submit">Login</button>
19-
</form>
12+
<main class="row">
13+
<div class="admin-text col-md-4">
2014
<h1 class="poll-title"><%=poll.poll_name%></h1>
2115
<p class="poll-description"><%=poll.description%></p>
2216
<p class="num-responses">Responses: <%=poll.responses%></p>
23-
<section class="choice-ranking">
17+
<table class="choice-ranking">
18+
<thead>
19+
<tr>
20+
<th class="table-title">CHOICE</th>
21+
<th class="table-title">DESCRIPTION</th>
22+
</tr>
23+
</thead>
24+
<tbody>
2425
<%for (let elm of choices) { %>
25-
<p class="choice1">Choice: <%= elm.choice %></p>
26-
<span>Description: <%= elm.description%></span>
26+
<tr>
27+
<td class="choice-name"><%= elm.choice %></td>
28+
<td class="choice-description"><%= elm.description%></td>
29+
</tr>
2730
<% } %>
28-
</section>
31+
</tbody>
32+
</table>
2933
<button data-poll-id="<%= poll.admin_link %>" id="delete_poll" data-confirm="Are you sure to delete this poll?" type="submit">Delete</button>
3034

3135
<section class="link-section">
32-
<h3>Your admin link: </h3>
36+
<h1 class="links-title">Links</h1>
3337
<a href=`<%- links.adminLink %>` class="poll-links"><p id="admin-link"><%= links.adminLink %></p></a>
34-
<h3>Your shareable link: </h3>
3538
<a href=`<%- links.friendLink %>` class="poll-links"><p id="friend-link"><%= links.friendLink %></p></a>
3639
</section>
37-
38-
<div id="piechart" style="width: 900px; height: 500px;"></div>
40+
</div>
41+
<div id="piechart" class="col-md-8"></div>
3942
<script>
4043
var data = <%- JSON.stringify(choices) %>
4144
renderChart(data, 'piechart');

0 commit comments

Comments
 (0)