refactor: changed position of generaTOR link; added missing tooltips

src/components/SceneryView/SceneryInfo.vue

@@ -6,18 +6,6 @@
       <SceneryInfoRoutes v-if="station" :station="station" />
       <SceneryInfoAuthors :station="station" />
 
-      <!-- Link to GeneraTOR app -->
-      <section class="generator-app" v-if="onlineScenery">
-        <a
-          class="a-button btn--action btn--image"
-          :href="`https://generator-td2.web.app/?sceneryId=${onlineScenery.name}|${onlineScenery.region}`"
-          target="_blank"
-        >
-          <img src="/public/images/icon-gnr.svg" alt="GeneraTOR app icon" />
-          {{ $t('scenery.gnr-link-content') }}
-        </a>
-      </section>
-
       <div style="margin: 1em 0; height: 2px; background-color: white"></div>
 
       <!-- info dispatcher -->
@@ -95,8 +83,4 @@ h3.section-header {
 .scenery-topic a {
   font-weight: bold;
 }
-
-.generator-app {
-  margin-top: 2em;
-}
 </style>

src/components/SceneryView/SceneryInfo/SceneryInfoRoutes.vue

@@ -118,7 +118,8 @@ export default defineComponent({
 
 <style lang="scss" scoped>
 .info-routes {
-  display: flex;
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
   justify-content: center;
   flex-direction: column;
 

src/components/SceneryView/SceneryTimetable.vue

@@ -13,12 +13,31 @@
           </span>
         </span>
 
-        <span class="header_links" v-if="station">
-          <a :href="pragotronHref" target="_blank" :title="$t('scenery.pragotron-link')">
+        <span class="header_links" v-if="station && onlineScenery">
+          <a
+            :href="generatorHref"
+            target="_blank"
+            data-tooltip-type="HtmlTooltip"
+            :data-tooltip-content="`<b>${$t('scenery.gnr-link')}</b>`"
+          >
+            <img src="/images/icon-gnr.svg" alt="GeneraTOR app icon" />
+          </a>
+
+          <a
+            :href="pragotronHref"
+            target="_blank"
+            data-tooltip-type="HtmlTooltip"
+            :data-tooltip-content="`<b>${$t('scenery.pragotron-link')}</b>`"
+          >
             <img src="/images/icon-pragotron.svg" alt="icon-pragotron" />
           </a>
 
-          <a :href="tabliceZbiorczeHref" target="_blank" :title="$t('scenery.tablice-link')">
+          <a
+            :href="tabliceZbiorczeHref"
+            target="_blank"
+            data-tooltip-type="HtmlTooltip"
+            :data-tooltip-content="`<b>${$t('scenery.tablice-link')}</b>`"
+          >
             <img src="/images/icon-tablice.ico" alt="icon-tablice" />
           </a>
         </span>
@@ -256,6 +275,10 @@ export default defineComponent({
       return url;
     },
 
+    generatorHref() {
+      return `https://generator-td2.web.app/?sceneryId=${this.onlineScenery!.name}|${this.onlineScenery!.region}`;
+    },
+
     sceneryTimetables(): SceneryTimetableRow[] {
       if (!this.onlineScenery) return [];
 
@@ -363,7 +386,7 @@ export default defineComponent({
 
 .header_links {
   display: flex;
-  gap: 0.5em;
+  gap: 0.25em;
   margin-left: 0.5em;
 }