jdownie/homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Starting to add some content.

Browse Source
This commit is contained in:
James Downie
2025-05-18 22:00:05 +10:00
parent 825a058bef
commit c57ab6f147
6 changed files with 72 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
index.html
View File

@@ -1,27 +1,81 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Homelab Brisbane</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
rel="stylesheet"
crossorigin="anonymous" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
crossorigin="anonymous" />
<style>
.card img {
max-height: 120px;
height: auto;
width: auto;
}
#about { float: right; font-size: 8pt; font-style: italic; }
</style>
</head>
<body>
<div class="container mt-5">
<h1 class="text-center">Hello, Bootstrap & jQuery!</h1>
<p class="text-center">This is a simple one-page HTML template.</p>
<div class="container">
<div class="p-5 mt-4 mb-4 bg-body-secondary rounded-3">
<div class="container-fluid py-5">
<h1 class="display-5 fw-bold">Homelab Brisbane</h1>
<p class="col-md-12 fs-4">Using a series of utilities, you can create this jumbotron, just like the one in previous versions of Bootstrap. Check out the examples below for how you can remix and restyle it to your liking.</p>
<a id="about" href="about.html">Learn more...</a>
</div>
</div>
<div class="row">
<div class="col">
<div class="card">
<div class="card-body">
<img src="image/icon/handshake.png" class="card-img-top" alt="...">
<h5 class="card-title">Meet In Person</h5>
This is some text within a card body.
</div>
</div>
</div>
<div class="col">
<div class="card">
<div class="card-body">
<img src="image/icon/webcam.png" class="card-img-top" alt="...">
<h5 class="card-title">Meet Online</h5>
This is some text within a card body.
</div>
</div>
</div>
<div class="col">
<div class="card">
<div class="card-body">
<img src="image/icon/chat.png" class="card-img-top" alt="...">
<h5 class="card-title">Online Forum</h5>
This is some text within a card body.
</div>
</div>
</div>
<div class="col">
<div class="card">
<div class="card-body">
<img src="image/icon/email.png" class="card-img-top" alt="...">
<h5 class="card-title">Contact Up</h5>
This is some text within a card body.
</div>
</div>
</div>
</div>
<div class="row mt-4">
<div class="col">
<iframe src="https://calendar.google.com/calendar/embed?src=5c588a442ef8884195b84068cd7e4d51717723ff65938e02417e39e69f29d0b8%40group.calendar.google.com&ctz=Australia%2FBrisbane" style="border: 0" width="100%" height="600" frameborder="0" scrolling="no"></iframe>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"
crossorigin="anonymous">
</script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
crossorigin="anonymous">
</script>
<script src="https://code.jquery.com/jquery-3.7.1.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
<script>
$(document).ready(function () {
});
</script>
</body>
</html>
</html>