f898c53b17
Enhance generator gallery by displaying the time difference since the last update in the footer by each card. This information is obtained from the GitHub API for the specified folders.
66 lines
2.7 KiB
HTML
66 lines
2.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Generators</title>
|
|
<link rel="icon" href="./images/lifeadventurer.jpg">
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
|
|
<script src="https://unpkg.com/vue@3.3.8/dist/vue.global.js"></script>
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
|
|
<link rel="stylesheet" href="./styles.css">
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<!-- <hgroup> -->
|
|
<h1>Generators</h1>
|
|
<!-- </hgroup> -->
|
|
</header>
|
|
<!-- <nav class="navbar">
|
|
<ul class="navbar-nav">
|
|
<li><a href="./fortune_generator">Fortune Generator</a></li>
|
|
<li><a href="./quote_generator/">Quote Generator</a></li>
|
|
</ul>
|
|
</nav> -->
|
|
<section>
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="card mb-3 bg-dark text-white border-0">
|
|
<img class="card-img-top" src="./images/fortune_generator_example.png" alt="fortune generator example">
|
|
<!-- <video src="#" autoplay></video> -->
|
|
<div class="card-body">
|
|
<h4 class="card-title">Fortune Generator</h4>
|
|
<p class="card-text">Get your daily fortune with just a click.</p>
|
|
<a href="./fortune_generator/" class="btn btn-secondary">Check this out</a>
|
|
</div>
|
|
<div class="card-footer">
|
|
<div id="last-update-1"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="card mb-3 bg-dark text-white border-0">
|
|
<img class="card-img-top" src="./images/quote_generator_example_(2).png" alt="quote generator example">
|
|
<!-- <video src="#" autoplay></video> -->
|
|
<div class="card-body">
|
|
<h4 class="card-title">Quote Generator</h4>
|
|
<p class="card-text">Generate inspiring and thought-provoking quotes effortlessly.</p>
|
|
<a href="./quote_generator/" class="btn btn-secondary">Check this out</a>
|
|
</div>
|
|
<div class="card-footer">
|
|
<div id="last-update-2"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<footer>
|
|
<div class="row text-muted py-3 me-3 float-end" style="text-align: right;">
|
|
<h5>made by <b>LifeAdventurer</b> <img src="./images/lifeadventurer.jpg" alt="footer image" style="width: 4%;"></h5>
|
|
</div>
|
|
</footer>
|
|
<script src="./scripts.js"></script>
|
|
</body>
|
|
</html> |