Commit 713e0356 authored by Dana Yao's avatar Dana Yao
Browse files

add styles

parent 166797be
File added
......@@ -125,38 +125,41 @@
</div>
<!-- Block 1 -->
<div class='block'>
<span class='section-prompt'>1. Type the name of a major you are interested in</span>
<div class='block' id="block1">
<span class='section-prompt'>1. Type the name of a major you are interested in:</span>
<iframe width="560" height="315" src="https://www.youtube.com/embed/vjsbZiBVFRM"
frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope;
picture-in-picture" allowfullscreen></iframe>
</div>
<!-- Block 2 -->
<div class='block'>
<div class='block' id="block2">
<span class='section-prompt'>2. Choose something that sounds fulfilling</span>
<br>
<div class='inner-nav'> <!-- Nav options for this block -->
<button type="button" class="btn btn-labeled btn-dark">
<button type="button" class="btn btn-labeled btn-dark btn-research">
<span class="btn-label"><i class="fa fa-flask"></i></span><br>Research</button>
<button type="button" class="btn btn-labeled btn-dark">
<button type="button" class="btn btn-labeled btn-dark btn-internship">
<span class="btn-label"><i class="fa fa-user-md"></i></span><br> Internship</button>
<button type="button" class="btn btn-labeled btn-dark">
<button type="button" class="btn btn-labeled btn-dark btn-offcampus">
<span class="btn-label"><i class="fa fa-book"></i></span><br> Off-campus Study</button>
</div>
</div>
<!-- Block 3 -->
<div class='block'>
<div class='block' id="block3">
<span class='section-prompt'>3. What would you like to do for fun?</span>
</div>
<!-- Block 4 -->
<div class='block'>
<div class='block' id="block4">
<span class='section-prompt'>4. What would you like to become?</span>
<br>
<div class='inner-nav'> <!-- Nav options for this block -->
<button type="button" class="btn btn-labeled btn-dark">
<button type="button" class="btn btn-labeled btn-dark btn-explore">
<span class="btn-label"><i class="fa fa-globe"></i></span><br> Explore</button>
<button type="button" class="btn btn-labeled btn-dark">
<button type="button" class="btn btn-labeled btn-dark btn-finish">
<span class="btn-label"><i class="fa fa-check"></i></span><br> Finish!</button>
</div>
</div>
......
......@@ -6,9 +6,9 @@ body{
font-size: 25px;
}
#main-content{
padding-left: 10%;
padding-right: 10%;
background-color: #bbb;
padding-left: 0%;
padding-right: 0%;
background-color: #EFDBB2;
}
#search-bar{
position: absolute;
......@@ -34,7 +34,6 @@ body{
.block{
height: 200px;
width: 100%;
background-color: #ccc;
border: 1px solid black;
text-align: left;
}
......@@ -42,11 +41,69 @@ body{
text-align: center;
}
.section-prompt{
font-size: 18px;
margin-left: 20px;
font-size: 20px;
font-family: Arial, Helvetica, sans-serif;
padding: 40px 20px;
}
.inner-nav{
width: 100%;
text-align: center;
padding-top: 20px;
}
#block1 {
background-color: white;
height: 400px;
}
#block2 {
background-color: #6F263D;
color:white;
}
#block3 {
background-color: white;
}
#block4 {
background-color: #6F263D;
color: white;
}
.btn {
padding: 30px 65px;
}
.btn-research {
color: white;
background-color: #FF9E1B;
}
.btn-internship {
background-color:#F9423A;
color:white;
}
.btn-offcampus {
background-color: #71C5E8;
color:white;
}
.btn-explore {
background-color: #FF9E1B;
color:white;
}
.btn-finish{
background-color: #F9423A;
color:white;
}
iframe{
float: right;
margin: 32px 40px;
}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment