Skip to content

Commit 70f0681

Browse files
Kyle HoganKyle Hogan
Kyle Hogan
authored and
Kyle Hogan
committed
first commit before online test
0 parents  commit 70f0681

31 files changed

+29065
-0
lines changed

‎.DS_Store

8 KB
Binary file not shown.

‎TopBar.jpg

283 KB
Loading

‎TopBar2.jpg

201 KB
Loading

‎aStyle.css

+115
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
body{
2+
font-family: 'Oswald', sans-serif;
3+
margin: auto;
4+
background-color: #ccc;
5+
}
6+
7+
#theHeader{
8+
9+
/*background-color: #333;*/
10+
color: #ffffff;
11+
text-shadow: 2px 2px 4px #0000ff;
12+
text-align: center;
13+
background: url("TopBar2.jpg");
14+
background-size: 100%;
15+
background-repeat: no-repeat;
16+
height: 200px;
17+
18+
}
19+
20+
#theNav{
21+
22+
background-color: yellow;
23+
color: black;
24+
font-size:22px;
25+
padding: 14 0;
26+
27+
}
28+
29+
#main{
30+
color: black;
31+
width:85%;
32+
max-width: 800px;
33+
height:510px;
34+
margin: 10 auto;
35+
padding-top:15px;
36+
37+
38+
}
39+
40+
#bio{
41+
float: left;
42+
width: 400px;
43+
height:200px;
44+
font-family: sans-serif;
45+
margin: auto 0;
46+
}
47+
48+
#Description{
49+
width: 95%;
50+
height:130px;
51+
font-family: sans-serif;
52+
margin: 0 auto;
53+
font-size:18px;
54+
}
55+
56+
#portrait{
57+
/*float:left;*/
58+
width:350;
59+
border-radius: 3px;
60+
margin: 10 auto;
61+
62+
}
63+
64+
#snap{
65+
/*float:left;*/
66+
border-radius: 3px;
67+
margin: auto 0;
68+
width: 100%;
69+
70+
}
71+
72+
#bookSnap{
73+
/*float:left;*/
74+
border-radius: 3px;
75+
margin: 0 auto;
76+
width: 400px;
77+
display: block;
78+
79+
}
80+
81+
#contact{
82+
/*float:left;*/
83+
margin: 50 auto;
84+
width: 500px;
85+
display: block;
86+
87+
padding-left: 102;
88+
89+
}
90+
#contact ul{
91+
list-style-type: none;
92+
font-size:24px;
93+
}
94+
nav ul{
95+
width: 680;
96+
margin:0 auto;
97+
}
98+
99+
nav li {
100+
display: inline;
101+
margin: auto 20px;
102+
}
103+
104+
.bigDiv{
105+
width: 100%;
106+
display: block;
107+
108+
}
109+
110+
a:visited {
111+
color: black;
112+
}
113+
a:link{
114+
color: black;
115+
}

‎about.html

+54
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
<html>
2+
<head>
3+
<link rel="stylesheet" type = "text/css" href = "aStyle.css">
4+
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
5+
</head>
6+
<body>
7+
<header>
8+
<div id="theHeader" class = "bigDiv">
9+
</br>
10+
<h1>Kyle Hogan</h1>
11+
12+
<h2>Full Stack Web Developer in Training * Bad Sense of Humor * Kind of a Jerk</h2>
13+
14+
</div>
15+
</header>
16+
<nav >
17+
<div id="theNav" class = "bigDiv">
18+
<ul>
19+
<li><a href="about.html">About Me</a></li>
20+
<li><a href="chat-about.html">Chat Room</a></li>
21+
<li><a href="reader-about.html">E-Reader</a></li>
22+
<li>Future Projects</li>
23+
<li><a href="contact.html">Contact</a></li>
24+
</ul>
25+
</div>
26+
</nav>
27+
<section>
28+
<div id="main" class = "bigdiv">
29+
<div id="bio">
30+
<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;In case you missed it at the top of the page, my name is Kyle Hogan, and
31+
I am currently a student in General Assembly's Web Development Immersive course.
32+
I'm seeking out opportunities that will help me build upon the knowledge base
33+
that I've started laying the foundation for at GA. By the time I complete the
34+
program, I expect to be qualified as an entry-level web developer, and hopefully
35+
be able to build my own lightsaber.
36+
37+
</p>
38+
</div>
39+
<img id="portrait" src="kdog.jpg">
40+
</div>
41+
42+
43+
44+
45+
46+
47+
48+
49+
50+
51+
52+
</section>
53+
</body>
54+
</html>

‎aboutGenerator.html

+112
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,112 @@
1+
<html>
2+
<head>
3+
<link rel="stylesheet" type="text/css" href="style.css">
4+
</head>
5+
<body id="body" backgroundColor = "red">
6+
7+
<script>
8+
var bod = document.getElementById("body");
9+
bod.style.textAlign = "center";
10+
bod.style.backgroundColor = "red";
11+
bod.style.fontSize = "32px";
12+
var brk = document.createElement("br");
13+
var heading = document.createElement("h1");
14+
heading.innerText = "Let's talk about you.";
15+
var nam = document.createElement("input");
16+
nam.placeholder = "your name here";
17+
nam.style.padding = "10px";
18+
var town = document.createElement("input");
19+
town.placeholder = "your hometown";
20+
town.style.padding = "10px";
21+
var sign = document.createElement("input");
22+
sign.placeholder = "your sign";
23+
sign.style.padding = "10px";
24+
var color = document.createElement("input");
25+
color.placeholder = "your favorite color";
26+
color.style.padding = "10px";
27+
var but = document.createElement("button");
28+
but.innerHTML = "Magically generate your new homepage!";
29+
but.style.padding = "10px";
30+
but.style.fontSize = "14px";
31+
32+
var newPage = function(){
33+
34+
var nameA = nam.value;
35+
var townA = town.value;
36+
var signA = sign.value;
37+
var colorA = color.value;
38+
var newTitle = document.createElement("h1");
39+
newTitle.innerHTML = "All about " + nameA;
40+
41+
var mainD = document.createElement("div");
42+
mainD.style.width = "100%";
43+
mainD.style.height = 100;
44+
mainD.style.textAlign = "center";
45+
mainD.style.background = "rgba(200,200,210,0.5)";
46+
mainD.style.borderRadius = 10;
47+
48+
var signD = document.createElement("div");
49+
signD.style.width = "48%";
50+
signD.style.cssFloat = "left";
51+
signD.style.styleFloat = "left";
52+
53+
var signP = document.createElement("p");
54+
signP.innerHTML = nameA + "'s sign is " + signA;
55+
56+
var townD = document.createElement("div");
57+
townD.style.width="48%";
58+
townD.style.cssFloat = "right";
59+
60+
var townP = document.createElement("p");
61+
townP.innerHTML = nameA + "'s hometown is " + townA;
62+
63+
var slate = document.createElement("div");
64+
slate.style.width = "100%";
65+
slate.style.height = "100%";
66+
slate.style.background = "rgba(255,255,255,0.01)";
67+
slate.style.position = "fixed";
68+
slate.style.margin = -10, 20 ,10,-20 ;
69+
var x = 0.01
70+
71+
var wipe = function(){
72+
bod.insertBefore(slate , heading);
73+
slate.style.background = "rgba(255,255,255," + x + ")";
74+
if(x <= 1){x = x+0.04;}
75+
}
76+
77+
var rec = function(){
78+
clearInterval(wiper);
79+
bod.removeChild(heading);
80+
bod.removeChild(nam);
81+
bod.removeChild(town);
82+
bod.removeChild(sign);
83+
bod.removeChild(color);
84+
bod.removeChild(but);
85+
bod.style.backgroundColor = colorA;
86+
bod.appendChild(newTitle);
87+
bod.appendChild(brk);
88+
bod.appendChild(mainD);
89+
mainD.appendChild(signD);
90+
signD.appendChild(signP);
91+
mainD.appendChild(townD);
92+
townD.appendChild(townP);
93+
bod.removeChild(slate);
94+
}
95+
96+
var wiper = setInterval(wipe,1);
97+
setTimeout(rec , 2000);
98+
}
99+
100+
but.addEventListener("click" , newPage);
101+
bod.appendChild(heading);
102+
bod.appendChild(brk);
103+
bod.appendChild(nam);
104+
bod.appendChild(town);
105+
bod.appendChild(sign);
106+
bod.appendChild(color);
107+
bod.appendChild(but);
108+
109+
110+
</script>
111+
</body>
112+
</html>

0 commit comments

Comments
 (0)