CCF_100/ASDV-WebDev
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

MP06

Browse Source
This commit is contained in:
Chloe Fontenot 🏳️‍⚧️
2023-03-02 19:15:32 -06:00
parent ba26741f42
commit 21e337e635
11 changed files with 348 additions and 181 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
Assignments/MP06_CalebFontenot/public_html/activities.html
View File

@@ -10,7 +10,7 @@ Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/html.html to edit this
<link href="pacific.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<div class="wrapper">
<div id="wrapper">
<body>
<header> <h1><a id="headerlink" href=index.html>Pacific Trails Resort</a></h1> </header>
<nav>

4
Assignments/MP06_CalebFontenot/public_html/index.html
View File

@@ -3,14 +3,14 @@
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/Other/html.html to edit this template
-->
<html>
<head>
<title>Pacific Trail Resort</title>
<meta charset="UTF-8">
<link href="pacific.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<div class="wrapper">
<div id="wrapper">
<header>
<h1><a id="headerlink" href=index.html>Pacific Trails Resort</a></h1>
</header>

155
Assignments/MP06_CalebFontenot/public_html/pacific.css
View File

@@ -7,54 +7,41 @@ Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/css.css to edit this t
Author : caleb
*/
* {
box-sizing: border-box;
box-sizing: border-box;
}
body {
background-color: #EAEAEA;
color: #555555;
font-family: Arial, Helvetica, sans-serif;
}
.wrapper {
//background-color: #90C7E3;
//width: 80%;
//background-image: linear-gradient(to bottom, #FFFFFF, #90C7E3);
//min-width: 960px;
//max-width: 2048px;
//box-shadow: 1px 1px 1px #000033;
//margin-left: auto;
//margin-right: auto;
}
#headerlink {
color: white;
text-decoration: none;
}
header {
background-color: #002171;
line-height: 120px;
padding-top: 30px;
padding-left: 3em;
color: #FFFFFF;
text-align: center;
background-repeat: no-repeat;
background-position: right;
}
nav {
//float: left;
//width: 160px;
font-weight: bold;
padding: 0;
font-size: 120%;
float: left;
width: 160px;
font-weight: bold;
text-decoration: none;
padding: 0;
text-align: center;
//text-decoration: none;
}
nav ul {
list-style-type: none;
margin: 0;
padding: 0;
padding-left: 0;
font-size: 1.2em;
}
nav li {
border-bottom: 1px solid darkblue;
}
nav a:link, a:visited {
color: #344873;
}
@@ -65,17 +52,20 @@ header a:link a:visited {
text-decoration: none;
color: #FFFFFF;
}
main {
padding-top: 1px;
padding-right: 20px;
padding-left: 20px;
padding: 1px 20px 20px 30px;
display: block;
overflow: auto;
background-color: #FFFFFF;
width: 100%;
}
h1{
margin-bottom: 0;
font-family: Georgia, "Times New Roman", sans-serif;
font-size: 3em;
//font-size: 3em;
padding-bottom: 0.5em;
letter-spacing: 0.25em;
}
h2 {
@@ -90,9 +80,6 @@ h3 {
dt {
color: #002171;
}
ul {
list-style-image: url('images/marker.gif');
}
footer {
font-size: 75%;
font-style: italic;
@@ -100,20 +87,22 @@ footer {
text-align: center;
padding: 2em;
}
.resort {
color: #1976D2;
font-weight: bold;
}
.contact {
font-size: 90%;
}
img {
height: 100%;
width: 100%;
}
// Classes and ids
.resort {
color: #1976D2;
font-weight: bold;
}
#contact { font-size: 90%}
#homehero {
height: 300px;
margin-left: 190px;
//margin-left: 190px;
background-image: url("images/coast2.jpg");
background-repeat: no-repeat;
background-size: 100% 100%;
@@ -123,24 +112,90 @@ img {
background-image: url("images/yurt.jpg");
background-repeat: no-repeat;
background-size: 100% 100%;
margin-left: 190px;
//margin-left: 190px;
}
#trailhero {
height: 300px;
background-image: url("images/trail.jpg");
background-repeat: no-repeat;
background-size: 100% 100%;
margin-left: 190px;
//margin-left: 190px;
}
#body {
background-color: #FFFFFF;
margin-left: 190px;
//margin-left: 190px;
width: auto;
}
table {
border: 0px;
#wrapper {
background-color: #90C7E3;
//width: 80%;
background-image: linear-gradient(to bottom, #FFFFFF, #90C7E3);
//min-width: 960px;
//max-width: 2048px;
//box-shadow: 1px 1px 1px #000033;
//margin-left: auto;
//margin-right: auto;
}
#headerlink {
color: white;
text-decoration: none;
}
table {
border: 0px;
}
nav li {
box-shadow: 1px 1px 1px blue;
font-size: 0.5em;
//font-size: 0.5em;
}
// Medium Styles
@media (min-width: 600px) {
nav ul {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-around;
}
nav li {
boarder-bottom: none;
}
section {
margin-left: 2em;
margin-right: 2em;
flex: 1;
}
.flow {
display: flex;
flex-direction: row;
}
}
@media (min-width: 1024px) {
#wrapper {
margin: auto;
width: 80%;
border: 1px solid #002171;
box-shadow: 3px 3px 3px #002171;
}
nav { text-align: left;
padding-left: 1em;
}
@supports (display: grid)
nav ul {flex-direction: column;
padding-top: 1em;}
.hero { grid-area: hero;}
header { grid-area: header;}
nav { grid-area: nav;}
main { grid-area: main;}
footer { grid-area: footer; }
#wrapper { display: grid;
grid-template: "header header"
"nav hero"
"nav main"
"nav footer"
/ 180px 1fr;
}
}

44
Assignments/MP06_CalebFontenot/public_html/yurts.html
View File

@@ -10,7 +10,7 @@ Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/html.html to edit this
<link href="pacific.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<div class="wrapper">
<div id="wrapper">
<body>
<header> <h1><a id="headerlink" href=index.html>Pacific Trails Resort</a></h1> </header>
<nav>
@@ -24,33 +24,33 @@ Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/html.html to edit this
<div id="yurthero">
</div>
<div id="body">
<div class="flow">
<main><h2>The Yurts at Pacific Trails</h2></main>
<table>
<tr>
<td>
<dt><strong>What is a yurt?</strong></dt>
<dd>Our luxury yurts are permanent structures four feet off the ground.
Each Yurt is fully enclosed with canvas walls, a wooden floor, and a roof dome that can be opened.</dd>
</td>
<td>
<dt><strong>How are the yurts furnished?</strong></dt>
<dd>Each yurt is furnished with a queen-size bed with down quilt and gas-fired stove. Your luxury camping experience
<section>
<h3><strong>What is a yurt?</strong></h3>
<p>Our luxury yurts are permanent structures four feet off the ground.
Each Yurt is fully enclosed with canvas walls, a wooden floor, and a roof dome that can be opened.</p>
</section>
<section>
<h3><strong>How are the yurts furnished?</strong></h3>
<p>Each yurt is furnished with a queen-size bed with down quilt and gas-fired stove. Your luxury camping experience
includes electricity and a sink with hot and cold running water. Shower and restroom facilities are located in the
lodge. </dd>
</td>
<td>
<dt><strong>What should I bring?</strong></dt>
<dd>Most guest pack comfortable walking shoes and plan to dress for changing weather with light layers of clothing.
It's also helpful to bring a flashlight and a sense of adventure! </dd>
</td>
</tr>
</table>
lodge. </p>
</section>
<section>
<h3><strong>What should I bring?</strong></h3>
<p>Most guest pack comfortable walking shoes and plan to dress for changing weather with light layers of clothing.
It's also helpful to bring a flashlight and a sense of adventure! </p>
<section>
</div>
</body>
<footer>
<div id="contact">
<footer>
<small><i>Copyright &copy; 2023 Pacific Trails Resort</i></small>
<br>
<a href="mailto:caleb@fontenot.com"> caleb@fontenot.com</a>&nbsp;
</footer>
</footer>
</div>
</div>
</div>
</html>