diff options
| author | yuzu-eva <stevenhu@web.de> | 2023-03-20 15:02:41 +0100 |
|---|---|---|
| committer | yuzu-eva <stevenhu@web.de> | 2023-03-20 15:02:41 +0100 |
| commit | 6d919f453fd39a96f3999f5249aa3a17fe5740d6 (patch) | |
| tree | a1594b18f35ffbfd1aee7c62a4bca9f05cea5182 | |
| parent | bc7eb37e99fb1449baef62a981e3c6e9fe50208c (diff) | |
odin project links and images
| -rw-r--r-- | images/dog.jpg | bin | 0 -> 1021417 bytes | |||
| -rw-r--r-- | index.html | 55 | ||||
| -rw-r--r-- | static/about.html | 35 | ||||
| -rw-r--r-- | static/style.css | 54 | ||||
| -rw-r--r-- | styles/style.css | 8 |
5 files changed, 141 insertions, 11 deletions
diff --git a/images/dog.jpg b/images/dog.jpg Binary files differnew file mode 100644 index 0000000..a236a64 --- /dev/null +++ b/images/dog.jpg @@ -5,13 +5,62 @@ <title>yuzu-eva's odin project</title> <meta charset="UTF-8"> <meta name="viewport" content="width=devide-width,initial-scale=1"> - <link rel="stylesheet" href="styles/style.css"> + <link rel="stylesheet" href="static/style.css"> </head> <body> - <div> + <header> + <nav> + <ul> + <li> + <a href="index.html">Home</a> + </li> + <li> + <a href="static/about.html">About</a> + </li> + </ul> + </nav> + <h1>Hello, World!</h1> - </div> + <p>... and everyone in it.</p> + <a href="https://wiby.me/surprise">Link to a random website</a> + </header> + + <main> + <div id="lists"> + <h3>favourite foods:</h3> + <ul> + <li>steak</li> + <li>cheese</li> + <li>rice</li> + <li>tortillas</li> + <li>salmon</li> + </ul> + + <br> + + <h3>todo list:</h3> + <ol> + <li>Finish Part 1 of Odin Project</li> + <li>Cook something with leftover rice</li> + <li>Read some more One Piece</li> + </ol> + + <br> + + <h3>favourite video games:</h3> + <ol> + <li>Monster Hunter 4 Ultimate</li> + <li>Fallout: New Vegas</li> + <li>Final Fantasy X</li> + <li>The Legend of Zelda: Majora's Mask</li> + <li>The Binding of Isaac</li> + </ol> + </div> + <div id="img-wrapper"> + <img src="./images/dog.jpg" alt="This is a cute picture of a dog"> + </div> + </main> </body> <script src=""></script> diff --git a/static/about.html b/static/about.html new file mode 100644 index 0000000..a7d2cff --- /dev/null +++ b/static/about.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang="en-US"> + +<head> + <title>Website About</title> + <meta charset="UTF-8"> + <meta name="viewport" content="width=devide-width,initial-scale=1"> + <link rel="stylesheet" href="style.css"> +</head> + +<body> + <header> + <nav> + <ul> + <li> + <a href="../index.html">Home</a> + </li> + <li> + <a href="about.html">About</a> + </li> + </ul> + </nav> + <h1>About this Website</h1> + + <p> + This website will contain all projects related to The + Odin Project online course. + </p> + </header> + <main> + </main> +</body> +<script src=""></script> + +</html> diff --git a/static/style.css b/static/style.css new file mode 100644 index 0000000..032e2ce --- /dev/null +++ b/static/style.css @@ -0,0 +1,54 @@ +html { + background: black; + font-family: 'Open Sans', sans-serif; +} + +body { + color: white; +} + +header { + text-align: center; +} + +main { + padding-top: 2%; +} + +nav ul li a { + color: #f1f3f3; + font-size: smaller; +} + +nav ul { + margin: 0; + padding: 0; +} + +nav li { + display: inline-block; + list-style-type: none; +} + +nav a { + text-decoration: none; + display: block; + padding: 5px 6px 5px 6px; + color: black; +} + +#lists { + float: left; + padding-left: 10%; + max-width: 70%; +} + +#img-wrapper { + float: right; + padding-right: 10%; + max-width: 30%; +} + +img { + max-height: 500px; +} diff --git a/styles/style.css b/styles/style.css deleted file mode 100644 index 4ea6483..0000000 --- a/styles/style.css +++ /dev/null @@ -1,8 +0,0 @@ -html { - background: black; - font-family: 'Open Sans', sans-serif; -} - -body { - color: white; -} |
