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.

Sign up for GitHub

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

New Facebook pages #135

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

New Facebook pages #135

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
361257c
project_prep_facebook_pages
joelugolini Jul 28, 2017
904e95d
index2.html
joelugolini Jul 31, 2017
2ded8f2
index3.html
joelugolini Aug 4, 2017
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
96 changes: 96 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,96 @@
<!doctype html>
<html>

<head>
<div class="Rectangle">
<div class="Heading">Facebook</div>
</div>
<link rel="stylesheet" type="text/css" href="style.css">

<form>
<div class="Entry">
Email:
<input type="text" name="Email"><br>
</div>
<div class="Entry2">
Password:
<input type="text" name="Password">
</div>
<input class="btn" type="submit" value="Log In">
</form>

</head>

<body>
<div class="SignUp">
<h1>Sign Up</h1>
<div class="Inputs">
<input type="text" name="First Name" placeholder="First Name"> <input type="text" name="Last Name" placeholder="Last Name"><br>
<input type="text" name="Your Email" placeholder="Your Email"><br>
<input type="text" name="Your New Password" placeholder="Your New Password"><br>
<input type="text" name="Confirm Password" placeholder="Confirm Password"><br>
</div>
<h4>Birthday</h4><br>
<div class="Birthday">
<select id="Month">
<option value="" selected>Month</option>
<option>Jan</option>
<option>Feb</option>
<option>Mar</option>
<option>Apr</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>Aug</option>
<option>Sept</option>
<option>Oct</option>
<option>Nov</option>
<option>Dec</option>
</select>
<select id="Day">
<option value="" selected>Day</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
</select>
<select id="Year">
<option value="" selected>Year</option>
<option>1990</option>
<option>1991</option>
<option>1993</option>
<option>1994</option>
</select><br>
<input type="radio" name="Answer">Female</label><input type="radio" name="Answer">Male</label><br>
<form action="http://www.google.com">
<button>Sign Up!</button> </div>
</div>


<div class="Connect">
<h2>Connect with all your friends!</h2>
<ul>
<li>See photos and updates in your news feed</li>
<li>Post your status for the world to see from your profile</li>
<li>Get in touch with your friends by "friending" them</li>
<li>Like things because you're a positive person!</li>
</ul>
</div>


</body>

</html>
68 changes: 68 additions & 0 deletions index2.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
<!doctype html>
<html>

<head>

<link rel="stylesheet" type="text/css" href="style2.css">
<div class="Rectangle">
<div class="Heading">Facebook</div>
<input type="text" name="Search" placeholder="Search for Users">
<h5>Harry</h5>
<div id="Uni">
<img src="https://s-media-cache-ak0.pinimg.com/236x/73/61/98/736198596b99b1b519098fed4000c3f5--baby-unicorn-chibi-unicorn.jpg" alt="Unicorn" style="width:60px;height:60px">
</div>
</div>
</head>

<body>
<div id="Uni2">
<img src="https://s-media-cache-ak0.pinimg.com/236x/73/61/98/736198596b99b1b519098fed4000c3f5--baby-unicorn-chibi-unicorn.jpg" alt="Unicorn" style="width:1200px;height:360px">
</div>
<div id=happybox></div>
<div id="Edit">
<a href="html_images.asp">Edit Profile</a>
</div>
<input class="btn" type="submit" value="Timeline">
<input class="btn" type="submit" value="About">
<input class="btn" type="submit" value="Photos (32)">
<input class="btn" type="submit" value="Friends (1,200)">
<strong>Harry Potter</strong>
<div id="Uni3">
<img src="https://s-media-cache-ak0.pinimg.com/236x/73/61/98/736198596b99b1b519098fed4000c3f5--baby-unicorn-chibi-unicorn.jpg" alt="Unicorn" style="width:190px;height:230px">
</div>


<div class="Box">
<h3>About</h3><br>
<button>Edit your Profile</button>
<div class="boxed">
<div id="h2">
<h2>Basic Information</h2></div>
<h6>Birthday:</h6>
<h6>College:</h6>
<h6>Hometown:</h6>
<h6>Currently Lives:</h6>
<div id="h2">
<h2>Contact Information</h2></div>
<h6>Email:</h6>
<h6>Telephone:</h6>
<div id="col">
<h6>July 31, 1980</h6>
<h6>Villanova</h6>
<h6>Toms River</h6>
<h6>Mars</h6>
</div>
<div id="col2">
<h6>[email protected]</h6>
<h6>7778888</h6>
</div>
<div id="Words">
<h2>Words to Live By</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<h2>About Me</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
</div>
</body>
</html>
91 changes: 91 additions & 0 deletions index3.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style3.css">
<div class="Rectangle">
<div class="Heading">Facebook</div>
<input type="text" name="Search" placeholder="Search for Users">
<h5>Harry</h5>
<div id="Uni">
<img src="https://s-media-cache-ak0.pinimg.com/236x/73/61/98/736198596b99b1b519098fed4000c3f5--baby-unicorn-chibi-unicorn.jpg" alt="Unicorn" style="width:60px;height:60px">
</div>
</div>
</head>
<body>
<div id="Uni2">
<img src="https://s-media-cache-ak0.pinimg.com/236x/73/61/98/736198596b99b1b519098fed4000c3f5--baby-unicorn-chibi-unicorn.jpg" alt="Unicorn" style="width:1200px;height:360px">
</div>
<div id=happybox></div>
<div id="Edit">
<a href="html_images.asp">Edit Profile</a>
</div>
<input class="btn" type="submit" value="Timeline">
<input class="btn" type="submit" value="About">
<input class="btn" type="submit" value="Photos (32)">
<input class="btn" type="submit" value="Friends (1,200)">
<strong>Harry Potter</strong>
<div id="Uni3">
<img src="https://s-media-cache-ak0.pinimg.com/236x/73/61/98/736198596b99b1b519098fed4000c3f5--baby-unicorn-chibi-unicorn.jpg" alt="Unicorn" style="width:190px;height:230px">
</div>

<div class="Box">
<h3>Friends</h3>
</div>
<div class=Boxed>
<div id=Boxed1>
<div id=KH1>
<img src="https://comedycentral.mtvnimages.com/images/ccstandup/comedians/800x600/kevin_hart_800x600.jpg?quality=0.85&width=236&height=236&crop=true" alt="Harmione Gronger" style="width:110px;height:110px">
</div>
<div id=HG>
<a href="html_images.asp">Hermiane Gronger</a><br>
</div>
<button>Unfriend Me</button><br>
<h4>432 Friends</h4></div>
<div id=Boxed2>
<div id=KH1>
<img src="https://comedycentral.mtvnimages.com/images/ccstandup/comedians/800x600/kevin_hart_800x600.jpg?quality=0.85&width=236&height=236&crop=true" alt="Harmione Gronger" style="width:110px;height:110px">
</div>
<div id=HG>
<a href="html_images.asp">Hermiane Gronger</a><br>
</div>
<button>Unfriend Me</button><br>
<h4>432 Friends</h4></div>
<div id=Boxed3>
<div id=KH1>
<img src="https://comedycentral.mtvnimages.com/images/ccstandup/comedians/800x600/kevin_hart_800x600.jpg?quality=0.85&width=236&height=236&crop=true" alt="Harmione Gronger" style="width:110px;height:110px">
</div>
<div id=HG>
<a href="html_images.asp">Hermiane Gronger</a><br>
</div>
<button>Unfriend Me</button><br>
<h4>432 Friends</h4></div>
<div id=Boxed4>
<div id=KH1>
<img src="https://comedycentral.mtvnimages.com/images/ccstandup/comedians/800x600/kevin_hart_800x600.jpg?quality=0.85&width=236&height=236&crop=true" alt="Harmione Gronger" style="width:110px;height:110px">
</div>
<div id=HG>
<a href="html_images.asp">Hermiane Gronger</a><br>
</div>
<button>Unfriend Me</button><br>
<h4>432 Friends</h4></div>
<div id=Boxed5>
<div id=KH1>
<img src="https://comedycentral.mtvnimages.com/images/ccstandup/comedians/800x600/kevin_hart_800x600.jpg?quality=0.85&width=236&height=236&crop=true" alt="Harmione Gronger" style="width:110px;height:110px">
</div>
<div id=HG>
<a href="html_images.asp">Hermiane Gronger</a><br>
</div>
<button>Unfriend Me</button><br>
<h4>432 Friends</h4></div>
<div id=Boxed6>
<div id=KH1>
<img src="https://comedycentral.mtvnimages.com/images/ccstandup/comedians/800x600/kevin_hart_800x600.jpg?quality=0.85&width=236&height=236&crop=true" alt="Harmione Gronger" style="width:110px;height:110px">
</div>
<div id=HG>
<a href="html_images.asp">Hermiane Gronger</a><br>
</div>
<button>Unfriend Me</button><br>
<h4>432 Friends</h4></div>
</div>
</body>
</html>
101 changes: 101 additions & 0 deletions style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,101 @@
.Rectangle {
position: static;
width: 100%;
height: 75px;
background-color: blue;
border: 1px solid black;
}

.Heading {
color: white;
padding-left: 2%;
font-weight: bold;
font-size: 200%;
position: static;
margin-top: 1%;
font-family: "Lucida Grande",arial,sans-serif;
}

.Entry {
position: relative;
left: 61%;
top: -48px;
color: white;
}

.Entry2 {
position: relative;
left: 76%;
top: -72px;
color: white;
}

input[value="Log In"] {
position: relative;
left: 93%;
top: -94px;
background-color: lightblue;
border: 1px solid black;
}

input[value="Sign Up!"] {
background-color: green;
color: white;
border: 1px solid black;
width: 32%;
font-size: 143%;
}

.Connect {
letter-spacing: 4px;
line-height: 250%;
position: absolute;
top: 27%;
left: 5%;
font-family: "Lucida Grande",arial,sans-serif;
}

.Birthday {
position: absolute;
top: 265px;
float: right;
width: 109%;
}

h4 {
position: absolute;
top: 72.5%;
}

h1 {
font-family: "Lucida Grande",arial,sans-serif;
letter-spacing: 2px;
font-size: 270%;
}

.SignUp {
padding-right: 17%;
line-height: 279%;
position: relative;
left: 60%;
top: -35px;
}

input[name="First Name"], input[name="Last Name"] {
width: 20%;
}

input[name="Confirm Password"], input[name="Your Email"], input[name="Your New Password"] {
width: 42%;
}

input[name="First Name"] {
margin-right: 1%;
}

#Greenbutton {
color: black;
position: relative;
left: 70%;
font-size: 10px;
}
Loading