Skip to content
This repository was archived by the owner on Apr 19, 2025. It is now read-only.

Commit 911daa8

Browse files
JoshuaWierengaJoshuaWierenga
committed
Update website
See da8c65d.
1 parent 2a6748e commit 911daa8

File tree

6 files changed

+87
-73
lines changed

6 files changed

+87
-73
lines changed

‎about.html

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
<link rel="stylesheet" href="assets/style.css">
2626
</head>
2727
<body>
28-
<input id="dark-mode-toggle" type="checkbox" class="btn-check" name="dark-mode-toggle" hidden>
28+
<input type="checkbox" id="dark-mode-toggle" hidden>
2929
<div id="background" class="h-100 overflow-x-hidden bg-secondary-subtle">
3030
<div id="foreground" class="mx-auto my-4 pt-2 pb-1 px-3 bg-body border border-secondary">
3131
<header>
@@ -36,24 +36,24 @@
3636
<img height="64" class="pe-2" src="assets/icon.png" alt="Programming Club logo">
3737
</picture>
3838
<h1 class="me-auto">Programming Club</h1>
39-
<label class="btn btn-link mb-2 d-none d-sm-block" for="dark-mode-toggle" tabindex="0" onclick="ToggleDarkMode()" onkeydown="ToggleDarkMode()">
39+
<label for="dark-mode-toggle" class="btn btn-link mb-2 d-none d-sm-block" tabindex="0" onclick="ToggleDarkMode()" onkeydown="ToggleDarkMode()">
4040
<svg class="bi bg-warning light-mode-icon"><title>Sun icon</title></svg>
4141
<svg class="bi bg-white dark-mode-icon"><title>Moon icon</title></svg>
4242
</label>
4343
</div>
44-
<!-- TODO: Support toggling menu without js on mobile -->
4544
<!-- TODO: Decide if .navbar-expand-sm would be fine -->
46-
<nav class="navbar navbar-expand-md">
45+
<nav class="navbar navbar-expand-md" role="navigation">
4746
<div class="container-fluid ps-2 pe-0 pe-sm-2">
48-
<button type="button" class="navbar-toggler mt-2" data-bs-toggle="collapse" data-bs-target="#navbarPages" aria-controls="navbarPages" aria-expanded="false" aria-label="Toggle header navigation with pages">
47+
<input type="checkbox" id="nav-toggle" hidden>
48+
<label for="nav-toggle" class="navbar-toggler mt-2" tabindex="0" aria-haspopup="true" aria-controls="navbar-pages" aria-expanded="false" aria-label="Toggle header navigation with pages">
4949
<span class="navbar-toggler-icon"></span>
50-
</button>
51-
<label class="btn btn-link mt-2 d-block d-sm-none" for="dark-mode-toggle" tabindex="0" onclick="ToggleDarkMode()" onkeydown="ToggleDarkMode()">
50+
</label>
51+
<label for="dark-mode-toggle" class="btn btn-link mt-2 d-block d-sm-none" tabindex="0" onclick="ToggleDarkMode()" onkeydown="ToggleDarkMode()">
5252
<svg class="bi text-bg-warning light-mode-icon"><title>Sun icon</title></svg>
5353
<svg class="bi bg-white dark-mode-icon"><title>Moon icon</title></svg>
5454
</label>
55-
<div id="navbarPages" class="collapse navbar-collapse pt-3">
56-
<ul class="navbar-nav nav-justified w-100 mb-2 mb-md-0">
55+
<div id="navbar-pages" class="navbar-collapse overflow-hidden pt-3">
56+
<ul class="navbar-nav nav-justified w-100 mb-2 mb-md-0" aria-label="submenu">
5757
<li class="nav-item mb-2 px-2">
5858
<a class="nav-link pt-1" href="index.html">Home</a>
5959
</li>
@@ -79,11 +79,11 @@ <h2 class="title">About Us</h2>
7979
<p>To focus our learning and efforts, the Club runs various projects which members are encouraged to contribute to. See the projects page for more details. Our main aim is to push people to improve while keeping projects accessible for people with varying skill levels and abilities.</p>
8080
<p>If anyone has any questions for the Club, please send us a message via either Discord or <a href="mailto:%20contact@programmingclub.com.au">Email</a>.</p>
8181
<p><img src="https://programmingclub.com.au/assets/photos/weekly_meetup_cropped.jpg" title="A weekly meetup at the Sandy Bay Campus" class="img-fluid" alt="Club members in a large room with a big screen at a weekly meetup"></p>
82-
<h3 id="committee"><span>Committee</span><a class="ms-2" href="#committee"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h3>
82+
<h3 id="committee"><span>Committee</span><a class="ms-2" href="#committee"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h3>
8383
<p>The Club’s affairs are managed by the Committee.</p>
8484
<p>If you wish to contact a committee member via Discord, please do it via our server unless they give permission to do so privately. We would prefer if sensitive matters were handled via email.</p>
8585
<p>For the 2024-2025 Club year, the Committee is made up by the following people (preferred names, if any, are in brackets):</p>
86-
<h4 id="president"><span>President</span><a class="ms-2" href="#president"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h4>
86+
<h4 id="president"><span>President</span><a class="ms-2" href="#president"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h4>
8787
<p>The president is to act as the chairperson at meetings, and act as a spokesperson for the Club.<br>
8888
<strong>Officeholder:</strong> Kentaro Watts<br>
8989
Email: <a href="mailto:president@programmingclub.com.au" class="email">president@programmingclub.com.au</a><br>
@@ -92,7 +92,7 @@ <h4 id="president"><span>President</span><a class="ms-2" href="#president"><svg
9292
<source srcset="assets/Committee%20Kentaro.webp" type="image/webp">
9393
<img src="assets/Committee%20Kentaro.jpg" height="200" alt="Portrait of Kentaro Watts">
9494
</picture></p>
95-
<h4 id="treasurer"><span>Treasurer</span><a class="ms-2" href="#treasurer"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h4>
95+
<h4 id="treasurer"><span>Treasurer</span><a class="ms-2" href="#treasurer"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h4>
9696
<p>The Treasurer is responsible for overseeing the Club’s financial activities, keeping accurate records of funds and assets, and preparing and presenting budgets for new or ongoing projects.<br>
9797
<strong>Officeholder</strong>: Lachlan McKay<br>
9898
Email: <a href="mailto:treasurer@programmingclub.com.au" class="email">treasurer@programmingclub.com.au</a><br>
@@ -101,7 +101,7 @@ <h4 id="treasurer"><span>Treasurer</span><a class="ms-2" href="#treasurer"><svg
101101
<source srcset="assets/Committee%20Lachlan.webp" type="image/webp">
102102
<img src="assets/Committee%20Lachlan.jpg" height="200" alt="Portrait of Lachlan McKay">
103103
</picture></p>
104-
<h4 id="secretary"><span>Secretary</span><a class="ms-2" href="#secretary"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h4>
104+
<h4 id="secretary"><span>Secretary</span><a class="ms-2" href="#secretary"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h4>
105105
<p>The Secretary ensures meetings are effectively organised and minuted, maintains effective membership records, and documents the Club’s communication and correspondence.<br>
106106
<strong>Officeholder</strong>: Cameron Munro<br>
107107
Email: <a href="mailto:secretary@programmingclub.com.au" class="email">secretary@programmingclub.com.au</a><br>
@@ -110,7 +110,7 @@ <h4 id="secretary"><span>Secretary</span><a class="ms-2" href="#secretary"><svg
110110
<source srcset="assets/Committee%20Cameron.webp" type="image/webp">
111111
<img src="assets/Committee%20Cameron.jpg" height="200" alt="Portrait of Cameron Munro">
112112
</picture></p>
113-
<h4 id="southern-technical-support-officer"><span>Southern Technical Support Officer</span><a class="ms-2" href="#southern-technical-support-officer"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h4>
113+
<h4 id="southern-technical-support-officer"><span>Southern Technical Support Officer</span><a class="ms-2" href="#southern-technical-support-officer"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h4>
114114
<p>The Southern Technical Support Officer runs the Club’s projects and meetups, and help members with programming issues and learning to code, focusing on southern Tasmania.<br>
115115
<strong>Officeholder</strong>: Joshua Wierenga<br>
116116
Email: <a href="mailto:tech@programmingclub.com.au" class="email">tech@programmingclub.com.au</a>, this is subject to change<br>
@@ -119,7 +119,7 @@ <h4 id="southern-technical-support-officer"><span>Southern Technical Support Off
119119
<source srcset="assets/Committee%20Joshua.webp" type="image/webp">
120120
<img src="assets/Committee%20Joshua.jpg" height="200" alt="Portrait of Joshua Wierenga">
121121
</picture></p>
122-
<h4 id="marketing-officer"><span>Marketing Officer</span><a class="ms-2" href="#marketing-officer"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h4>
122+
<h4 id="marketing-officer"><span>Marketing Officer</span><a class="ms-2" href="#marketing-officer"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h4>
123123
<p>The Marketing Officer prepares and distributes advertising material, and tries to get members to attend the Club’s events.<br>
124124
<strong>Officeholder</strong>: Kat Carolan<br>
125125
Email: <a href="mailto:marketing@programmingclub.com.au" class="email">marketing@programmingclub.com.au</a><br>
@@ -129,19 +129,19 @@ <h4 id="marketing-officer"><span>Marketing Officer</span><a class="ms-2" href="#
129129
<img src="assets/Committee%20Kat.jpg" height="200" alt="Portrait of Kat Carolan">
130130
</picture></p>
131131
<!-- TODO: Get photo of Michael -->
132-
<h4 id="northern-technical-support-officer"><span>Northern Technical Support Officer</span><a class="ms-2" href="#northern-technical-support-officer"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h4>
132+
<h4 id="northern-technical-support-officer"><span>Northern Technical Support Officer</span><a class="ms-2" href="#northern-technical-support-officer"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h4>
133133
<p>The Northern Technical Support Officer runs the Club’s projects and meetups, and help members with programming issues and learning to code, focusing on northern Tasmania.<br>
134134
<strong>Officeholder</strong>: Michael Dacey<br>
135135
Email: Currently does not have a dedicated email, please just use <a href="mailto:contact@programmingclub.com.au" class="email">contact@programmingclub.com.au</a> for the now<br>
136136
<img height="200" src="https://upload.wikimedia.org/wikipedia/commons/6/65/No-Image-Placeholder.svg" alt="Placeholder image for portrait"></p>
137137
<!-- TODO: Get general member photos? -->
138-
<h4 id="general-members"><span>General Members</span><a class="ms-2" href="#general-members"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h4>
138+
<h4 id="general-members"><span>General Members</span><a class="ms-2" href="#general-members"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h4>
139139
<p>General Members have no specific responsibilies but are required to assist with the Club’s activities whenever necessary.</p>
140140
<ul>
141141
<li>Tran (Luke), Hau Duc</li>
142142
<li>Oliver Kulinski</li>
143143
</ul>
144-
<h4 id="unfilled-positions"><span>Unfilled positions</span><a class="ms-2" href="#unfilled-positions"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h4>
144+
<h4 id="unfilled-positions"><span>Unfilled positions</span><a class="ms-2" href="#unfilled-positions"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h4>
145145
<p><span class="list-heading">In addition to the positions listed above, we also have some that are currently unfilled:</span></p>
146146
<ul>
147147
<li>Northern and Southern Education Officers<br>
@@ -153,7 +153,7 @@ <h4 id="unfilled-positions"><span>Unfilled positions</span><a class="ms-2" href=
153153
<li>Two General Member positions</li>
154154
</ul>
155155
<p>Members are encouraged to contact us if they are at all interested in running for these positions as we would love some assistance.</p>
156-
<h3 id="constitution"><span>Constitution</span><a class="ms-2" href="#constitution"><svg class="bi heading-anchor-icon"><title>Link icon</title></svg></a></h3>
156+
<h3 id="constitution"><span>Constitution</span><a class="ms-2" href="#constitution"><svg class="heading-anchor-icon"><title>Link icon</title></svg></a></h3>
157157
<p>The Club is governed by a constitution which is included below:<br>
158158
<a href="assets/Programming%20Club%20Constitution.pdf">Link to fullsize copy</a>
159159
<embed src="assets/Programming%20Club%20Constitution.pdf" class="w-100 constitution" type="application/pdf"></p>

‎assets/style.css

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,19 @@ body, html {
2828
mask-image: url('data:image/svg+xml,<svg width="1em" height="1em" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M6 .278a.77.77 0 0 1 .08.858 7.2 7.2 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277q.792-.001 1.533-.16a.79.79 0 0 1 .81.316.73.73 0 0 1-.031.893A8.35 8.35 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.75.75 0 0 1 6 .278"/><path d="M10.794 3.148a.217.217 0 0 1 .412 0l.387 1.162c.173.518.579.924 1.097 1.097l1.162.387a.217.217 0 0 1 0 .412l-1.162.387a1.73 1.73 0 0 0-1.097 1.097l-.387 1.162a.217.217 0 0 1-.412 0l-.387-1.162A1.73 1.73 0 0 0 9.31 6.593l-1.162-.387a.217.217 0 0 1 0-.412l1.162-.387a1.73 1.73 0 0 0 1.097-1.097zM13.863.099a.145.145 0 0 1 .274 0l.258.774c.115.346.386.617.732.732l.774.258a.145.145 0 0 1 0 .274l-.774.258a1.16 1.16 0 0 0-.732.732l-.258.774a.145.145 0 0 1-.274 0l-.258-.774a1.16 1.16 0 0 0-.732-.732l-.774-.258a.145.145 0 0 1 0-.274l.774-.258c.346-.115.617-.386.732-.732z"/></svg>');
2929
}
3030

31+
#navbar-pages {
32+
display: block;
33+
overflow: hidden;
34+
max-height: 200px;
35+
transition: max-height 0.35s ease, padding-top 0.05s ease;
36+
}
37+
38+
#nav-toggle:not(:checked) ~ #navbar-pages {
39+
max-height: 0;
40+
padding-top: 0 !important;
41+
transition-delay: 0s, 0.30s;
42+
}
43+
3144
.nav-link {
3245
line-height: 1rem;
3346
padding-bottom: 0.05rem;
@@ -67,7 +80,6 @@ h6:hover .heading-anchor-icon
6780
}
6881
}
6982

70-
7183
/* Pandoc created in all pages */
7284
#title-block-header {
7385
margin-top: 1em;

0 commit comments

Comments
 (0)