mdrockwell/littlelink
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Removed webkit-touch-callout css to fix long press on iPhone. Also fixed a span tag that was being closed by an </a>

Browse Source
This commit is contained in:
Mike Rockwell
2026-05-19 16:41:13 -04:00
parent b8b6297b46
commit 66b8d6e8b2
3 changed files with 325 additions and 309 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/min.css
+1 -1
View File
File diff suppressed because one or more lines are too long
css/style.css
+312 -296
View File
@@ -2,13 +2,13 @@
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@font-face {
font-family: "IBM Plex Sans";
src: url(../fonts/IBMPlexSans.ttf)
font-family: "IBM Plex Sans";
src: url(../fonts/IBMPlexSans.ttf);
}
@font-face {
font-family: "IBM Plex Mono";
src: url(../fonts/IBMPlexMono.ttf)
font-family: "IBM Plex Mono";
src: url(../fonts/IBMPlexMono.ttf);
}
/*
@@ -20,7 +20,7 @@
*,
*::before,
*::after {
box-sizing: border-box;
box-sizing: border-box;
}
/* Remove default margin */
@@ -34,35 +34,35 @@ figure,
blockquote,
dl,
dd {
margin: 0;
margin: 0;
}
/* Remove list styles on ul, ol elements */
ul,
ol {
list-style: none;
margin: 0;
padding: 0;
list-style: none;
margin: 0;
padding: 0;
}
/* Set core root defaults */
html:focus-within {
scroll-behavior: smooth;
scroll-behavior: smooth;
}
/* Set core body defaults */
body {
min-height: 100vh;
text-rendering: optimizeSpeed;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
min-height: 100vh;
text-rendering: optimizeSpeed;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* Make images easier to work with */
img,
picture {
max-width: 100%;
display: block;
max-width: 100%;
display: block;
}
/* Inherit fonts for inputs and buttons */
@@ -70,38 +70,39 @@ input,
button,
textarea,
select {
font: inherit;
font: inherit;
}
/* Remove all animations and transitions for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
html:focus-within {
scroll-behavior: auto;
}
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
html:focus-within {
scroll-behavior: auto;
}
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
}
/* Modern focus styles */
:focus:not(:focus-visible) {
outline: none;
outline: none;
}
:focus-visible {
outline: 2px solid #2457F5;
outline-offset: 2px;
outline: 2px solid #2457f5;
outline-offset: 2px;
}
/* Remove touch callout on iOS */
a {
-webkit-touch-callout: none;
}
/* Remove touch callout on iOS
* a {
* -webkit-touch-callout: none;
* }
*/
/*
* LittleLink
@@ -113,111 +114,115 @@ a {
/* Base Typography Settings
–––––––––––––––––––––––––––––––––––––––––––––––––– */
:root {
font-size:16px;
font-size: 16px;
}
/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
position:relative;
width:100%;
max-width:37.5rem; /* 600px */
text-align:center;
margin:0 auto;
padding:3rem 1.25rem 0 1.25rem;
box-sizing:border-box;
.container {
position: relative;
width: 100%;
max-width: 37.5rem; /* 600px */
text-align: center;
margin: 0 auto;
padding: 3rem 1.25rem 0 1.25rem;
box-sizing: border-box;
}
.container-left {
position:relative;
width:100%;
max-width:37.5rem;
text-align:left;
margin:0 auto;
padding:0 1.25rem;
box-sizing:border-box;
position: relative;
width: 100%;
max-width: 37.5rem;
text-align: left;
margin: 0 auto;
padding: 0 1.25rem;
box-sizing: border-box;
}
.container-left p {
margin-bottom: 1rem; /* 16px space between paragraphs */
}
margin-bottom: 1rem; /* 16px space between paragraphs */
}
.column {
position:center;
width:100%;
float:center;
box-sizing:border-box;
position: center;
width: 100%;
float: center;
box-sizing: border-box;
}
/* For devices larger than 400px */
@media (min-width:25rem) { /* 400px */
.container {
width:85%;
padding-left:0;
padding-right:0;
}
}/* For devices larger than 550px */
@media (min-width:34.375rem) { /* 550px */
.container {
width:80%;
}
.column,.columns {
margin-left:0;
}
.column:first-child,.columns:first-child {
margin-left:0;
}
@media (min-width: 25rem) {
/* 400px */
.container {
width: 85%;
padding-left: 0;
padding-right: 0;
}
} /* For devices larger than 550px */
@media (min-width: 34.375rem) {
/* 550px */
.container {
width: 80%;
}
.column,
.columns {
margin-left: 0;
}
.column:first-child,
.columns:first-child {
margin-left: 0;
}
}
/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
body {
margin:0;
padding:0;
background-color:#ffffff;
color:#1a1a1a;
font-family:"IBM Plex Sans",sans-serif;
font-size:1.125rem; /* 18px */
font-weight:400;
line-height:1.6;
body {
margin: 0;
padding: 0;
background-color: #ffffff;
color: #1a1a1a;
font-family: "IBM Plex Sans", sans-serif;
font-size: 1.125rem; /* 18px */
font-weight: 400;
line-height: 1.6;
}
/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1 {
margin:0 0 0.5rem 0;
font-size:3rem; /* 48px */
font-weight:800;
line-height:1;
letter-spacing:0;
word-wrap:break-word;
overflow-wrap:break-word;
h1 {
margin: 0 0 0.5rem 0;
font-size: 3rem; /* 48px */
font-weight: 800;
line-height: 1;
letter-spacing: 0;
word-wrap: break-word;
overflow-wrap: break-word;
}
.container p {
margin:0 0 2rem 0;
margin: 0 0 2rem 0;
}
/* Base Typography Settings
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Base size - 16px browser default */
:root {
font-size:16px; /* Using a 1.25 modular scale for typography */
--scale-0:1rem; /* 16px */
--scale-0a:1.125rem; /* 18px */
--scale-1:1.125rem; /* 20px */
--scale-2:1.563rem; /* 25px */
--scale-3:1.953rem; /* 31px */
--scale-4:2.441rem; /* 39px */
--scale-5:3.052rem; /* 49px */
font-size: 16px; /* Using a 1.25 modular scale for typography */
--scale-0: 1rem; /* 16px */
--scale-0a: 1.125rem; /* 18px */
--scale-1: 1.125rem; /* 20px */
--scale-2: 1.563rem; /* 25px */
--scale-3: 1.953rem; /* 31px */
--scale-4: 2.441rem; /* 39px */
--scale-5: 3.052rem; /* 49px */
/* Spacing units */
--spacing-xs:0.5rem; /* 8px */
--spacing-s:1rem; /* 16px */
--spacing-m:1.5rem; /* 24px */
--spacing-l:2rem; /* 32px */
--spacing-xl:3rem; /* 48px */
--spacing-xxl:4rem; /* 64px */
/* Spacing units */
--spacing-xs: 0.5rem; /* 8px */
--spacing-s: 1rem; /* 16px */
--spacing-m: 1.5rem; /* 24px */
--spacing-l: 2rem; /* 32px */
--spacing-xl: 3rem; /* 48px */
--spacing-xxl: 4rem; /* 64px */
}
/* Avatar */
.avatar {
width: 8rem; /* 128px */
width: 8rem; /* 128px */
height: 8rem;
border-radius: 50%;
object-fit: cover;
@@ -226,117 +231,119 @@ a {
margin-left: auto;
margin-right: auto;
display: block;
}
}
/* Typography Scale */
h1 {
margin:0 0 var(--spacing-m) 0;
font-size:var(--scale-5); /* ~49px */
font-weight:800;
line-height:1.1;
letter-spacing:-0.02em;
word-wrap:break-word;
overflow-wrap:break-word;
margin: 0 0 var(--spacing-m) 0;
font-size: var(--scale-5); /* ~49px */
font-weight: 800;
line-height: 1.1;
letter-spacing: -0.02em;
word-wrap: break-word;
overflow-wrap: break-word;
}
body {
font-size:var(--scale-1); /* 20px */
line-height:1.6;
font-size: var(--scale-1); /* 20px */
line-height: 1.6;
}
.container p {
margin:0 0 var(--spacing-l) 0;
font-size:var(--scale-1);
line-height:1.6;
margin: 0 0 var(--spacing-l) 0;
font-size: var(--scale-1);
line-height: 1.6;
}
/* Container spacing */
.container {
padding:var(--spacing-xl) var(--spacing-m) 0 var(--spacing-m);
text-align:center;
padding: var(--spacing-xl) var(--spacing-m) 0 var(--spacing-m);
text-align: center;
}
/* Footer */
footer {
margin:var(--spacing-l) 0; /* 4rem (64px) top and bottom */
font-size:var(--scale-0);
margin: var(--spacing-l) 0; /* 4rem (64px) top and bottom */
font-size: var(--scale-0);
}
/* Responsive adjustments */
@media (max-width:34.375rem) { /* 550px */
h1 {
font-size:var(--scale-4);
}
body {
font-size:var(--scale-0);
}
.container p {
font-size:var(--scale-0a);
}
.avatar {
margin-bottom:var(--spacing-m);
}
footer {
margin:var(--spacing-xl) 0; /* 3rem (48px) top and bottom */
}
@media (max-width: 34.375rem) {
/* 550px */
h1 {
font-size: var(--scale-4);
}
body {
font-size: var(--scale-0);
}
.container p {
font-size: var(--scale-0a);
}
.avatar {
margin-bottom: var(--spacing-m);
}
footer {
margin: var(--spacing-xl) 0; /* 3rem (48px) top and bottom */
}
}
/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
color:#0085ff;
text-decoration:underline;
a {
color: #0085ff;
text-decoration: underline;
}
a:hover {
color:#083BDA;
color: #083bda;
}
/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,button {
display:inline-flex;
align-items:center;
justify-content:center;
width:18.75rem; /* 300px */
min-height:3rem; /* 48px */
padding:0.75rem 1rem; /* 12px ; 16px */
font-size:1.125rem; /* 18px */
font-weight:700;
text-decoration:none;
white-space:normal;
background-color:var(--button-background,transparent);
color:var(--button-text,#000000);
border:var(--button-border,none);
border-radius:0.5rem;
cursor:pointer;
box-sizing:border-box;
hyphens:auto; /* Delete this to remove automatic hyphen on line break */
margin-bottom:1rem;
text-align:center;
line-height:1.3;
.button,
button {
display: inline-flex;
align-items: center;
justify-content: center;
width: 18.75rem; /* 300px */
min-height: 3rem; /* 48px */
padding: 0.75rem 1rem; /* 12px ; 16px */
font-size: 1.125rem; /* 18px */
font-weight: 700;
text-decoration: none;
white-space: normal;
background-color: var(--button-background, transparent);
color: var(--button-text, #000000);
border: var(--button-border, none);
border-radius: 0.5rem;
cursor: pointer;
box-sizing: border-box;
hyphens: auto; /* Delete this to remove automatic hyphen on line break */
margin-bottom: 1rem;
text-align: center;
line-height: 1.3;
}
/* Icons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.icon {
width:1.25rem;
height:1.25rem;
margin-right:0.5rem;
flex-shrink:0;
width: 1.25rem;
height: 1.25rem;
margin-right: 0.5rem;
flex-shrink: 0;
}
/* Avatar
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.avatar {
width: 8rem; /* 128px */
width: 8rem; /* 128px */
height: 8rem;
object-fit: cover;
background-position: center;
margin-bottom: var(--spacing-l);
}
}
/* Modifier for rounded avatar */
.avatar--rounded {
/* Modifier for rounded avatar */
.avatar--rounded {
border-radius: 50%;
}
}
/* Theme System
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@@ -344,100 +351,102 @@ a:hover {
/* Dark theme */
:root.theme-dark {
color-scheme:dark;
color-scheme: dark;
}
:root.theme-dark :focus-visible {
outline: 2px solid #4899F7;
outline: 2px solid #4899f7;
outline-offset: 2px;
}
}
:root.theme-dark body {
background-color:#121212;
color:#ffffff;
background-color: #121212;
color: #ffffff;
}
:root.theme-dark a:not(.button) {
color:#4899F7;
color: #4899f7;
}
:root.theme-dark a:not(.button):hover {
color:#7AB8FF;
color: #7ab8ff;
}
/* Auto theme */
:root.theme-auto {
color-scheme:light dark;
color-scheme: light dark;
}
@media (prefers-color-scheme:dark) {
@media (prefers-color-scheme: dark) {
:root.theme-auto body {
background-color:#121212;
color:#ffffff;
}
:root.theme-auto :focus-visible {
outline: 2px solid #4899F7;
outline-offset: 2px;
}
:root.theme-auto a:not(.button) {
color:#4899F7;
}
:root.theme-auto a:not(.button):hover {
color:#7AB8FF;
}
background-color: #121212;
color: #ffffff;
}
:root.theme-auto :focus-visible {
outline: 2px solid #4899f7;
outline-offset: 2px;
}
:root.theme-auto a:not(.button) {
color: #4899f7;
}
:root.theme-auto a:not(.button):hover {
color: #7ab8ff;
}
}
/* Button Text Color Override
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button:hover,button:hover {
color:var(--button-text);
.button:hover,
button:hover {
color: var(--button-text);
}
/* Responsive Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media (max-width:34.375rem) { /* 550px */
h1 {
font-size:2rem; /* 32px */
@media (max-width: 34.375rem) {
/* 550px */
h1 {
font-size: 2rem; /* 32px */
}
body {
font-size:1rem; /* 16px */
font-size: 1rem; /* 16px */
}
}
/* Privacy Page Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
nav {
margin:var(--spacing-l) 0;
text-align:left;
margin: var(--spacing-l) 0;
text-align: left;
}
section {
margin:var(--spacing-xl) 0;
text-align:left;
margin: var(--spacing-xl) 0;
text-align: left;
}
h2 {
font-size:var(--scale-3);
font-weight:700;
margin-bottom:var(--spacing-m);
font-size: var(--scale-3);
font-weight: 700;
margin-bottom: var(--spacing-m);
}
h3 {
font-size:var(--scale-2);
font-weight:600;
margin:var(--spacing-l) 0 var(--spacing-s) 0;
font-size: var(--scale-2);
font-weight: 600;
margin: var(--spacing-l) 0 var(--spacing-s) 0;
}
ul {
list-style:none;
padding:0;
margin:0 0 var(--spacing-m) 0;
list-style: none;
padding: 0;
margin: 0 0 var(--spacing-m) 0;
}
ul li {
margin-bottom:var(--spacing-xs);
margin-bottom: var(--spacing-xs);
}
/* Privacy page specific responsive adjustments */
@media (max-width:34.375rem) {
@media (max-width: 34.375rem) {
h2 {
font-size:var(--scale-2);
font-size: var(--scale-2);
}
h3 {
font-size:var(--scale-1);
font-size: var(--scale-1);
}
section {
margin:var(--spacing-l) 0;
margin: var(--spacing-l) 0;
}
}
@@ -451,26 +460,30 @@ ul li {
/* Brand Button Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Only include brand-specific button styling here */
.button,button {
color:var(--button-text,#000000);
background-color:var(--button-background,transparent);
border:var(--button-border,none);
transition:filter 0.2s ease,transform 0.2s ease;
.button,
button {
color: var(--button-text, #000000);
background-color: var(--button-background, transparent);
border: var(--button-border, none);
transition:
filter 0.2s ease,
transform 0.2s ease;
}
/* Global Button Hover Effect
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media (hover: hover) {
.button:hover,button:hover {
filter:brightness(90%);
transform:translateY(-1px);
}
.button:hover,
button:hover {
filter: brightness(90%);
transform: translateY(-1px);
}
}
/* Button Icons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.icon {
filter:var(--icon-filter,none);
filter: var(--icon-filter, none);
}
/* Brand-Specific Styles
@@ -478,154 +491,157 @@ ul li {
/* Default */
.button.button-default {
--button-text:#ffffff;
--button-background:#0085ff;
--button-text: #ffffff;
--button-background: #0085ff;
}
/* Beeper */
.button-beeper {
--button-text:#ffffff;
--button-background:#355bf3;
--button-text: #ffffff;
--button-background: #355bf3;
}
.button-beeper .icon {
width: 1.5rem;
height: 1.5rem;
margin-right: 0.25rem;
width: 1.5rem;
height: 1.5rem;
margin-right: 0.25rem;
}
/* Initial Charge */
.button-initialcharge {
--button-text:#ffffff;
--button-background:#000000;
--button-border:2px solid #ffffff;
--button-text: #ffffff;
--button-background: #000000;
--button-border: 2px solid #ffffff;
}
.button-initialcharge .icon {
width: 1.5rem;
height: 1.5rem;
margin-right: 0.25rem;
width: 1.5rem;
height: 1.5rem;
margin-right: 0.25rem;
}
/* Last.fm */
.button-last-fm {
--button-text:#ffffff;
--button-background:#f71414;
--button-text: #ffffff;
--button-background: #f71414;
}
/* Mastodon */
.button-mastodon {
--button-text:#ffffff;
--button-background:#1f232b;
--button-text: #ffffff;
--button-background: #1f232b;
}
/* MetaGamerScore */
.button-metagamerscore {
--button-text:#000000;
--button-background:#f0f0f0;
--button-text: #000000;
--button-background: #f0f0f0;
}
/* PayPal */
.button-paypal {
--button-text:#ffffff;
--button-background:#002991;
--button-border:1px solid #FFFFFF;
--button-text: #ffffff;
--button-background: #002991;
--button-border: 1px solid #ffffff;
}
/* Pixelfed */
.button-pixelfed {
--button-text:#000000;
--button-background:#ffffff;
--button-border:2px solid #000000;
--button-text: #000000;
--button-background: #ffffff;
--button-border: 2px solid #000000;
}
/* Value for Value */
.button-v4v {
--button-text:#ffffff;
--button-background:#1DBF73;
--button-text: #ffffff;
--button-background: #1dbf73;
}
.button-v4v .icon {
width: 1rem;
height: 1rem;
margin-right: 0.5rem;
width: 1rem;
height: 1rem;
margin-right: 0.5rem;
}
/* Custom Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
details.value-block > summary {
list-style: none;
width: fit-content;
margin-left: auto;
margin-right: auto;
list-style: none;
width: fit-content;
margin-left: auto;
margin-right: auto;
}
details.value-block > summary::-webkit-details-marker {
display: none;
display: none;
}
.value-block ul {
list-style-type: none;
padding-inline-start: 0;
list-style-type: none;
padding-inline-start: 0;
}
.value-block code {
font-size: .75rem
font-size: 0.75rem;
}
code, kbd, pre, samp {
font-family: "IBM Plex Mono", monospace;
code,
kbd,
pre,
samp {
font-family: "IBM Plex Mono", monospace;
}
.value-block code {
padding: .2rem .5rem;
margin: 0 .2rem;
white-space: nowrap;
background: #f1f1f1;
border: 1px solid #e1e1e1;
border-radius: 4px;
padding: 0.2rem 0.5rem;
margin: 0 0.2rem;
white-space: nowrap;
background: #f1f1f1;
border: 1px solid #e1e1e1;
border-radius: 4px;
}
/* Fix v4v details block hover and open styles */
details[open] summary span.button.button-v4v {
filter: brightness(90%);
transform: 0px;
filter: brightness(90%);
transform: 0px;
}
@media (hover: hover) {
details[open] summary span.button.button-v4v:hover {
transform: -1px;
}
details[open] summary span.button.button-v4v:hover {
transform: -1px;
}
}
details:not([open]) {
filter: brightness(100%);
transform: 0px;
filter: brightness(100%);
transform: 0px;
}
@media (hover: hover) {
details:not([open]) summary span.button.button-v4v:hover {
filter: brightness(90%);
transform: -1px;
}
@media (hover: hover) {
details:not([open]) summary span.button.button-v4v:hover {
filter: brightness(90%);
transform: -1px;
}
}
/* /end Fix v4v details block hover and open styles */
p.value-explainer {
margin-top: 2rem;
margin-top: 2rem;
}
details.value-block ul li {
margin-bottom:32px
margin-bottom: 32px;
}
details.value-block ul li img {
margin-left:auto;
margin-right:auto;
margin-left: auto;
margin-right: auto;
}
span.button.button-v4v {
margin-bottom:0;
margin-bottom: 0;
}
span.crypto-js-qr img {
width: 150px;
}
width: 150px;
}
index.html
+12 -12
View File
@@ -44,36 +44,36 @@
<!-- Mastodon -->
<a class="button button-mastodon" href="https://libertynode.net/@mike" role="button" itemprop="sameAs" rel="me"><img class="icon" aria-hidden="true" src="images/icons/mastodon.svg" alt="Mastodon Logo">Mastodon</a>
<!-- Beeper -->
<a class="button button-beeper" href="https://matrix.to/#/@mdrockwell:beeper.com" rel="noopener" role="button" itemprop="sameAs" rel="me"><img class="icon" aria-hidden="true" src="images/icons/beeper.svg" alt="">Beeper / Matrix</a>
<!-- Pixelfed -->
<a class="button button-pixelfed" href="https://libertynode.cam/mike" role="button" itemprop="sameAs" rel="me"><img class="icon" aria-hidden="true" src="images/icons/pixelfed.svg" alt="">Pixelfed</a>
<!-- Generic Email -->
<a class="button button-default" href="mailto:mike@rockwell.mx" role="button" itemprop="sameAs" rel="me"><img class="icon" aria-hidden="true" src="images/icons/generic-email.svg" alt="Email Icon">Email</a>
<!-- Last.fm -->
<a class="button button-last-fm" href="https://last.fm/user/mdrockwell/" rel="noopener" role="button" itemprop="sameAs" rel="me"><img class="icon" aria-hidden="true" src="images/icons/last-fm.svg" alt="">Last.fm</a>
<!-- MetaGamerScore -->
<a class="button button-metagamerscore" href="https://metagamerscore.com/profile/25193" rel="noopener" role="button" itemprop="sameAs" rel="me"><img class="icon" aria-hidden="true" src="images/icons/generic-game-controller.svg" alt="">MetaGamerScore</a>
<details class="value-block">
<summary id="value-expanded">
<!-- Value for Value -->
<span class="button button-v4v" role="button"><img class="icon" aria-hidden="true" src="images/icons/generic-bolt-icon.svg" alt="">Value for Value</a>
</summary>
<p class="value-explainer">Support my work by providing <a href="https://value4value.info/">value for value</a> — with a direct donation or ordering from&nbsp;the&nbsp;shop.</p>
<p class="value-explainer">Support my work by providing < href="https://value4value.info/">value for value</span> — with a direct donation or ordering from&nbsp;the&nbsp;shop.</p>
<!-- Initial Charge Shop -->
<a class="button button-initialcharge" href="https://initialcharge.shop/" role="button"><img class="icon" aria-hidden="true" src="images/icons/initialcharge.svg" alt="">Initial Charge Shop</a>
<!-- PayPal -->
<a class="button button-paypal" href="https://www.paypal.com/donate/?business=LXMQTRPCCLAEG&no_recurring=0&item_name=Support+Initial+Charge%2C+%23OpenWeb%2C+and+my+other+projects+with+value+for+value.&currency_code=USD" rel="noopener" role="button"><img class="icon" aria-hidden="true" src="images/icons/paypal.svg" alt="PayPal Logo">PayPal</a>
<ul>
<li id="btc-qr-link"><strong>Bitcoin</strong> &#8226; <a href="images/crypto/btc-qr.png">QR Code</a><br><code id="btcwall">bc1qxj26ssa24a7x8mp0rykn80d6v088p996mt0kcc</code></li>
<li id="eth-qr-link"><strong>Ethereum</strong> &#8226; <a href="images/crypto/eth-qr.png">QR Code</a><br><code id="ethwall">0x41C1689FF03a11205aB22dd0d97889065E971D7f</code></li>
@@ -84,7 +84,7 @@
<footer>
<p class="footer-links"><a href="https://initialcharge.net/about/#hardware">Setup</a> &#8226; <a href="https://initialcharge.net/tag/home-screens-series/">Home Screens</a> &#8226; <a href="resume/">Résumé</a><br><a href="https://initialcharge.net/projects/toolkit/">The Toolkit</a> &#8226; <a href="https://initialcharge.net/2017/08/linen-home-screen/#wallpaper">Linen Wallpaper</a></p>
Built with <a href="https://littlelink.io" rel="noopener">LittleLink</a>, view source on <a href="https://libertynode.dev/mdrockwell/littlelink" rel="noopener">Gitea</a>.</br>
Made on a <a href="https://frame.work/laptop13" rel="noopener">Framework</a>.
</footer>