Merge pull request #1154 from monarch-initiative/header-update

Minor header updates to mi.org header

Author: varun-divya

frontend/src/components/TheHeroTools.vue

@@ -1,7 +1,6 @@
 <template>
   <hr />
   <div class="hero-tool-links">
-    <p class="hero-tools-label">Knowledge Graph Tools:</p>
     <AppLink to="/search-phenotypes">Phenotype Similarity Tools</AppLink>
     <span>|</span>
     <AppLink to="/text-annotator">Text Annotator</AppLink>
@@ -48,13 +47,7 @@ $wrap: 1350px;
     }
   }
 }
-.hero-tools-label {
-  font-weight: 500;
-  text-align: center;
-  @media (max-width: $wrap) {
-    color: $white;
-  }
-}
+
 @media (max-width: 1350) {
   hr {
     height: 1px;

frontend/src/components/TheSearchSuggestions.vue

@@ -19,6 +19,7 @@
           />
           <AppNodeText :text="search.source.name" />
         </span>
+        <span class="separator">-</span>
         <span class="node">
           <AppIcon
             class="icon"
@@ -191,7 +192,7 @@ span {
   display: flex;
   align-items: center;
   padding: 0.5rem 1rem;
-  gap: 0.6rem;
+  gap: 0.3rem;
   border-radius: 0.5rem;
   background: #f3f3f3;
   white-space: nowrap;
@@ -252,4 +253,7 @@ span {
   margin-right: 0.4em;
   vertical-align: middle;
 }
+.separator {
+  user-select: none;
+}
 </style>