fix(HTML): Ensure email icons act as links

Fix stencila/encoda#840
stencila · Feb 18, 2022 · ccbc61a · ccbc61a
1 parent 39e7f34
commit ccbc61a
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 16 deletions.
diff --git a/rust/codec-html/src/encode/works.rs b/rust/codec-html/src/encode/works.rs
@@ -225,7 +225,9 @@ fn author_person_to_html(person: &Person, orgs: Option<&Vec<&Organization>>) ->
                 &concat(emails, |email| {
                     [
                         "<a itemprop=\"email\"", &attr("href", &["mailto:", email].concat()), ">",
-                            email,
+                            "<span>",
+                                email,
+                            "</span>",
                         "</a>",
                     ].concat()
                 }),

diff --git a/themes/src/extensions/person/styles.css b/themes/src/extensions/person/styles.css
@@ -61,13 +61,15 @@
     }
 
     :--email {
-      display: none;
-    }
+      span {
+        display: none;
+      }
 
-    &::after {
-      content: '\00a0📧';
-      vertical-align: super;
-      color: var(--color-primary-100);
+      &::after {
+        content: '\00a0📧';
+        vertical-align: super;
+        color: var(--color-primary-100);
+      }
     }
   }
 

diff --git a/themes/src/themes/elife/styles.css b/themes/src/themes/elife/styles.css
@@ -89,24 +89,34 @@
 
   & :--authors {
     @extend .content-header__author_list;
+    margin-bottom: 0;
 
     :--Person {
       @extend .content-header__author_list_item;
+      display: inline;
 
-      font-size: var(--TEXT-SIZE-MEDIUM-REM);
-
-      :--familyName::after {
+      &::after {
         content: ', ';
       }
 
       &:last-child {
-        :--familyName::after {
+        &::after {
           content: '';
         }
       }
 
-      :--emails::after {
-        content: url('~/node_modules/@elifesciences/pattern-library/source/assets/img/icons/corresponding-author@1x.png');
+      :--emails {
+        padding-left: 4px;
+      }
+
+      :--email {
+        span {
+          display: none;
+        }
+
+        &::after {
+          content: url('~/node_modules/@elifesciences/pattern-library/source/assets/img/icons/corresponding-author@1x.png');
+        }
       }
     }
 
@@ -125,8 +135,14 @@
         }
       }
 
-      :--emails::after {
-        content: url('~/node_modules/@elifesciences/pattern-library/source/assets/img/icons/corresponding-author@1x.png');
+      :--email {
+        span {
+          display: none;
+        }
+
+        &::after {
+          content: url('~/node_modules/@elifesciences/pattern-library/source/assets/img/icons/corresponding-author@1x.png');
+        }
       }
     }
 
@@ -143,11 +159,12 @@
     margin-bottom: var(--BASELINE-MEASURE-REM);
 
     :--Organization {
+      @extend .content-header__institution_list_item;
       display: inline;
+      font-size: var(--TEXT-SIZE-MEDIUM-REM);
 
       :--name,
       :--address {
-        @extend .content-header__institution_list_item;
       }
 
       & :--parentOrganization::before {