From bfd3a95a4b9c5828b0623eda15a19b48cebdca61 Mon Sep 17 00:00:00 2001 From: Yangshun Tay Date: Mon, 1 Aug 2022 06:58:04 +0800 Subject: [PATCH] website: update icons --- ...-30-a-glimpse-into-front-end-interviews.md | 2 +- website/docusaurus.config.js | 17 ++++- website/src/css/custom.css | 75 +++---------------- website/static/img/icons8-facebook-light.svg | 1 - website/static/img/icons8-facebook.svg | 1 - website/static/img/icons8-github-light.svg | 1 - website/static/img/icons8-github.svg | 1 - website/static/img/icons8-telegram-light.svg | 1 - website/static/img/icons8-telegram.svg | 1 - website/static/img/icons8-twitter-light.svg | 1 - website/static/img/icons8-twitter.svg | 1 - website/static/img/instagram-light.svg | 1 - website/static/img/instagram.svg | 1 - 13 files changed, 27 insertions(+), 77 deletions(-) delete mode 100644 website/static/img/icons8-facebook-light.svg delete mode 100644 website/static/img/icons8-facebook.svg delete mode 100644 website/static/img/icons8-github-light.svg delete mode 100644 website/static/img/icons8-github.svg delete mode 100644 website/static/img/icons8-telegram-light.svg delete mode 100644 website/static/img/icons8-telegram.svg delete mode 100644 website/static/img/icons8-twitter-light.svg delete mode 100644 website/static/img/icons8-twitter.svg delete mode 100644 website/static/img/instagram-light.svg delete mode 100644 website/static/img/instagram.svg diff --git a/website/blog/2021-08-30-a-glimpse-into-front-end-interviews.md b/website/blog/2021-08-30-a-glimpse-into-front-end-interviews.md index b454ea7d..268c7100 100644 --- a/website/blog/2021-08-30-a-glimpse-into-front-end-interviews.md +++ b/website/blog/2021-08-30-a-glimpse-into-front-end-interviews.md @@ -2,7 +2,7 @@ title: A Glimpse into Front End Interviews slug: a-glimpse-into-front-end-interviews author: Kai Li -author_title: Software Engineer at Quora +author_title: Software Engineer at Stripe, ex-Quora author_url: https://github.com/li-kai author_image_url: https://github.com/li-kai.png tags: [front end, leetcode] diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index 7c653022..f5188707 100755 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -49,26 +49,39 @@ module.exports = { { href: 'https://github.com/yangshun/tech-interview-handbook', position: 'right', - className: 'navbar-icon navbar-icon-github', + className: 'navbar-icon', 'aria-label': 'GitHub repository', + html: ` + + `, }, { href: 'https://discord.gg/usMqNaPczq', position: 'right', - className: 'navbar-icon navbar-icon-discord', + className: 'navbar-icon', 'aria-label': 'Discord channel', + html: ``, }, { href: 'https://t.me/techinterviewhandbook', position: 'right', className: 'navbar-icon navbar-icon-telegram', 'aria-label': 'Telegram channel', + html: ``, }, { href: 'https://twitter.com/techinterviewhb', position: 'right', className: 'navbar-icon navbar-icon-twitter', 'aria-label': 'Twitter page', + html: ``, }, ], }, diff --git a/website/src/css/custom.css b/website/src/css/custom.css index ee36df30..6034143a 100755 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -147,74 +147,21 @@ div[class^='announcementBar_'] { margin-bottom: 0 !important; } -.navbar-icon:before { - background-repeat: no-repeat; - content: ''; +.navbar-icon { + border-radius: 50%; display: flex; - height: 24px; - width: 24px; - transition: all 300ms ease-in-out; + height: 32px; + width: 32px; + align-items: center; + justify-content: center; + margin-right: 12px; + padding: 0; + transition: background var(--ifm-transition-fast); } .navbar-icon:hover { - opacity: 0.8; -} - -.navbar-icon-github:before { - background-image: url('/img/icons8-github.svg'); -} - -html[data-theme='dark'] .navbar-icon-github:before { - background-image: url('/img/icons8-github-light.svg'); - height: 28px; - width: 28px; -} - -.navbar-icon-twitter:before { - background-image: url('/img/icons8-twitter.svg'); -} - -html[data-theme='dark'] .navbar-icon-twitter:before { - background-image: url('/img/icons8-twitter-light.svg'); -} - -.navbar-icon-facebook:before { - background-image: url('/img/icons8-facebook.svg'); - width: 28px; -} - -html[data-theme='dark'] .navbar-icon-facebook:before { - background-image: url('/img/icons8-facebook-light.svg'); - height: 28px; - width: 28px; -} - -.navbar-icon-telegram:before { - background-image: url('/img/icons8-telegram.svg'); -} - -html[data-theme='dark'] .navbar-icon-telegram:before { - background-image: url('/img/icons8-telegram-light.svg'); - height: 28px; - width: 24px; -} - -.navbar-icon-instagram:before { - background-image: url('/img/instagram.svg'); - width: 24px; -} - -html[data-theme='dark'] .navbar-icon-instagram:before { - background-image: url('/img/instagram-light.svg'); -} - -.navbar-icon-discord:before { - background-image: url('/img/discord.svg'); - width: 31px; -} - -html[data-theme='dark'] .navbar-icon-discord:before { - background-image: url('/img/discord-light.svg'); + background: var(--ifm-color-emphasis-200); + color: inherit; } .admonition-heading h5 { diff --git a/website/static/img/icons8-facebook-light.svg b/website/static/img/icons8-facebook-light.svg deleted file mode 100644 index be47b238..00000000 --- a/website/static/img/icons8-facebook-light.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/static/img/icons8-facebook.svg b/website/static/img/icons8-facebook.svg deleted file mode 100644 index 9931883f..00000000 --- a/website/static/img/icons8-facebook.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/static/img/icons8-github-light.svg b/website/static/img/icons8-github-light.svg deleted file mode 100644 index 3fbd5fc2..00000000 --- a/website/static/img/icons8-github-light.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/static/img/icons8-github.svg b/website/static/img/icons8-github.svg deleted file mode 100644 index d198f327..00000000 --- a/website/static/img/icons8-github.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/static/img/icons8-telegram-light.svg b/website/static/img/icons8-telegram-light.svg deleted file mode 100644 index f063ac27..00000000 --- a/website/static/img/icons8-telegram-light.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/static/img/icons8-telegram.svg b/website/static/img/icons8-telegram.svg deleted file mode 100644 index 1c595b00..00000000 --- a/website/static/img/icons8-telegram.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/static/img/icons8-twitter-light.svg b/website/static/img/icons8-twitter-light.svg deleted file mode 100644 index 3e9c79ab..00000000 --- a/website/static/img/icons8-twitter-light.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/static/img/icons8-twitter.svg b/website/static/img/icons8-twitter.svg deleted file mode 100644 index 8698c876..00000000 --- a/website/static/img/icons8-twitter.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/static/img/instagram-light.svg b/website/static/img/instagram-light.svg deleted file mode 100644 index c4322b07..00000000 --- a/website/static/img/instagram-light.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/website/static/img/instagram.svg b/website/static/img/instagram.svg deleted file mode 100644 index ccdae2e1..00000000 --- a/website/static/img/instagram.svg +++ /dev/null @@ -1 +0,0 @@ -