From efd4be09800c42691b708c0db2f4953c5f2ac9e1 Mon Sep 17 00:00:00 2001 From: David Morrow Date: Wed, 11 Dec 2024 09:41:11 -0800 Subject: [PATCH] Adding social icons to footer of developer site (#728) * adding social icons also fixing the header responsive layout on mobile * fixes mastodon URL * changing the id of social icons to prevent ad blocking --------- Co-authored-by: Sebastian Hermida --- content/assets/css/_colorscheme.scss | 6 +++ content/assets/css/_dual_cta.scss | 1 - layouts/footer.html | 3 ++ layouts/header.html | 10 ++-- layouts/social_icons.html | 73 ++++++++++++++++++++++++++++ 5 files changed, 87 insertions(+), 6 deletions(-) create mode 100644 layouts/social_icons.html diff --git a/content/assets/css/_colorscheme.scss b/content/assets/css/_colorscheme.scss index 1177dc21..9c435346 100644 --- a/content/assets/css/_colorscheme.scss +++ b/content/assets/css/_colorscheme.scss @@ -26,6 +26,7 @@ --green: hsl(100, 100%, 30%);; --gray: hsl(50, 0%, 50%);; --orange: hsl(30, 100%, 50%);; + --icon-color: hsl(0deg 0% 70%); } /* Dark Mode */ @@ -46,6 +47,7 @@ --green: hsl(100, 100%, 40%);; --gray: hsl(50, 0%, 70%);; --orange: hsl(30, 100%, 60%);; + --icon-color: hsl(248deg 31% 40%); } body { @@ -187,3 +189,7 @@ input { content: url("/assets/images/vendors/linux-foundation-color.png"); } } + +footer .social-media path { + fill: var(--icon-color); +} \ No newline at end of file diff --git a/content/assets/css/_dual_cta.scss b/content/assets/css/_dual_cta.scss index f0412649..8f22ed3d 100644 --- a/content/assets/css/_dual_cta.scss +++ b/content/assets/css/_dual_cta.scss @@ -1,6 +1,5 @@ .dual-cta-container { --border-radius: 1.2em; - margin-left: 0.5em; display: inline-flex; a { diff --git a/layouts/footer.html b/layouts/footer.html index 45f6dcd4..74e30300 100644 --- a/layouts/footer.html +++ b/layouts/footer.html @@ -6,6 +6,9 @@

Get Help From Developers

Everyone at DNSimple enjoys writing developer docs.
We love answering your emails, too.

Try us free for 30 days + + <%= render "social_icons" %> +