Compare commits
No commits in common. "f8d4f03cf83ff68643156399ba85c93632d910cd" and "a7d942622b802617dfd3d5844607d4ea810760a2" have entirely different histories.
f8d4f03cf8
...
a7d942622b
18
Caddyfile
18
Caddyfile
@ -1,18 +0,0 @@
|
|||||||
:80 {
|
|
||||||
root * /srv
|
|
||||||
file_server {
|
|
||||||
hide Caddyfile
|
|
||||||
hide .git .gitignore Caddyfile *.md
|
|
||||||
}
|
|
||||||
|
|
||||||
handle_errors {
|
|
||||||
@404 {
|
|
||||||
expression {http.error.status_code} == 404
|
|
||||||
}
|
|
||||||
rewrite @404 /404.html
|
|
||||||
file_server
|
|
||||||
}
|
|
||||||
|
|
||||||
log
|
|
||||||
metrics /metrics
|
|
||||||
}
|
|
||||||
16
README.md
16
README.md
@ -1,13 +1,11 @@
|
|||||||
|
|
||||||
|
|
||||||
# LittleLink
|
# LittleLink
|
||||||
This repository is a fork of [LittleLink](https://github.com/sethcottle/littlelink) hosted on my [website](https://syyrell.com). It adds additional websites as long as a custom toggle button to switch between dark and light mode. Default theme is chosen according to client operating system preference thanks to **prefers-color-scheme** CSS media feature (see [Mozilla documentation](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme))
|
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.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
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.
|
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.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -15,13 +13,9 @@ Using [Skeleton](http://getskeleton.com/) let us build something that loads quic
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
No need for gulp, npm, or anything else to make LittleLink work—it uses the bare essentials. You can automatically fork and deploy LittleLink with [Netlify](https://www.netlify.com/), [Vercel](https://vercel.com/), or [Amplify](https://aws.amazon.com/amplify). 👇️
|
No need for gulp, npm, or anything else to make LittleLink work—it uses the bare essentials. You can automatically fork and deploy LittleLink with [Vercel](https://vercel.com/). Enjoy free and fast hosting with automatic deployments on every branch push with one click below. 👇️
|
||||||
|
|
||||||
[](https://app.netlify.com/start/deploy?repository=https://github.com/sethcottle/littlelink)
|
[](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.)
|
||||||
|
|
||||||
[](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fsethcottle%2Flittlelink&project-name=littlelink&repository-name=littlelink)
|
|
||||||
|
|
||||||
[](https://console.aws.amazon.com/amplify/home#/deploy?repo=https://github.com/sethcottle/littlelink)
|
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
@ -49,8 +43,6 @@ Duplicate the [LittleLink Template on Figma Community](https://www.figma.com/com
|
|||||||
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 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.
|
||||||
|
|
||||||
#### 🏢 Business Supporters
|
#### 🏢 Business Supporters
|
||||||
**[links.dev](https://github.com/fatih-yavuz/links.dev)**
|
|
||||||
|
|
||||||
[Add Your Company Name](https://www.buymeacoffee.com/seth/e/50574)
|
[Add Your Company Name](https://www.buymeacoffee.com/seth/e/50574)
|
||||||
|
|
||||||
#### ✨ Individual Supporters
|
#### ✨ Individual Supporters
|
||||||
|
|||||||
@ -33,26 +33,23 @@
|
|||||||
button {
|
button {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
height: 100%;
|
height: 48px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
width: 300px;
|
width: 300px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
line-height: 20px;
|
line-height: 48px;
|
||||||
padding: 14px 12px 12px 12px;
|
|
||||||
letter-spacing: 0.1px;
|
letter-spacing: 0.1px;
|
||||||
white-space: wrap;
|
white-space: wrap;
|
||||||
outline: none;
|
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
}
|
}
|
||||||
button:hover,
|
button:hover,
|
||||||
.button:focus {
|
.button:focus {
|
||||||
color: #212121;
|
color: #333;
|
||||||
border-color: #888;
|
border-color: #888;
|
||||||
outline: #7AB8FF solid 3px
|
outline: 0;
|
||||||
}
|
}
|
||||||
.button.button-primary {
|
.button.button-primary {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
@ -357,16 +354,6 @@ button:hover,
|
|||||||
filter: brightness(90%);
|
filter: brightness(90%);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Gitea */
|
|
||||||
.button.button-gitea {
|
|
||||||
color: #ffffff;
|
|
||||||
background-color: #87ab63;
|
|
||||||
}
|
|
||||||
.button.button-gitea:hover,
|
|
||||||
.button.button-gitea:focus {
|
|
||||||
filter: brightness(90%);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* GitHub */
|
/* GitHub */
|
||||||
.button.button-github {
|
.button.button-github {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
@ -388,16 +375,6 @@ button:hover,
|
|||||||
filter: brightness(90%);
|
filter: brightness(90%);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* GoFundMe */
|
|
||||||
.button.button-gofundme {
|
|
||||||
color: #ffffff;
|
|
||||||
background-color: #02A95C;
|
|
||||||
}
|
|
||||||
.button.button-gofundme:hover,
|
|
||||||
.button.button-gofundme:focus {
|
|
||||||
filter: brightness(90%);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Goodreads */
|
/* Goodreads */
|
||||||
.button.button-goodreads {
|
.button.button-goodreads {
|
||||||
color: #333333;
|
color: #333333;
|
||||||
@ -453,16 +430,6 @@ button:hover,
|
|||||||
filter: brightness(90%);
|
filter: brightness(90%);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* GPG */
|
|
||||||
.button.button-gpg {
|
|
||||||
color: #ffffff;
|
|
||||||
background-color: #29aff1;
|
|
||||||
}
|
|
||||||
.button.button-gpg:hover,
|
|
||||||
.button.button-gpg:focus {
|
|
||||||
filter: brightness(90%);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Guilded */
|
/* Guilded */
|
||||||
.button.button-guilded {
|
.button.button-guilded {
|
||||||
color: #000000;
|
color: #000000;
|
||||||
@ -484,16 +451,6 @@ button:hover,
|
|||||||
filter: brightness(90%);
|
filter: brightness(90%);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Hedgedoc */
|
|
||||||
.button.button-hedgedoc {
|
|
||||||
color: #ffffff;
|
|
||||||
background-color: #eebc7a;
|
|
||||||
}
|
|
||||||
.button.button-hedgedoc:hover,
|
|
||||||
.button.button-hedgedoc:focus {
|
|
||||||
filter: brightness(90%);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Instagram */
|
/* Instagram */
|
||||||
.button.button-instagram {
|
.button.button-instagram {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
@ -598,20 +555,6 @@ button:hover,
|
|||||||
filter: brightness(90%);
|
filter: brightness(90%);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Mealie */
|
|
||||||
.button.button-mealie {
|
|
||||||
color: #ffffff;
|
|
||||||
background-color: #e58325;
|
|
||||||
}
|
|
||||||
.button.button-mealie:hover,
|
|
||||||
.button.button-mealie:focus {
|
|
||||||
filter: brightness(90%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon.icon-mealie {
|
|
||||||
filter: brightness(0) invert(1);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Medium */
|
/* Medium */
|
||||||
.button.button-medium {
|
.button.button-medium {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
|||||||
@ -124,30 +124,12 @@ p {
|
|||||||
|
|
||||||
/* Links
|
/* Links
|
||||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||||
a {
|
|
||||||
color: #2457F5;
|
|
||||||
}
|
|
||||||
a:hover {
|
|
||||||
color: #083BDA;
|
|
||||||
}
|
|
||||||
a:focus {
|
|
||||||
outline: #7AB8FF solid 2px;
|
|
||||||
border-radius: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Link Color Dark Theme */
|
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
a {
|
a {
|
||||||
color: #4899F7;
|
color: #4899F7;
|
||||||
}
|
}
|
||||||
a:hover {
|
a:hover {
|
||||||
color: #7AB8FF;
|
color: #7AB8FF;
|
||||||
}
|
}
|
||||||
a:focus {
|
|
||||||
outline: #7AB8FF solid 2px;
|
|
||||||
border-radius: 2px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Code
|
/* Code
|
||||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||||
@ -277,49 +259,3 @@ hr {
|
|||||||
url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.ttf') format('truetype'), /* Safari, Android, iOS */
|
url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.ttf') format('truetype'), /* Safari, Android, iOS */
|
||||||
url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.svg#OpenSans') format('svg'); /* Legacy iOS */
|
url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.svg#OpenSans') format('svg'); /* Legacy iOS */
|
||||||
}
|
}
|
||||||
|
|
||||||
label {
|
|
||||||
width:70px;
|
|
||||||
height:35px;
|
|
||||||
position: relative;
|
|
||||||
display: block;
|
|
||||||
top: -40px;
|
|
||||||
left: 265px;
|
|
||||||
background: #ebebeb;
|
|
||||||
border-radius: 20px;
|
|
||||||
box-shadow: inset 0px 0px 10px rgba(0,0,0,0.4), inset 0px 0px 10px rgba(255,255,255,0.4);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
label:after {
|
|
||||||
content: "";
|
|
||||||
width:28px;
|
|
||||||
height: 28px;
|
|
||||||
position: absolute;
|
|
||||||
top:4px;
|
|
||||||
left:2px;
|
|
||||||
background: linear-gradient(180deg,#ffcc89,#d8860b);
|
|
||||||
border-radius: 60px;
|
|
||||||
box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
|
|
||||||
}
|
|
||||||
input {
|
|
||||||
width: 0;
|
|
||||||
height: 0;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
input:checked + label {
|
|
||||||
background: #242424;
|
|
||||||
}
|
|
||||||
input:checked + label:after {
|
|
||||||
left:68px;
|
|
||||||
transform: translateX(-100%);
|
|
||||||
background: linear-gradient(180deg,#777,#3a3a3a);
|
|
||||||
}
|
|
||||||
label, label:after {
|
|
||||||
transition: 0.3s
|
|
||||||
}
|
|
||||||
|
|
||||||
label:active:after{
|
|
||||||
width: 40px;
|
|
||||||
}
|
|
||||||
@ -1,31 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="utf-8"?>
|
|
||||||
<svg version="1.1" id="main_outline" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
|
||||||
y="0px" viewBox="0 0 640 640" style="enable-background:new 0 0 640 640;" xml:space="preserve">
|
|
||||||
<g>
|
|
||||||
<path id="teabag" style="fill:#FFFFFF" d="M395.9,484.2l-126.9-61c-12.5-6-17.9-21.2-11.8-33.8l61-126.9c6-12.5,21.2-17.9,33.8-11.8
|
|
||||||
c17.2,8.3,27.1,13,27.1,13l-0.1-109.2l16.7-0.1l0.1,117.1c0,0,57.4,24.2,83.1,40.1c3.7,2.3,10.2,6.8,12.9,14.4
|
|
||||||
c2.1,6.1,2,13.1-1,19.3l-61,126.9C423.6,484.9,408.4,490.3,395.9,484.2z"/>
|
|
||||||
<g>
|
|
||||||
<g>
|
|
||||||
<path style="fill:#609926" d="M622.7,149.8c-4.1-4.1-9.6-4-9.6-4s-117.2,6.6-177.9,8c-13.3,0.3-26.5,0.6-39.6,0.7c0,39.1,0,78.2,0,117.2
|
|
||||||
c-5.5-2.6-11.1-5.3-16.6-7.9c0-36.4-0.1-109.2-0.1-109.2c-29,0.4-89.2-2.2-89.2-2.2s-141.4-7.1-156.8-8.5
|
|
||||||
c-9.8-0.6-22.5-2.1-39,1.5c-8.7,1.8-33.5,7.4-53.8,26.9C-4.9,212.4,6.6,276.2,8,285.8c1.7,11.7,6.9,44.2,31.7,72.5
|
|
||||||
c45.8,56.1,144.4,54.8,144.4,54.8s12.1,28.9,30.6,55.5c25,33.1,50.7,58.9,75.7,62c63,0,188.9-0.1,188.9-0.1s12,0.1,28.3-10.3
|
|
||||||
c14-8.5,26.5-23.4,26.5-23.4s12.9-13.8,30.9-45.3c5.5-9.7,10.1-19.1,14.1-28c0,0,55.2-117.1,55.2-231.1
|
|
||||||
C633.2,157.9,624.7,151.8,622.7,149.8z M125.6,353.9c-25.9-8.5-36.9-18.7-36.9-18.7S69.6,321.8,60,295.4
|
|
||||||
c-16.5-44.2-1.4-71.2-1.4-71.2s8.4-22.5,38.5-30c13.8-3.7,31-3.1,31-3.1s7.1,59.4,15.7,94.2c7.2,29.2,24.8,77.7,24.8,77.7
|
|
||||||
S142.5,359.9,125.6,353.9z M425.9,461.5c0,0-6.1,14.5-19.6,15.4c-5.8,0.4-10.3-1.2-10.3-1.2s-0.3-0.1-5.3-2.1l-112.9-55
|
|
||||||
c0,0-10.9-5.7-12.8-15.6c-2.2-8.1,2.7-18.1,2.7-18.1L322,273c0,0,4.8-9.7,12.2-13c0.6-0.3,2.3-1,4.5-1.5c8.1-2.1,18,2.8,18,2.8
|
|
||||||
l110.7,53.7c0,0,12.6,5.7,15.3,16.2c1.9,7.4-0.5,14-1.8,17.2C474.6,363.8,425.9,461.5,425.9,461.5z"/>
|
|
||||||
<path style="fill:#609926" d="M326.8,380.1c-8.2,0.1-15.4,5.8-17.3,13.8c-1.9,8,2,16.3,9.1,20c7.7,4,17.5,1.8,22.7-5.4
|
|
||||||
c5.1-7.1,4.3-16.9-1.8-23.1l24-49.1c1.5,0.1,3.7,0.2,6.2-0.5c4.1-0.9,7.1-3.6,7.1-3.6c4.2,1.8,8.6,3.8,13.2,6.1
|
|
||||||
c4.8,2.4,9.3,4.9,13.4,7.3c0.9,0.5,1.8,1.1,2.8,1.9c1.6,1.3,3.4,3.1,4.7,5.5c1.9,5.5-1.9,14.9-1.9,14.9
|
|
||||||
c-2.3,7.6-18.4,40.6-18.4,40.6c-8.1-0.2-15.3,5-17.7,12.5c-2.6,8.1,1.1,17.3,8.9,21.3c7.8,4,17.4,1.7,22.5-5.3
|
|
||||||
c5-6.8,4.6-16.3-1.1-22.6c1.9-3.7,3.7-7.4,5.6-11.3c5-10.4,13.5-30.4,13.5-30.4c0.9-1.7,5.7-10.3,2.7-21.3
|
|
||||||
c-2.5-11.4-12.6-16.7-12.6-16.7c-12.2-7.9-29.2-15.2-29.2-15.2s0-4.1-1.1-7.1c-1.1-3.1-2.8-5.1-3.9-6.3c4.7-9.7,9.4-19.3,14.1-29
|
|
||||||
c-4.1-2-8.1-4-12.2-6.1c-4.8,9.8-9.7,19.7-14.5,29.5c-6.7-0.1-12.9,3.5-16.1,9.4c-3.4,6.3-2.7,14.1,1.9,19.8
|
|
||||||
C343.2,346.5,335,363.3,326.8,380.1z"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.5 KiB |
@ -1,6 +0,0 @@
|
|||||||
<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>
|
|
||||||
|
Before Width: | Height: | Size: 1.0 KiB |
@ -1,88 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
||||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
|
||||||
<svg
|
|
||||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
|
||||||
xmlns:cc="http://web.resource.org/cc/"
|
|
||||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
|
||||||
xmlns:svg="http://www.w3.org/2000/svg"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
|
||||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
|
||||||
id="svg2"
|
|
||||||
sodipodi:version="0.32"
|
|
||||||
inkscape:version="0.45"
|
|
||||||
width="70"
|
|
||||||
height="92"
|
|
||||||
version="1.0"
|
|
||||||
sodipodi:docbase="D:\Desktop"
|
|
||||||
sodipodi:docname="GnuPG-Logo.png"
|
|
||||||
sodipodi:modified="true">
|
|
||||||
<metadata
|
|
||||||
id="metadata7">
|
|
||||||
<rdf:RDF>
|
|
||||||
<cc:Work
|
|
||||||
rdf:about="">
|
|
||||||
<dc:format>image/svg+xml</dc:format>
|
|
||||||
<dc:type
|
|
||||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
|
||||||
</cc:Work>
|
|
||||||
</rdf:RDF>
|
|
||||||
</metadata>
|
|
||||||
<defs
|
|
||||||
id="defs5" />
|
|
||||||
<sodipodi:namedview
|
|
||||||
inkscape:window-height="975"
|
|
||||||
inkscape:window-width="1280"
|
|
||||||
inkscape:pageshadow="2"
|
|
||||||
inkscape:pageopacity="0.0"
|
|
||||||
guidetolerance="10.0"
|
|
||||||
gridtolerance="10.0"
|
|
||||||
objecttolerance="10.0"
|
|
||||||
borderopacity="1.0"
|
|
||||||
bordercolor="#666666"
|
|
||||||
pagecolor="#ffffff"
|
|
||||||
id="base"
|
|
||||||
width="70px"
|
|
||||||
height="92px"
|
|
||||||
inkscape:zoom="4"
|
|
||||||
inkscape:cx="37.678772"
|
|
||||||
inkscape:cy="50.578436"
|
|
||||||
inkscape:window-x="-4"
|
|
||||||
inkscape:window-y="-4"
|
|
||||||
inkscape:current-layer="svg2" />
|
|
||||||
<rect
|
|
||||||
style="opacity:1;fill:#0093dd;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.5;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
|
|
||||||
id="rect3132"
|
|
||||||
width="70"
|
|
||||||
height="47.099998"
|
|
||||||
x="0"
|
|
||||||
y="44.900002" />
|
|
||||||
<rect
|
|
||||||
style="opacity:1;fill:#0093dd;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.5;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
|
|
||||||
id="rect4103"
|
|
||||||
width="15.009007"
|
|
||||||
height="19.485378"
|
|
||||||
x="4.7396865"
|
|
||||||
y="25.468845" />
|
|
||||||
<rect
|
|
||||||
style="opacity:1;fill:#0093dd;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.5;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
|
|
||||||
id="rect4105"
|
|
||||||
width="15.18455"
|
|
||||||
height="19.239996"
|
|
||||||
x="50.117794"
|
|
||||||
y="25.694933" />
|
|
||||||
<path
|
|
||||||
style="opacity:1;fill:#0093dd;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
|
||||||
d="M 35.625,0 C 13.155955,0.16164779 4.75,20.998357 4.75,25.5625 C 10.896546,25.562499 17.561658,25.90625 18.96875,25.90625 C 19.298759,25.90625 19.367598,25.906322 19.6875,25.90625 C 21.365862,19.035999 27.552617,13.9375 34.9375,13.9375 C 42.289526,13.9375 48.445364,18.988532 50.15625,25.8125 C 50.543323,25.812313 50.720292,25.8125 51.125,25.8125 C 63.764162,25.8125 65.25,25.90625 65.25,25.90625 C 65.25,25.90625 60.201152,-0.17554394 35.625,0 z "
|
|
||||||
id="path6045" />
|
|
||||||
<path
|
|
||||||
style="fill:#ffffff;fill-rule:evenodd;stroke:none;stroke-width:0.1;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;fill-opacity:1"
|
|
||||||
d="M 10.269321,25.20553 C 21.691029,1.9172856 37.700972,5.1573508 46.958242,6.5921309 C 46.958242,6.5921309 34.785164,0.76242296 23.084029,6.5100997 C 11.608567,12.146925 10.269321,25.20553 10.269321,25.20553 z "
|
|
||||||
id="path7026"
|
|
||||||
sodipodi:nodetypes="ccsc" />
|
|
||||||
<path
|
|
||||||
style="fill:#ffffff;fill-rule:evenodd;stroke:none;stroke-width:0.1;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;fill-opacity:1"
|
|
||||||
d="M -0.25,68.25 C -0.25,68.25 7.5390098,59.548683 13.8125,57.25 C 22,54.25 32,55.1875 48.5625,51.875 C 54.425075,50.702485 56.25,49.25 65.1875,44.625 C 65.942492,44.234305 70.5625,44.3125 70.5625,44.3125 L 70.1875,50.5625 C 60,61.25 36.75,67.21875 34.8125,67.125 C 54.479984,69.763423 64.97809,59.568082 69.25,58.9375 C 59.3125,80.0625 24.0625,79 24.0625,79 C 44.5,84.5625 61.125,76.25 61.125,76.25 C 51.8125,91.65625 17.4375,89.5625 17.4375,89.5625 C 13.84375,89.875 10.9375,92.1875 10.9375,92.1875 L -0.125,92.5 L -0.25,68.25 z "
|
|
||||||
id="path7997"
|
|
||||||
sodipodi:nodetypes="cssscccccccccc" />
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 266 KiB |
351
index.html
351
index.html
@ -6,12 +6,15 @@
|
|||||||
<!-- Page Information
|
<!-- Page Information
|
||||||
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<title>Syrell</title>
|
<title>LittleLink</title>
|
||||||
|
<meta name="description" content="https://littlelink.io">
|
||||||
|
<meta name="author" content="Seth Cottle">
|
||||||
|
|
||||||
<!-- Mobile Specific Metas
|
<!-- Mobile Specific Metas
|
||||||
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
|
||||||
<!-- CSS
|
<!-- CSS
|
||||||
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
<link rel="stylesheet" href="css/normalize.css">
|
<link rel="stylesheet" href="css/normalize.css">
|
||||||
@ -21,20 +24,12 @@
|
|||||||
Light: css/skeleton-light.css
|
Light: css/skeleton-light.css
|
||||||
Dark: css/skeleton-dark.css
|
Dark: css/skeleton-dark.css
|
||||||
-->
|
-->
|
||||||
<script>
|
|
||||||
function setTheme() {
|
|
||||||
var decider = document.getElementById('darkmode-toggle').checked ? 'dark' : 'light';
|
|
||||||
document.head.insertAdjacentHTML(
|
|
||||||
'beforeend',
|
|
||||||
`<link rel="stylesheet" href="css/skeleton-${decider}.css" onload="document.documentElement.style.display = \'\'">`
|
|
||||||
);
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<link rel="stylesheet" href="css/skeleton-auto.css">
|
<link rel="stylesheet" href="css/skeleton-auto.css">
|
||||||
|
|
||||||
<!-- Brand Styles -->
|
<!-- Brand Styles -->
|
||||||
<link rel="stylesheet" href="css/brands.css">
|
<link rel="stylesheet" href="css/brands.css">
|
||||||
|
|
||||||
|
|
||||||
<!-- Favicon
|
<!-- Favicon
|
||||||
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
<link rel="icon" type="image/png" href="images/littlelink.png">
|
<link rel="icon" type="image/png" href="images/littlelink.png">
|
||||||
@ -68,12 +63,13 @@
|
|||||||
-->
|
-->
|
||||||
|
|
||||||
<!-- Your Image Here -->
|
<!-- Your Image Here -->
|
||||||
<img src="images/parrot.png" class="avatar" srcset="images/parrot.png 2x" alt="">
|
<img src="images/littlelink.svg" class="avatar" srcset="images/littlelink.svg 2x" alt="LittleLink Logo">
|
||||||
|
|
||||||
<!-- Title -->
|
<!-- Title -->
|
||||||
<h1 role="heading">Syrell</h1>
|
<h1>LittleLink</h1>
|
||||||
|
|
||||||
<!-- Short Bio -->
|
<!-- Short Bio -->
|
||||||
|
<p>An open source DIY <a href="https://linktr.ee" target="_blank" rel="noopener">Linktree</a> alternative.</p>
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
|
|
||||||
@ -90,8 +86,6 @@
|
|||||||
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.
|
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
|
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:
|
## 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`.
|
1.) class="icon" | This class is telling the <img> tag that it should use the styling for icons found in `css/brands.css`.
|
||||||
@ -99,47 +93,328 @@
|
|||||||
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.
|
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.
|
Add your own 24x24 icons to the "icons" folder to reference them. We recommend providing a SVG.
|
||||||
|
|
||||||
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.
|
3.) alt="Example Logo" | This alt attribute helps provides alternate text for an image, this can assist users who use screen readers.
|
||||||
This can improve the experience for assistive technology users by hiding what is essentially duplicated
|
|
||||||
|
|
||||||
-->
|
-->
|
||||||
<input class="button" type="checkbox" id="darkmode-toggle" onclick="setTheme()"/>
|
|
||||||
<label for="darkmode-toggle"></label>
|
|
||||||
|
|
||||||
<script>
|
<!-- Default LittleLink -->
|
||||||
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
<a class="button button-default" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/littlelink.svg" alt="LittleLink Logo">LittleLink</a><br>
|
||||||
document.getElementById("darkmode-toggle").checked = true;
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
document.getElementById("darkmode-toggle").checked = false;
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- Email -->
|
<!-- Amazon -->
|
||||||
<a class="button button-default" href="mailto:contact@syyrell.com" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-email.svg" alt="">Email</a><br>
|
<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>
|
||||||
|
|
||||||
<!-- GPG -->
|
<!-- Amazon Music -->
|
||||||
<a class="button button-gpg" href="https://git.syyrell.com/syrell.gpg" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/gpg.svg" alt="">GPG</a><br>
|
<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>
|
||||||
|
|
||||||
<!-- Gitea -->
|
<!-- Apple App Store -->
|
||||||
<a class="button button-gitea" href="https://git.syyrell.com/syrell" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/gitea.svg" alt="">Gitea</a><br>
|
<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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
<!-- GitLab -->
|
<!-- GitLab -->
|
||||||
<a class="button button-gitlab" href="https://gitlab.com/syrell" 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"><img class="icon" src="images/icons/gitlab.svg" alt="GitLab Logo">GitLab</a><br>
|
||||||
|
|
||||||
<!-- Hedgedoc -->
|
<!-- Goodreads -->
|
||||||
<a class="button button-hedgedoc" href="https://hedgedoc.syyrell.com/" target="_blank" rel="noopener" role="button"><img class="icon icon-hedgedoc" src="images/icons/hedgedoc.png" alt="">Hedgedoc</a><br>
|
<a class="button button-goodreads" href="#" target="_blank" rel="noopener"><img class="icon" src="images/icons/goodreads.svg" alt="Goodreads Logo">Goodreads</a><br>
|
||||||
|
|
||||||
<!-- Mealie -->
|
<!-- Google Drive -->
|
||||||
<a class="button button-mealie" href="https://food.syyrell.com/" target="_blank" rel="noopener" role="button"><img class="icon icon-mealie" src="images/icons/mealie.png" alt="">Mealie</a><br>
|
<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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<!-- 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>
|
||||||
|
|
||||||
|
<br>
|
||||||
<!--
|
<!--
|
||||||
Footer:
|
Footer:
|
||||||
This includes a link to privacy.html page which can be setup for your Privacy Policy.
|
This includes a link to privacy.html page which can be setup for your Privacy Policy.
|
||||||
This also includes a link to the LittleLink repository to make forking LittleLink easier.
|
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.
|
You can edit or remove anything here to make your own footer.
|
||||||
-->
|
-->
|
||||||
<p>© Syrell</p>
|
<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>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
164
privacy.html
Normal file
164
privacy.html
Normal file
@ -0,0 +1,164 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||||
|
|
||||||
|
<!-- Page Information
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<title>LittleLink Privacy Policy</title>
|
||||||
|
<meta name="description" content="https://littlelink.io" />
|
||||||
|
<meta name="author" content="Seth Cottle" />
|
||||||
|
|
||||||
|
<!-- Mobile Specific Metas
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
|
||||||
|
<!-- CSS
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
|
<link rel="stylesheet" href="css/normalize.css" />
|
||||||
|
|
||||||
|
<!--
|
||||||
|
Themes:
|
||||||
|
Auto: css/skeleton-auto.css
|
||||||
|
Light: css/skeleton-light.css
|
||||||
|
Dark: css/skeleton-dark.css
|
||||||
|
-->
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="css/skeleton-auto.css" />
|
||||||
|
<link rel="stylesheet" href="css/brands.css" />
|
||||||
|
|
||||||
|
<!-- Favicon
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
|
<link rel="icon" type="image/png" href="images/littlelink.png" />
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<!-- Primary Page Layout
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
|
<div class="container-left">
|
||||||
|
<div class="row">
|
||||||
|
<div class="column" style="margin-top: 10%">
|
||||||
|
<p>
|
||||||
|
<a href="index.html">⬅️ Back to main page</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<!--
|
||||||
|
Privacy Policy:
|
||||||
|
We recommend adding a Privacy Policy to your LittleLink. Adding one can help you stay compliant
|
||||||
|
with different privacy legislation and can also help set expectations for your site visitors.
|
||||||
|
|
||||||
|
This is a boilerplate, what is here may not be applicable to you. By default, we give three sections...
|
||||||
|
|
||||||
|
Analytics: where you can add links to analytic services.
|
||||||
|
|
||||||
|
Content From External Platforms: This could be used for CDN services or additional buttons like GitHub hotlinkable buttons.
|
||||||
|
|
||||||
|
Hosting and Backend Infrastructure: For where you host your LittleLink.
|
||||||
|
|
||||||
|
You can remove, edit, and add to these as necessary for your project.
|
||||||
|
-->
|
||||||
|
|
||||||
|
<!-- Page Name -->
|
||||||
|
<h1>🔒 Privacy Overview</h1>
|
||||||
|
|
||||||
|
<!-- Page Information -->
|
||||||
|
<p>
|
||||||
|
<b
|
||||||
|
>Personal Data collected for the following purposes and using the
|
||||||
|
following services:</b
|
||||||
|
>
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
<!-- Start Section -->
|
||||||
|
<b>🧮 Analytics</b>
|
||||||
|
<br />
|
||||||
|
The services contained in this section enable the Owner to monitor
|
||||||
|
and analyze web traffic and can be used to keep track of User
|
||||||
|
behavior.
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
<!-- Here you can add any analytics companies you use and what they track -->
|
||||||
|
<b>1.) Example LLC.</b><br />
|
||||||
|
Personal Data:
|
||||||
|
<i
|
||||||
|
>various types of Data as specified in the privacy policy of the
|
||||||
|
service</i
|
||||||
|
><br />
|
||||||
|
<a href="https://example.com/privacy/"
|
||||||
|
>Privacy Policy</a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<!-- End Section -->
|
||||||
|
|
||||||
|
<!-- Start Section -->
|
||||||
|
<p>
|
||||||
|
<b>📦 Displaying Content From External Platforms</b>
|
||||||
|
<br />
|
||||||
|
This type of service allows you to view content hosted on external
|
||||||
|
platforms directly from the pages of this website and interact with
|
||||||
|
them.<br /><br />
|
||||||
|
This type of service might still collect web traffic data for the
|
||||||
|
pages where the service is installed, even when Users do not use it.
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
<!-- Add any external cdn's and they use and what they track -->
|
||||||
|
<b>1.) Example LLC</b><br />
|
||||||
|
Personal Data:
|
||||||
|
<i
|
||||||
|
>Usage Data; various types of Data as specified in the privacy
|
||||||
|
policy of the service</i
|
||||||
|
>
|
||||||
|
<br />
|
||||||
|
<a href="https://example.com/privacy/"
|
||||||
|
>Privacy Policy</a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<!-- End Section -->
|
||||||
|
|
||||||
|
<!-- Start Section -->
|
||||||
|
<p>
|
||||||
|
<b>📁 Hosting and Backend Infrastructure</b>
|
||||||
|
<br />
|
||||||
|
This type of service has the purpose of hosting Data and files that
|
||||||
|
enable this website to exist.
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
Some services among those listed below, if any, may work through
|
||||||
|
geographically distributed servers, making it difficult to determine
|
||||||
|
the actual location where the Personal Data are stored.
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
<!-- Here you can add any hosting companies you use and what they track -->
|
||||||
|
<b>1.) Example LLC.</b><br />
|
||||||
|
Personal Data:
|
||||||
|
<i
|
||||||
|
>various types of Data as specified in the privacy policy of the
|
||||||
|
service</i
|
||||||
|
>
|
||||||
|
<br />
|
||||||
|
<a href="https://example.com/privacy"
|
||||||
|
>Privacy Policy</a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<!-- End Section -->
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
|
||||||
|
<!--
|
||||||
|
Footer:
|
||||||
|
This includes a link to the LittleLink repository to make forking LittleLink easier.
|
||||||
|
You can edit or remove anything here to make your own footer.
|
||||||
|
-->
|
||||||
|
<center>
|
||||||
|
<p>Build your own by forking <a href="https://littlelink.io" target="_blank" rel="noopener">LittleLink</a>.</p>
|
||||||
|
</center>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- End Document
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue
Block a user