/ Fixed scss links and a v-if bug

full-skies-nuxt/assets/scss/_variables.scss

@@ -20,6 +20,9 @@ $danger: $red;
 
 $primary: $space-blue-700;
 $primary-light: $space-blue-600;
+$primary-xlight: $space-blue-500;
+$primary-xxlight: $space-blue-300;
+
 
 $heading-font-family: 'Poppins', serif;
 $body-font-family: 'Open Sans', sans-serif;

full-skies-nuxt/pages/astres/_slug.vue

@@ -14,6 +14,15 @@
             <h3 class="heading-3">
               Informations
             </h3>
+            <p v-if="celestial.aroundPlanet">
+              Orbite autour de
+              <nuxt-link
+                :to="`/astres/${celestial.aroundPlanet.planet}`"
+                class="txt-capitalize"
+              >
+                {{ celestial.aroundPlanet.planet }}
+              </nuxt-link>
+            </p>
             <p v-if="celestial.discoveredBy">
               Découvert par {{ celestial.discoveredBy }} le {{ celestial.discoveryDate }}
             </p>
@@ -23,7 +32,7 @@
           </div>
           <div v-if="celestial.moons" class="celestial-moons">
             <h2 class="heading-2">
-              Lunes orbitant {{ celestial.name }}
+              Astres orbitant {{ celestial.name }}
             </h2>
             <celestials-list :celestials="celestial.moons" :has-filters="false" />
           </div>
@@ -85,8 +94,12 @@ export default {
   }
 
   .celestial-body {
-    .celestial-type {
-      text-transform: capitalize;
+    a {
+      color: $primary-xxlight;
+      text-decoration: underline;
+      &:hover {
+        color: $primary-xlight;
+      }
     }
   }
 }