From e4a2e07c8e076c3f6b75fb69b43fc3ffb0c2655e Mon Sep 17 00:00:00 2001 From: kvakazyambra Date: Thu, 31 Aug 2023 00:16:55 +0300 Subject: [PATCH] Add social icons --- public/icons/user-link-behance.svg | 6 ++ public/icons/user-link-dribbble.svg | 4 + public/icons/user-link-dzen.svg | 4 + public/icons/user-link-github.svg | 3 + public/icons/user-link-linkedin.svg | 6 ++ public/icons/user-link-medium.svg | 3 + public/icons/user-link-ok.svg | 5 ++ public/icons/user-link-pinterest.svg | 3 + public/icons/user-link-reddit.svg | 4 + public/icons/user-link-tiktok.svg | 3 + public/icons/user-link-twitter.svg | 2 +- public/icons/user-link-vk.svg | 3 + public/icons/user-link-youtube.svg | 3 + src/components/Author/AuthorCard.module.scss | 77 +++++++++++++++++++- 14 files changed, 123 insertions(+), 3 deletions(-) create mode 100644 public/icons/user-link-behance.svg create mode 100644 public/icons/user-link-dribbble.svg create mode 100644 public/icons/user-link-dzen.svg create mode 100644 public/icons/user-link-github.svg create mode 100644 public/icons/user-link-linkedin.svg create mode 100644 public/icons/user-link-medium.svg create mode 100644 public/icons/user-link-ok.svg create mode 100644 public/icons/user-link-pinterest.svg create mode 100644 public/icons/user-link-reddit.svg create mode 100644 public/icons/user-link-tiktok.svg create mode 100644 public/icons/user-link-vk.svg create mode 100644 public/icons/user-link-youtube.svg diff --git a/public/icons/user-link-behance.svg b/public/icons/user-link-behance.svg new file mode 100644 index 00000000..f9ccd2cc --- /dev/null +++ b/public/icons/user-link-behance.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/icons/user-link-dribbble.svg b/public/icons/user-link-dribbble.svg new file mode 100644 index 00000000..759ccd9d --- /dev/null +++ b/public/icons/user-link-dribbble.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/icons/user-link-dzen.svg b/public/icons/user-link-dzen.svg new file mode 100644 index 00000000..e730bde0 --- /dev/null +++ b/public/icons/user-link-dzen.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/icons/user-link-github.svg b/public/icons/user-link-github.svg new file mode 100644 index 00000000..b7c1ef2d --- /dev/null +++ b/public/icons/user-link-github.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/user-link-linkedin.svg b/public/icons/user-link-linkedin.svg new file mode 100644 index 00000000..973dadd8 --- /dev/null +++ b/public/icons/user-link-linkedin.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/icons/user-link-medium.svg b/public/icons/user-link-medium.svg new file mode 100644 index 00000000..38cc100c --- /dev/null +++ b/public/icons/user-link-medium.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/user-link-ok.svg b/public/icons/user-link-ok.svg new file mode 100644 index 00000000..99faa68b --- /dev/null +++ b/public/icons/user-link-ok.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/public/icons/user-link-pinterest.svg b/public/icons/user-link-pinterest.svg new file mode 100644 index 00000000..f9602b73 --- /dev/null +++ b/public/icons/user-link-pinterest.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/user-link-reddit.svg b/public/icons/user-link-reddit.svg new file mode 100644 index 00000000..ddfce137 --- /dev/null +++ b/public/icons/user-link-reddit.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/icons/user-link-tiktok.svg b/public/icons/user-link-tiktok.svg new file mode 100644 index 00000000..8741f6c9 --- /dev/null +++ b/public/icons/user-link-tiktok.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/user-link-twitter.svg b/public/icons/user-link-twitter.svg index cb8cb03e..8cdfcc67 100644 --- a/public/icons/user-link-twitter.svg +++ b/public/icons/user-link-twitter.svg @@ -1,3 +1,3 @@ - + diff --git a/public/icons/user-link-vk.svg b/public/icons/user-link-vk.svg new file mode 100644 index 00000000..d2a49375 --- /dev/null +++ b/public/icons/user-link-vk.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/icons/user-link-youtube.svg b/public/icons/user-link-youtube.svg new file mode 100644 index 00000000..25a90f08 --- /dev/null +++ b/public/icons/user-link-youtube.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/Author/AuthorCard.module.scss b/src/components/Author/AuthorCard.module.scss index 9ae93a71..69e39749 100644 --- a/src/components/Author/AuthorCard.module.scss +++ b/src/components/Author/AuthorCard.module.scss @@ -130,13 +130,13 @@ a[href*='vk.cc/'], a[href*='vk.com/'] { &::before { - background-image: url(/icons/vk-white.svg); + background-image: url(/icons/user-link-vk.svg); } } a[href*='tumblr.com/'] { &::before { - background-image: url(/icons/tumblr-white.svg); + background-image: url(/icons/user-link-tumblr.svg); } } @@ -146,6 +146,79 @@ } } + a[href*='behance.net/'] { + &::before { + background-image: url(/icons/user-link-behance.svg); + } + } + + a[href*='dribbble.com/'] { + &::before { + background-image: url(/icons/user-link-dribbble.svg); + } + } + + a[href*='github.com/'] { + &::before { + background-image: url(/icons/user-link-github.svg); + } + } + + a[href*='linkedin.com/'] { + &::before { + background-image: url(/icons/user-link-linkedin.svg); + } + } + + a[href*='medium.com/'] { + &::before { + background-image: url(/icons/user-link-medium.svg); + } + } + + a[href*='ok.ru/'] { + &::before { + background-image: url(/icons/user-link-ok.svg); + } + } + + a[href*='pinterest.com/'] { + &::before { + background-image: url(/icons/user-link-pinterest.svg); + } + } + + a[href*='reddit.com/'] { + &::before { + background-image: url(/icons/user-link-reddit.svg); + } + } + + a[href*='tiktok.com/'] { + &::before { + background-image: url(/icons/user-link-tiktok.svg); + } + } + + a[href*='vk.com/'] { + &::before { + background-image: url(/icons/user-link-vk.svg); + } + } + + a[href*='youtube.com/'], + a[href*='youtu.be/'] { + &::before { + background-image: url(/icons/user-link-youtube.svg); + } + } + + a[href*='dzen.ru/'] { + &::before { + background-image: url(/icons/user-link-dzen.svg); + } + } + .button { margin-right: 0.5em; width: 9em;