20 Commits

Author SHA1 Message Date
Seth Cottle
093aaa0a29 Added "X"
👎
2023-07-31 10:36:04 -04:00
Seth Cottle
57e61be9cd Update README.md 2023-07-06 16:04:37 -04:00
Seth Cottle
9ea8125fef Created FUNDING.yml 2023-07-06 15:40:52 -04:00
Seth Cottle
e648b49856 Added Threads
Also updated Untappd branding to be more accessible.
2023-07-06 15:23:43 -04:00
Seth Cottle
e9795187b1 Merge pull request #94 from artificialbutter/main
Added NGL
2023-06-29 19:51:48 -04:00
artificial
4cbc3699c3 Use "official" gradient 2023-06-29 14:51:05 -07:00
artificialbutter
a8082c0078 Merge branch 'sethcottle:main' into main 2023-06-29 14:45:30 -07:00
Seth Cottle
d607fe5799 Merge pull request #93 from soypato/soypato_dev
Added Kick
2023-06-29 15:54:28 -04:00
soypato
bb98a753e1 Fix Kick Alt conflicts 2023-06-29 14:44:24 -03:00
soypato
2ddac4d2c5 Fix Kick - colors - based in Branding Guidelines 2023-06-29 14:42:31 -03:00
soypato
fd3efdc367 fix Kick - colors - based in Branding Guidelines 2023-06-29 14:32:03 -03:00
soypato
5dabc02f2d add kick in social nw. list 2023-06-29 04:10:17 -03:00
artificial
be78b6bd4d Add NGL 2023-06-28 18:17:07 -07:00
Seth Cottle
93878a91c1 Merge pull request #92 from fatih-yavuz/main
Add supporter links.dev to README.md
2023-06-16 21:01:55 -04:00
Fatih Yavuz
683e1c1aa4 Update README.md 2023-06-16 18:31:37 +02:00
Fatih Yavuz
5fe2d9b332 add supporter links.dev to README.md 2023-06-16 18:31:02 +02:00
Seth Cottle
b40c337a9e Update README.md 2023-06-12 11:26:18 -04:00
Seth Cottle
8eaa45c270 Added GoFundMe 2023-06-12 11:25:26 -04:00
Seth Cottle
aa334ce37c Update README.md
Updates Vercel deploy link
2023-05-23 20:55:01 -04:00
Seth Cottle
11b820b0ce Accessibility Updates
Buttons now include a `role="button"` to aid with assistive technologies like screen readers.

`alt="[Description]"` has been nullified and set to `alt=""` on buttons to reduce duplicative screen reader announcements since the button text gives the context to the button and imagery is purely decorative.
2023-05-01 20:47:14 -04:00
11 changed files with 302 additions and 126 deletions

6
.github/FUNDING.yml vendored Normal file
View File

@@ -0,0 +1,6 @@
# These are supported funding model platforms
github: sethcottle
patreon: sethcottle
ko_fi: sethcottle
custom: [https://buymeacoffee.com/seth, https://paypal.me/sethcottle]

View File

@@ -1,11 +1,11 @@
![Logo](https://cdn.cottle.cloud/littlelink/littlelink.gif)
# LittleLink
The DIY self-hosted <a href="https://linktr.ee/" target="_blank" rel="noopener">LinkTree</a> alternative. LittleLink has more than 60 branded button styles you can easily use, with more being added by our community all the time.
The DIY self-hosted <a href="https://linktr.ee/" target="_blank" rel="noopener">LinkTree</a> alternative. LittleLink has more than 100 branded button styles you can easily use, with more being added by our community all the time.
![Theme](https://cdn.cottle.cloud/littlelink/themesupport.gif)
LittleLink has more than 60 branded button styles you can use (with even more being added by our community). You'll also find a light and dark theme ready to go. Not a fan of the default colors? Update `skeleton-light.css` or `skeleton-dark.css` to the HEX values of your choosing. You can also set your CSS to `skeleton-auto.css`, which will use the system theme of the device you visit on.
LittleLink has more than 100 branded button styles you can use (with even more being added by our community). You'll also find a light and dark theme ready to go. Not a fan of the default colors? Update `skeleton-light.css` or `skeleton-dark.css` to the HEX values of your choosing. You can also set your CSS to `skeleton-auto.css`, which will use the system theme of the device you visit on.
![Performance](https://cdn.cottle.cloud/littlelink/Lighthouse.svg)
@@ -17,7 +17,7 @@ No need for gulp, npm, or anything else to make LittleLink work—it uses the ba
[![Deploy to Netlify](https://cdn.cottle.cloud/littlelink/button-deploy-netlify.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/sethcottle/littlelink)
[![Deploy to Vercel](https://cdn.cottle.cloud/littlelink/button-deploy-vercel.svg)](https://vercel.com/new/git/external?repository-url=https%3A%2F%2Fgithub.com%2Fsethcottle%2Flittlelink&project-name=littlelink&repository-name=littlelink&demo-title=LittleLink%20Demo&demo-description=Imported%20from%20GitHub.)
[![Deploy to Vercel](https://cdn.cottle.cloud/littlelink/button-deploy-vercel.svg)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fsethcottle%2Flittlelink&project-name=littlelink&repository-name=littlelink)
[![Deploy to Amplify](https://cdn.cottle.cloud/littlelink/button-deploy-amplify.svg)](https://console.aws.amazon.com/amplify/home#/deploy?repo=https://github.com/sethcottle/littlelink)
@@ -31,30 +31,52 @@ Looking for more niche services to add to your copy of LittleLink? Check out [Li
#### 🎨 Figma
Duplicate the [LittleLink Template on Figma Community](https://www.figma.com/community/file/846568099968305613) to help plan out and design your LittleLink page.
#### 🐋 Docker
[Techno Tim](https://github.com/timothystewart6) is building [LittleLink-Server](https://github.com/techno-tim/littlelink-server). Check out [his video](https://youtu.be/42SqfI_AjXU)!
[![Figma Community](https://cdn.cottle.cloud/littlelink/button-figma-community.svg)](https://www.figma.com/community/file/846568099968305613)
[Drew](https://github.com/davisdre) is building a [super simple Docker implementation of LittleLink](https://github.com/davisdre/littlelink).
#### 🐋 Docker
• [Techno Tim](https://github.com/timothystewart6) is building [LittleLink-Server](https://github.com/techno-tim/littlelink-server). Check out [his video](https://youtu.be/42SqfI_AjXU)!
• [Drew](https://github.com/davisdre) is building a [super simple Docker implementation of LittleLink](https://github.com/davisdre/littlelink).
#### 🗃️ Misc
[Khashayar](https://github.com/khashayarzavosh) is building [LittleLink Admin](https://github.com/khashayarzavosh/admin-littlelink) which lets you host your own admin portal to manage LittleLink!
[Khashayar](https://github.com/khashayarzavosh) is building [LittleLink Admin](https://github.com/khashayarzavosh/admin-littlelink) which lets you host your own admin portal to manage LittleLink!
[Julian](https://github.com/JulianPrieber) is building [LittleLink Custom](https://github.com/JulianPrieber/littlelink-custom) which approaches the admin portal with an easy-to-use "plug-and-play" mentality!
[Julian](https://github.com/JulianPrieber) is building [LittleLink Custom](https://github.com/JulianPrieber/littlelink-custom) which approaches the admin portal with an easy-to-use "plug-and-play" mentality!
---
### 💖 Supporters
You can support LittleLink by [buying me a beer](https://www.buymeacoffee.com/seth). You can also have your name or your company added to this section and the supporters page of the [LittleLink.io](https://littlelink.io) website.
You can support LittleLink by [buying me a coffee](https://www.buymeacoffee.com/seth). You can also have your name or your company added to this section and the supporters page of the [LittleLink.io](https://littlelink.io) website.
#### 🏢 Business Supporters
[Add Your Company Name](https://www.buymeacoffee.com/seth/e/50574)
**[links.dev](https://github.com/fatih-yavuz/links.dev)**
[![Add Your Company Name](https://cdn.cottle.cloud/littlelink/button-buy-me-a-coffee-company.svg)](https://www.buymeacoffee.com/seth/e/50574)
#### ✨ Individual Supporters
**[Drew Davis](https://connect.davisdre.me)**
**[Drew Davis](https://connect.davisdre.me)**
**[Robotter112](https://robotter112.de/)**
**[Robotter112](https://robotter112.de/)**
[Add Your Name](https://www.buymeacoffee.com/seth/e/50573)
[![Buy Me A Coffee](https://cdn.cottle.cloud/littlelink/button-buy-me-a-coffee-individual.svg)](https://www.buymeacoffee.com/seth/e/50573)
#### 🐙 GitHub Sponsors
**[Your Name Here](https://github.com/sponsors/sethcottle)**
[![GitHub Sponsors](https://cdn.cottle.cloud/littlelink/button-github-sponsors.svg)](https://github.com/sponsors/sethcottle)
#### ❤️ Patreon Members
**[Your Name Here](https://www.patreon.com/sethcottle)**
[![Patreon](https://cdn.cottle.cloud/littlelink/button-patreon.svg)](https://www.patreon.com/sethcottle)
#### 🥰 More Ways to Support LittleLink
[![Buy Me A Coffee](https://cdn.cottle.cloud/littlelink/button-buy-me-a-coffee.svg)](https://www.buymeacoffee.com/seth/)
[![Ko-Fi](https://cdn.cottle.cloud/littlelink/button-ko-fi.svg)](https://ko-fi.com/sethcottle)
[![PayPal](https://cdn.cottle.cloud/littlelink/button-paypal.svg)](https://paypal.me/sethcottle/)
---
@@ -66,3 +88,4 @@ To help build a more privacy focused product, we recommend using [Fathom Analyti
###### ** Analytics in this dashboard start May 03, 2022. View this [Google Sheets file](https://docs.google.com/spreadsheets/d/1GL4SroAdH-OZphBVR5z-BoSukHIEVJfao25q_e9-Ii8/edit?usp=sharing) with the generic unique pageview data from Google Analytics.
[![PayPal](https://cdn.cottle.cloud/littlelink/button-fathom-analytics.svg)](https://usefathom.com/ref/EQVZMV)

View File

@@ -378,6 +378,16 @@ button:hover,
filter: brightness(90%);
}
/* GoFundMe */
.button.button-gofundme {
color: #ffffff;
background-color: #02A95C;
}
.button.button-gofundme:hover,
.button.button-gofundme:focus {
filter: brightness(90%);
}
/* Goodreads */
.button.button-goodreads {
color: #333333;
@@ -464,6 +474,26 @@ button:hover,
filter: brightness(90%);
}
/* Kick */
.button.button-kick {
background-color:#000000;
color: #ffffff;
border: 1px solid #ffffff;
}
.button.button-kick:hover {
filter: brightness(90%);
}
/* Kick Alt */
.button.button-kick-alt {
background-color:#01e701;
color: #000;
}
.button.button-kick-alt:hover {
filter: brightness(90%);
}
/* Kickstarter */
.button.button-kickstarter {
color: #ffffff;
@@ -569,6 +599,16 @@ button:hover,
filter: brightness(90%);
}
/* NGL */
.button.button-ngl {
color: #ffffff;
background-image: linear-gradient(-45deg, #ff8d10, #ec1187);
}
.button.button-ngl:hover,
.button.button-ngl:focus {
filter: brightness(90%);
}
/* Notion */
.button.button-notion {
color: #000000;
@@ -808,6 +848,17 @@ button:hover,
filter: brightness(90%);
}
/* Threads */
.button.button-threads {
color: #FFFFFF;
background-color: #000000;
border: 1px solid #FFFFFF;
}
.button.button-threads:hover,
.button.button-threads:focus {
filter: brightness(90%);
}
/* Threema */
.button.button-threema {
color: #000000;
@@ -860,7 +911,7 @@ button:hover,
filter: brightness(90%);
}
/* Twitter */
/* Twitter (archiving soon, see 'X') */
.button.button-twit {
color: #ffffff;
background-color: #1da1f2;
@@ -883,7 +934,7 @@ button:hover,
/* Untappd */
.button.button-untappd {
color: #ffffff;
color: #000000;
background-color: #ffc000;
}
.button.button-untappd:hover,
@@ -974,6 +1025,17 @@ button:hover,
filter: brightness(90%);
}
/* X */
.button.button-x {
color: #FFFFFF;
background-color: #000000;
border: 1px solid #FFFFFF;
}
.button.button-x:hover,
.button.button-x:focus {
filter: brightness(90%);
}
/* Xing */
.button.button-xing {
color: #ffffff;

View File

@@ -0,0 +1,6 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20.132 18.4042C18.5041 15.5885 15.4684 13.6966 11.9927 13.6966C8.50229 13.6966 5.46654 15.5885 3.83868 18.4042H20.132Z" fill="white"/>
<path d="M23.549 9.19432C22.9331 8.59303 21.9505 8.59303 21.3492 9.19432L19.0174 11.5261C18.4308 12.1127 18.4161 13.066 18.9588 13.6673L19.0174 13.7259C19.6334 14.3272 20.616 14.3272 21.2172 13.7259L23.549 11.3941C24.1503 10.7782 24.1503 9.7956 23.549 9.19432Z" fill="white"/>
<path d="M2.65078 9.19432C2.06416 8.6077 1.11091 8.59303 0.509623 9.13566L0.450962 9.19432C-0.150321 9.81027 -0.150321 10.7929 0.450962 11.3941L2.78277 13.7259C3.39872 14.3272 4.3813 14.3272 4.98259 13.7259C5.58387 13.11 5.58387 12.1274 4.98259 11.5261L2.65078 9.19432Z" fill="white"/>
<path d="M12.0367 5H11.9633C11.1127 5 10.4235 5.68927 10.4088 6.55454V9.85426C10.4088 10.7049 11.1127 11.4088 11.9633 11.4088C12.8139 11.4088 13.5179 10.7049 13.5179 9.85426V6.55454C13.5179 5.71861 12.8579 5.02933 12.0367 5Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

27
images/icons/kick-alt.svg Normal file
View File

@@ -0,0 +1,27 @@
<svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 264 302" width="500" height="572">
<title>kick-svg</title>
<defs>
<clipPath clipPathUnits="userSpaceOnUse" id="cp1">
<path d="m0 1h933v300h-933z"/>
</clipPath>
<clipPath clipPathUnits="userSpaceOnUse" id="cp2">
<path d="m0 1h933.33v300h-933.33z"/>
</clipPath>
</defs>
<style>
.s0 { fill: #000000 }
</style>
<g id="Clip-Path: Clip-Path" clip-path="url(#cp1)">
<g id="Clip-Path">
<g id="Layer">
<g id="Clip-Path: Clip-Path" clip-path="url(#cp2)">
<g id="Clip-Path">
<g id="Layer">
<path id="Layer" fill-rule="evenodd" class="s0" d="m0 1h100v66.7h33.3v-33.4h33.4v-33.3h100v100h-33.4v33.3h-33.3v33.4h33.3v33.3h33.4v100h-100v-33.3h-33.4v-33.4h-33.3v66.7h-100zm666.7 0h100v66.7h33.3v-33.4h33.3v-33.3h100v100h-33.3v33.3h-33.3v33.4h33.3v33.3h33.3v100h-100v-33.3h-33.3v-33.4h-33.3v66.7h-100zm-366.7 0h100v300h-100zm333.3 0v100h-100v100h100v100h-166.6v-33.3h-33.4v-233.4h33.4v-33.3z"/>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

23
images/icons/kick.svg Normal file
View File

@@ -0,0 +1,23 @@
<svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 264 300" width="502" height="571">
<title>Kick_logo-svg</title>
<defs>
<clipPath clipPathUnits="userSpaceOnUse" id="cp1">
<path d="m0 0h933v300h-933z"/>
</clipPath>
<clipPath clipPathUnits="userSpaceOnUse" id="cp2">
<path d="m0 0h933.33v300h-933.33z"/>
</clipPath>
</defs>
<style>
.s0 { fill: #53fc18 }
</style>
<g id="Clip-Path" clip-path="url(#cp1)">
<g id="Layer">
<g id="Clip-Path" clip-path="url(#cp2)">
<g id="Layer">
<path id="Layer" fill-rule="evenodd" class="s0" d="m0 0h100v66.7h33.3v-33.4h33.4v-33.3h100v100h-33.4v33.3h-33.3v33.4h33.3v33.3h33.4v100h-100v-33.3h-33.4v-33.4h-33.3v66.7h-100zm666.7 0h100v66.7h33.3v-33.4h33.3v-33.3h100v100h-33.3v33.3h-33.3v33.4h33.3v33.3h33.3v100h-100v-33.3h-33.3v-33.4h-33.3v66.7h-100zm-366.7 0h100v300h-100zm333.3 0v100h-100v100h100v100h-166.6v-33.3h-33.4v-233.4h33.4v-33.3z"/>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 961 B

1
images/icons/ngl.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 8.5 KiB

3
images/icons/threads.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M17.6921 11.1235C17.5888 11.074 17.4837 11.0263 17.3774 10.9806C17.1921 7.56728 15.327 5.61312 12.1952 5.59312C12.181 5.59304 12.1669 5.59304 12.1528 5.59304C10.2795 5.59304 8.72164 6.39261 7.76275 7.84759L9.48512 9.0291C10.2014 7.94229 11.3256 7.7106 12.1536 7.7106C12.1631 7.7106 12.1727 7.7106 12.1822 7.71069C13.2134 7.71726 13.9915 8.01708 14.4951 8.60175C14.8616 9.02741 15.1067 9.61563 15.2281 10.358C14.3139 10.2026 13.3251 10.1548 12.2681 10.2154C9.29059 10.3869 7.37639 12.1235 7.50495 14.5365C7.57019 15.7605 8.17996 16.8135 9.22188 17.5014C10.1028 18.0829 11.2374 18.3673 12.4165 18.3029C13.9737 18.2175 15.1954 17.6234 16.0476 16.537C16.6949 15.712 17.1042 14.6429 17.285 13.2957C18.0271 13.7436 18.5771 14.333 18.8809 15.0415C19.3974 16.2459 19.4275 18.225 17.8126 19.8385C16.3978 21.252 14.697 21.8635 12.1267 21.8824C9.27552 21.8613 7.11922 20.9469 5.71726 19.1646C4.40444 17.4958 3.72596 15.0852 3.70065 12C3.72596 8.91473 4.40444 6.5042 5.71726 4.83534C7.11922 3.05311 9.27549 2.13875 12.1266 2.11756C14.9985 2.13891 17.1924 3.05767 18.648 4.8485C19.3618 5.7267 19.8999 6.8311 20.2546 8.11879L22.273 7.58028C21.843 5.99528 21.1664 4.62946 20.2456 3.49675C18.3795 1.20084 15.6503 0.0243935 12.1337 0H12.1196C8.6102 0.0243088 5.91151 1.20522 4.09854 3.50991C2.48524 5.5608 1.65305 8.41446 1.62509 11.9916L1.625 12L1.62509 12.0084C1.65305 15.5855 2.48524 18.4393 4.09854 20.4901C5.91151 22.7948 8.6102 23.9757 12.1196 24H12.1337C15.2538 23.9784 17.453 23.1615 19.2647 21.3514C21.6351 18.9833 21.5637 16.0149 20.7825 14.1926C20.222 12.8859 19.1534 11.8245 17.6921 11.1235ZM12.3051 16.1884C11.0001 16.2619 9.6443 15.6761 9.57745 14.4215C9.5279 13.4913 10.2395 12.4533 12.3851 12.3296C12.6309 12.3154 12.872 12.3085 13.1089 12.3085C13.8883 12.3085 14.6174 12.3842 15.2802 12.5291C15.033 15.6169 13.5827 16.1183 12.3051 16.1884Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 1.9 KiB

View File

@@ -1,3 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.9606 13.4174L5.29131 21.5434C4.91336 21.9214 4.34643 22.1104 3.96848 22.1104C3.40155 21.9214 2.45667 21.7324 1.70076 21.1655L0.188949 19.4647C-2.71006e-05 18.8978 -2.71006e-05 18.3308 0.377926 17.9529L6.04722 9.82689L7.18107 8.88201L8.31493 8.31508L8.88186 7.74815L13.6063 2.83476V2.64579H13.7952L13.9842 2.45681V2.26783L14.1732 2.07886L15.1181 2.45681L15.874 3.21272L15.685 3.40169L15.496 3.59067V3.77964L15.3071 3.96862H15.1181C14.0549 6.27101 12.9205 8.53982 11.7165 10.7718L11.5275 12.0946C11.5275 12.4726 11.3386 13.0395 10.9606 13.4174ZM23.811 17.9529L17.9527 9.82689L16.8189 8.88201L15.685 8.31508L15.1181 7.74815C14.8675 7.55727 14.6156 7.36829 14.3622 7.18122C13.7601 8.4548 13.13 9.71495 12.4724 10.9607V12.0946C12.4724 12.4726 12.6614 13.0395 13.0393 13.4174L18.8976 21.5434C19.0866 21.9214 19.6535 22.1104 20.0315 22.1104C20.7874 21.9214 21.5433 21.7324 22.2992 21.1655L23.811 19.4647V17.9529ZM8.31493 3.40169L8.50391 3.59067H8.69289V3.96862H8.88186C9.19372 4.53727 9.50869 5.1042 9.82674 5.66941C10.326 5.09833 10.8299 4.53138 11.3386 3.96862L10.3937 2.83476V2.64579H10.2047V2.45681H10.0157V2.07886L8.88186 2.45681L8.31493 3.21272V3.40169Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.9606 13.4174L5.29131 21.5434C4.91336 21.9214 4.34643 22.1104 3.96848 22.1104C3.40155 21.9214 2.45667 21.7324 1.70076 21.1655L0.188949 19.4647C-2.71127e-05 18.8978 -2.70903e-05 18.3308 0.377926 17.9529L6.04722 9.82689L7.18108 8.88201L8.31493 8.31508L8.88186 7.74815L13.6063 2.83476V2.64579H13.7952L13.9842 2.45681V2.26783L14.1732 2.07886L15.1181 2.45681L15.874 3.21272L15.685 3.40169L15.496 3.59067V3.77964L15.3071 3.96862H15.1181C14.0549 6.27101 12.9205 8.53982 11.7165 10.7718L11.5275 12.0946C11.5275 12.4726 11.3386 13.0395 10.9606 13.4174Z" fill="#C3712A"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M23.811 17.9529L17.9527 9.82689L16.8189 8.88201L15.685 8.31508L15.1181 7.74815C14.8676 7.55727 14.6156 7.36829 14.3622 7.18122C13.7601 8.4548 13.1301 9.71495 12.4724 10.9607V12.0946C12.4724 12.4726 12.6614 13.0395 13.0394 13.4174L18.8976 21.5434C19.0866 21.9214 19.6535 22.1104 20.0315 22.1104C20.7874 21.9214 21.5433 21.7324 22.2992 21.1655L23.811 19.4647V17.9529ZM8.31494 3.40169L8.50392 3.59067H8.69289V3.96862H8.88187C9.19373 4.53727 9.5087 5.1042 9.82675 5.66941C10.326 5.09833 10.83 4.53138 11.3386 3.96862L10.3937 2.83476V2.64579H10.2047V2.45681H10.0157V2.07886L8.88187 2.45681L8.31494 3.21272V3.40169Z" fill="#83481F"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

3
images/icons/x.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18.9014 1.16016H22.5816L14.5415 10.3493L24 22.8537H16.5941L10.7935 15.2699L4.15631 22.8537H0.473926L9.07356 13.0249L0 1.16016H7.59394L12.8372 8.09208L18.9014 1.16016ZM17.6098 20.651H19.649L6.48589 3.24719H4.29759L17.6098 20.651Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 358 B

View File

@@ -63,13 +63,13 @@
-->
<!-- Your Image Here -->
<img src="images/littlelink.svg" class="avatar" srcset="images/littlelink.svg 2x" alt="LittleLink Logo">
<img src="images/littlelink.svg" class="avatar" srcset="images/littlelink.svg 2x" alt="">
<!-- Title -->
<h1>LittleLink</h1>
<h1 role="heading">LittleLink</h1>
<!-- Short Bio -->
<p>An open source DIY <a href="https://linktr.ee" target="_blank" rel="noopener">Linktree</a> alternative.</p>
<p>An open source DIY <a href="https://linktr.ee" target="_blank" rel="noopener" role="link">Linktree</a> alternative.</p>
<!--
@@ -86,6 +86,8 @@
4.) rel="noopener" | This attribute instructs the browser to navigate to the target resource without granting the new browsing context access to the document that opened it.
This is especially useful when opening untrusted links. https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types/noopener
5.) role="button" | The button role identifies an element as a button to assistive technology such as screen readers.
## Breaking down the <img> attributes:
1.) class="icon" | This class is telling the <img> tag that it should use the styling for icons found in `css/brands.css`.
@@ -93,318 +95,337 @@
2.) src="images/icons/[icon-name].svg" | This defines the icon you would like to display from the 'images/icons/' folder. For example, you can change this to src="images/icons/discord.svg" to use the Discord icon.
Add your own 24x24 icons to the "icons" folder to reference them. We recommend providing a SVG.
3.) alt="Example Logo" | This alt attribute helps provides alternate text for an image, this can assist users who use screen readers.
3.) alt="" | Since the text at the end of the snippet, "..>[Button Text]</a><br>", explains what the button is, we use "alt=""" to nullify the icon annoucement from the accessibility tree.
This can improve the experience for assistive technology users by hiding what is essentially duplicated
-->
<!-- Default LittleLink -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/littlelink.svg" alt="LittleLink Logo">LittleLink</a><br>
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/littlelink.svg" alt="">LittleLink</a><br>
<!-- Amazon -->
<a class="button button-amazon" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/amazon.svg" alt="Amazon Logo">Amazon Wishlist</a><br>
<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>
<!-- Amazon Music -->
<a class="button button-amazon-music" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/amazon-music.svg" alt="Amazon Music Logo">Listen on Amazon Music</a><br>
<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>
<!-- Apple App Store -->
<a class="button button-appstore" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/apple.svg" alt="Apple Logo">Apple App Store</a><br>
<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>
<!-- Apple Music -->
<a class="button button-apple-music" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/apple-music.svg" alt="Apple Music Logo">Listen on Apple Music</a><br>
<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>
<!-- Apple Music Alternate -->
<a class="button button-apple-music-alt" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/apple-music-alt.svg" alt="Apple Music Logo">Listen on Apple Music</a><br>
<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>
<!-- Apple Podcasts -->
<a class="button button-apple-podcasts" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/apple-podcasts.svg" alt="Apple Prodcasts Logo">Listen on Apple Podcasts</a><br>
<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>
<!-- Apple Podcasts Alternate -->
<a class="button button-apple-podcasts-alt" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/apple-podcasts-alt.svg" alt="Apple Prodcasts Logo">Listen on Apple Podcasts</a><br>
<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>
<!-- Bandcamp -->
<a class="button button-bandcamp" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/bandcamp.svg" alt="Bandcamp Logo">Bandcamp</a><br>
<a class="button button-bandcamp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/bandcamp.svg" alt="">Bandcamp</a><br>
<!-- Behance -->
<a class="button button-behance" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/behance.svg" alt="Behance Logo">Behance</a><br>
<a class="button button-behance" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/behance.svg" alt="">Behance</a><br>
<!-- Bluesky -->
<a class="button button-bluesky" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/bluesky.svg" alt="Bluesky Logo">Bluesky</a><br>
<a class="button button-bluesky" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/bluesky.svg" alt="">Bluesky</a><br>
<!-- Buy Me A Coffee -->
<a class="button button-coffee" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/buy-me-a-coffee.svg" alt="Buy Me A Coffee Logo">Buy Me A Coffee</a><br>
<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>
<!-- Cal.com -->
<a class="button button-cal" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/cal.svg" alt="Cal.com Logo">Schedule with Cal.com</a><br>
<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>
<!-- Calendly -->
<a class="button button-calendly" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/calendly.svg" alt="Calendly Logo">Schedule with Calendly</a><br>
<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>
<!-- Cash App -->
<a class="button button-cash-app" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/cash-app-dollar.svg" alt="Cash App Logo">Cash App</a><br>
<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>
<!-- Clubhouse -->
<a class="button button-clubhouse" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/clubhouse.svg" alt="Clubhouse Logo">Clubhouse</a><br>
<a class="button button-clubhouse" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/clubhouse.svg" alt="">Clubhouse</a><br>
<!-- Dev.to -->
<a class="button button-dev-to" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/dev-to.svg" alt="Dev.to Logo">Dev.to</a><br>
<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>
<!-- Discord -->
<a class="button button-discord" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/discord.svg" alt="Discord Logo">Discord</a><br>
<a class="button button-discord" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/discord.svg" alt="">Discord</a><br>
<!-- Dribbble -->
<a class="button button-dribbble" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/dribbble.svg" alt="Dribbble Logo">Dribbble</a><br>
<a class="button button-dribbble" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/dribbble.svg" alt="">Dribbble</a><br>
<!-- Etsy -->
<a class="button button-etsy" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/etsy.svg" alt="Etsy Logo">Shop on Etsy</a><br>
<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>
<!-- Facebook -->
<a class="button button-faceb" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/facebook.svg" alt="Facebook Logo">Find us on Facebook</a><br>
<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>
<!-- Facebook Messenger -->
<a class="button button-messenger" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/messenger.svg" alt="Facebook Messenger Logo">Chat on Messenger</a><br>
<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>
<!-- Figma -->
<a class="button button-figma" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/figma.svg" alt="Figma Logo">Figma Community</a><br>
<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>
<!-- Fiverr -->
<a class="button button-fiverr" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/fiverr.svg" alt="Fiverr Logo">Fiverr Gig</a><br>
<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>
<!-- Flickr -->
<a class="button button-flickr" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/flickr.svg" alt="Flickr Logo">Flickr</a><br>
<a class="button button-flickr" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/flickr.svg" alt="">Flickr</a><br>
<!-- GitHub -->
<a class="button button-github" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/github.svg" alt="GitHub Logo">GitHub</a><br>
<a class="button button-github" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/github.svg" alt="">GitHub</a><br>
<!-- GitLab -->
<a class="button button-gitlab" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/gitlab.svg" alt="GitLab Logo">GitLab</a><br>
<a class="button button-gitlab" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/gitlab.svg" alt="">GitLab</a><br>
<!-- 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>
<!-- Goodreads -->
<a class="button button-goodreads" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/goodreads.svg" alt="Goodreads Logo">Goodreads</a><br>
<a class="button button-goodreads" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/goodreads.svg" alt="">Goodreads</a><br>
<!-- Google Drive -->
<a class="button button-google-black" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/google-drive.svg" alt="Google Drive Logo">View in Google Drive</a><br>
<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>
<!-- Google Play Store -->
<a class="button button-playstore" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/google-play.svg" alt="Google Play Store Logo">Google Play Store</a><br>
<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>
<!-- Google Podcasts -->
<a class="button button-google-podcasts" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/google-podcasts.svg" alt="Google Podcasts Logo">Listen on Google Podcasts</a><br>
<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 -->
<a class="button button-google-scholar" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/google-scholar.svg" alt="Google Scholar Logo">Google Scholar</a><br>
<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>
<!-- Guilded -->
<a class="button button-guilded" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/guilded.svg" alt="Guilded Logo">Guilded</a><br>
<a class="button button-guilded" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/guilded.svg" alt="">Guilded</a><br>
<!-- Hashnode -->
<a class="button button-hashnode" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/hashnode.svg" alt="Hashnode Logo">Hashnode</a><br>
<a class="button button-hashnode" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/hashnode.svg" alt="">Hashnode</a><br>
<!-- Instagram -->
<a class="button button-instagram" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/instagram.svg" alt="Instagram Logo">Instagram</a><br>
<a class="button button-instagram" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/instagram.svg" alt="">Instagram</a><br>
<!-- 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>
<!-- 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>
<!-- Kickstarter -->
<a class="button button-kickstarter" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/kickstarter.svg" alt="Kickstarter Logo">Kickstarter</a><br>
<a class="button button-kickstarter" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/kickstarter.svg" alt="">Kickstarter</a><br>
<!-- Kit -->
<a class="button button-kit" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/kit.svg" alt="Kit Logo">Kit</a><br>
<a class="button button-kit" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/kit.svg" alt="">Kit</a><br>
<!-- Ko-fi -->
<a class="button button-ko-fi" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/ko-fi.svg" alt="Ko-fi Logo">Ko-fi</a><br>
<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>
<!-- Last.fm -->
<a class="button button-last-fm" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/last-fm.svg" alt="Last.fm Logo">Last.fm</a><br>
<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>
<!-- Letterboxd -->
<a class="button button-letterboxd" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/letterboxd.svg" alt="Letterboxd Logo">Letterboxd</a><br>
<a class="button button-letterboxd" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/letterboxd.svg" alt="">Letterboxd</a><br>
<!-- Line -->
<a class="button button-line" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/line.svg" alt="Line Logo">Line</a><br>
<a class="button button-line" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/line.svg" alt="">Line</a><br>
<!-- LinkedIn -->
<a class="button button-linked" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/linkedin.svg" alt="LinkedIn Logo">LinkedIn</a><br>
<a class="button button-linked" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/linkedin.svg" alt="">LinkedIn</a><br>
<!-- Mailchimp -->
<a class="button button-mailchimp" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/mailchimp.svg" alt="Mailchimp Logo">Mailchimp</a><br>
<a class="button button-mailchimp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/mailchimp.svg" alt="">Mailchimp</a><br>
<!-- Mastodon -->
<a class="button button-mastodon" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/mastodon.svg" alt="Mastodon Logo">Mastodon</a><br>
<a class="button button-mastodon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/mastodon.svg" alt="">Mastodon</a><br>
<!-- Medium -->
<a class="button button-medium" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/medium.svg" alt="Medium Logo">Medium</a><br>
<a class="button button-medium" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/medium.svg" alt="">Medium</a><br>
<!-- NGL -->
<a class="button button-ngl" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/ngl.svg" alt="">NGL</a><br>
<!-- Notion -->
<a class="button button-notion" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/notion.svg" alt="Notion Logo">Notion</a><br>
<a class="button button-notion" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/notion.svg" alt="">Notion</a><br>
<!-- OnlyFans -->
<a class="button button-onlyfans" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/onlyfans.svg" alt="OnlyFans Logo">OnlyFans (18+)</a><br>
<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>
<!-- Patreon -->
<a class="button button-patreon" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/patreon.svg" alt="Patreon Logo">Patreon</a><br>
<a class="button button-patreon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/patreon.svg" alt="">Patreon</a><br>
<!-- PayPal -->
<a class="button button-paypal" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/paypal.svg" alt="PayPal Logo">PayPal</a><br>
<a class="button button-paypal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/paypal.svg" alt="">PayPal</a><br>
<!-- Pinterest -->
<a class="button button-pinterest" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/pinterest.svg" alt="Pinterest Logo">Pinterest</a><br>
<a class="button button-pinterest" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/pinterest.svg" alt="">Pinterest</a><br>
<!-- Post.news -->
<a class="button button-post-news" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/post-news.svg" alt="Post.news Logo">Post.news</a><br>
<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>
<!-- Product Hunt -->
<a class="button button-product-hunt" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/product-hunt.svg" alt="Product Hunt Logo">Product Hunt</a><br>
<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>
<!-- Read.cv -->
<a class="button button-read-cv" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/read-cv.svg" alt="Read.cv Logo">Read.cv</a><br>
<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>
<!-- Redbubble -->
<a class="button button-redbubble" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/redbubble.svg" alt="Redbubble Logo">Redbubble</a><br>
<a class="button button-redbubble" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/redbubble.svg" alt="">Redbubble</a><br>
<!-- Reddit -->
<a class="button button-reddit" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/reddit.svg" alt="Reddit Logo">Reddit</a><br>
<a class="button button-reddit" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/reddit.svg" alt="">Reddit</a><br>
<!-- Shop -->
<a class="button button-shop" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/shop.svg" alt="Shop Logo">Buy with Shop</a><br>
<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>
<!-- Signal -->
<a class="button button-signal" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/signal.svg" alt="Signal Logo">Signal</a><br>
<a class="button button-signal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/signal.svg" alt="">Signal</a><br>
<!-- Skoob -->
<a class="button button-skoob" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/skoob.svg" alt="Skoob Logo">Skoob</a><br>
<a class="button button-skoob" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/skoob.svg" alt="">Skoob</a><br>
<!-- Slack -->
<a class="button button-slack" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/slack.svg" alt="Slack Logo">Join Slack</a><br>
<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>
<!-- Snapchat -->
<a class="button button-snapchat" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/snapchat.svg" alt="Snapchat Logo">Snapchat</a><br>
<a class="button button-snapchat" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/snapchat.svg" alt="">Snapchat</a><br>
<!-- SoundCloud -->
<a class="button button-soundcloud" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/soundcloud.svg" alt="SoundCloud Logo">SoundCloud</a><br>
<a class="button button-soundcloud" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/soundcloud.svg" alt="">SoundCloud</a><br>
<!-- Spotify -->
<a class="button button-spotify" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/spotify.svg" alt="Spotify Logo">Listen on Spotify</a><br>
<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>
<!-- Spotify Alt -->
<a class="button button-spotify-alt" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/spotify-alt.svg" alt="Spotify Logo">Listen on Spotify</a><br>
<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>
<!-- Square -->
<a class="button button-square" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/square.svg" alt="Square Logo">Buy with Square</a><br>
<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>
<!-- Steam -->
<a class="button button-steam" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/steam.svg" alt="Steam Logo">Steam</a><br>
<a class="button button-steam" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/steam.svg" alt="">Steam</a><br>
<!-- Strava -->
<a class="button button-strava" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/strava.svg" alt="Strava Logo">Strava</a><br>
<a class="button button-strava" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/strava.svg" alt="">Strava</a><br>
<!-- Substack -->
<a class="button button-substack" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/substack.svg" alt="Substack Logo">Substack</a><br>
<a class="button button-substack" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/substack.svg" alt="">Substack</a><br>
<!-- Telegram -->
<a class="button button-telegram" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/telegram.svg" alt="Telegram Logo">Telegram</a><br>
<a class="button button-telegram" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/telegram.svg" alt="">Telegram</a><br>
<!-- 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>
<!-- Threema -->
<a class="button button-threema" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/threema.svg" alt="Threema Logo">Threema</a><br>
<a class="button button-threema" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/threema.svg" alt="">Threema</a><br>
<!-- TikTok -->
<a class="button button-tiktok" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/tiktok.svg" alt="TikTok Logo">TikTok</a><br>
<a class="button button-tiktok" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/tiktok.svg" alt="">TikTok</a><br>
<!-- Trello -->
<a class="button button-trello" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/trello.svg" alt="Trello Logo">Trello</a><br>
<a class="button button-trello" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/trello.svg" alt="">Trello</a><br>
<!-- Tumblr -->
<a class="button button-tumb" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/tumblr.svg" alt="Tumblr Logo">Tumblr</a><br>
<a class="button button-tumb" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/tumblr.svg" alt="">Tumblr</a><br>
<!-- Twitch -->
<a class="button button-twitch" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/twitch.svg" alt="Twitch Logo">Twitch</a><br>
<a class="button button-twitch" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/twitch.svg" alt="">Twitch</a><br>
<!-- Twitter -->
<a class="button button-twit" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/twitter.svg" alt="Twitter Logo">Twitter</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 -->
<a class="button button-unsplash" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/unsplash.svg" alt="Unsplash Logo">Unsplash</a><br>
<a class="button button-unsplash" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/unsplash.svg" alt="">Unsplash</a><br>
<!-- Untappd -->
<a class="button button-untappd" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/untappd.svg" alt="Untapped Logo">Untappd</a><br>
<a class="button button-untappd" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/untappd.svg" alt="">Untappd</a><br>
<!-- Upwork -->
<a class="button button-upwork" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/upwork.svg" alt="Upwork Logo">Upwork</a><br>
<a class="button button-upwork" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/upwork.svg" alt="">Upwork</a><br>
<!-- Venmo -->
<a class="button button-venmo" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/venmo.svg" alt="Venmo Logo">Venmo</a><br>
<a class="button button-venmo" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/venmo.svg" alt="">Venmo</a><br>
<!-- Vimeo -->
<a class="button button-vimeo" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/vimeo.svg" alt="Clubhouse Logo">Vimeo</a><br>
<a class="button button-vimeo" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/vimeo.svg" alt="">Vimeo</a><br>
<!-- VRChat -->
<a class="button button-vrchat" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/vrchat.svg" alt="VR Chat Logo">VRChat</a><br>
<a class="button button-vrchat" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/vrchat.svg" alt="">VRChat</a><br>
<!-- VSCO -->
<a class="button button-vsco" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/vsco.svg" alt="VR Chat Logo">VSCO</a><br>
<a class="button button-vsco" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/vsco.svg" alt="">VSCO</a><br>
<!-- WhatsApp -->
<a class="button button-whatsapp" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/whatsapp.svg" alt="WhatsApp Logo">WhatsApp</a><br>
<a class="button button-whatsapp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/whatsapp.svg" alt="">WhatsApp</a><br>
<!-- WordPress -->
<a class="button button-wordpress" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/wordpress.svg" alt="WordPress Logo">WordPress</a><br>
<a class="button button-wordpress" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/wordpress.svg" alt="">WordPress</a><br>
<!-- 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>
<!-- Xing -->
<a class="button button-xing" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/xing.svg" alt="Xing Logo">Xing</a><br>
<a class="button button-xing" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/xing.svg" alt="">Xing</a><br>
<!-- YouTube -->
<a class="button button-yt" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/youtube.svg" alt="YouTube Logo">YouTube</a><br>
<a class="button button-yt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/youtube.svg" alt="">YouTube</a><br>
<!-- YouTube Music -->
<a class="button button-yt" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/youtube-music.svg" alt="YouTube Music Logo">Listen on YouTube Music</a><br>
<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>
<!-- Zoom -->
<a class="button button-zoom" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/zoom.svg" alt="Zoom Logo">Join Zoom Webinar</a><br>
<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>
<!-- Generic Blog -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-blog.svg" alt="Blog Icon">Read our blog</a><br>
<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>
<!-- Generic Calendar -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-calendar.svg" alt="Calendar Icon">Event RSVP</a><br>
<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>
<!-- Generic Cloud -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-cloud.svg" alt="Cloud Icon">Download File</a><br>
<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>
<!-- Generic Code -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-code.svg" alt="Code Icon">View the code</a><br>
<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>
<!-- Generic Computer -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-computer.svg" alt="Computer Icon">Homelab Setup</a><br>
<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>
<!-- Generic Email -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-email.svg" alt="Email Icon">Email Us</a><br>
<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>
<!-- Generic Email Alt -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-email-alt.svg" alt="Email Alt Icon">Email Us</a><br>
<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>
<!-- Generic Homepage -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-homepage.svg" alt="Homepage Icon">Visit Homepage</a><br>
<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>
<!-- Generic Map -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-map.svg" alt="Map Icon">Get Directions</a><br>
<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>
<!-- Generic Phone -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-phone.svg" alt="Phone Icon">Call Us</a><br>
<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>
<!-- Generic Review -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-review.svg" alt="Review Icon">Leave us a review</a><br>
<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>
<!-- Generic RSS -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-rss.svg" alt="RSS Icon">RSS Subscribe</a><br>
<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>
<!-- Generic Shopping Bag -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-shopping-bag.svg" alt="Shopping Bag Icon">Visit Our Shop</a><br>
<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>
<!-- Generic Shopping Tag -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-shopping-tag.svg" alt="Shopping Tag Icon">10% Discount</a><br>
<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>
<!-- Generic SMS -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-sms.svg" alt="SMS Icon">Send us a message</a><br>
<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>
<!-- Generic Website -->
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/generic-website.svg" alt="Website Icon">Visit Website</a><br>
<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>
<br>
<!--
@@ -413,7 +434,7 @@
This also includes a link to the LittleLink repository to make forking LittleLink easier.
You can edit or remove anything here to make your own footer.
-->
<p><a href="privacy.html">Privacy Policy</a> | Build your own by forking <a href="https://littlelink.io" target="_blank" rel="noopener">LittleLink</a>.</p>
<p><a href="privacy.html">Privacy Policy</a> | Build your own by forking <a href="https://littlelink.io" target="_blank" rel="noopener" role="button">LittleLink</a>.</p>
</div>
</div>