syrell/homepage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
syrell 2023-06-18 20:03:08 +02:00
parent 93878a91c1
commit f8d4f03cf8
Signed by: syrell
GPG Key ID: BC9570E849334AF9
12 changed files with 444 additions and 479 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

181
404.html Normal file
View File

File diff suppressed because one or more lines are too long

18
Caddyfile Normal file
View File

@ -0,0 +1,18 @@
: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
}

2
README.md
View File

@ -1,6 +1,8 @@
![Logo](https://cdn.cottle.cloud/littlelink/littlelink.gif)
# 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 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)

44
css/brands.css
View File

@ -357,6 +357,16 @@ button:hover,
filter: brightness(90%);
}
/* Gitea */
.button.button-gitea {
color: #ffffff;
background-color: #87ab63;
}
.button.button-gitea:hover,
.button.button-gitea:focus {
filter: brightness(90%);
}
/* GitHub */
.button.button-github {
color: #ffffff;
@ -443,6 +453,16 @@ button:hover,
filter: brightness(90%);
}
/* GPG */
.button.button-gpg {
color: #ffffff;
background-color: #29aff1;
}
.button.button-gpg:hover,
.button.button-gpg:focus {
filter: brightness(90%);
}
/* Guilded */
.button.button-guilded {
color: #000000;
@ -464,6 +484,16 @@ button:hover,
filter: brightness(90%);
}
/* Hedgedoc */
.button.button-hedgedoc {
color: #ffffff;
background-color: #eebc7a;
}
.button.button-hedgedoc:hover,
.button.button-hedgedoc:focus {
filter: brightness(90%);
}
/* Instagram */
.button.button-instagram {
color: #ffffff;
@ -568,6 +598,20 @@ button:hover,
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 */
.button.button-medium {
color: #ffffff;

46
css/skeleton-auto.css
View File

@ -277,3 +277,49 @@ 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.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;
}

31
images/icons/gitea.svg Normal file
View File

@ -0,0 +1,31 @@
<?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>
Side by Side

After

Width:  |  Height:  |  Size: 2.5 KiB

88
images/icons/gpg.svg Normal file
View File

@ -0,0 +1,88 @@
<?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>
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
images/icons/hedgedoc.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
images/icons/mealie.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
images/parrot.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 266 KiB

349
index.html
View File

@ -6,15 +6,12 @@
<!-- Page Information
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta charset="utf-8">
<title>LittleLink</title>
<meta name="description" content="https://littlelink.io">
<meta name="author" content="Seth Cottle">
<title>Syrell</title>
<!-- Mobile Specific Metas
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSS
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="stylesheet" href="css/normalize.css">
@ -24,12 +21,20 @@
Light: css/skeleton-light.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">
<!-- Brand Styles -->
<link rel="stylesheet" href="css/brands.css">
<!-- Favicon
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="icon" type="image/png" href="images/littlelink.png">
@ -63,13 +68,12 @@
-->
<!-- Your Image Here -->
<img src="images/littlelink.svg" class="avatar" srcset="images/littlelink.svg 2x" alt="">
<img src="images/parrot.png" class="avatar" srcset="images/parrot.png 2x" alt="">
<!-- Title -->
<h1 role="heading">LittleLink</h1>
<h1 role="heading">Syrell</h1>
<!-- Short Bio -->
<p>An open source DIY <a href="https://linktr.ee" target="_blank" rel="noopener" role="link">Linktree</a> alternative.</p>
<!--
@ -99,328 +103,43 @@
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>
<!-- Default LittleLink -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/littlelink.svg" alt="">LittleLink</a><br>
<script>
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.getElementById("darkmode-toggle").checked = true;
}
else {
document.getElementById("darkmode-toggle").checked = false;
}
</script>
<!-- Amazon -->
<a class="button button-amazon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/amazon.svg" alt="">Amazon Wishlist</a><br>
<!-- Email -->
<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>
<!-- Amazon Music -->
<a class="button button-amazon-music" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/amazon-music.svg" alt="">Listen on Amazon Music</a><br>
<!-- GPG -->
<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>
<!-- Apple App Store -->
<a class="button button-appstore" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple.svg" alt="">Apple App Store</a><br>
<!-- Apple Music -->
<a class="button button-apple-music" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple-music.svg" alt="">Listen on Apple Music</a><br>
<!-- Apple Music Alternate -->
<a class="button button-apple-music-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple-music-alt.svg" alt="">Listen on Apple Music</a><br>
<!-- Apple Podcasts -->
<a class="button button-apple-podcasts" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple-podcasts.svg" alt="">Listen on Apple Podcasts</a><br>
<!-- Apple Podcasts Alternate -->
<a class="button button-apple-podcasts-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/apple-podcasts-alt.svg" alt="">Listen on Apple Podcasts</a><br>
<!-- Bandcamp -->
<a class="button button-bandcamp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/bandcamp.svg" alt="">Bandcamp</a><br>
<!-- Behance -->
<a class="button button-behance" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/behance.svg" alt="">Behance</a><br>
<!-- Bluesky -->
<a class="button button-bluesky" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/bluesky.svg" alt="">Bluesky</a><br>
<!-- Buy Me A Coffee -->
<a class="button button-coffee" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/buy-me-a-coffee.svg" alt="">Buy Me A Coffee</a><br>
<!-- Cal.com -->
<a class="button button-cal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/cal.svg" alt="">Schedule with Cal.com</a><br>
<!-- Calendly -->
<a class="button button-calendly" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/calendly.svg" alt="">Schedule with Calendly</a><br>
<!-- Cash App -->
<a class="button button-cash-app" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/cash-app-dollar.svg" alt="">Cash App</a><br>
<!-- Clubhouse -->
<a class="button button-clubhouse" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/clubhouse.svg" alt="">Clubhouse</a><br>
<!-- Dev.to -->
<a class="button button-dev-to" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/dev-to.svg" alt="">Dev.to</a><br>
<!-- Discord -->
<a class="button button-discord" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/discord.svg" alt="">Discord</a><br>
<!-- Dribbble -->
<a class="button button-dribbble" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/dribbble.svg" alt="">Dribbble</a><br>
<!-- Etsy -->
<a class="button button-etsy" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/etsy.svg" alt="">Shop on Etsy</a><br>
<!-- Facebook -->
<a class="button button-faceb" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/facebook.svg" alt="">Find us on Facebook</a><br>
<!-- Facebook Messenger -->
<a class="button button-messenger" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/messenger.svg" alt="">Chat on Messenger</a><br>
<!-- Figma -->
<a class="button button-figma" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/figma.svg" alt="">Figma Community</a><br>
<!-- Fiverr -->
<a class="button button-fiverr" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/fiverr.svg" alt="">Fiverr Gig</a><br>
<!-- Flickr -->
<a class="button button-flickr" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/flickr.svg" alt="">Flickr</a><br>
<!-- GitHub -->
<a class="button button-github" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/github.svg" alt="">GitHub</a><br>
<!-- Gitea -->
<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>
<!-- GitLab -->
<a class="button button-gitlab" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/gitlab.svg" alt="">GitLab</a><br>
<a class="button button-gitlab" href="https://gitlab.com/syrell" 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>
<!-- Hedgedoc -->
<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>
<!-- Goodreads -->
<a class="button button-goodreads" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/goodreads.svg" alt="">Goodreads</a><br>
<!-- Mealie -->
<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>
<!-- Google Drive -->
<a class="button button-google-black" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/google-drive.svg" alt="">View in Google Drive</a><br>
<!-- Google Play Store -->
<a class="button button-playstore" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/google-play.svg" alt="">Google Play Store</a><br>
<!-- Google Podcasts -->
<a class="button button-google-podcasts" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/google-podcasts.svg" alt="">Listen on Google Podcasts</a><br>
<!-- Google Scholar -->
<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" 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" 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" role="button"><img class="icon" src="images/icons/instagram.svg" alt="">Instagram</a><br>
<!-- Kickstarter -->
<a class="button button-kickstarter" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/kickstarter.svg" alt="">Kickstarter</a><br>
<!-- Kit -->
<a class="button button-kit" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/kit.svg" alt="">Kit</a><br>
<!-- Ko-fi -->
<a class="button button-ko-fi" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/ko-fi.svg" alt="">Ko-fi</a><br>
<!-- Last.fm -->
<a class="button button-last-fm" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/last-fm.svg" alt="">Last.fm</a><br>
<!-- Letterboxd -->
<a class="button button-letterboxd" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/letterboxd.svg" alt="">Letterboxd</a><br>
<!-- Line -->
<a class="button button-line" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/line.svg" alt="">Line</a><br>
<!-- LinkedIn -->
<a class="button button-linked" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/linkedin.svg" alt="">LinkedIn</a><br>
<!-- Mailchimp -->
<a class="button button-mailchimp" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/mailchimp.svg" alt="">Mailchimp</a><br>
<!-- Mastodon -->
<a class="button button-mastodon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/mastodon.svg" alt="">Mastodon</a><br>
<!-- Medium -->
<a class="button button-medium" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/medium.svg" alt="">Medium</a><br>
<!-- Notion -->
<a class="button button-notion" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/notion.svg" alt="">Notion</a><br>
<!-- OnlyFans -->
<a class="button button-onlyfans" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/onlyfans.svg" alt="">OnlyFans (18+)</a><br>
<!-- Patreon -->
<a class="button button-patreon" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/patreon.svg" alt="">Patreon</a><br>
<!-- PayPal -->
<a class="button button-paypal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/paypal.svg" alt="">PayPal</a><br>
<!-- Pinterest -->
<a class="button button-pinterest" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/pinterest.svg" alt="">Pinterest</a><br>
<!-- Post.news -->
<a class="button button-post-news" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/post-news.svg" alt="">Post.news</a><br>
<!-- Product Hunt -->
<a class="button button-product-hunt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/product-hunt.svg" alt="">Product Hunt</a><br>
<!-- Read.cv -->
<a class="button button-read-cv" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/read-cv.svg" alt="">Read.cv</a><br>
<!-- Redbubble -->
<a class="button button-redbubble" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/redbubble.svg" alt="">Redbubble</a><br>
<!-- Reddit -->
<a class="button button-reddit" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/reddit.svg" alt="">Reddit</a><br>
<!-- Shop -->
<a class="button button-shop" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/shop.svg" alt="">Buy with Shop</a><br>
<!-- Signal -->
<a class="button button-signal" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/signal.svg" alt="">Signal</a><br>
<!-- Skoob -->
<a class="button button-skoob" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/skoob.svg" alt="">Skoob</a><br>
<!-- Slack -->
<a class="button button-slack" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/slack.svg" alt="">Join Slack</a><br>
<!-- Snapchat -->
<a class="button button-snapchat" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/snapchat.svg" alt="">Snapchat</a><br>
<!-- SoundCloud -->
<a class="button button-soundcloud" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/soundcloud.svg" alt="">SoundCloud</a><br>
<!-- Spotify -->
<a class="button button-spotify" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/spotify.svg" alt="">Listen on Spotify</a><br>
<!-- Spotify Alt -->
<a class="button button-spotify-alt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/spotify-alt.svg" alt="">Listen on Spotify</a><br>
<!-- Square -->
<a class="button button-square" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/square.svg" alt="">Buy with Square</a><br>
<!-- Steam -->
<a class="button button-steam" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/steam.svg" alt="">Steam</a><br>
<!-- Strava -->
<a class="button button-strava" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/strava.svg" alt="">Strava</a><br>
<!-- Substack -->
<a class="button button-substack" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/substack.svg" alt="">Substack</a><br>
<!-- Telegram -->
<a class="button button-telegram" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/telegram.svg" alt="">Telegram</a><br>
<!-- Threema -->
<a class="button button-threema" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/threema.svg" alt="">Threema</a><br>
<!-- TikTok -->
<a class="button button-tiktok" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/tiktok.svg" alt="">TikTok</a><br>
<!-- Trello -->
<a class="button button-trello" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/trello.svg" alt="">Trello</a><br>
<!-- Tumblr -->
<a class="button button-tumb" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/tumblr.svg" alt="">Tumblr</a><br>
<!-- Twitch -->
<a class="button button-twitch" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/twitch.svg" alt="">Twitch</a><br>
<!-- Twitter -->
<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" 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" 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" 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" 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" 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" 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" 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" 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" role="button"><img class="icon" src="images/icons/wordpress.svg" alt="">WordPress</a><br>
<!-- Xing -->
<a class="button button-xing" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/xing.svg" alt="">Xing</a><br>
<!-- YouTube -->
<a class="button button-yt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/youtube.svg" alt="">YouTube</a><br>
<!-- YouTube Music -->
<a class="button button-yt" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/youtube-music.svg" alt="">Listen on YouTube Music</a><br>
<!-- Zoom -->
<a class="button button-zoom" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/zoom.svg" alt="">Join Zoom Webinar</a><br>
<!-- Generic Blog -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-blog.svg" alt="">Read our blog</a><br>
<!-- Generic Calendar -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-calendar.svg" alt="">Event RSVP</a><br>
<!-- Generic Cloud -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-cloud.svg" alt="">Download File</a><br>
<!-- Generic Code -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-code.svg" alt="">View the code</a><br>
<!-- Generic Computer -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-computer.svg" alt="">Homelab Setup</a><br>
<!-- Generic Email -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-email.svg" alt="">Email Us</a><br>
<!-- Generic Email Alt -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-email-alt.svg" alt="">Email Us</a><br>
<!-- Generic Homepage -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-homepage.svg" alt="">Visit Homepage</a><br>
<!-- Generic Map -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-map.svg" alt="">Get Directions</a><br>
<!-- Generic Phone -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-phone.svg" alt="">Call Us</a><br>
<!-- Generic Review -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-review.svg" alt="">Leave us a review</a><br>
<!-- Generic RSS -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-rss.svg" alt="">RSS Subscribe</a><br>
<!-- Generic Shopping Bag -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-shopping-bag.svg" alt="">Visit Our Shop</a><br>
<!-- Generic Shopping Tag -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-shopping-tag.svg" alt="">10% Discount</a><br>
<!-- Generic SMS -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-sms.svg" alt="">Send us a message</a><br>
<!-- Generic Website -->
<a class="button button-default" href="#" target="_blank" rel="noopener" role="button"><img class="icon" src="images/icons/generic-website.svg" alt="">Visit Website</a><br>
<br>
<!--
Footer:
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.
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" role="button">LittleLink</a>.</p>
<p>© Syrell</p>
</div>
</div>
</div>

164
privacy.html
View File

@ -1,164 +0,0 @@
<!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>