Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

added question pages #10

Merged
merged 4 commits into from
Jul 24, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
137 changes: 137 additions & 0 deletions assets/css/styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,137 @@
header{
overflow: auto;
}
body{
font-family: cursive;
background: #f8fdff;
}
#logo{
width: 40px;
float: left;
}
#co{
float: right;
}
.main{
clear: both;
text-align: center;
margin-top: 70px;
}
h3{
font-size: 30px;
}
p{
font-size: 20px;
}
button{
background: #32ad75;
width: 120px;
height: 40px;
color: #fff;
}
#paragraph{
text-align: center;
font-weight: bold;
margin-top: 70px;
}
.container{
margin: 0px auto;
width: 100%;
margin-top: 70px;
overflow: hidden;

text-align: center;
}

.center{
width: 950px;
margin: 10px auto;
}


#bg{
width: 400px;
height: 400px;
}

.link a{
color:#fff;
font-weight: bolder;
text-decoration: none;
font-size: 1.2em;

}

.link{
z-index: 9;
display: block;
position: relative;
margin-top: 30px;
}

.showcase{
-webkit-box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.75);
box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.75);
border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border: 0px solid #000000;
}

.showcase1{
background: url("../images/student.jpg") no-repeat ;
background-size: cover;
padding: 15px;
height: 200px;
width: 250px;
float: left;
margin-left: 25px;
}

.overlay {
position: relative;

}

.overlay:before{
position: absolute;
content:" ";
top:0;
left:0;
width:100%;
height:100%;
/*display: none;*/
z-index:0;
}

.blue:before {
background-color: rgba(83,192,232,0.8);
}

.green:before {
background-color: rgba(124,201,164,0.8);
}

.dark:before {
background-color: rgba(46,93,111,0.8);
}
.showcase2{
background: url("../images/student.jpg") no-repeat;
background-size: cover;
padding: 15px;
height: 200px;
width: 250px;
float: left;
margin-left: 25px;

}
.showcase3{
background: url("../images/student.jpg") no-repeat;
background-size: cover;
padding: 15px;
height: 200px;
width: 250px;
float: left;
margin-left: 25px;
}
Binary file added assets/images/logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/student.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
18 changes: 18 additions & 0 deletions begin.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Quality: Critical
This seems to be designed without any use of css or care for responsiveness. This should be refactored and appropriate css should be used.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes...no styling as the #4 is basically to create plain html

<title>coding101</title>
<header>
<img src="images/logo.png">
<p>Coding101</p>
</header>
</head>
<body>
<section>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Quality: Nitpick
This should be revisited and divided into reasonable divs

<h3>We've already done the hardwork on curating the best<br/> resources to help you.</h3>
<p>All you have to do is try answer the next couple of<br/> questions as best as you can so we can figure out<br/> what you may like.</p>
<p>We then use that to create a track that might be the<br/> most engaging way for you to get into tech.</p>
<button>Begin</button>
</section>
</body>
</html>
23 changes: 23 additions & 0 deletions how.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<title>coding101</title>
<link rel="stylesheet" type="text/css" href="assets/css/styles.css">
</head>
<body>
<div>
<header>
<img src="assets/images/logo.png" id="logo">
<p id="co">Coding101</p>
</header>
</div>
<section class="main">
<div>
<h3>We've already done the hardwork on curating the best<br/> resources to help you.</h3>
<p>All you have to do is try answer the next couple of<br/> questions as best as you can so we can figure out<br/> what you may like.</p>
<p>We then use that to create a track that might be the<br/> most engaging way for you to get into tech.</p>
<a href="question1.html"><button>Begin</button></a>
</div>
</section>
</body>
</html>
22 changes: 22 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<title>coding 101</title>
<link rel="stylesheet" type="text/css" href="assets/css/styles.css">
</head>
<body>
<div>
<header>
<img src="assets/images/logo.png" id="logo">
<p id="co">Coding101</p>
</header>
</div>

<div class="main">
<h3>Coding101 aims to help people who are interested in<br> coding get an head start.</h3>
<p>We understand that coding can be a bit difficult at<br> the beginning and we are here to help you get<br> started.</p>
<a href="how.html"> <button> How?</button></a>
</div>

</body>
</html>
49 changes: 49 additions & 0 deletions question1.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
<!DOCTYPE html>
<html>
<head>

<title>coding101</title>
<link rel="stylesheet" type="text/css" href="assets/css/styles.css">
</head>
<body>
<header>
<img src="assets/images/logo.png" id="logo">
<p id="co">Coding101</p>
</header>



<section>
<p id="paragraph">I am a...</p>
<div class="container">

<div class="center">

<div class="showcase1 showcase overlay blue">
<span class="link" >
<a href="#">
Secondary School Graduate
</a>
</span>
</div>

<div class="showcase2 showcase overlay green">
<span class="link">
<a href="#">
Student/<br/>Graduate/<br/>Awaiting NYSC
</a>
</span>
</div>
<div class="showcase3 showcase overlay dark">
<span class="link">
<a href="#">
Employed/<br/>Corp Member/<br/>Unemployed
</a>
</span>
</div>
</div>
</div>
</section>

</body>
</html>