Notoric
/
FEWD-CTEC3905
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
FEWD-CTEC3905/index.html

99 lines
7.4 KiB
HTML
Raw Permalink Normal View History

Initial commit
2024-02-04 16:29:54 +00:00
<!doctype html>
<html lang="en">
Changed background image to use colour selector
2024-02-19 20:42:24 +00:00
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>P2672045</title>
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<main>
Working desktop carousel
2024-02-23 23:56:16 +00:00
<div id="landing">
Changed background image to use colour selector
2024-02-19 20:42:24 +00:00
<div id="background"></div>
<div id="background-transition"></div>
<h1 id="titleBanner" class="black">Tom Cornes</h1>
<div id="colorSelector">
Background now changes on transition with colourpicker
2024-02-19 22:13:06 +00:00
<label for="bgColour">Background Color:</label>
<input id="bgColour" type="color" value="#ffffff">
Changed background image to use colour selector
2024-02-19 20:42:24 +00:00
</div>
</div>
Pokemon Popup w/ statblock
2024-04-15 16:21:08 +00:00
<div id="fullscreen"></div>
Added about and added hover effect for title
2024-03-08 17:40:37 +00:00
<div id="below-landing">
Added a feature to display a dynamic list of pokemon that you can filter by type and generation TODO: save current filters for page load, add popup page with info, make clickable cards, potential favourites system?
2024-03-19 02:39:47 +00:00
<section id="pokedex">
<h2>Pokedex</h2>
<form id="generation-selector"></form>
<div id="pokemon-container"></div>
Pokedex type chart
2024-04-16 20:38:04 +00:00
<div id="type-selector"></div>
<p>Select any creature to view its profile. You can use the top buttons to toggle creatures from different generations or use the bottom buttons to toggle creatures with a specific type.</p>
Added a feature to display a dynamic list of pokemon that you can filter by type and generation TODO: save current filters for page load, add popup page with info, make clickable cards, potential favourites system?
2024-03-19 02:39:47 +00:00
</section>
Nicely styled the first features section
2024-03-08 20:11:42 +00:00
<section id="features-intro" class="content-column features">
Replaced "about" with "features" and changed icons for carousel
2024-03-08 19:12:47 +00:00
<h2>Features</h2>
Added about and added hover effect for title
2024-03-08 17:40:37 +00:00
<p>
Replaced "about" with "features" and changed icons for carousel
2024-03-08 19:12:47 +00:00
This webpage has been designed to display a variety of different web development skills and features.
Added about and added hover effect for title
2024-03-08 17:40:37 +00:00
</p>
</section>
Replaced "about" with "features" and changed icons for carousel
2024-03-08 19:12:47 +00:00
Added about and added hover effect for title
2024-03-08 17:40:37 +00:00
<div id="carousel">
<div id="carousel-container">
<div class="carousel-item" id="carousel-1">
Replaced "about" with "features" and changed icons for carousel
2024-03-08 19:12:47 +00:00
<svg class="carousel-id" viewBox="-100 -50 450 450" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet" fill="#ffffff"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><path d="M255.555 70.766l-23.241 260.36-104.47 28.962-104.182-28.922L.445 70.766h255.11z" fill="#E44D26"></path><path d="M128 337.95l84.417-23.403 19.86-222.49H128V337.95z" fill="#F16529"></path><path d="M82.82 155.932H128v-31.937H47.917l.764 8.568 7.85 88.01H128v-31.937H85.739l-2.919-32.704zM90.018 236.542h-32.06l4.474 50.146 65.421 18.16.147-.04V271.58l-.14.037-35.568-9.604-2.274-25.471z" fill="#EBEBEB"></path><path d="M24.18 0h16.23v16.035h14.847V0h16.231v48.558h-16.23v-16.26H40.411v16.26h-16.23V0zM92.83 16.103H78.544V0h44.814v16.103h-14.295v32.455h-16.23V16.103h-.001zM130.47 0h16.923l10.41 17.062L168.203 0h16.93v48.558h-16.164V24.49l-11.166 17.265h-.28L146.35 24.49v24.068h-15.88V0zM193.21 0h16.235v32.508h22.824v16.05h-39.06V0z"></path><path d="M127.89 220.573h39.327l-3.708 41.42-35.62 9.614v33.226l65.473-18.145.48-5.396 7.506-84.08.779-8.576H127.89v31.937zM127.89 155.854v.078h77.143l.64-7.178 1.456-16.191.763-8.568H127.89v31.86z" fill="#FFF"></path></g></svg>
<p class="carousel-title">HTML</p>
Added about and added hover effect for title
2024-03-08 17:40:37 +00:00
</div>
<div class="carousel-item" id="carousel-2">
Replaced "about" with "features" and changed icons for carousel
2024-03-08 19:12:47 +00:00
<svg class="carousel-id" viewBox="-100 -50 450 450" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid" fill="#ffffff"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><path d="M127.844 360.088L23.662 331.166.445 70.766h255.11l-23.241 260.36-104.47 28.962z" fill="#264DE4"></path><path d="M212.417 314.547l19.86-222.49H128V337.95l84.417-23.403z" fill="#2965F1"></path><path d="M53.669 188.636l2.862 31.937H128v-31.937H53.669zM47.917 123.995l2.903 31.937H128v-31.937H47.917zM128 271.58l-.14.037-35.568-9.604-2.274-25.471h-32.06l4.474 50.146 65.421 18.16.147-.04V271.58z" fill="#EBEBEB"></path><path d="M60.484 0h38.68v16.176H76.66v16.176h22.506v16.175H60.484V0zM106.901 0h38.681v14.066h-22.505v2.813h22.505v32.352h-38.68V34.46h22.505v-2.813H106.9V0zM153.319 0H192v14.066h-22.505v2.813H192v32.352h-38.681V34.46h22.505v-2.813H153.32V0z"></path><path d="M202.127 188.636l5.765-64.641H127.89v31.937h45.002l-2.906 32.704H127.89v31.937h39.327l-3.708 41.42-35.62 9.614v33.226l65.473-18.145.48-5.396 7.506-84.08.779-8.576z" fill="#FFF"></path></g></svg>
<p class="carousel-title">CSS</p>
Added about and added hover effect for title
2024-03-08 17:40:37 +00:00
</div>
<div class="carousel-item" id="carousel-3">
Replaced "about" with "features" and changed icons for carousel
2024-03-08 19:12:47 +00:00
<svg class="carousel-id" viewBox="-0 -0 250 250" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet" fill="#000000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><path d="M0 0h256v256H0V0z" fill="#F7DF1E"></path><path d="M67.312 213.932l19.59-11.856c3.78 6.701 7.218 12.371 15.465 12.371 7.905 0 12.89-3.092 12.89-15.12v-81.798h24.057v82.138c0 24.917-14.606 36.259-35.916 36.259-19.245 0-30.416-9.967-36.087-21.996M152.381 211.354l19.588-11.341c5.157 8.421 11.859 14.607 23.715 14.607 9.969 0 16.325-4.984 16.325-11.858 0-8.248-6.53-11.17-17.528-15.98l-6.013-2.58c-17.357-7.387-28.87-16.667-28.87-36.257 0-18.044 13.747-31.792 35.228-31.792 15.294 0 26.292 5.328 34.196 19.247L210.29 147.43c-4.125-7.389-8.591-10.31-15.465-10.31-7.046 0-11.514 4.468-11.514 10.31 0 7.217 4.468 10.14 14.778 14.608l6.014 2.577c20.45 8.765 31.963 17.7 31.963 37.804 0 21.654-17.012 33.51-39.867 33.51-22.339 0-36.774-10.654-43.819-24.574"></path></g></svg>
<p class="carousel-title">Javascript</p>
Added about and added hover effect for title
2024-03-08 17:40:37 +00:00
</div>
Working desktop carousel
2024-02-23 23:56:16 +00:00
</div>
</div>
Nicely styled the first features section
2024-03-08 20:11:42 +00:00
<section id="feature-showcase-1" class="content-column features">
<h2 id="table-heading" class="content-column">A Few Features</h2>
<div class="feature-showcase">
added a background color and some underlines
2024-03-09 17:08:09 +00:00
<div class="feature-showcase-item" id="interactive-ui">
<h3>Interactive UI</h3>
Nicely styled the first features section
2024-03-08 20:11:42 +00:00
<p>
changed punctuation and pushed unsaved changes
2024-03-08 20:14:25 +00:00
This website has been designed to provide satisfying user feedback. From using javscript to expand the carousel, to using css to change the shape of the title on the landing page; the website has been designed to provide an outstanding user experience.
Nicely styled the first features section
2024-03-08 20:11:42 +00:00
</p>
</div>
added a background color and some underlines
2024-03-09 17:08:09 +00:00
<div class="feature-showcase-item" id="responsive-design">
<h3>Responsive Design</h3>
Nicely styled the first features section
2024-03-08 20:11:42 +00:00
<p>
The website has been designed to support a variety of different devices and aspect ratios. The website will adapt to the size of the window and display the content in a way that is easy to read and navigate.
</p>
</div>
<div class="feature-showcase-item" id="user-input">
<h3>User Input</h3>
<p>
The website has been designed to allow the user to interact with the website. This includes the ability to change the background color of the website.
</p>
</div>
<div class="feature-showcase-item" id="modern-css">
<h3>Modern CSS</h3>
<p>
The website has been designed to use modern css features such as the flex layout and grids to provide a visually appealing layout.
</p>
</div>
</div>
</section>
<!--
<section id="feature-showcase-2" class="content-column">
<div class="feature-showcase-item" id="animation"></div>
<div class="feature-showcase-item" id="api-useage"></div>
<div class="feature-showcase-item" id="browser-data"></div>
<div class="feature-showcase-item" id="great-website"></div>
</section>
Working desktop carousel
2024-02-23 23:56:16 +00:00
</div>
Nicely styled the first features section
2024-03-08 20:11:42 +00:00
-->
Changed background image to use colour selector
2024-02-19 20:42:24 +00:00
</main>
Set a title and background image with some effects
2024-02-08 17:21:26 +00:00
<script src="js/scripts.js"></script>
Changed background image to use colour selector
2024-02-19 20:42:24 +00:00
</body>
Initial commit
2024-02-04 16:29:54 +00:00
</html>