Show sourcecode
The following files exists in this folder. Click to view.
public_html/gamla-kurser/webbutv1/projekt/backup/MemoRing/pages/store/
index.html
84 lines ASCII Windows (CRLF)
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MEMORING - STORE</title>
<link rel="icon" href="../../bilder/logo.png">
<link rel="stylesheet" href="../../css/css_index.css" />
<link rel="stylesheet" href="./store.css">
</head>
<body>
<!-- Navigation Bar -->
<div class="navbar" id="navbar">
<a href="../../index.html" class="navbar-logo">
<h1 class="navbar-title">MEMORING</h1>
</a>
<div class="navbar-tabs">
<a href="../store/index.html">Store</a>
<a href="../gallery/index.html">Gallery</a>
<a href="../aboutus/index.html">About us</a>
<a href="../events/index.html">Events</a>
</div>
<div class="order-button-pos">
<button id="order-button">Order Now</button>
</div>
</div>
<!-- Scroll Function -->
<script>
window.onscroll = function () { scrollFunction() };
function scrollFunction() {
var navbar = document.getElementById("navbar");
if (document.body.scrollTop > 80 || document.documentElement.scrollTop > 80) {
navbar.classList.add("shrink");
} else {
navbar.classList.remove("shrink");
}
}
</script>
<script src="../../js/vanilla-tilt.js"></script>
<!-- Main Content -->
<h1 id="product-title">Your Ring. <span style="color: gray;">Your Color.</span></h1>
<div class="maindiv">
<div class="card" data-tilt style="--clr: #ffffff;"><img src="./bilder/titanium.png" alt="titanium">
<h3>Titanium</h3>
<h3>$499</h3>
</div>
<div class="card" style="--clr: #ffffff;"><img src="./bilder/rosegold.png" alt="rosegold">
<h3>Rose</h3>
<h3>$449</h3>
</div>
<div class="card" style="--clr: #ffffff;"><img src="./bilder/gold.png" alt="gold">
<h3>Gold</h3>
<h3>$499</h3>
</div>
<div class="card" style="--clr: #ffffff;"><img src="./bilder/black.png" alt="black">
<h3>Black (LE)</h3>
<h3>$599</h3>
</div>
</div>
<script>
document.querySelectorAll('.card').forEach(item =>
{
item.onmousemove = e => {
item.style.setProperty('--x', (e.pageX -
item.offsetLeft) + 'px');
item.style.setProperty('--y', (e.pageY -
item.offsetTop) + 'px');
}
});
</script>
<footer class="footer">
<p>Contact:<br><a href="mailto: lovhol23@varmdogymnasium.se">Email</a><br><a
href="https://en.wikipedia.org/wiki/Pigeon_post">Pigeon Post</a></p>
<p>Address: <br>308 Negra Arroyo Lane</p>
</footer>
</body>
</html>