Joururi/sample-full-skies
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

/ Fixed the scope of the nest-loader component

Browse Source
This commit is contained in:
Alexis
2021-03-29 09:33:08 +02:00
parent 6402011ee0
commit 9fca291603
3 changed files with 60 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
full-skies-nuxt/pages/astres/_slug.vue
View File

@@ -1,46 +1,41 @@
<template>
<section class="celestial bg-image">
<div v-if="celestialLoaded">
<header>
<h1 class="heading-1">
<span>{{ celestial.name }}</span>
<span v-if="celestial.name != celestial.englishName">/ {{ celestial.englishName }}</span>
<span class="txt-capitalize">- {{ celestial.type }}</span>
</h1>
</header>
<div class="section-content">
<main class="celestial-body">
<div>
<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>
<p>Facteur Gravité : {{ celestial.gravity }}</p>
<p>Facteur Densité : {{ celestial.density }}</p>
<p>Inclinaison : {{ celestial.inclination }}</p>
</div>
<div v-if="celestial.moons" class="celestial-moons">
<h2 class="heading-2">
Astres orbitant {{ celestial.name }}
</h2>
<celestials-list :celestials="celestial.moons" :has-filters="false" />
</div>
</main>
</div>
</div>
<div v-else>
<nest-loader />
<header>
<h1 class="heading-1">
<span>{{ celestial.name }}</span>
<span v-if="celestial.name != celestial.englishName">/ {{ celestial.englishName }}</span>
<span class="txt-capitalize">- {{ celestial.type }}</span>
</h1>
</header>
<div class="section-content">
<main class="celestial-body">
<div>
<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>
<p>Facteur Gravité : {{ celestial.gravity }}</p>
<p>Facteur Densité : {{ celestial.density }}</p>
<p>Inclinaison : {{ celestial.inclination }}</p>
</div>
<div v-if="celestial.moons" class="celestial-moons">
<h2 class="heading-2">
Astres orbitant {{ celestial.name }}
</h2>
<celestials-list :celestials="celestial.moons" :has-filters="false" />
</div>
</main>
</div>
</section>
</template>
@@ -51,20 +46,14 @@ import { fetchCelestial } from '@/api/le-systeme-solaire'
// import { fetchWikipediaExcerpt } from "@/api/wikipedia";
// Global methods
import NestLoader from '@/components/NestLoader.vue'
export default {
name: 'Celestial',
components: {
NestLoader
},
data () {
return {
celestial: {},
celestialLoaded: false,
excerpt: '',
error: ''
celestialLoaded: false
}
},

18
full-skies-nuxt/pages/astres/index.vue
View File

@@ -6,15 +6,7 @@
</h1>
</header>
<div class="section-content">
<div v-if="error">
Une erreur est survenue : {{ error }}
</div>
<div v-if="celestials.length > 1">
<celestials-list :celestials="celestials" />
</div>
<div v-else>
<nest-loader />
</div>
<celestials-list :celestials="celestials" />
</div>
</section>
</template>
@@ -24,20 +16,16 @@
import { fetchCelestials } from '@/api/le-systeme-solaire'
// Global methods
import CelestialsList from '@/components/celestials/CelestialsList.vue'
import NestLoader from '@/components/NestLoader.vue'
export default {
name: 'Celestials',
components: {
CelestialsList,
NestLoader
CelestialsList
},
data () {
return {
celestials: [],
error: ''
celestials: []
}
},