From 38e626aa2226923991613d42ac9defc2384e7b62 Mon Sep 17 00:00:00 2001
From: Alexis <35.alexis.pele@gmail.com>
Date: Sun, 28 Mar 2021 19:01:45 +0200
Subject: [PATCH] / Fixed scss links and a v-if bug

---
 full-skies-nuxt/assets/scss/_variables.scss |  3 +++
 full-skies-nuxt/pages/astres/_slug.vue      | 19 ++++++++++++++++---
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/full-skies-nuxt/assets/scss/_variables.scss b/full-skies-nuxt/assets/scss/_variables.scss
index bec6060..3a46133 100644
--- a/full-skies-nuxt/assets/scss/_variables.scss
+++ b/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;
diff --git a/full-skies-nuxt/pages/astres/_slug.vue b/full-skies-nuxt/pages/astres/_slug.vue
index e9d4854..3488df9 100644
--- a/full-skies-nuxt/pages/astres/_slug.vue
+++ b/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;
+      }
     }
   }
 }