🎉 - Réalisation du site répertoire de liens
This commit is contained in:
445
css/brands-extended.css
Normal file
445
css/brands-extended.css
Normal file
@@ -0,0 +1,445 @@
|
||||
/*
|
||||
* LittleLink Extended Button Styles
|
||||
* https://littlelink.io
|
||||
* Free to use under the MIT license
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*/
|
||||
|
||||
/* 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;
|
||||
}
|
||||
|
||||
/* Global Button Hover Effect
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.button:hover,button:hover {
|
||||
filter:brightness(90%);
|
||||
transform:translateY(-1px);
|
||||
}
|
||||
|
||||
/* Button Icons
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.icon {
|
||||
filter:var(--icon-filter,none);
|
||||
}
|
||||
|
||||
/* Brand-Specific Styles
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
|
||||
/* 500px */
|
||||
.button-500px {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* Alpha Universe */
|
||||
.button-alphauniverse {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* AniList */
|
||||
.button-anilist {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#2B2D42;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Audiomack */
|
||||
.button-audiomack {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Bandsintown */
|
||||
.button-bandsintown {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* BeReal */
|
||||
.button-bereal {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Big Cartel */
|
||||
.button-bigcartel {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#222222;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Bonfire */
|
||||
.button-bonfire {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#F49979;
|
||||
--button-border:1px solid #3D4853;
|
||||
}
|
||||
|
||||
/* Cameo */
|
||||
.button-cameo {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Clubhouse */
|
||||
.button-clubhouse {
|
||||
--button-text:#1F1F1A;
|
||||
--button-background:#F1EFE3;
|
||||
--button-border:1px solid #212121;
|
||||
}
|
||||
|
||||
/* Codepen */
|
||||
.button-codepen {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* Deezer */
|
||||
.button-deezer {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#181818;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Devpost */
|
||||
.button-devpost {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#003E54;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Distiller */
|
||||
.button-dist {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#ED5C47;
|
||||
}
|
||||
|
||||
/* Filmweb */
|
||||
.button-filmweb {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* GOG */
|
||||
.button-gog {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#303030;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Guilded */
|
||||
.button-guilded {
|
||||
--button-text:#000000;
|
||||
--button-background:#F5C400;
|
||||
}
|
||||
|
||||
/* Gumroad */
|
||||
.button-gumroad {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* HackerEarth */
|
||||
.button-hackerearth {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#2B3352;
|
||||
}
|
||||
|
||||
/* HackerRank */
|
||||
.button-hackerrank {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* itch.io */
|
||||
.button-itchio {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#FA5C5C;
|
||||
}
|
||||
|
||||
/* Layers */
|
||||
.button-layers {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* LeetCode */
|
||||
.button-leetcode {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* Lemmy */
|
||||
.button-lemmy {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#14854F;
|
||||
}
|
||||
|
||||
/* ListenBrainz */
|
||||
.button-listenbrainz {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* Matrix */
|
||||
.button-matrix {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Micro.blog */
|
||||
.button-microblog {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#FD9927;
|
||||
}
|
||||
|
||||
/* Mixcloud */
|
||||
.button-mixcloud {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#5000FF;
|
||||
}
|
||||
|
||||
/* MyAnimeList */
|
||||
.button-myanimelist {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* NGL */
|
||||
.button-ngl {
|
||||
--button-text:#FFFFFF;
|
||||
background-image:linear-gradient(-45deg, #ff8d10, #ec1187);
|
||||
}
|
||||
|
||||
/* Nostr */
|
||||
.button-nostr {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#A915FF;
|
||||
}
|
||||
|
||||
/* OP.GG */
|
||||
.button-opgg {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#5383E8;
|
||||
}
|
||||
|
||||
/* OpenSea */
|
||||
.button-opensea {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#0086FF;
|
||||
--button-border:1px solid #0086FF;
|
||||
}
|
||||
|
||||
/* OpenStreetMap */
|
||||
.button-osm {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* ORCID ID */
|
||||
.button-orcid-id {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #212121;
|
||||
}
|
||||
|
||||
/* osu! */
|
||||
.button-osu {
|
||||
--button-text:#000000;
|
||||
--button-background:#FF8EE6;
|
||||
}
|
||||
|
||||
/* Partiful */
|
||||
.button-partiful {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* PeerTube */
|
||||
.button-peertube {
|
||||
--button-text:#000000;
|
||||
--button-background:#FCE8DB;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* Pixelfed */
|
||||
.button-pixelfed {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* PlayStation */
|
||||
.button-playstation {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#0070D1;
|
||||
}
|
||||
|
||||
/* Qobuz */
|
||||
.button-qobuz {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* QQ */
|
||||
.button-qq {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* Ravelry */
|
||||
.button-ravelry {
|
||||
--button-text:#000000;
|
||||
--button-background:#F3F4F0;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* Redbubble */
|
||||
.button-redbubble {
|
||||
--button-text:#e41321;
|
||||
--button-background:#ffffff;
|
||||
--button-border:1px solid #212121;
|
||||
}
|
||||
|
||||
/* ResearchGate */
|
||||
.button-researchgate {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #212121;
|
||||
}
|
||||
|
||||
/* Revolut */
|
||||
.button-revolut {
|
||||
--button-text:#000000;
|
||||
--button-background:#ffffff;
|
||||
--button-border:1px solid black;
|
||||
}
|
||||
|
||||
/* Roll20 */
|
||||
.button-roll20 {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#EC008C;
|
||||
}
|
||||
|
||||
/* SimpleX Chat */
|
||||
.button-simplex {
|
||||
--button-text:#000000;
|
||||
--button-background:#F3F6F7;
|
||||
--button-border: 1px solid #000000;
|
||||
}
|
||||
|
||||
/* SimpleX Chat Alt */
|
||||
.button-simplex-alt {
|
||||
--button-text:#FFFFFF;
|
||||
--background-color: #000000;
|
||||
--button-border: 1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Skoob */
|
||||
.button-skoob {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#3189C8;
|
||||
}
|
||||
|
||||
/* SpaceHey */
|
||||
.button-spacehey {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#3234CF;
|
||||
}
|
||||
|
||||
/* Tidal */
|
||||
.button-tidal {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Trakt */
|
||||
.button-trakt {
|
||||
--button-text:#ffffff;
|
||||
--button-background:#ED1C24;
|
||||
}
|
||||
|
||||
/* Untappd */
|
||||
.button-untappd {
|
||||
--button-text:#000000;
|
||||
--button-background:#ffc000;
|
||||
}
|
||||
|
||||
/* Upwork */
|
||||
.button-upwork {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#14A800;
|
||||
}
|
||||
|
||||
/* Vero */
|
||||
.button-vero {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#000000;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* VRChat */
|
||||
.button-vrchat {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* WIP */
|
||||
.button-wip {
|
||||
--button-text:#000000;
|
||||
--button-background:#F9DB00;
|
||||
}
|
||||
|
||||
/* Write.as */
|
||||
.button-writeas {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* WriteFreely */
|
||||
.button-writefreely {
|
||||
--button-text:#000000;
|
||||
--button-background:#F4F4F4;
|
||||
--button-border:1px solid #000000;
|
||||
}
|
||||
|
||||
/* Xbox */
|
||||
.button-xbox {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#107C10;
|
||||
}
|
||||
|
||||
/* Xing */
|
||||
.button-xing {
|
||||
--button-text:#FFFFFF;
|
||||
--button-background:#026466;
|
||||
}
|
||||
606
css/brands.css
Normal file
606
css/brands.css
Normal file
@@ -0,0 +1,606 @@
|
||||
/*
|
||||
* LittleLink Button Styles
|
||||
* https://littlelink.io
|
||||
* Free to use under the MIT license
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*/
|
||||
|
||||
/* 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;
|
||||
}
|
||||
|
||||
/* Global Button Hover Effect
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.button:hover,button:hover {
|
||||
filter:brightness(90%);
|
||||
transform:translateY(-1px);
|
||||
}
|
||||
|
||||
/* Button Icons
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.icon {
|
||||
filter:var(--icon-filter,none);
|
||||
}
|
||||
|
||||
/* Brand-Specific Styles
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
|
||||
/* Default */
|
||||
.button.button-default {
|
||||
--button-text:#ffffff;
|
||||
--button-background:#2457F5;
|
||||
--button-border:1px solid #ffffff;
|
||||
}
|
||||
|
||||
/* Amazon */
|
||||
.button-amazon {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #212121;
|
||||
}
|
||||
|
||||
/* 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 {
|
||||
--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:#1877f2;
|
||||
}
|
||||
|
||||
/* Facebook Messenger */
|
||||
.button-messenger {
|
||||
--button-text:#ffffff;
|
||||
background-image:linear-gradient(25deg,#0099ff,#5f5dff,#a033ff,#c740cc,#ff5280,#ff7061);
|
||||
}
|
||||
|
||||
/* 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;
|
||||
}
|
||||
|
||||
/* 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;
|
||||
}
|
||||
|
||||
/* Mastodon */
|
||||
.button-mastodon {
|
||||
--button-text:#ffffff;
|
||||
--button-background:#17063B;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* 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;
|
||||
}
|
||||
|
||||
/* PayPal */
|
||||
.button-paypal {
|
||||
--button-text:#ffffff;
|
||||
--button-background:#002991;
|
||||
--button-border:1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
/* Pinterest */
|
||||
.button-pinterest {
|
||||
--button-text:#000000;
|
||||
--button-background:#ffffff;
|
||||
--button-border:1px solid #212121;
|
||||
}
|
||||
|
||||
/* 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 {
|
||||
--button-text:#ffffff;
|
||||
--button-background:#5A31F4;
|
||||
}
|
||||
|
||||
/* Signal */
|
||||
.button-signal {
|
||||
--button-text:#ffffff;
|
||||
--button-background:#3a76f0;
|
||||
}
|
||||
|
||||
/* Slack */
|
||||
.button-slack {
|
||||
--button-text:#000000;
|
||||
--button-background:#FFFFFF;
|
||||
--button-border:1px solid #212121;
|
||||
}
|
||||
|
||||
/* Snapchat */
|
||||
.button-snapchat {
|
||||
--button-text:#000000;
|
||||
--button-background:#fffc00;
|
||||
}
|
||||
|
||||
/* SoundCloud */
|
||||
.button-soundcloud {
|
||||
--button-text:#ffffff;
|
||||
--button-background:#ff5500;
|
||||
}
|
||||
|
||||
/* Spotify */
|
||||
.button-spotify {
|
||||
--button-text:#191414;
|
||||
--button-background:#1db954;
|
||||
}
|
||||
|
||||
/* 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;
|
||||
}
|
||||
33
css/custom.css
Normal file
33
css/custom.css
Normal file
@@ -0,0 +1,33 @@
|
||||
hr {
|
||||
border: none;
|
||||
height: 1px;
|
||||
width: 40%;
|
||||
background: lightgray;
|
||||
opacity: .3;
|
||||
margin-bottom: 2rem
|
||||
}
|
||||
|
||||
.space {
|
||||
margin-bottom: 2rem
|
||||
}
|
||||
.custom.icon {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
.button-araneite {
|
||||
background: linear-gradient(to right, #1C0052, #460A7C);
|
||||
color: white;
|
||||
}
|
||||
.button-skycel {
|
||||
border: 3px solid #FA784F;
|
||||
color: white;
|
||||
background: rgb(2,0,36);
|
||||
background: linear-gradient(130deg, rgba(2,0,36,1) 0%, rgba(0,0,0,1) 49%, rgba(250,120,79,1) 50%, rgba(250,120,79,1) 100%);
|
||||
background-size: 220% auto;
|
||||
background-position: left center;
|
||||
transition: background-position .3s ease-in-out;
|
||||
}
|
||||
.button-skycel:hover {
|
||||
color: black;
|
||||
background-position: right center;
|
||||
}
|
||||
91
css/reset.css
Normal file
91
css/reset.css
Normal file
@@ -0,0 +1,91 @@
|
||||
/*
|
||||
* LittleLink Reset
|
||||
* A minimal CSS reset for LittleLink
|
||||
*/
|
||||
|
||||
/* Box sizing rules */
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Remove default margin */
|
||||
body,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
p,
|
||||
figure,
|
||||
blockquote,
|
||||
dl,
|
||||
dd {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Remove list styles on ul, ol elements */
|
||||
ul,
|
||||
ol {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* Set core root defaults */
|
||||
html:focus-within {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
/* Set core body defaults */
|
||||
body {
|
||||
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;
|
||||
}
|
||||
|
||||
/* Inherit fonts for inputs and buttons */
|
||||
input,
|
||||
button,
|
||||
textarea,
|
||||
select {
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
/* Modern focus styles */
|
||||
:focus:not(:focus-visible) {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
:focus-visible {
|
||||
outline: 2px solid #2457F5;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* Remove touch callout on iOS */
|
||||
a {
|
||||
-webkit-touch-callout: none;
|
||||
}
|
||||
382
css/style.css
Normal file
382
css/style.css
Normal file
@@ -0,0 +1,382 @@
|
||||
/*
|
||||
* LittleLink
|
||||
* https://littlelink.io
|
||||
* Free to use under the MIT license
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*/
|
||||
|
||||
/* Base Typography Settings
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
:root {
|
||||
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-left {
|
||||
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 */
|
||||
}
|
||||
.column {
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
/* Base Styles
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
body {
|
||||
margin:0;
|
||||
padding:0;
|
||||
background-color:#ffffff;
|
||||
color:#1a1a1a;
|
||||
font-family:"Open Sans",system-ui;
|
||||
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;
|
||||
hyphens:auto; /* Delete this to remove automatic hyphen on line break */
|
||||
}
|
||||
.container p {
|
||||
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-1:1.25rem; /* 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 */
|
||||
}
|
||||
|
||||
/* Avatar */
|
||||
.avatar {
|
||||
width: 8rem; /* 128px */
|
||||
height: 8rem;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
background-position: center;
|
||||
margin-bottom: var(--spacing-l);
|
||||
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;
|
||||
}
|
||||
body {
|
||||
font-size:var(--scale-1); /* 20px */
|
||||
line-height:1.6;
|
||||
}
|
||||
.container p {
|
||||
margin:0 0 var(--spacing-xl) 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;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
footer {
|
||||
margin:var(--spacing-xxl) 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-0);
|
||||
}
|
||||
.avatar {
|
||||
margin-bottom:var(--spacing-m);
|
||||
}
|
||||
footer {
|
||||
margin:var(--spacing-xl) 0; /* 3rem (48px) top and bottom */
|
||||
}
|
||||
}
|
||||
|
||||
/* Links
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
a {
|
||||
color:#2457F5;
|
||||
text-decoration:underline;
|
||||
}
|
||||
a:hover {
|
||||
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;
|
||||
}
|
||||
|
||||
/* Icons
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.icon {
|
||||
width:1.25rem;
|
||||
height:1.25rem;
|
||||
margin-right:0.5rem;
|
||||
flex-shrink:0;
|
||||
}
|
||||
|
||||
/* Avatar
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.avatar {
|
||||
width: 8rem; /* 128px */
|
||||
height: 8rem;
|
||||
object-fit: cover;
|
||||
background-position: center;
|
||||
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 */
|
||||
|
||||
/* Dark theme */
|
||||
:root.theme-dark {
|
||||
color-scheme:dark;
|
||||
}
|
||||
:root.theme-dark :focus-visible {
|
||||
outline: 2px solid #4899F7;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
:root.theme-dark body {
|
||||
background-color:#121212;
|
||||
color:#ffffff;
|
||||
}
|
||||
:root.theme-dark a:not(.button) {
|
||||
color:#4899F7;
|
||||
}
|
||||
:root.theme-dark a:not(.button):hover {
|
||||
color:#7AB8FF;
|
||||
}
|
||||
|
||||
/* Auto theme */
|
||||
:root.theme-auto {
|
||||
color-scheme:light 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;
|
||||
}
|
||||
}
|
||||
|
||||
/* Button Text Color Override
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.button:hover,button:hover {
|
||||
color:var(--button-text);
|
||||
}
|
||||
|
||||
/* Responsive Typography
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
@media (max-width:34.375rem) { /* 550px */
|
||||
h1 {
|
||||
font-size:2rem; /* 32px */
|
||||
}
|
||||
body {
|
||||
font-size:1rem; /* 16px */
|
||||
}
|
||||
}
|
||||
|
||||
/* Privacy Page Styles
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
nav {
|
||||
margin:var(--spacing-l) 0;
|
||||
text-align:left;
|
||||
}
|
||||
section {
|
||||
margin:var(--spacing-xl) 0;
|
||||
text-align:left;
|
||||
}
|
||||
h2 {
|
||||
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;
|
||||
}
|
||||
ul {
|
||||
list-style:none;
|
||||
padding:0;
|
||||
margin:0 0 var(--spacing-m) 0;
|
||||
}
|
||||
ul li {
|
||||
margin-bottom:var(--spacing-xs);
|
||||
}
|
||||
|
||||
/* Privacy page specific responsive adjustments */
|
||||
@media (max-width:34.375rem) {
|
||||
h2 {
|
||||
font-size:var(--scale-2);
|
||||
}
|
||||
h3 {
|
||||
font-size:var(--scale-1);
|
||||
}
|
||||
section {
|
||||
margin:var(--spacing-l) 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* 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');
|
||||
}
|
||||
Reference in New Issue
Block a user