diff --git a/docs/docusaurus.config.ts b/docs/docusaurus.config.ts index ba04caa5..54240aed 100644 --- a/docs/docusaurus.config.ts +++ b/docs/docusaurus.config.ts @@ -191,26 +191,26 @@ const config: Config = { position: 'right', dropdownActiveClassDisabled: true, }, - { - href: GITHUB_URL, - label: 'GitHub', - position: 'right' - }, { href: TWITTER_URL, - label: 'Twitter', - position: 'right' + position: 'right', + className: "header-icon-link icon-twitter", }, { href: MASTODON_URL, - label: 'Mastodon', rel: 'me', - position: 'right' + position: 'right', + className: "header-icon-link icon-mastodon", }, { href: DISCORD_URL, - label: 'Discord', - position: 'right' + position: 'right', + className: "header-icon-link icon-discord", + }, + { + href: GITHUB_URL, + position: 'right', + className: "header-icon-link icon-github", } ] }, diff --git a/docs/src/css/custom.css b/docs/src/css/custom.css index bd242147..b1d0a07c 100644 --- a/docs/src/css/custom.css +++ b/docs/src/css/custom.css @@ -76,3 +76,36 @@ .gold-sponsors table img { width: 200px; } + +.header-icon-link::before { + content: ''; + width: 24px; + height: 24px; + display: flex; + background-color: var(--ifm-navbar-link-color); + transition: background-color var(--ifm-transition-fast) + var(--ifm-transition-timing-default); + mask-size: contain; + mask-repeat: no-repeat; + mask-position: center; +} + +.header-icon-link:hover::before { + background-color: var(--ifm-navbar-link-hover-color); +} + +.icon-github::before { + mask-image: url('/img/icon-github.svg'); +} + +.icon-discord::before { + mask-image: url('/img/icon-discord.svg'); +} + +.icon-mastodon::before { + mask-image: url('/img/icon-mastodon.svg'); +} + +.icon-twitter::before { + mask-image: url('/img/icon-twitter.svg'); +} diff --git a/docs/static/img/icon-discord.svg b/docs/static/img/icon-discord.svg new file mode 100644 index 00000000..5b86d820 --- /dev/null +++ b/docs/static/img/icon-discord.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/icon-github.svg b/docs/static/img/icon-github.svg new file mode 100644 index 00000000..a3fcb98d --- /dev/null +++ b/docs/static/img/icon-github.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/icon-mastodon.svg b/docs/static/img/icon-mastodon.svg new file mode 100644 index 00000000..b22406aa --- /dev/null +++ b/docs/static/img/icon-mastodon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/icon-twitter.svg b/docs/static/img/icon-twitter.svg new file mode 100644 index 00000000..c8465f4a --- /dev/null +++ b/docs/static/img/icon-twitter.svg @@ -0,0 +1,21 @@ + + + + + + + + \ No newline at end of file