From 2b649f8aee35b85941cf9b24ad7e9ad4329f69d9 Mon Sep 17 00:00:00 2001
From: Karina <93212792+karr9@users.noreply.github.com>
Date: Tue, 21 May 2024 12:41:18 -0600
Subject: [PATCH] New linkedin button (#1778)

* Add new floating linkedin button on site
* Add script for linkedin button function
* Add new floating linkedin button on site
* Add a new floating LinkedIn button on the site and the script that hides it when the follow has been made
* Commented out console.log message

---------

Signed-off-by: Karina Rodriguez <karina.rodriguez11@gmail.com>
Co-authored-by: Travis Beckham <travis@buoyant.io>
---
 linkerd.io/assets/js/follow-linkedin.js     | 9 +++++++++
 linkerd.io/assets/scss/styles.scss          | 4 ++++
 linkerd.io/layouts/partials/header.html     | 5 +++++
 linkerd.io/layouts/partials/javascript.html | 3 +++
 4 files changed, 21 insertions(+)
 create mode 100644 linkerd.io/assets/js/follow-linkedin.js

diff --git a/linkerd.io/assets/js/follow-linkedin.js b/linkerd.io/assets/js/follow-linkedin.js
new file mode 100644
index 0000000000..b1f0280061
--- /dev/null
+++ b/linkerd.io/assets/js/follow-linkedin.js
@@ -0,0 +1,9 @@
+setTimeout(function(){    
+    var buttonWrapper = document.querySelector('.linkedin__btn');
+    widthOriginal = buttonWrapper.getBoundingClientRect().width;
+    //console.log("-"+widthOriginal);
+
+    if(widthOriginal>99){
+        buttonWrapper.style.display = 'none'; 
+    }
+}, 2300);
diff --git a/linkerd.io/assets/scss/styles.scss b/linkerd.io/assets/scss/styles.scss
index 707453135b..ed407fdb0a 100644
--- a/linkerd.io/assets/scss/styles.scss
+++ b/linkerd.io/assets/scss/styles.scss
@@ -925,3 +925,7 @@ blockquote {
 .modal-content {
   width: 95%;
 }
+
+.linkedin__btn{
+    z-index: 999; display: block; top: 100px; right: -5px; position: fixed;
+}
\ No newline at end of file
diff --git a/linkerd.io/layouts/partials/header.html b/linkerd.io/layouts/partials/header.html
index f1a91dc849..b7c644a516 100644
--- a/linkerd.io/layouts/partials/header.html
+++ b/linkerd.io/layouts/partials/header.html
@@ -14,3 +14,8 @@
 
 {{ $js := resources.Get "js/navbar.js" | resources.Minify | resources.Fingerprint }}
 <script src="{{ $js.Permalink }}"></script>
+
+<div class="linkedin__btn">
+    <script src="https://platform.linkedin.com/in.js" type="text/javascript"> lang: en_US</script>
+    <script data-proofer-ignore type="IN/FollowCompany" data-id="99659303"></script>
+</div>
diff --git a/linkerd.io/layouts/partials/javascript.html b/linkerd.io/layouts/partials/javascript.html
index 73b4c75a37..7778aed7da 100644
--- a/linkerd.io/layouts/partials/javascript.html
+++ b/linkerd.io/layouts/partials/javascript.html
@@ -35,4 +35,7 @@
 {{ $headingsLinkJs := resources.Get "js/docs-heading-link.js"}}
 <script defer src="{{ $headingsLinkJs.Permalink }}"></script>
 
+{{ $linkedinJs := resources.Get "js/follow-linkedin.js" }}
+<script src="{{ $linkedinJs.Permalink }}"></script>
+
 <script async defer src="https://buttons.github.io/buttons.js"></script>
\ No newline at end of file