removed unused styles, added font, button, and value block styles

This commit is contained in:
2025-07-17 11:51:22 -04:00
parent f2853c692e
commit d448b78f91

657
style.css
View File

@@ -1,3 +1,16 @@
/* Font Face Definitions
*/
@font-face {
font-family: "IBM Plex Sans";
src: url(fonts/IBMPlexSans.ttf)
}
@font-face {
font-family: "IBM Plex Mono";
src: url(fonts/IBMPlexMono.ttf)
}
/*
* LittleLink Reset
* A minimal CSS reset for LittleLink
@@ -159,7 +172,7 @@ a {
padding:0;
background-color:#ffffff;
color:#1a1a1a;
font-family:"Open Sans",system-ui;
font-family:"IBM Plex Sans",sans-serif;
font-size:1.125rem; /* 18px */
font-weight:400;
line-height:1.6;
@@ -175,7 +188,6 @@ a {
letter-spacing:0;
word-wrap:break-word;
overflow-wrap:break-word;
hyphens:auto; /* Delete this to remove automatic hyphen on line break */
}
.container p {
margin:0 0 2rem 0;
@@ -187,7 +199,7 @@ a {
:root {
font-size:16px; /* Using a 1.25 modular scale for typography */
--scale-0:1rem; /* 16px */
--scale-1:1.25rem; /* 20px */
--scale-1:1.125rem; /* 20px */
--scale-2:1.563rem; /* 25px */
--scale-3:1.953rem; /* 31px */
--scale-4:2.441rem; /* 39px */
@@ -320,21 +332,11 @@ a:hover {
margin-bottom: var(--spacing-l);
}
/* Modifier for no avatar rounding */
.avatar--none {
border-radius: 0%;
}
/* Modifier for rounded avatar */
.avatar--rounded {
border-radius: 50%;
}
/* Modifier for slightly rounded corners */
.avatar--soft {
border-radius: 0.5rem; /* 8px rounded corners */
}
/* Theme System
*/
/* Light theme is default above */
@@ -438,41 +440,6 @@ ul li {
}
}
/* Font Face Definitions
*/
@font-face {
font-display:swap;
font-family:'Open Sans';
font-style:normal;
font-weight:400;
src:url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-regular.eot');
src:url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-regular.eot?#iefix') format('embedded-opentype'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-regular.woff2') format('woff2'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-regular.woff') format('woff'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-regular.ttf') format('truetype'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-regular.svg#OpenSans') format('svg');
}
@font-face {
font-display:swap;
font-family:'Open Sans';
font-style:normal;
font-weight:600;
src:url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-600.eot');
src:url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-600.eot?#iefix') format('embedded-opentype'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-600.woff2') format('woff2'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-600.woff') format('woff'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-600.ttf') format('truetype'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-600.svg#OpenSans') format('svg');
}
@font-face {
font-display:swap;
font-family:'Open Sans';
font-style:normal;
font-weight:700;
src:url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-700.eot');
src:url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-700.eot?#iefix') format('embedded-opentype'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-700.woff2') format('woff2'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-700.woff') format('woff'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-700.ttf') format('truetype'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-700.svg#OpenSans') format('svg');
}
@font-face {
font-display:swap;
font-family:'Open Sans';
font-style:normal;
font-weight:800;
src:url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.eot');
src:url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.eot?#iefix') format('embedded-opentype'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.woff2') format('woff2'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.woff') format('woff'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.ttf') format('truetype'),url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.svg#OpenSans') format('svg');
}
/*
* LittleLink Button Styles
* https://littlelink.io
@@ -509,376 +476,38 @@ ul li {
/* Default */
.button.button-default {
--button-text:#ffffff;
--button-background:#2457F5;
--button-border:1px solid #ffffff;
--button-background:#0085ff;
}
/* Amazon */
.button-amazon {
--button-text:#000000;
--button-background:#FFFFFF;
--button-border:1px solid #212121;
/* Beeper */
.button-beeper {
--button-text:#ffffff;
--button-background:#355bf3;
}
/* Amazon Music */
.button-amazon-music {
--button-text:#000000;
--button-background:#25D1DA;
}
/* Apple App Store */
.button-appstore {
--button-text:#FFFFFF;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Apple Invites */
.button-invites {
--button-text:#FFFFFF;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Apple Music */
.button-apple-music {
/* Initial Charge */
.button-initialcharge {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Apple Music Alt */
.button-apple-music-alt {
--button-text:#ffffff;
background-image:linear-gradient(to bottom,#FB5C74,#FA233B);
}
/* Apple Podcasts */
.button-apple-podcasts {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Apple Podcasts Alt */
.button-apple-podcasts-alt {
--button-text:#ffffff;
background-image:linear-gradient(to bottom,#F452FF,#832BC1);
}
/* Bandcamp */
.button-bandcamp {
--button-text:#ffffff;
--button-background:#1d9fc3;
}
/* Behance */
.button-behance {
--button-text:#ffffff;
--button-background:#0057FF;
--button-border:1px solid #FFFFFF;
}
/* Bluesky */
.button-bluesky {
--button-text:#FFFFFF;
--button-background:#1185FE;
}
/* Bluesky Alt */
.button-bluesky-alt {
--button-text:#000000;
--button-background:#FFFFFF;
--button-border:1px solid #000000;
}
/* Buy Me a Coffee */
.button-coffee {
--button-text:#000000;
--button-background:#ffdd00;
}
/* Cal.com */
.button-cal {
--button-text:#FFFFFF;
--button-background:#292929;
--button-border:1px solid #FFFFFF;
}
/* Calendly */
.button-calendly {
--button-text:#FFFFFF;
--button-background:#006BFF;
}
/* Cash App */
.button-cash-app {
--button-text:#ffffff;
background-image:linear-gradient(to bottom,#00d64b,#00c244);
}
/* dev.to */
.button-dev-to {
--button-text:#000000;
--button-background:#f5f5f5;
--button-border:1px solid #212121;
}
/* Discogs */
.button-discogs {
--button-text:#000000;
--button-background:#FFFFFF;
--button-border:1px solid #000000;
}
/* Discogs Alt */
.button-discogs-alt {
--button-text:#FFFFFF;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Discord */
.button-discord {
--button-text:#ffffff;
--button-background:#5865F2;
}
/* Dribbble */
.button-dribbble {
--button-text:#000000;
--button-background:#FFFFFF;
--button-border:1px solid #212121;
}
/* Etsy */
.button-etsy {
--button-text:#ffffff;
--button-background:#F45800;
}
/* Facebook */
.button-faceb {
--button-text:#ffffff;
--button-background:#0866FF;
}
/* Facebook Messenger */
.button-messenger {
--button-text:#ffffff;
--button-background:#0866FF;
}
/* Figma */
.button-figma {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Fiverr */
.button-fiverr {
--button-text:#ffffff;
--button-background:#1DBF73;
}
/* Flickr */
.button-flickr {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* GitHub */
.button-github {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* GitLab */
.button-gitlab {
--button-text:#ffffff;
--button-background:#6151b2;
}
/* GoFundMe */
.button-gofundme {
--button-text:#ffffff;
--button-background:#02A95C;
}
/* Goodreads */
.button-goodreads {
--button-text:#333333;
--button-background:#f3f1e6;
--button-border:1px solid #212121;
}
/* Google Black */
.button-google-black {
--button-text:#FFFFFF;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Google Play Store */
.button-playstore {
--button-text:#FFFFFF;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Google Scholar */
.button-google-scholar {
--button-text:#000000;
--button-background:#FFFFFF;
--button-border:1px solid #212121;
}
/* Hashnode */
.button-hashnode {
--button-text:#000000;
--button-background:#ffffff;
--button-border:1px solid #212121;
}
/* Instagram */
.button-instagram {
--button-text:#ffffff;
background-image:linear-gradient(-135deg,#1400c8,#b900b4,#f50000);
}
/* Kick */
.button-kick {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #ffffff;
}
/* Kick Alt */
.button-kick-alt {
--button-text:#000000;
--button-background:#01e701;
}
/* Kickstarter */
.button-kickstarter {
--button-text:#ffffff;
--button-background:#05ce78;
}
/* Kit */
.button-kit {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Ko-fi */
.button-ko-fi {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
--button-border:2px solid #ffffff;
}
/* Last.fm */
.button-last-fm {
--button-text:#ffffff;
--button-background:#D51007;
}
/* Letterboxd */
.button-letterboxd {
--button-text:#ffffff;
--button-background:#2c3440;
--button-border:1px solid #FFFFFF;
}
/* Line */
.button-line {
--button-text:#FFFFFF;
--button-background:#06C755;
}
/* LinkedIn */
.button-linked {
--button-text:#ffffff;
--button-background:#2867b2;
}
/* Mailchimp */
.button-mailchimp {
--button-text:#000000;
--button-background:#FFE01B;
--button-background:#f71414;
}
/* Mastodon */
.button-mastodon {
--button-text:#ffffff;
--button-background:#17063B;
--button-border:1px solid #FFFFFF;
--button-background:#1f232b;
}
/* Matrix */
.button-matrix {
/* MetaGamerScore */
.button-metagamerscore {
--button-text:#000000;
--button-background:#ffffff;
--button-border:1px solid #000000;
}
/* Meetup */
.button-meetup {
--button-text:#000000;
--button-background:#ffffff;
--button-border:1px solid #000000;
}
/* Meetup Alt */
.button-meetup-alt {
--button-text:#ffffff;
--button-background:#ED1C40;
}
/* Medium */
.button-medium {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Microsoft */
.button-microsoft {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Notion */
.button-notion {
--button-text:#000000;
--button-background:#ffffff;
--button-border:1px solid #212121;
}
/* Obsidian */
.button.button-obsidian {
--button-text:#ffffff;
--button-background:#262626;
--button-border:1px solid #ffffff;
}
/* OnlyFans */
.button-onlyfans {
--button-text:#ffffff;
--button-background:#00AEEF;
}
/* Patreon */
.button-patreon {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
--button-background:#f0f0f0;
}
/* PayPal */
@@ -888,221 +517,57 @@ ul li {
--button-border:1px solid #FFFFFF;
}
/* Pinterest */
.button-pinterest {
/* Pixelfed */
.button-pixelfed {
--button-text:#000000;
--button-background:#ffffff;
--button-border:1px solid #212121;
--button-border:2px solid #000000;
}
/* Product Hunt */
.button-product-hunt {
--button-text:#000000;
--button-background:#ffffff;
--button-border:1px solid #212121;
}
/* Reddit */
.button-reddit {
--button-text:#FFFFFF;
--button-background:#FF4500;
}
/* Shop */
.button-shop {
/* Value for Value */
.button-v4v {
--button-text:#ffffff;
--button-background:#5A31F4;
--button-background:#1DBF73;
}
/* Signal */
.button-signal {
/* Value for Value */
.button-v4v {
--button-text:#ffffff;
--button-background:#3B45FD;
--button-background:#1DBF73;
}
/* Signal Alt */
.button-signal-alt {
--button-text:#3B45FD;
--button-background:#E3E8FE;
--button-border:1px solid #000000;
/* Custom Styles
*/
details.value-block > summary {
list-style: none;
width: fit-content;
margin-left: auto;
margin-right: auto;
}
/* Slack */
.button-slack {
--button-text:#000000;
--button-background:#FFFFFF;
--button-border:1px solid #212121;
details.value-block > summary::-webkit-details-marker {
display: none;
}
/* Snapchat */
.button-snapchat {
--button-text:#000000;
--button-background:#fffc00;
.value-block ul {
list-style-type: none;
padding-inline-start: 0;
}
/* SoundCloud */
.button-soundcloud {
--button-text:#ffffff;
--button-background:#ff5500;
.value-block code {
font-size: .75rem
}
/* Spotify */
.button-spotify {
--button-text:#191414;
--button-background:#1db954;
code, kbd, pre, samp {
font-family: "IBM Plex Mono", monospace;
}
/* Spotify Alt */
.button-spotify-alt {
--button-text:#FFFFFF;
--button-background:#191414;
--button-border:1px solid #FFFFFF;
}
/* Square */
.button-square {
--button-text:#FFFFFF;
--button-background:#006AFF;
}
/* Stack Overflow */
.button-stack-overflow {
--button-text:#000000;
--button-background:#FFFFFF;
--button-border:1px solid #000000;
}
/* Steam */
.button-steam {
--button-text:#ffffff;
background-image:linear-gradient(90deg,#08BBFF,#2B75FF);
}
/* Steam Alt */
.button-steam-alt {
--button-text:#ffffff;
background-image:linear-gradient(90deg,#09172a,#072a57,#0c5085);
--button-border:1px solid #FFFFFF;
}
/* Strava */
.button-strava {
--button-text:#ffffff;
--button-background:#fc5200;
}
/* Substack */
.button-substack {
--button-text:#ffffff;
--button-background:#FF6719;
}
/* Telegram */
.button-telegram {
--button-text:#ffffff;
--button-background:#3faee8;
}
/* Threads */
.button-threads {
--button-text:#FFFFFF;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Threema */
.button-threema {
--button-text:#000000;
--button-background:#3fe669;
}
/* TikTok */
.button-tiktok {
--button-text:#ffffff;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* Trello */
.button-trello {
--button-text:#ffffff;
--button-background:#0065ff;
}
/* Tumblr */
.button-tumb {
--button-text:#ffffff;
--button-background:#131313;
--button-border:1px solid #FFFFFF;
}
/* Twitch */
.button-twitch {
--button-text:#ffffff;
--button-background:#9146ff;
}
/* Unsplash */
.button-unsplash {
--button-text:#000000;
--button-background:#ffffff;
--button-border:1px solid #212121;
}
/* Venmo */
.button-venmo {
--button-text:#ffffff;
--button-background:#008CFF;
}
/* Vimeo */
.button-vimeo {
--button-text:#ffffff;
--button-background:#1ab7ea;
}
/* VSCO */
.button-vsco {
--button-text:#FFFFFF;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* WhatsApp */
.button-whatsapp {
--button-text:#ffffff;
--button-background:#455a64;
}
/* WordPress */
.button-wordpress {
--button-text:#ffffff;
--button-background:#3858E9;
}
/* X */
.button-x {
--button-text:#FFFFFF;
--button-background:#000000;
--button-border:1px solid #FFFFFF;
}
/* YouTube */
.button-yt {
--button-text:#ffffff;
--button-background:#282828;
--button-border:1px solid #FFFFFF;
}
/* YouTube Alt */
.button-yt-alt {
--button-text:#ffffff;
--button-background:#FF0000;
}
/* Zoom */
.button-zoom {
--button-text:#ffffff;
--button-background:#0B5CFF;
--button-border:1px solid #FFFFFF;
.value-block code {
padding: .2rem .5rem;
margin: 0 .2rem;
white-space: nowrap;
background: #f1f1f1;
border: 1px solid #e1e1e1;
border-radius: 4px;
}