mirror of
https://github.com/runyanjake/jakeswestcoast.git
synced 2025-10-04 23:37:29 -07:00
Edit html, without adding greyscale gif.
This commit is contained in:
parent
54da50c003
commit
8340b6a269
@ -1,2 +1,4 @@
|
|||||||
# jakeswestcoast
|
# jakeswestcoast
|
||||||
Website HTML for www.jakeswestcoast.com.
|
Website HTML for www.jakeswestcoast.com.
|
||||||
|
</br>
|
||||||
|
Note: `data/greyscale_banner.gif` is too large for Github. Gonna have to store it on egn.
|
||||||
|
|||||||
90
css/index.css
Normal file
90
css/index.css
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
/****************************************************
|
||||||
|
* index.css
|
||||||
|
* @author Jake Runyan
|
||||||
|
* @desc The CSS portion of / for the website.
|
||||||
|
*//*************************************************/
|
||||||
|
|
||||||
|
html {
|
||||||
|
min-height: 100px;
|
||||||
|
min-width: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.page-background {
|
||||||
|
background-color: red;
|
||||||
|
width:100px;
|
||||||
|
}
|
||||||
|
div.page-header {
|
||||||
|
background-color: orange;
|
||||||
|
}
|
||||||
|
div.page-main {
|
||||||
|
background-color: yellow;
|
||||||
|
}
|
||||||
|
div.page-secondary {
|
||||||
|
background-color: green;
|
||||||
|
}
|
||||||
|
div.page-bottom {
|
||||||
|
background-color: blue;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-background-1 {
|
||||||
|
background-image: url('../data/greyscale_banner.gif');
|
||||||
|
min-height: 1000px;
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-background-2 {
|
||||||
|
background-image: url('../data/rlfloss.gif');
|
||||||
|
min-height: 500px;
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.aboutme {
|
||||||
|
height: inherit;
|
||||||
|
width: inherit;
|
||||||
|
background-color: aquamarine;
|
||||||
|
height: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.photoframe {
|
||||||
|
height: 90%;
|
||||||
|
position: relative;
|
||||||
|
left: 5%;
|
||||||
|
right: 5%;
|
||||||
|
top: 5%;
|
||||||
|
bottom: 5%;
|
||||||
|
background-color: cyan;
|
||||||
|
}
|
||||||
|
|
||||||
|
img.myphoto {
|
||||||
|
padding-top: 50%;
|
||||||
|
margin:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.mybio {
|
||||||
|
height: 90%;
|
||||||
|
position: relative;
|
||||||
|
left: 5%;
|
||||||
|
right: 5%;
|
||||||
|
top: 5%;
|
||||||
|
bottom: 5%;
|
||||||
|
background-color: brown;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.blog {
|
||||||
|
background-color: rgb(127, 255, 144);
|
||||||
|
height: 4000px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.hover {
|
||||||
|
color: hotpink;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.link {
|
||||||
|
padding-left: 2%;
|
||||||
|
}
|
||||||
BIN
data/jake.jpg
Normal file
BIN
data/jake.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
35
index.html
35
index.html
@ -1,6 +1,37 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<header><title>Jake's West Coast</title></header>
|
<head>
|
||||||
|
<title>Jake's West Coast</title>
|
||||||
|
<link rel="stylesheet" href="css/index.css">
|
||||||
|
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
</head>
|
||||||
<body>
|
<body>
|
||||||
Jakeswestcoast root page.
|
<div class="main-background-1 w3-display-container w3-opacity-min">
|
||||||
|
<div class="w3-display-middle w3-padding-large w3-border w3-wide w3-text-light-grey w3-center" style="white-space:nowrap;">
|
||||||
|
<h1 class="w3-hide-medium w3-hide-small w3-xxxlarge" style="font-weight:bolder;">Jake's West Coast</h1>
|
||||||
|
<h3 class="w3-hide-medium w3-hide-small" style="font-weight:bolder;">My Mountaineering Diary!</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="w3-black" id="about">
|
||||||
|
<div class="w3-container w3-content w3-padding-64" style="max-width:800px">
|
||||||
|
<h2 class="w3-wide w3-center">Who Am I?</h2>
|
||||||
|
<div class="w3-row-padding w3-padding-32 w3-light-grey w3-round-large" style="margin:0 -16px">
|
||||||
|
<div class="w3-third w3-margin-bottom">
|
||||||
|
<img src="data/jake.jpg" style="width:100%" class="w3-hover-opacity w3-round-large">
|
||||||
|
</div>
|
||||||
|
<div class="w3-twothird w3-margin-bottom">
|
||||||
|
<div class="w3-container w3-light-grey w3-round-large">
|
||||||
|
<p>I'm Jake, a rider from the Bay Area. I enjoy being in the mountains and riding new trails! Catch me riding in the Santa Cruz mountains on the weekend. </p>
|
||||||
|
<p>Check out my social media and Youtube to see what I've been riding! Links are below. </p>
|
||||||
|
<button class="w3-round-large w3-button w3-black w3-margin-bottom fa fa-youtube" onclick=" window.open('https://www.youtube.com/channel/UCRuRbPZ67qkJvGyxbNUHj4w');"></button>
|
||||||
|
<button class="w3-round-large w3-button w3-black w3-margin-bottom fa fa-instagram" onclick=" window.open('https://www.instagram.com/jakeswestcoast/');"></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user