Add twitter sharing link to stripes pages

cemac · Aug 9, 2024 · b743450 · b743450
1 parent 6021e6e
commit b743450
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 0 deletions.
diff --git a/css/site.css b/css/site.css
@@ -261,6 +261,21 @@ body {
   }
 }
 
+/** sharing links: **/
+
+.content_plot_share {
+  margin-left: 1em;
+}
+
+.content_plot_share_links {
+  margin-left: 5em;
+  margin-bottom: 1em;
+}
+
+.share_logo {
+  width: 2em;
+}
+
 /** text: **/
 
 .content_text_container {

diff --git a/img/stripes/x_logo.png b/img/stripes/x_logo.png
diff --git a/js/stripes.js b/js/stripes.js
@@ -372,6 +372,11 @@ function update_location() {
   og_url.name = 'og:url';
   og_url.content = meta_url_val;
   page_head.appendChild(og_url);
+  /* update sharing links: */
+  var twit_share = document.getElementById('twit_share');
+  twit_share.href = 'https://twitter.com/intent/tweet?text=' +
+                    meta_desc_val +
+                    '&url=' + encodeURIComponent(meta_url_val);
 };
 
 /* function to load site data: */

diff --git a/stripes/index.html b/stripes/index.html
@@ -155,6 +155,17 @@
                  class="content_plot_img flex_no_grow"
                  src="">
           </div>
+          <!-- sharing links: _____________________________________________ -->
+          <div id="content_plot_share"
+               class="content_plot_share column flex_start">
+            <h3>Share</h3>
+            <div id="content_plot_share_links"
+                 class="content_plot_share_links row_wrap flex_start">
+              <a id="twit_share"
+                 href="https://twitter.com/intent/tweet?text=Air Quality Stripes&url=https%3A%2F%2Fairqualitystripes.info%2Fstripes%2F"
+                 target="_new"><img class="share_logo" src="../img/stripes/x_logo.png"></a>
+            </div>
+          </div>
         </div>
       </div>
       <!-- footer: ________________________________________________________ -->