Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
WebDev
epic-journey-display
Commits
7169b89f
Commit
7169b89f
authored
Mar 05, 2020
by
Porter Libby
Browse files
start updating frame to match dana's blueprint
parent
377983f9
Changes
4
Hide whitespace changes
Inline
Side-by-side
index.html
View file @
7169b89f
...
...
@@ -26,6 +26,7 @@
<link
rel=
"apple-touch-icon"
href=
"icon.png"
>
<link
rel=
"stylesheet"
href=
"publiic/css/fonts.css"
>
<link
rel=
"stylesheet"
href=
"public/css/keyb.css"
>
<link
rel=
"stylesheet"
href=
"public/css/input.css"
>
<link
rel=
"stylesheet"
href=
"public/css/main.css"
>
<!-- LOCAL JS -->
...
...
@@ -122,11 +123,15 @@
<!-- Block 1 -->
<div
class=
'block'
id=
"block1"
>
<div
style=
'position:absolute'
id=
'search_parent'
>
<span
class=
'section-prompt'
></br>
1. Type the name of a major you are interested in
</span>
<div
style=
'position:absolute'
id=
'search_parent'
>
<span
class=
'section-prompt'
></br>
1. What major are you interested in?
</span>
</div>
<div
style=
'position:absolute; left:30%; margin-top:200px;font-size:20px;'
>
<span>
Not sure? See
<mark><a
href=
'https://earlham.edu/academics/majors-minors/'
>
full list
</a></mark></span>
</div>
<script>
var
parent
=
document
.
getElementById
(
'
search_parent
'
);
create_searchbar
(
parent
,
'
major_selection
'
);
if
((
'
ontouchstart
'
in
document
.
documentElement
)){
$
(
"
#search_parent #searchbar
"
).
keyboard
({
...
...
@@ -175,6 +180,25 @@
<!-- Block 3 -->
<div
class=
'block'
id=
"block3"
>
<span
class=
'section-prompt'
>
3. What would you like to do for fun?
</span>
<div>
<input
type=
"checkbox"
id=
"campuslife1"
name=
"campuslife1"
value=
"campuslife1"
>
<label
for=
"campuslife1"
>
option 1
</label><br>
<input
type=
"checkbox"
id=
"campuslife2"
name=
"campuslife2"
value=
"campuslife2"
>
<label
for=
"campuslife2"
>
option 2
</label><br>
<input
type=
"checkbox"
id=
"campuslife3"
name=
"campuslife3"
value=
"campuslife3"
>
<label
for=
"campuslife3"
>
option 3
</label><br>
<input
type=
"checkbox"
id=
"campuslife4"
name=
"campuslife4"
value=
"campuslife4"
>
<label
for=
"campuslife4"
>
option 4
</label><br>
<input
type=
"checkbox"
id=
"campuslife5"
name=
"campuslife5"
value=
"campuslife5"
>
<label
for=
"campuslife5"
>
option 5
</label><br>
</div>
<div>
</div>
</div>
<!-- Block 4 -->
...
...
@@ -184,9 +208,17 @@
<div
class=
'inner-nav'
>
<!-- Nav options for this block -->
<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>
</div>
</div>
<!-- Block 5 -->
<div
class=
'block'
id=
"block5"
>
<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 btn-finish"
>
<span
class=
"btn-label"
><i
class=
"fa fa-check"
></i></span><br>
Finish!
</button>
<span
class=
"btn-label"
><i
class=
"fa fa-check"
></i></span><br>
Finish
and see results
!
</button>
</div>
</div>
</div>
...
...
public/css/input.css
0 → 100644
View file @
7169b89f
.wrapper
{
background-color
:
#FFF
;
border-radius
:
2px
;
box-shadow
:
0px
2px
1px
0px
#DDD
;
box-sizing
:
border-box
;
height
:
300px
;
left
:
50%
;
margin
:
-150px
0
0
-150px
;
position
:
absolute
;
top
:
50%
;
width
:
300px
;
}
input
{
border
:
0
;
outline
:
0
;
background
:
transparent
;
border-bottom
:
2px
solid
#6F263D
;
}
\ No newline at end of file
public/css/main.css
View file @
7169b89f
...
...
@@ -20,6 +20,7 @@ body{
width
:
100%
;
height
:
100%
;
font-family
:
Sentinel-Light
;
color
:
#6F263D
;
}
.fa
{
font-size
:
25px
;
...
...
@@ -39,6 +40,8 @@ body{
}
#searchbar
{
width
:
50%
;
font-size
:
20px
;
}
#searchbarautocomplete-list
{
cursor
:
pointer
;
...
...
@@ -76,7 +79,7 @@ body{
text-align
:
center
;
}
.section-prompt
{
font-size
:
25
px
;
font-size
:
30
px
;
font-family
:
Sentinel-Semibold
;
padding
:
40px
20px
;
...
...
public/js/searchBar.js
View file @
7169b89f
...
...
@@ -10,6 +10,7 @@ function create_searchbar(parent, key){
search_container
.
classList
=
""
;
var
search
=
document
.
createElement
(
"
INPUT
"
);
search
.
id
=
'
searchbar
'
search
.
placeholder
=
"
e.g. Computer Science
"
;
search
.
classList
=
""
;
search
.
setAttribute
(
"
type
"
,
"
text
"
);
search
.
setAttribute
(
"
value
"
,
""
);
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment