make email field clickable

Author: lucaslyl

Diff for: packages/experiments-realm/email.gts

@@ -69,6 +69,11 @@ export class EmailField extends StringField {
     <template>
       {{#if @model}}
         <EntityDisplayWithIcon @title={{@model}} @underline={{false}}>
+          <:title>
+            <a href='mailto:{{@model}}' rel='noopener noreferrer'>
+              {{@model}}
+            </a>
+          </:title>
           <:icon>
             <MailIcon class='icon' />
           </:icon>
@@ -78,6 +83,10 @@ export class EmailField extends StringField {
         .icon {
           color: var(--boxel-400);
         }
+        a:hover {
+          text-decoration: underline;
+          color: inherit;
+        }
       </style>
     </template>
   };

Diff for: packages/experiments-realm/website.gts

@@ -20,6 +20,8 @@ export class WebsiteField extends UrlField {
     <template>
       <EntityDisplayWithIcon>
         <:title>
+          {{! Display only domain and path, unlike URLField's full URL representation }}
+          {{! Custom atom implementation for handling URL interactions }}
           {{#if @model}}
             {{#if (isValidUrl @model)}}
               <a href={{@model}} target='_blank' rel='noopener noreferrer'>