Final project complete
This commit is contained in:
commit
62b75b7f32
BIN
images/blackwidow.jpg
Normal file
BIN
images/blackwidow.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 143 KiB |
BIN
images/tenet.jpg
Normal file
BIN
images/tenet.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 122 KiB |
BIN
images/ww84.jpg
Normal file
BIN
images/ww84.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 174 KiB |
53
joshua_style.css
Normal file
53
joshua_style.css
Normal file
@ -0,0 +1,53 @@
|
||||
.alert{
|
||||
background-color: #444444;
|
||||
display: inline-block;
|
||||
width: 95%;
|
||||
padding: 5px 55px 5px 10px;
|
||||
margin-bottom: 5px;
|
||||
margin-top: 5px;
|
||||
color: orange;
|
||||
}
|
||||
.movie-container{
|
||||
margin-left: 5%;
|
||||
}
|
||||
.movie{
|
||||
border: 1px black solid;
|
||||
width: 30%;
|
||||
min-width: 30%;
|
||||
display: inline-block;
|
||||
}
|
||||
.movielisting{
|
||||
float:left;
|
||||
margin: 0px 8px 0px 8px;
|
||||
}
|
||||
.container{
|
||||
display:block;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.loginform{
|
||||
margin: 0 auto;
|
||||
display:block;
|
||||
/*background-color:black;
|
||||
color:white;*/
|
||||
width:320px;
|
||||
}
|
||||
.giantbutton{
|
||||
font-family: Verdana;
|
||||
color: white;
|
||||
background-color: dodgerblue;
|
||||
border: none;
|
||||
font-size: 12px;
|
||||
border-radius: 5px;
|
||||
padding: 10px 30px;
|
||||
}
|
||||
.textform{
|
||||
margin-bottom:24px;
|
||||
width:100%;
|
||||
height:24px;
|
||||
font-size: 32px;
|
||||
}
|
||||
.loginform label{
|
||||
font-weight:bold;
|
||||
display:block;
|
||||
padding-bottom:4px;
|
||||
}
|
43
login.html
Normal file
43
login.html
Normal file
@ -0,0 +1,43 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Movies</title>
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" href="joshua_style.css">
|
||||
<link rel="stylesheet" type="text/css" href="scott_style.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- Navigation -->
|
||||
<nav>
|
||||
<div class="topnav">
|
||||
<a class="title" href="movies.html">GMDB</a>
|
||||
<a class="links" href="movies.html">Movies</a>
|
||||
<a class="links" href="login.html">Login</a>
|
||||
<div class="topnav-right">
|
||||
<form class="submit" action="#">
|
||||
<input class="submit-bar" type="text" placeholder="Search" name="search">
|
||||
<button type="submit"><i class="fa fa-search"></i>Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Page Content -->
|
||||
<div class="container">
|
||||
<div class="loginform">
|
||||
<form method="post" action="login.html">
|
||||
<label for="email">Email:</label>
|
||||
<input class="textform" type="text" name="email" id="email">
|
||||
<label for="password">Password:</label>
|
||||
<input class="textform" type="password" name="password" id="password">
|
||||
<input class="giantbutton" type="submit" value="Login">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- JS -->
|
||||
<script src=""></script>
|
||||
</body>
|
||||
</html>
|
52
movies.html
Normal file
52
movies.html
Normal file
@ -0,0 +1,52 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Movies</title>
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" type="text/css" href="scott_style.css">
|
||||
<link rel="stylesheet" href="joshua_style.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- Navigation -->
|
||||
<nav>
|
||||
<div class="topnav">
|
||||
<a class="title" href="movies.html">GMDB</a>
|
||||
<a class="links" href="movies.html">Movies</a>
|
||||
<a class="links" href="login.html">Login</a>
|
||||
<div class="topnav-right">
|
||||
<form class="submit" action="#">
|
||||
<input class="submit-bar" type="text" placeholder="Search" name="search">
|
||||
<button type="submit"><i class="fa fa-search"></i>Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Page Content -->
|
||||
<div class="alert">
|
||||
<a class="alert" href="#">Back to results</a>
|
||||
</div>
|
||||
<div class="movie-container">
|
||||
<div class="movie">
|
||||
<a href="movies/blackwidow.html">
|
||||
<img class="border" src="images/blackwidow.jpg" width="100%">
|
||||
</a>
|
||||
</div>
|
||||
<div class="movie">
|
||||
<a href="movies/tenet.html">
|
||||
<img class="border" src="images/tenet.jpg" width="100%">
|
||||
</a>
|
||||
</div>
|
||||
<div class="movie">
|
||||
<a href="movies/ww84.html">
|
||||
<img class="border" src="images/ww84.jpg" width="100%">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- JS -->
|
||||
<script src=""></script>
|
||||
</body>
|
||||
</html>
|
59
movies/blackwidow.html
Normal file
59
movies/blackwidow.html
Normal file
@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Movies</title>
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" href="../joshua_style.css">
|
||||
<link rel="stylesheet" href="../scott_style.css">
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navigation -->
|
||||
<nav>
|
||||
<div class="topnav">
|
||||
<a class="title" href="../movies.html">GMDB</a>
|
||||
<a class="links" href="../movies.html">Movies</a>
|
||||
<a class="links" href="../login.html">Login</a>
|
||||
<div class="topnav-right">
|
||||
<form class="submit" action="#">
|
||||
<input class="submit-bar" type="text" placeholder="Search" name="search">
|
||||
<button type="submit"><i class="fa fa-search"></i>Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Page Content -->
|
||||
<div class="alert">
|
||||
<a class="alert" href="../movies.html">Back to results</a>
|
||||
</div>
|
||||
<div class="container">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="movielisting movie">
|
||||
<img class="border" src="../images/blackwidow.jpg" width="100%">
|
||||
</div>
|
||||
<h1>Black Widow</h1>
|
||||
<h3>Released April 24, 2020</h3>
|
||||
<p>Kevin Feige, Stan Lee, Eric Pearson, Jac Schaeffer, Ned Benson</p>
|
||||
<p>At birth the Black Widow (aka Natasha Romanova) is given to the KGB, which grooms her to become its ultimate operative. When the U.S.S.R. breaks up, the government tries to kill her as the action moves to present-day New York, where she is a freelance operative.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="container">
|
||||
<form action="." method="post">
|
||||
<label for="comment">
|
||||
Leave a comment:
|
||||
</label>
|
||||
<input type="text" name="comment" id="comment"><br><br>
|
||||
<input class= "giantbutton" type="submit" value="Submit">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- JS -->
|
||||
<script src=""></script>
|
||||
</body>
|
||||
</html>
|
59
movies/tenet.html
Normal file
59
movies/tenet.html
Normal file
@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Movies</title>
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" href="../joshua_style.css">
|
||||
<link rel="stylesheet" href="../scott_style.css">
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navigation -->
|
||||
<nav>
|
||||
<div class="topnav">
|
||||
<a class="title" href="../movies.html">GMDB</a>
|
||||
<a class="links" href="../movies.html">Movies</a>
|
||||
<a class="links" href="../login.html">Login</a>
|
||||
<div class="topnav-right">
|
||||
<form class="submit" action="#">
|
||||
<input class="submit-bar" type="text" placeholder="Search" name="search">
|
||||
<button type="submit"><i class="fa fa-search"></i>Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Page Content -->
|
||||
<div class="alert">
|
||||
<a class="alert" href="../movies.html">Back to results</a>
|
||||
</div>
|
||||
<div class="container">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="movielisting movie">
|
||||
<img class="border" src="../images/tenet.jpg" width="100%">
|
||||
</div>
|
||||
<h1>Tenet</h1>
|
||||
<h3>Released July 15, 2020</h3>
|
||||
<p>Christopher Nolan, Hoyte van Hoytema</p>
|
||||
<p>Tenet is an upcoming spy film written and directed by Christopher Nolan. It stars John David Washington, Robert Pattinson, Elizabeth Debicki, Dimple Kapadia, Michael Caine, and Kenneth Branagh.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="container">
|
||||
<form action="." method="post">
|
||||
<label for="comment">
|
||||
Leave a comment:
|
||||
</label>
|
||||
<input type="text" name="comment" id="comment"><br><br>
|
||||
<input class= "giantbutton" type="submit" value="Submit">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- JS -->
|
||||
<script src=""></script>
|
||||
</body>
|
||||
</html>
|
59
movies/ww84.html
Normal file
59
movies/ww84.html
Normal file
@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Movies</title>
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" href="../joshua_style.css">
|
||||
<link rel="stylesheet" href="../scott_style.css">
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navigation -->
|
||||
<nav>
|
||||
<div class="topnav">
|
||||
<a class="title" href="../movies.html">GMDB</a>
|
||||
<a class="links" href="../movies.html">Movies</a>
|
||||
<a class="links" href="../login.html">Login</a>
|
||||
<div class="topnav-right">
|
||||
<form class="submit" action="#">
|
||||
<input class="submit-bar" type="text" placeholder="Search" name="search">
|
||||
<button type="submit"><i class="fa fa-search"></i>Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Page Content -->
|
||||
<div class="alert">
|
||||
<a class="alert" href="../movies.html">Back to results</a>
|
||||
</div>
|
||||
<div class="container">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="movielisting movie">
|
||||
<img class="border" src="../images/ww84.jpg" width="100%">
|
||||
</div>
|
||||
<h1>Wonder Woman 1984</h1>
|
||||
<h3>Released August 12, 2020</h3>
|
||||
<p>Patty Jenkins, Gal Gadot, Patty Jenkins, Zack Snyder, Deborah Snyder, Charles Roven, Stephen Jones</p>
|
||||
<p>Wonder Woman squares off against the Cheetah, a villainess who possesses superhuman strength and agility.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="container">
|
||||
<form action="." method="post">
|
||||
<label for="comment">
|
||||
Leave a comment:
|
||||
</label>
|
||||
<input type="text" name="comment" id="comment"><br><br>
|
||||
<input class= "giantbutton" type="submit" value="Submit">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- JS -->
|
||||
<script src=""></script>
|
||||
</body>
|
||||
</html>
|
59
scott_style.css
Normal file
59
scott_style.css
Normal file
@ -0,0 +1,59 @@
|
||||
/* Add a black background color to the top navigation */
|
||||
.topnav {
|
||||
background-color: #333;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Style the links inside the navigation bar */
|
||||
.topnav .links {
|
||||
font-family: Verdana;
|
||||
float: left;
|
||||
color: #f2f2f2;
|
||||
text-align: center;
|
||||
padding: 16px 16px;
|
||||
text-decoration: none;
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-family: Verdana;
|
||||
float: left;
|
||||
color: #f2f2f2;
|
||||
text-align: center;
|
||||
padding: 14px 16px;
|
||||
text-decoration: none;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
/* Right-aligned section inside the top navigation */
|
||||
.topnav-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.topnav form {
|
||||
float: left;
|
||||
color: #f2f2f2;
|
||||
text-align: center;
|
||||
padding: 14px 16px;
|
||||
text-decoration: none;
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
.submit-bar {
|
||||
padding: 10px 30px;
|
||||
border-radius: 5px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
button {
|
||||
font-family: Verdana;
|
||||
color: #ff9800;
|
||||
background-color: #464646;;
|
||||
border: none;
|
||||
font-size: 12px;
|
||||
border: 1px solid #ff9800;
|
||||
border-radius: 5px;
|
||||
padding: 10px 30px;
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user