diff --git a/CHANGELOG.md b/CHANGELOG.md index 97b58c0..559a044 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,13 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [Unreleased] + +### Added + +- [#108](https://github.com/kytta/shareon/pull/108) + Fediverse button (via [Share₂Fedi](https://github.com/kytta/share2fedi)) + ## [2.4.0] - 2023-12-07 ### Added diff --git a/README.md b/README.md index 82a8a98..9ddf307 100644 --- a/README.md +++ b/README.md @@ -94,6 +94,7 @@ names of which match the names of the social networks (or `copy-url`, for the ```html
+ @@ -140,6 +141,8 @@ Apart from the URL and title, some networks support extra parameters: - you **MUST** add `data-fb-app-id` to the FB Messenger button to make sharing even possible +- add `data-s2f-instance` to the Fediverse button to set your Share₂Fedi + instance - add `data-media` to an Odnoklassniki, Pinterest, or VK button to customize the pinned picture - add `data-text` to a Mastodon, Telegram, Tumblr, Viber, or WhatsApp button to add @@ -155,6 +158,7 @@ Here are all custom parameters: ```html
+ Pin diff --git a/index.html b/index.html index 45935fd..4802d4a 100644 --- a/index.html +++ b/index.html @@ -30,6 +30,7 @@

<a>

+ @@ -54,6 +55,7 @@

<button>

+ @@ -83,6 +85,7 @@ data-text="hey check this out" > + @@ -106,6 +109,7 @@

Specimen

+ Toot diff --git a/package.json b/package.json index 0df9edb..39f3547 100644 --- a/package.json +++ b/package.json @@ -110,12 +110,12 @@ }, "size-limit": [ { - "limit": "6 KB", + "limit": "6 KiB", "path": "./dist/shareon.min.css", "brotli": true }, { - "limit": "1 KB", + "limit": "1 KiB", "path": "./dist/shareon.es.js", "brotli": true } diff --git a/src/icons/fediverse.svg b/src/icons/fediverse.svg new file mode 100644 index 0000000..92aba54 --- /dev/null +++ b/src/icons/fediverse.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/shareon.css b/src/shareon.css index 1964807..b099aad 100644 --- a/src/shareon.css +++ b/src/shareon.css @@ -92,6 +92,13 @@ background-image: url("icons/facebook.svg"); } +.shareon > .fediverse { + background-color: #8a54af; +} +.shareon > .fediverse:before { + background-image: url("icons/fediverse.svg"); +} + .shareon > .linkedin { background-color: #0a66c2; } diff --git a/src/shareon.js b/src/shareon.js index 63d75c5..b5358cc 100644 --- a/src/shareon.js +++ b/src/shareon.js @@ -13,11 +13,13 @@ import "./shareon.css"; * media?: string, * text?: string, * via?: string, - * fbAppId?: string + * fbAppId?: string, + * s2fInstance?: string, * }) => string}} */ const urlBuilderMap = { facebook: (d) => `https://www.facebook.com/sharer/sharer.php?u=${d.url}${d.hashtags ? `&hashtag=%23${d.hashtags.split('%2C')[0]}` : ''}`, + fediverse: (d) => `https://${d.s2fInstance}/?text=${d.title}%0D%0A${d.url}${d.text ? `%0D%0A%0D%0A${d.text}` : ''}${d.via ? `%0D%0A%0D%0A${d.via}` : ''}`, email: (d) => `mailto:?subject=${d.title}&body=${d.url}`, linkedin: (d) => `https://www.linkedin.com/sharing/share-offsite/?url=${d.url}`, mastodon: (d) => `https://toot.kytta.dev/?text=${d.title}%0D%0A${d.url}${d.text ? `%0D%0A%0D%0A${d.text}` : ''}${d.via ? `%0D%0A%0D%0A${d.via}` : ''}`, @@ -126,6 +128,11 @@ const init = () => { fbAppId: encodeURIComponent( child.dataset.fbAppId || container.dataset.fbAppId || "", ), + s2fInstance: encodeURIComponent( + child.dataset.s2fInstance || + container.dataset.s2fInstance || + "s2f.kytta.dev", + ), }; const url = urlBuilderMap[cls](preset);