From 463e3904e3afb810869a0e3339ba2549f033e02f Mon Sep 17 00:00:00 2001
From: Fraser <tomatoesneverlie@gmail.com>
Date: Sat, 12 Aug 2023 17:45:48 -0400
Subject: [PATCH] swap order of elements for more consistent layout

---
 web/src/glossary.tsx       | 2 +-
 web/src/styles/globals.css | 5 +++--
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/web/src/glossary.tsx b/web/src/glossary.tsx
index 1e43326..8269719 100644
--- a/web/src/glossary.tsx
+++ b/web/src/glossary.tsx
@@ -42,12 +42,12 @@ export const GlossarySpan: React.FC<{content: string}> = ({content}) => {
         const pageid = item.pageid;
 
         return `
+            <div class="glossary-hover" nowrap>${hover_content}</div>
             <a href="https://aisafety.info/?state=${pageid}"
                target="_blank"
                class="glossary-link">
                  ${match}
             </a>
-            <div class="glossary-hover">${hover_content}</div>
         `;
 
     })}} />;
diff --git a/web/src/styles/globals.css b/web/src/styles/globals.css
index 0d117aa..ceef29c 100644
--- a/web/src/styles/globals.css
+++ b/web/src/styles/globals.css
@@ -43,11 +43,12 @@ ol {
   position: absolute;
   display: none;
   width: 300px;
-  transform: translate(-50%, 1.7rem);
+  transform: translateY(1.7rem);
   @apply bg-white hover:bg-gray-300 h-fit px-3;
   @apply border border-gray-300;
 }
 
-.glossary-link:hover + .glossary-hover {
+/* .glossary-link:hover + .glossary-hover { */
+.glossary-hover:has(+ .glossary-link:hover) {
   display: initial;
 }