baalajimaestro/littlelink
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

General Updates

Browse source 
Added the `aria-hidden="true"` to `img` to avoid having the icon be read by screen readers. Screen readers should now read as a simplified `[brand] button` (i.e. `LittleLink button`). Alt text is making a return with this as well.

I've removed Twitter, since it looks like X branding is sticking around.

Renamed `discogs_alt` to `discogs-alt` to align with how other alt versions are added.
This commit is contained in:
Seth Cottle 2024-03-06 22:59:49 -05:00
parent df1f9e6075
commit 94ddcd2685
4 changed files with 126 additions and 169 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
css/brands.css
View file

@ -299,14 +299,14 @@ button:hover,
filter: brightness(90%); filter: brightness(90%);
} }
/* Discogs_alt */ /* Discogs Alt */
.button.button-discogs_alt { .button.button-discogs-alt {
color: #FFFFFF; color: #FFFFFF;
background-color: #000000; background-color: #000000;
border: 1px solid #FFFFFF border: 1px solid #FFFFFF
} }
.button.button-discogs:hover, .button.button-discogs-alt:hover,
.button.button-discogs:focus { .button.button-discogs-alt:focus {
filter: brightness(90%); filter: brightness(90%);
} }
@ -465,17 +465,6 @@ button:hover,
filter: brightness(90%); filter: brightness(90%);
} }
/* Google Podcasts */
.button.button-google-podcasts {
color: #000000;
background-color: #FFFFFF;
border: 1px solid #212121;
}
.button.button-google-podcasts:hover,
.button.button-google-podcasts:focus {
filter: brightness(90%);
}
/* Google Scholar */ /* Google Scholar */
.button.button-google-scholar { .button.button-google-scholar {
color: #000000; color: #000000;
@ -537,7 +526,6 @@ button:hover,
filter: brightness(90%); filter: brightness(90%);
} }
/* Kickstarter */ /* Kickstarter */
.button.button-kickstarter { .button.button-kickstarter {
color: #ffffff; color: #ffffff;
@ -752,7 +740,7 @@ button:hover,
.button.button-qq { .button.button-qq {
color: #000000; color: #000000;
background-color: #FFFFFF; background-color: #FFFFFF;
border: 3px solid #4D94FF; border: 1px solid #000000;
} }
.button.button-qq:hover, .button.button-qq:hover,
.button.button-qq:focus { .button.button-qq:focus {
@ -843,7 +831,6 @@ button:hover,
filter: brightness(90%); filter: brightness(90%);
} }
/* Snapchat */ /* Snapchat */
.button.button-snapchat { .button.button-snapchat {
color: #000000; color: #000000;
@ -1030,16 +1017,6 @@ button:hover,
filter: brightness(90%); filter: brightness(90%);
} }
/* Twitter (archiving soon, see 'X') */
.button.button-twit {
color: #ffffff;
background-color: #1da1f2;
}
.button.button-twit:hover,
.button.button-twit:focus {
filter: brightness(90%);
}
/* Unsplash */ /* Unsplash */
.button.button-unsplash { .button.button-unsplash {
color: #000000; color: #000000;
@ -1184,8 +1161,4 @@ button:hover,
.button.button-zoom:hover, .button.button-zoom:hover,
.button.button-zoom:focus { .button.button-zoom:focus {
filter: brightness(90%); filter: brightness(90%);
} }

0
images/icons/discogs_alt.svg → images/icons/discogs-alt.svg
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.6 KiB

After

Width:  |  Height:  |  Size: 3.6 KiB

10
images/icons/twitter.svg
View file

@ -1,10 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1432_8793)">
<path d="M23.954 4.38171C23.069 4.78054 22.124 5.05224 21.129 5.1763C22.143 4.54985 22.923 3.56252 23.292 2.38448C22.341 2.9535 21.287 3.36771 20.165 3.5984C19.269 2.61516 17.992 2 16.574 2C13.857 2 11.654 4.25868 11.654 7.04127C11.654 7.44112 11.699 7.8256 11.781 8.19367C7.691 7.9958 4.066 5.98216 1.64 2.93812C1.213 3.67837 0.974 4.53858 0.974 5.47568C0.974 7.22889 1.844 8.76988 3.162 9.67519C2.355 9.64854 1.596 9.42093 0.934 9.04363V9.10617C0.934 11.5514 2.627 13.5907 4.88 14.0552C4.467 14.169 4.031 14.2305 3.584 14.2305C3.27 14.2305 2.969 14.1997 2.668 14.1423C3.299 16.1447 5.113 17.6047 7.272 17.6457C5.592 18.998 3.463 19.8039 1.17 19.8039C0.78 19.8039 0.391 19.7803 0 19.7352C2.189 21.1644 4.768 22 7.557 22C16.611 22 21.556 14.3146 21.556 7.66053C21.556 7.44625 21.556 7.22992 21.541 7.01461C22.502 6.3082 23.341 5.41518 24.001 4.40221L23.954 4.38171Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0_1432_8793">
<rect width="24" height="24" fill="white"/>
</clipPath>
</defs>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.1 KiB

246
index.html
View file

@ -69,7 +69,7 @@
<h1 role="heading">LittleLink</h1> <h1 role="heading">LittleLink</h1>
<!-- Short Bio --> <!-- Short Bio -->
<p>An open source DIY <a href="https://linktr.ee" target="_blank" rel="noopener" role="link">Linktree</a> alternative.</p> <p>An open source DIY Linktree alternative.</p>
<!-- <!--
@ -101,364 +101,358 @@
--> -->
<!-- Default LittleLink --> <!-- Default LittleLink -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/littlelink.svg" alt="">LittleLink</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/littlelink.svg" alt="Little Link Logo">LittleLink</a><br>
<!-- Amazon --> <!-- Amazon -->
<a class="button button-amazon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/amazon.svg" alt="">Amazon Wishlist</a><br> <a class="button button-amazon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/amazon.svg" alt="Amazon Wishlist Logo">Amazon Wishlist</a><br>
<!-- Amazon Music --> <!-- Amazon Music -->
<a class="button button-amazon-music" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/amazon-music.svg" alt="">Listen on Amazon Music</a><br> <a class="button button-amazon-music" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/amazon-music.svg" alt="Amazon Music Logo">Listen on Amazon Music</a><br>
<!-- Apple App Store --> <!-- Apple App Store -->
<a class="button button-appstore" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple.svg" alt="">Apple App Store</a><br> <a class="button button-appstore" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/apple.svg" alt="Apple Logo">Apple App Store</a><br>
<!-- Apple Music --> <!-- Apple Music -->
<a class="button button-apple-music" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple-music.svg" alt="">Listen on Apple Music</a><br> <a class="button button-apple-music" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/apple-music.svg" alt="Apple Music Logo">Listen on Apple Music</a><br>
<!-- Apple Music Alternate --> <!-- Apple Music Alternate -->
<a class="button button-apple-music-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple-music-alt.svg" alt="">Listen on Apple Music</a><br> <a class="button button-apple-music-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/apple-music-alt.svg" alt="Apple Music Logo">Listen on Apple Music</a><br>
<!-- Apple Podcasts --> <!-- Apple Podcasts -->
<a class="button button-apple-podcasts" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple-podcasts.svg" alt="">Listen on Apple Podcasts</a><br> <a class="button button-apple-podcasts" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/apple-podcasts.svg" alt="Apple Podcasts Logo">Listen on Apple Podcasts</a><br>
<!-- Apple Podcasts Alternate --> <!-- Apple Podcasts Alternate -->
<a class="button button-apple-podcasts-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple-podcasts-alt.svg" alt="">Listen on Apple Podcasts</a><br> <a class="button button-apple-podcasts-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/apple-podcasts-alt.svg" alt="Apple Podcasts Logo">Listen on Apple Podcasts</a><br>
<!-- Bandcamp --> <!-- Bandcamp -->
<a class="button button-bandcamp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/bandcamp.svg" alt="">Bandcamp</a><br> <a class="button button-bandcamp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/bandcamp.svg" alt="Bandcamp Logo">Bandcamp</a><br>
<!-- Behance --> <!-- Behance -->
<a class="button button-behance" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/behance.svg" alt="">Behance</a><br> <a class="button button-behance" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/behance.svg" alt="Behance Logo">Behance</a><br>
<!-- BeReal --> <!-- BeReal -->
<a class="button button-bereal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/bereal.svg" alt=""> BeReal</a><br> <a class="button button-bereal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/bereal.svg" alt="BeReal Logo">BeReal</a><br>
<!-- Bluesky --> <!-- Bluesky -->
<a class="button button-bluesky" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/bluesky.svg" alt="">Bluesky</a><br> <a class="button button-bluesky" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/bluesky.svg" alt="Bluesky Logo">Bluesky</a><br>
<!-- Bluesky Alt --> <!-- Bluesky Alt -->
<a class="button button-bluesky-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/bluesky-alt.svg" alt="">Bluesky</a><br> <a class="button button-bluesky-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/bluesky-alt.svg" alt="Bluesky Logo">Bluesky</a><br>
<!-- Buy Me A Coffee --> <!-- Buy Me A Coffee -->
<a class="button button-coffee" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/buy-me-a-coffee.svg" alt="">Buy Me A Coffee</a><br> <a class="button button-coffee" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/buy-me-a-coffee.svg" alt="Buy Me A Coffee Logo">Buy Me A Coffee</a><br>
<!-- Cal.com --> <!-- Cal.com -->
<a class="button button-cal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/cal.svg" alt="">Schedule with Cal.com</a><br> <a class="button button-cal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/cal.svg" alt="Cal.com Logo">Schedule with Cal.com</a><br>
<!-- Calendly --> <!-- Calendly -->
<a class="button button-calendly" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/calendly.svg" alt="">Schedule with Calendly</a><br> <a class="button button-calendly" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/calendly.svg" alt="Calendly Logo">Schedule with Calendly</a><br>
<!-- Cash App --> <!-- Cash App -->
<a class="button button-cash-app" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/cash-app-dollar.svg" alt="">Cash App</a><br> <a class="button button-cash-app" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/cash-app-dollar.svg" alt="Cash App Logo">Cash App</a><br>
<!-- Clubhouse --> <!-- Clubhouse -->
<a class="button button-clubhouse" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/clubhouse.svg" alt="">Clubhouse</a><br> <a class="button button-clubhouse" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/clubhouse.svg" alt="Clubhouse Logo">Clubhouse</a><br>
<!-- Dev.to --> <!-- Dev.to -->
<a class="button button-dev-to" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/dev-to.svg" alt="">Dev.to</a><br> <a class="button button-dev-to" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/dev-to.svg" alt="Dev.to Logo">Dev.to</a><br>
<!-- Discogs --> <!-- Discogs -->
<a class="button button-discogs" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/discogs.svg" alt="">Discogs</a><br> <a class="button button-discogs" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/discogs.svg" alt="Discogs Logo">Discogs</a><br>
<!-- Discogs_alt --> <!-- Discogs Alt -->
<a class="button button-discogs_alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/discogs_alt.svg" alt="">Discogs</a><br> <a class="button button-discogs-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/discogs-alt.svg" alt="Discogs Logo">Discogs</a><br>
<!-- Discord --> <!-- Discord -->
<a class="button button-discord" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/discord.svg" alt="">Discord</a><br> <a class="button button-discord" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/discord.svg" alt="Discord Logo">Discord</a><br>
<!-- Dribbble --> <!-- Dribbble -->
<a class="button button-dribbble" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/dribbble.svg" alt="">Dribbble</a><br> <a class="button button-dribbble" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/dribbble.svg" alt="Dribbble Logo">Dribbble</a><br>
<!-- Etsy --> <!-- Etsy -->
<a class="button button-etsy" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/etsy.svg" alt="">Shop on Etsy</a><br> <a class="button button-etsy" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/etsy.svg" alt="Etsy Logo">Shop on Etsy</a><br>
<!-- Facebook --> <!-- Facebook -->
<a class="button button-faceb" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/facebook.svg" alt="">Find us on Facebook</a><br> <a class="button button-faceb" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/facebook.svg" alt="Facebook Logo">Find us on Facebook</a><br>
<!-- Facebook Messenger --> <!-- Facebook Messenger -->
<a class="button button-messenger" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/messenger.svg" alt="">Chat on Messenger</a><br> <a class="button button-messenger" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/messenger.svg" alt="Messenger Logo">Chat on Messenger</a><br>
<!-- Figma --> <!-- Figma -->
<a class="button button-figma" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/figma.svg" alt="">Figma Community</a><br> <a class="button button-figma" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/figma.svg" alt="Figma Logo">Figma Community</a><br>
<!-- Fiverr --> <!-- Fiverr -->
<a class="button button-fiverr" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/fiverr.svg" alt="">Fiverr Gig</a><br> <a class="button button-fiverr" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/fiverr.svg" alt="Fiverr Logo">Fiverr Gig</a><br>
<!-- Flickr --> <!-- Flickr -->
<a class="button button-flickr" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/flickr.svg" alt="">Flickr</a><br> <a class="button button-flickr" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/flickr.svg" alt="Flickr Logo">Flickr</a><br>
<!-- GitHub --> <!-- GitHub -->
<a class="button button-github" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/github.svg" alt="">GitHub</a><br> <a class="button button-github" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/github.svg" alt="GitHub Logo">GitHub</a><br>
<!-- GitLab --> <!-- GitLab -->
<a class="button button-gitlab" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/gitlab.svg" alt="">GitLab</a><br> <a class="button button-gitlab" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/gitlab.svg" alt="GitLab Logo">GitLab</a><br>
<!-- GoFundMe --> <!-- GoFundMe -->
<a class="button button-gofundme" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/gofundme.svg" alt="">GoFundMe</a><br> <a class="button button-gofundme" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/gofundme.svg" alt="GoFundMe Logo">GoFundMe</a><br>
<!-- Goodreads --> <!-- Goodreads -->
<a class="button button-goodreads" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/goodreads.svg" alt="">Goodreads</a><br> <a class="button button-goodreads" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/goodreads.svg" alt="Goodreads Logo">Goodreads</a><br>
<!-- Google Drive --> <!-- Google Drive -->
<a class="button button-google-black" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/google-drive.svg" alt="">View in Google Drive</a><br> <a class="button button-google-black" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/google-drive.svg" alt="Google Drive Logo">View in Google Drive</a><br>
<!-- Google Play Store --> <!-- Google Play Store -->
<a class="button button-playstore" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/google-play.svg" alt="">Google Play Store</a><br> <a class="button button-playstore" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/google-play.svg" alt="Google Play Store Logo">Google Play Store</a><br>
<!-- Google Podcasts -->
<a class="button button-google-podcasts" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/google-podcasts.svg" alt="">Listen on Google Podcasts</a><br>
<!-- Google Scholar --> <!-- Google Scholar -->
<a class="button button-google-scholar" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/google-scholar.svg" alt="">Google Scholar</a><br> <a class="button button-google-scholar" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/google-scholar.svg" alt="Google Scholar Logo">Google Scholar</a><br>
<!-- Guilded --> <!-- Guilded -->
<a class="button button-guilded" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/guilded.svg" alt="">Guilded</a><br> <a class="button button-guilded" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/guilded.svg" alt="Guilded Logo">Guilded</a><br>
<!-- Hashnode --> <!-- Hashnode -->
<a class="button button-hashnode" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/hashnode.svg" alt="">Hashnode</a><br> <a class="button button-hashnode" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/hashnode.svg" alt="Hashnode Logo">Hashnode</a><br>
<!-- Instagram --> <!-- Instagram -->
<a class="button button-instagram" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/instagram.svg" alt="">Instagram</a><br> <a class="button button-instagram" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/instagram.svg" alt="Instagram Logo">Instagram</a><br>
<!-- Kick --> <!-- Kick -->
<a class="button button-kick" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/kick.svg" alt="">Kick</a><br> <a class="button button-kick" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/kick.svg" alt="Kick Logo">Kick</a><br>
<!-- Kick Alt --> <!-- Kick Alt -->
<a class="button button-kick-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/kick-alt.svg" alt="">Kick</a><br> <a class="button button-kick-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/kick-alt.svg" alt="Kick Logo">Kick</a><br>
<!-- Kickstarter --> <!-- Kickstarter -->
<a class="button button-kickstarter" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/kickstarter.svg" alt="">Kickstarter</a><br> <a class="button button-kickstarter" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/kickstarter.svg" alt="Kickstarter Logo">Kickstarter</a><br>
<!-- Kit --> <!-- Kit -->
<a class="button button-kit" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/kit.svg" alt="">Kit</a><br> <a class="button button-kit" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/kit.svg" alt="Kit Logo">Kit</a><br>
<!-- Ko-fi --> <!-- Ko-fi -->
<a class="button button-ko-fi" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/ko-fi.svg" alt="">Ko-fi</a><br> <a class="button button-ko-fi" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/ko-fi.svg" alt="Ko-fi Logo">Ko-fi</a><br>
<!-- Last.fm --> <!-- Last.fm -->
<a class="button button-last-fm" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/last-fm.svg" alt="">Last.fm</a><br> <a class="button button-last-fm" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/last-fm.svg" alt="">Last.fm</a><br>
<!-- Letterboxd --> <!-- Letterboxd -->
<a class="button button-letterboxd" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/letterboxd.svg" alt="">Letterboxd</a><br> <a class="button button-letterboxd" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/letterboxd.svg" alt="">Letterboxd</a><br>
<!-- Line --> <!-- Line -->
<a class="button button-line" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/line.svg" alt="">Line</a><br> <a class="button button-line" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/line.svg" alt="Line Logo">Line</a><br>
<!-- LinkedIn --> <!-- LinkedIn -->
<a class="button button-linked" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/linkedin.svg" alt="">LinkedIn</a><br> <a class="button button-linked" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/linkedin.svg" alt="LinkedIn Logo">LinkedIn</a><br>
<!-- Mailchimp --> <!-- Mailchimp -->
<a class="button button-mailchimp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/mailchimp.svg" alt="">Mailchimp</a><br> <a class="button button-mailchimp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/mailchimp.svg" alt="Mailchimp Logo">Mailchimp</a><br>
<!-- Mastodon --> <!-- Mastodon -->
<a class="button button-mastodon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/mastodon.svg" alt="">Mastodon</a><br> <a class="button button-mastodon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/mastodon.svg" alt="Mastodon Logo">Mastodon</a><br>
<!-- Medium --> <!-- Medium -->
<a class="button button-medium" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/medium.svg" alt="">Medium</a><br> <a class="button button-medium" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/medium.svg" alt="Medium Logo">Medium</a><br>
<!-- Microsoft Store --> <!-- Microsoft Store -->
<a class="button button-microsoft" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/microsoft.svg" alt="">Get it from Microsoft</a><br> <a class="button button-microsoft" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/microsoft.svg" alt="Microsoft Logo">Get it from Microsoft</a><br>
<!-- NGL --> <!-- NGL -->
<a class="button button-ngl" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/ngl.svg" alt="">NGL</a><br> <a class="button button-ngl" href="#" target="_blank" rel="noopener"><img class="icon" aria-hidden="true" src="images/icons/ngl.svg" alt="NGL Logo">NGL</a><br>
<!-- Notion --> <!-- Notion -->
<a class="button button-notion" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/notion.svg" alt="">Notion</a><br> <a class="button button-notion" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/notion.svg" alt="Notion Logo">Notion</a><br>
<!-- OnlyFans --> <!-- OnlyFans -->
<a class="button button-onlyfans" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/onlyfans.svg" alt="">OnlyFans (18+)</a><br> <a class="button button-onlyfans" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/onlyfans.svg" alt="OnlyFans Logo">OnlyFans (18+)</a><br>
<!-- Partiful --> <!-- Partiful -->
<a class="button button-partiful" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/partiful.svg" alt="">Partiful</a><br> <a class="button button-partiful" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/partiful.svg" alt="Partiful Logo">Partiful</a><br>
<!-- Patreon --> <!-- Patreon -->
<a class="button button-patreon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/patreon.svg" alt="">Patreon</a><br> <a class="button button-patreon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/patreon.svg" alt="Patreon Logo">Patreon</a><br>
<!-- PayPal --> <!-- PayPal -->
<a class="button button-paypal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/paypal.svg" alt="">PayPal</a><br> <a class="button button-paypal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/paypal.svg" alt="PayPal Logo">PayPal</a><br>
<!-- Pinterest --> <!-- Pinterest -->
<a class="button button-pinterest" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/pinterest.svg" alt="">Pinterest</a><br> <a class="button button-pinterest" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/pinterest.svg" alt="Pinterest Logo">Pinterest</a><br>
<!-- Post.news --> <!-- Post.news -->
<a class="button button-post-news" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/post-news.svg" alt="">Post.news</a><br> <a class="button button-post-news" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/post-news.svg" alt="Post.news Logo">Post.news</a><br>
<!-- Product Hunt --> <!-- Product Hunt -->
<a class="button button-product-hunt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/product-hunt.svg" alt="">Product Hunt</a><br> <a class="button button-product-hunt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/product-hunt.svg" alt="Product Hunt Logo">Product Hunt</a><br>
<!-- QQ --> <!-- QQ -->
<a class="button button-qq" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/qq.svg" alt="">QQ</a><br> <a class="button button-qq" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/qq.svg" alt="QQ Logo">QQ</a><br>
<!-- Read.cv --> <!-- Read.cv -->
<a class="button button-read-cv" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/read-cv.svg" alt="">Read.cv</a><br> <a class="button button-read-cv" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/read-cv.svg" alt="Read.cv logo">Read.cv</a><br>
<!-- Redbubble --> <!-- Redbubble -->
<a class="button button-redbubble" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/redbubble.svg" alt="">Redbubble</a><br> <a class="button button-redbubble" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/redbubble.svg" alt="Redbubble Logo">Redbubble</a><br>
<!-- Reddit --> <!-- Reddit -->
<a class="button button-reddit" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/reddit.svg" alt="">Reddit</a><br> <a class="button button-reddit" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/reddit.svg" alt="Reddit Logo">Reddit</a><br>
<!-- Revolut --> <!-- Revolut -->
<a class="button button-revolut" href="" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/revolut.svg" alt="">Revolut</a><br> <a class="button button-revolut" href="" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/revolut.svg" alt="Revolut Logo">Revolut</a><br>
<!-- Shop --> <!-- Shop -->
<a class="button button-shop" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/shop.svg" alt="">Buy with Shop</a><br> <a class="button button-shop" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/shop.svg" alt="Shop Logo">Buy with Shop</a><br>
<!-- Signal --> <!-- Signal -->
<a class="button button-signal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/signal.svg" alt="">Signal</a><br> <a class="button button-signal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/signal.svg" alt="Signal Logo">Signal</a><br>
<!-- Skoob --> <!-- Skoob -->
<a class="button button-skoob" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/skoob.svg" alt="">Skoob</a><br> <a class="button button-skoob" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/skoob.svg" alt="Skoob logo">Skoob</a><br>
<!-- Slack --> <!-- Slack -->
<a class="button button-slack" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/slack.svg" alt="">Join Slack</a><br> <a class="button button-slack" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/slack.svg" alt="Slack Logo">Join Slack</a><br>
<!-- Snapchat --> <!-- Snapchat -->
<a class="button button-snapchat" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/snapchat.svg" alt="">Snapchat</a><br> <a class="button button-snapchat" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/snapchat.svg" alt="Snapchat Logo">Snapchat</a><br>
<!-- SoundCloud --> <!-- SoundCloud -->
<a class="button button-soundcloud" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/soundcloud.svg" alt="">SoundCloud</a><br> <a class="button button-soundcloud" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/soundcloud.svg" alt="SoundCloud Logo">SoundCloud</a><br>
<!-- Spotify --> <!-- Spotify -->
<a class="button button-spotify" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/spotify.svg" alt="">Listen on Spotify</a><br> <a class="button button-spotify" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/spotify.svg" alt="Spotify Logo">Listen on Spotify</a><br>
<!-- Spotify Alt --> <!-- Spotify Alt -->
<a class="button button-spotify-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/spotify-alt.svg" alt="">Listen on Spotify</a><br> <a class="button button-spotify-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/spotify-alt.svg" alt="Spotify Logo">Listen on Spotify</a><br>
<!-- Square --> <!-- Square -->
<a class="button button-square" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/square.svg" alt="">Buy with Square</a><br> <a class="button button-square" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/square.svg" alt="Square Logo">Buy with Square</a><br>
<!-- Stack Overflow --> <!-- Stack Overflow -->
<a class="button button-stack-overflow" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/stack-overflow.svg" alt="">Stack Overflow</a><br> <a class="button button-stack-overflow" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/stack-overflow.svg" alt="Stack Overflow Logo">Stack Overflow</a><br>
<!-- Steam --> <!-- Steam -->
<a class="button button-steam" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/steam.svg" alt="">Steam</a><br> <a class="button button-steam" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/steam.svg" alt="Steam Logo">Steam</a><br>
<!-- Steam Alt --> <!-- Steam Alt -->
<a class="button button-steam-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/steam.svg" alt="">Steam</a><br> <a class="button button-steam-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/steam.svg" alt="Steam Logo">Steam</a><br>
<!-- Strava --> <!-- Strava -->
<a class="button button-strava" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/strava.svg" alt="">Strava</a><br> <a class="button button-strava" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/strava.svg" alt="Strava Logo">Strava</a><br>
<!-- Substack --> <!-- Substack -->
<a class="button button-substack" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/substack.svg" alt="">Substack</a><br> <a class="button button-substack" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/substack.svg" alt="Substack Logo">Substack</a><br>
<!-- Telegram --> <!-- Telegram -->
<a class="button button-telegram" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/telegram.svg" alt="">Telegram</a><br> <a class="button button-telegram" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/telegram.svg" alt="Telegram Logo">Telegram</a><br>
<!-- Threads --> <!-- Threads -->
<a class="button button-threads" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/threads.svg" alt="">Threads</a><br> <a class="button button-threads" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/threads.svg" alt="Threads Logo">Threads</a><br>
<!-- Threema --> <!-- Threema -->
<a class="button button-threema" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/threema.svg" alt="">Threema</a><br> <a class="button button-threema" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/threema.svg" alt="Threema Logo">Threema</a><br>
<!-- TikTok --> <!-- TikTok -->
<a class="button button-tiktok" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/tiktok.svg" alt="">TikTok</a><br> <a class="button button-tiktok" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/tiktok.svg" alt="TikTok Logo">TikTok</a><br>
<!-- Trakt --> <!-- Trakt -->
<a class="button button-trakt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/trakt.svg" alt="">Trakt</a><br> <a class="button button-trakt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/trakt.svg" alt="Trakt Logo">Trakt</a><br>
<!-- Trello --> <!-- Trello -->
<a class="button button-trello" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/trello.svg" alt="">Trello</a><br> <a class="button button-trello" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/trello.svg" alt="Trello Logo">Trello</a><br>
<!-- Tumblr --> <!-- Tumblr -->
<a class="button button-tumb" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/tumblr.svg" alt="">Tumblr</a><br> <a class="button button-tumb" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/tumblr.svg" alt="Tumblr Logo">Tumblr</a><br>
<!-- Twitch --> <!-- Twitch -->
<a class="button button-twitch" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/twitch.svg" alt="">Twitch</a><br> <a class="button button-twitch" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/twitch.svg" alt="Twitch Logo">Twitch</a><br>
<!-- Twitter (archiving soon, see 'X') -->
<a class="button button-twit" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/twitter.svg" alt="">Twitter</a><br>
<!-- Unsplash --> <!-- Unsplash -->
<a class="button button-unsplash" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/unsplash.svg" alt="">Unsplash</a><br> <a class="button button-unsplash" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/unsplash.svg" alt="Unsplash Logo">Unsplash</a><br>
<!-- Untappd --> <!-- Untappd -->
<a class="button button-untappd" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/untappd.svg" alt="">Untappd</a><br> <a class="button button-untappd" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/untappd.svg" alt="Untappd Logo">Untappd</a><br>
<!-- Upwork --> <!-- Upwork -->
<a class="button button-upwork" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/upwork.svg" alt="">Upwork</a><br> <a class="button button-upwork" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/upwork.svg" alt="Upwork Logo">Upwork</a><br>
<!-- Venmo --> <!-- Venmo -->
<a class="button button-venmo" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/venmo.svg" alt="">Venmo</a><br> <a class="button button-venmo" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/venmo.svg" alt="Venmo Logo">Venmo</a><br>
<!-- Vimeo --> <!-- Vimeo -->
<a class="button button-vimeo" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/vimeo.svg" alt="">Vimeo</a><br> <a class="button button-vimeo" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/vimeo.svg" alt="Vimeo Logo">Vimeo</a><br>
<!-- VRChat --> <!-- VRChat -->
<a class="button button-vrchat" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/vrchat.svg" alt="">VRChat</a><br> <a class="button button-vrchat" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/vrchat.svg" alt="VRChat Logo">VRChat</a><br>
<!-- VSCO --> <!-- VSCO -->
<a class="button button-vsco" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/vsco.svg" alt="">VSCO</a><br> <a class="button button-vsco" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/vsco.svg" alt="VSCO Logo">VSCO</a><br>
<!-- WhatsApp --> <!-- WhatsApp -->
<a class="button button-whatsapp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/whatsapp.svg" alt="">WhatsApp</a><br> <a class="button button-whatsapp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/whatsapp.svg" alt="WhatsApp Logo">WhatsApp</a><br>
<!-- WordPress --> <!-- WordPress -->
<a class="button button-wordpress" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/wordpress.svg" alt="">WordPress</a><br> <a class="button button-wordpress" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/wordpress.svg" alt="WordPress Logo">WordPress</a><br>
<!-- X --> <!-- X -->
<a class="button button-x" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/x.svg" alt="">Follow on X</a><br> <a class="button button-x" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/x.svg" alt="X Logo">Follow on X</a><br>
<!-- Xing --> <!-- Xing -->
<a class="button button-xing" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/xing.svg" alt="">Xing</a><br> <a class="button button-xing" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/xing.svg" alt="Xing Logo">Xing</a><br>
<!-- YouTube --> <!-- YouTube -->
<a class="button button-yt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/youtube.svg" alt="">YouTube</a><br> <a class="button button-yt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/youtube.svg" alt="YouTube Logo">YouTube</a><br>
<!-- YouTube Music --> <!-- YouTube Music -->
<a class="button button-yt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/youtube-music.svg" alt="">Listen on YouTube Music</a><br> <a class="button button-yt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/youtube-music.svg" alt="YouTube Music Logo">Listen on YouTube Music</a><br>
<!-- Zoom --> <!-- Zoom -->
<a class="button button-zoom" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/zoom.svg" alt="">Join Zoom Webinar</a><br> <a class="button button-zoom" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/zoom.svg" alt="Zoom Logo">Join Zoom Webinar</a><br>
<!-- Generic Blog --> <!-- Generic Blog -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-blog.svg" alt="">Read our blog</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-blog.svg" alt="Blog Icon">Read our blog</a><br>
<!-- Generic Calendar --> <!-- Generic Calendar -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-calendar.svg" alt="">Event RSVP</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-calendar.svg" alt="Calendar Icon">Event RSVP</a><br>
<!-- Generic Cloud --> <!-- Generic Cloud -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-cloud.svg" alt="">Download File</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-cloud.svg" alt="Cloud Icon">Download File</a><br>
<!-- Generic Code --> <!-- Generic Code -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-code.svg" alt="">View the code</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-code.svg" alt="Code Icon">View the code</a><br>
<!-- Generic Computer --> <!-- Generic Computer -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-computer.svg" alt="">Homelab Setup</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-computer.svg" alt="Computer Icon">Homelab Setup</a><br>
<!-- Generic Email --> <!-- Generic Email -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-email.svg" alt="">Email Us</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-email.svg" alt="Email Icon">Email Us</a><br>
<!-- Generic Email Alt --> <!-- Generic Email Alt -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-email-alt.svg" alt="">Email Us</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-email-alt.svg" alt="Email Icon">Email Us</a><br>
<!-- Generic Homepage --> <!-- Generic Homepage -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-homepage.svg" alt="">Visit Homepage</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-homepage.svg" alt="Homepage Icon">Visit Homepage</a><br>
<!-- Generic Map --> <!-- Generic Map -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-map.svg" alt="">Get Directions</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-map.svg" alt="Map Icon">Get Directions</a><br>
<!-- Generic Phone --> <!-- Generic Phone -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-phone.svg" alt="">Call Us</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-phone.svg" alt="Phone Icon">Call Us</a><br>
<!-- Generic Review --> <!-- Generic Review -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-review.svg" alt="">Leave us a review</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-review.svg" alt="Review Icon">Leave us a review</a><br>
<!-- Generic RSS --> <!-- Generic RSS -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-rss.svg" alt="">RSS Subscribe</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-rss.svg" alt="RSS Icon">RSS Subscribe</a><br>
<!-- Generic Shopping Bag --> <!-- Generic Shopping Bag -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-shopping-bag.svg" alt="">Visit Our Shop</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-shopping-bag.svg" alt="Shopping Bag Icon">Visit Our Shop</a><br>
<!-- Generic Shopping Tag --> <!-- Generic Shopping Tag -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-shopping-tag.svg" alt="">10% Discount</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-shopping-tag.svg" alt="Shopping Tag Icon">10% Discount</a><br>
<!-- Generic SMS --> <!-- Generic SMS -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-sms.svg" alt="">Send us a message</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-sms.svg" alt="SMS Icon">Send us a message</a><br>
<!-- Generic Website --> <!-- Generic Website -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-website.svg" alt="">Visit Website</a><br> <a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-website.svg" alt="Website Icon">Visit Website</a><br>
<br> <br>
<!-- <!--
Footer: Footer: