qa: Improve design
This commit is contained in:
parent
13588fc634
commit
0e19b59452
19 changed files with 487 additions and 241 deletions
|
|
@ -1,4 +1,6 @@
|
|||
<script>
|
||||
import '../app.css';
|
||||
|
||||
import {
|
||||
Container,
|
||||
Styles,
|
||||
|
|
@ -6,9 +8,13 @@
|
|||
|
||||
import Header from '$lib/components/Header.svelte';
|
||||
import { version } from '$lib/stores/auth';
|
||||
import { view } from '$lib/stores/todo';
|
||||
|
||||
version.refresh();
|
||||
setInterval(version.refresh, 30000);
|
||||
|
||||
view.refresh();
|
||||
setInterval(view.refresh, 60000);
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<script>
|
||||
import {
|
||||
Alert,
|
||||
Col,
|
||||
Container,
|
||||
Row,
|
||||
} from 'sveltestrap';
|
||||
|
|
@ -32,7 +33,11 @@
|
|||
</p>
|
||||
</Alert>
|
||||
<Row>
|
||||
<MyTodo class="col-6" />
|
||||
<MyExercices class="col-6" />
|
||||
<Col>
|
||||
<MyTodo />
|
||||
</Col>
|
||||
<Col>
|
||||
<MyExercices />
|
||||
</Col>
|
||||
</Row>
|
||||
</Container>
|
||||
|
|
|
|||
|
|
@ -47,6 +47,9 @@
|
|||
{#each fieldsExercices as field}
|
||||
<td>
|
||||
{@html exercice[field]}
|
||||
{#if field == "title" && exercice.wip}
|
||||
<Icon name="cone-striped" />
|
||||
{/if}
|
||||
</td>
|
||||
{/each}
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -15,19 +15,12 @@
|
|||
let exerciceP = getExercice($page.params.eid);
|
||||
</script>
|
||||
|
||||
<Container class="mt-2 mb-5">
|
||||
{#await exerciceP}
|
||||
{#await exerciceP}
|
||||
<Container class="mt-2 mb-5">
|
||||
<div class="d-flex justify-content-center">
|
||||
<Spinner size="lg" />
|
||||
</div>
|
||||
{:then exercice}
|
||||
<Button
|
||||
class="float-start"
|
||||
color="link"
|
||||
on:click={() => goto('exercices')}
|
||||
>
|
||||
<Icon name="chevron-left" />
|
||||
</Button>
|
||||
<ExerciceQA {exercice} />
|
||||
{/await}
|
||||
</Container>
|
||||
</Container>
|
||||
{:then exercice}
|
||||
<ExerciceQA {exercice} />
|
||||
{/await}
|
||||
|
|
|
|||
|
|
@ -41,9 +41,9 @@
|
|||
{#if theme.name.indexOf(query) >= 0 || theme.authors.indexOf(query) >= 0 || theme.intro.indexOf(query) >= 0}
|
||||
<tr on:click={() => show(theme.id)}>
|
||||
{#each fields as field}
|
||||
<td>
|
||||
<td class:text-end={field == "image"}>
|
||||
{#if field == "image"}
|
||||
<img src={"../files" + theme[field]} alt="Image du scénario">
|
||||
<img src={"../files" + theme[field]} alt="Image du scénario" height="120">
|
||||
{:else}
|
||||
{@html theme[field]}
|
||||
{/if}
|
||||
|
|
|
|||
|
|
@ -40,13 +40,13 @@
|
|||
<small class="m-2 mb-3 text-muted text-truncate">{@html theme.authors}</small>
|
||||
</div>
|
||||
|
||||
<Container class="text-muted">
|
||||
<Container class="text-muted" style="overflow-y: auto; max-height: 34vh">
|
||||
{@html theme.intro}
|
||||
</Container>
|
||||
|
||||
{#await getThemedExercices($page.params.tid)}
|
||||
{:then exercices}
|
||||
<h3>
|
||||
<h3 class="mt-2">
|
||||
Défis ({exercices.length})
|
||||
</h3>
|
||||
|
||||
|
|
@ -70,6 +70,9 @@
|
|||
{#each fieldsExercices as field}
|
||||
<td>
|
||||
{@html exercice[field]}
|
||||
{#if field == "title" && exercice.wip}
|
||||
<Icon name="cone-striped" />
|
||||
{/if}
|
||||
</td>
|
||||
{/each}
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -15,19 +15,12 @@
|
|||
let exerciceP = getThemedExercice($page.params.tid, $page.params.eid);
|
||||
</script>
|
||||
|
||||
<Container class="mt-2 mb-5">
|
||||
{#await exerciceP}
|
||||
{#await exerciceP}
|
||||
<Container class="mt-2 mb-5">
|
||||
<div class="d-flex justify-content-center">
|
||||
<Spinner size="lg" />
|
||||
</div>
|
||||
{:then exercice}
|
||||
<Button
|
||||
class="float-start"
|
||||
color="link"
|
||||
on:click={() => goto('themes/' + $page.params.tid)}
|
||||
>
|
||||
<Icon name="chevron-left" />
|
||||
</Button>
|
||||
<ExerciceQA {exercice} />
|
||||
{/await}
|
||||
</Container>
|
||||
</Container>
|
||||
{:then exercice}
|
||||
<ExerciceQA theme_id={$page.params.tid} {exercice} />
|
||||
{/await}
|
||||
|
|
|
|||
Reference in a new issue