club-mate: update resource references
Hunter
Thursday, July 24th, 2025 at 7:41 PM
4 <style>
5 @font-face {
6 font-family: 'tribeca';
- src: url('pages/club-mate/resources/tribeca.woff2');
7 + src: url('https://hunterirving.github.io/web_workshop/pages/club-mate/resources/tribeca.woff2');
8 }
9 html {
10 scrollbar-color: #c68e17 #f7c200;
103 <body class="centered">
104 <div class="inner-div">
105 <div class="centered" style="max-width:100%">
- <img class="header-bottle" src="pages/club-mate/images/cm_bottle_photo.png">
- <img class="header-logo" src="pages/club-mate/images/hunters_club-mate_fan_club.svg">
- <img class="header-bottle" src="pages/club-mate/images/cm_bottle_photo.png">
106 + <img class="header-bottle" src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/cm_bottle_photo.png">
107 + <img class="header-logo" src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/hunters_club-mate_fan_club.svg">
108 + <img class="header-bottle" src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/cm_bottle_photo.png">
109 </div>
110 <hr>
111 <div class="centered gaucho-section">
- <img src="pages/club-mate/images/gaucho.svg">
112 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/gaucho.svg">
113 <blockquote class="centered">Cheers! And welcome to my online shrine to the celebrated German energy drink, Club-Mate. Have a maté, mate!</blockquote>
114 </div>
115 <div>
122 something of a barrier to entry.
123 </p>
124 <p>
- <img src="pages/club-mate/images/first_sip.png" class="inline-bottle" style="max-width:110px">
125 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/first_sip.png" class="inline-bottle" style="max-width:110px">
126 Varying first-taste reviews have compared the drink's earthy
127 essence to hay, herbal tea, and even an ashtray, but, as the drink's official slogan
128 promises, <i>"man gewöhnt sich daran"</i> (one gets used to it). If you find yourself struggling,
140 Especially if you're pregnant or breastfeeding:
141 </p>
142 <div class="centered">
- <img src="pages/club-mate/images/warning.jpg" style="width:400px; max-width:100%; padding-bottom: 10px;">
143 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/warning.jpg" style="width:400px; max-width:100%; padding-bottom: 10px;">
144 </div>
145 <p>
146 I don't think I've ever seen a beverage
158 hacker.
159 </p>
160 <div class="centered">
- <img src="pages/club-mate/images/di.jpg">
161 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/di.jpg">
162 </div>
163 <center class="image-caption">My friend Di on her way to the club, despite a broken leg.<br>That's the power of Club-Mate.</center>
164 <p>
173 <i>Buy at least one pallet of Club-Mate and sell it in your hackerspace. You will realize the results very soon!</i>
174 </blockquote>
175 <div class="centered">
- <img src="pages/club-mate/images/noisebridge_stash.jpg">
176 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/noisebridge_stash.jpg">
177 </div>
178 <center class="image-caption">The Club-Mate stash at <a href="https://www.noisebridge.net/wiki/Noisebridge">Noisebridge hackerspace</a> in San Francisco</center>
179 <p>
181 </p>
182 <p>Oh well, more mate for me :-)</p>
183 <div class="centered" style="max-width:100%">
- <img src="pages/club-mate/images/matemat.jpg" style="max-height:750px;">
184 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/matemat.jpg" style="max-height:750px;">
185 </div>
186 <center style="margin-top:10px; font-size: 22px;"><a href="https://blog.attraktor.org/2012/09/matemat-im-grosformat/">Attraktor</a> in Hamburg, Germany features MateMat, a Club-Mate vending machine. I'm trying to convince Hacksburg to build one of these...</center>
187 </div>
193 <div class="subchunk">
194 <h2>Club-Mate Winter Edition</h2>
195 <p>
- <img src="pages/club-mate/images/club-mate_winter_edition.png" class="inline-bottle" style="max-width:90px">
196 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/club-mate_winter_edition.png" class="inline-bottle" style="max-width:90px">
197 This limited edition Mate (introduced 2007) takes the original Club-Mate formula and adds "cardamom, cinnamon, star anise and citrus extract"<sup><a href="https://en.wikipedia.org/wiki/Club-Mate">1</a></sup>.
198 </p>
199 <p>
203 <div class="subchunk">
204 <h2>Club-Mate Cola</h2>
205 <p>
- <img src="pages/club-mate/images/club-mate_cola.png" class="inline-bottle" style="max-width:90px">
206 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/club-mate_cola.png" class="inline-bottle" style="max-width:90px">
207 As the name suggests, it's Club-Mate... plus Cola.
208 </p>
209 <p>
216 <div class="subchunk">
217 <h2>Club-Mate Beere</h2>
218 <p>
- <img src="pages/club-mate/images/club-mate_beere.png" class="inline-bottle" style="max-width:90px">
219 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/club-mate_beere.png" class="inline-bottle" style="max-width:90px">
220 Hold up, are you <b>21 or older</b>? If not, I probably shouldn't even be talking about this variant, which presumably mixes Club-Mate with straight up beer.
221 </p>
222 <p>What's that? It's just regular Club-Mate infused with with wild berry flavor?</p>
225 <div class="subchunk">
226 <h2>Club-Mate Granat</h2>
227 <p>
- <img src="pages/club-mate/images/club-mate_granat.png" class="inline-bottle" style="max-width:90px">
228 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/club-mate_granat.png" class="inline-bottle" style="max-width:90px">
229 It looks like this one mixes Club-Mate with pomegranate juice.
230 </p>
231 <p>
238 <div class="subchunk">
239 <h2>Club-Mate Ice-T</h2>
240 <p>
- <img src="pages/club-mate/images/club-mate_ice-t.png" class="inline-bottle" style="max-width:90px">
241 + <img src="https://hunterirving.github.io/web_workshop/pages/club-mate/images/club-mate_ice-t.png" class="inline-bottle" style="max-width:90px">
242 This Mate was created in collaboration with the <a href="https://en.wikipedia.org/wiki/Ice-T">American Hip Hop artist</a> of the same name.
243 </p>
244 <p>