Skip to content

Commit 3e88c45

Browse files
authored
Merge pull request #3 from yomete/master
backend pages done
2 parents f5a2e20 + 9123ee5 commit 3e88c45

24 files changed

+613
-141
lines changed

app/assets/components/skeleton/skeleton.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -354,7 +354,7 @@ p,
354354
ul,
355355
ol,
356356
form {
357-
margin-bottom: 2.5rem; }
357+
margin-bottom: 1.5rem; }
358358

359359

360360
/* Utilities

app/assets/css/style.css

Lines changed: 91 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -15,16 +15,26 @@
1515
html {
1616
font-size: 62.5%; }
1717

18+
a {
19+
color: black;
20+
text-decoration: none; }
21+
1822
a:hover {
1923
text-decoration: none;
20-
color: inherit; }
24+
color: #888; }
25+
26+
.active {
27+
font-weight: bold; }
2128

2229
.text-white {
2330
color: #fff; }
2431

2532
.text-black {
2633
color: #000; }
2734

35+
.text-grey {
36+
color: #ccc; }
37+
2838
.text-u-c {
2939
text-transform: uppercase; }
3040

@@ -948,8 +958,79 @@ textarea {
948958
font: inherit;
949959
/* 2 */ }
950960

951-
.nav ul {
952-
list-style: none; }
961+
.header {
962+
padding: 40px 0; }
963+
.header a {
964+
text-transform: uppercase;
965+
color: #000;
966+
text-decoration: none;
967+
letter-spacing: 2px; }
968+
.header a:hover {
969+
color: #888; }
970+
.header .nav-logo {
971+
font-weight: bold; }
972+
.header .nav-link {
973+
margin-top: 20px; }
974+
.header .nav-link a {
975+
margin-right: 20px; }
976+
977+
.borderline {
978+
border: 1px solid #eee; }
979+
980+
.tracks .list {
981+
margin: 15px 0; }
982+
.tracks .list .title {
983+
font-weight: bold;
984+
font-size: 1.7em; }
985+
.tracks .list .sub-title {
986+
color: #ccc; }
987+
.tracks .list a {
988+
float: right;
989+
font-weight: bold; }
990+
991+
.new-track .nav p {
992+
font-weight: bold; }
993+
994+
.new-track .nav a {
995+
margin-left: 10px;
996+
color: #000; }
997+
998+
.new-track-active {
999+
color: #000;
1000+
font-weight: bold; }
1001+
1002+
.add-track i {
1003+
margin-right: 10px; }
1004+
1005+
.questions i {
1006+
margin-right: 10px; }
1007+
1008+
.new-question .nav p {
1009+
font-weight: bold; }
1010+
1011+
.new-question .nav a {
1012+
margin-left: 10px;
1013+
color: #000; }
1014+
1015+
.another-answer i {
1016+
margin-right: 10px; }
1017+
1018+
.form .form-control {
1019+
margin-bottom: 30px;
1020+
border-top: none;
1021+
border-right: 0;
1022+
border-left: 0;
1023+
border-radius: 0;
1024+
border-color: #ccc;
1025+
background-color: transparent; }
1026+
1027+
input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="text"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, textarea:focus, select:focus {
1028+
margin-bottom: 30px;
1029+
border-top: none;
1030+
border-right: 0;
1031+
border-left: 0;
1032+
border-radius: 0;
1033+
border-color: #ccc; }
9531034

9541035
@font-face {
9551036
font-family: 'Font-Name';
@@ -958,41 +1039,10 @@ textarea {
9581039
font-weight: normal;
9591040
font-style: normal; }
9601041

961-
@media print {
962-
* {
963-
background: transparent !important;
964-
color: #000 !important;
965-
box-shadow: none !important;
966-
text-shadow: none !important; }
967-
a,
968-
a:visited {
969-
text-decoration: underline; }
970-
a[href]:after {
971-
content: " (" attr(href) ")"; }
972-
abbr[title]:after {
973-
content: " (" attr(title) ")"; }
974-
.ir a:after,
975-
a[href^="javascript:"]:after,
976-
a[href^="#"]:after {
977-
content: ""; }
978-
pre,
979-
blockquote {
980-
border: 1px solid #999;
981-
page-break-inside: avoid; }
982-
thead {
983-
display: table-header-group; }
984-
tr,
985-
img {
986-
page-break-inside: avoid; }
987-
img {
988-
max-width: 100% !important; }
989-
@page {
990-
margin: 0.5cm; }
991-
p,
992-
h2,
993-
h3 {
994-
orphans: 3;
995-
widows: 3; }
996-
h2,
997-
h3 {
998-
page-break-after: avoid; } }
1042+
@media only screen and (min-width: 550px) {
1043+
.header .nav-link {
1044+
float: right;
1045+
margin-top: 0; }
1046+
.header .nav-link a {
1047+
margin-left: 20px;
1048+
margin-right: 0; } }

app/assets/css/style.min.css

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

app/assets/js/scripts.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,3 +6,19 @@
66
* @version 0.0.1
77
* Copyright 2016. MIT licensed.
88
*/
9+
$(document).ready(function() {
10+
$("#add-another-answer").click(function() {
11+
12+
$($('.q-row').last()).after('<div class="row m-t-xl q-row"><div class="four columns"><label>Answer 3</label><a href="#" class="text-grey delete-this-answer">Remove</a></div><div class="eight columns"><input class="form-control u-full-width" placeholder="Actual Answer" type="text" required><input class="form-control u-full-width" placeholder="Add track" type="text" required></div></div>');
13+
14+
$(".delete-this-answer").click(function() {
15+
$(this).closest(".q-row").remove();
16+
});
17+
18+
});
19+
20+
$(".delete-this-answer").click(function() {
21+
$(this).closest(".q-row").remove();
22+
});
23+
24+
});

app/assets/js/scripts.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

app/index.html

Lines changed: 59 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,20 +7,75 @@
77
<meta http-equiv="X-UA-Compatible" content="IE=edge">
88
<meta name="description" content="">
99
<meta name="viewport" content="width=device-width,initial-scale=1">
10-
<link href="assets/components/skeleton/skeleton.css"/>
10+
<link href="assets/components/skeleton/skeleton.css" rel="stylesheet">
1111
<link href="assets/css/style.min.css" rel="stylesheet">
1212

13+
<script src="https://use.fontawesome.com/ab67cbccfa.js"></script>
1314
<script src="assets/components/modernizr/modernizr.js"></script>
1415
</head>
1516
<body>
1617

17-
<header class="header">
18+
<header class="container">
19+
20+
<nav class="header">
21+
22+
<div class="row">
23+
<div class="six columns">
24+
<a class="nav-logo" href="/">Coding101</a>
25+
</div>
26+
27+
<div class="six columns">
28+
<div class="nav-link">
29+
<a class="active" href="/">Tracks</a>
30+
<a href="questions.html">Questions</a>
31+
</div>
32+
</div>
33+
34+
</div>
35+
36+
</nav>
1837

1938
</header>
2039

21-
<main class="main">
40+
<section class="borderline"></section>
41+
42+
<section class="container add-track m-t-xl m-b-xl">
43+
<a href="new-track.html"><i class="fa fa-plus"></i>New Track</a>
44+
</section>
45+
46+
<section class="container tracks">
47+
48+
<div class="row list">
49+
50+
<div class="eight columns">
51+
<p class="title">Coding With HTML / CSS</p>
52+
<p class="sub-title"><em>coding-with-html.</em> 3 resources</p>
53+
</div>
54+
<div class=" four columns">
55+
<a href="#">Manage Track</a>
56+
</div>
57+
</div>
58+
59+
<div class="row list">
60+
<div class="eight columns">
61+
<p class="title">Back End: Javascript</p>
62+
<p class="sub-title"><em>back-end-javascript.</em> 3 resources</p>
63+
</div>
64+
<div class="four columns">
65+
<a href="#">Manage Track</a>
66+
</div>
67+
</div>
2268

23-
</main>
69+
<div class="row list">
70+
<div class="eight columns">
71+
<p class="title">Front End: Javascript</p>
72+
<p class="sub-title"><em>front-end-javascript.</em> 3 resources</p>
73+
</div>
74+
<div class="four columns">
75+
<a href="#">Manage Track</a>
76+
</div>
77+
</div>
78+
</section>
2479

2580
<script src="assets/js/scripts.min.js"></script>
2681

app/new-question.html

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Coding101</title>
6+
7+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
8+
<meta name="description" content="">
9+
<meta name="viewport" content="width=device-width,initial-scale=1">
10+
<link href="assets/components/skeleton/skeleton.css" rel="stylesheet">
11+
<link href="assets/css/style.min.css" rel="stylesheet">
12+
13+
<script src="https://use.fontawesome.com/ab67cbccfa.js"></script>
14+
<script src="assets/components/modernizr/modernizr.js"></script>
15+
</head>
16+
<body>
17+
18+
<header class="container">
19+
20+
<nav class="header">
21+
22+
<div class="row">
23+
<div class="six columns">
24+
<a class="nav-logo" href="/">Coding101</a>
25+
</div>
26+
27+
<div class="six columns">
28+
<div class="nav-link">
29+
<a href="/">Tracks</a>
30+
<a class="active" href="questions.html">Questions</a>
31+
</div>
32+
</div>
33+
34+
</div>
35+
36+
</nav>
37+
38+
</header>
39+
40+
<section class="borderline"></section>
41+
42+
<section class="container new-question m-t-xl">
43+
<form class="form">
44+
45+
<div class="row nav">
46+
<div class="eight columns">
47+
<p>New Question</p>
48+
</div>
49+
50+
<div class="four columns">
51+
<div class="u-pull-right">
52+
<a href="#">Cancel</a>
53+
<a class="new-track-active" href="#">Save</a>
54+
</div>
55+
</div>
56+
</div>
57+
58+
<div class="row m-t-xl">
59+
60+
<div class="four columns">
61+
<label>Actual Question</label>
62+
</div>
63+
<div class="eight columns">
64+
<input class="form-control u-full-width" placeholder="Question Name" type="text" required>
65+
</div>
66+
67+
</div>
68+
69+
<div class="row m-t-xl q-row">
70+
71+
<div class="four columns">
72+
<label>Answer 1</label>
73+
<a href="#" class="text-grey delete-this-answer">Remove</a>
74+
</div>
75+
<div class="eight columns">
76+
<input class="form-control u-full-width" placeholder="Actual Answer" type="text" required>
77+
<input class="form-control u-full-width" placeholder="Add track" type="text" required>
78+
</div>
79+
80+
</div>
81+
82+
<div class="row m-t-xl q-row">
83+
84+
<div class="four columns">
85+
<label>Answer 2</label>
86+
<a href="#" class="text-grey delete-this-answer">Remove</a>
87+
</div>
88+
<div class="eight columns">
89+
<input class="form-control u-full-width" placeholder="Actual Answer" type="text" required>
90+
<input class="form-control u-full-width" placeholder="Add track" type="text" required>
91+
</div>
92+
93+
</div>
94+
95+
<div class="row m-t-xl">
96+
<a id="add-another-answer" class="another-answer text-grey" href="#"><i class="fa fa-plus"></i>Add another answer</a>
97+
</div>
98+
99+
</form>
100+
</section>
101+
102+
<script src="assets/components/jquery/jquery.min.js"></script>
103+
<script src="assets/js/scripts.min.js"></script>
104+
105+
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
106+
<script>
107+
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
108+
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
109+
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
110+
e.src='//www.google-analytics.com/analytics.js';
111+
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
112+
ga('create','UA-XXXXX-X');ga('send','pageview');
113+
</script>
114+
115+
</body>
116+
</html>

0 commit comments

Comments
 (0)