frontend: Visual improvements
This commit is contained in:
parent
6e5fd70156
commit
c082ee43d0
@ -20,6 +20,10 @@ $enable-print-styles: false;
|
||||
@import "bootstrap/scss/bootstrap";
|
||||
@import "bootswatch/dist/slate/_bootswatch";
|
||||
|
||||
.text-indent p {
|
||||
text-indent: 1em;
|
||||
}
|
||||
|
||||
p img {
|
||||
margin: auto;
|
||||
max-width: 100%;
|
||||
|
@ -64,13 +64,13 @@
|
||||
<Nav navbar>
|
||||
<NavItem>
|
||||
<NavLink href=".">
|
||||
<Icon name="box-seam" />
|
||||
<Icon name="house" />
|
||||
Accueil
|
||||
</NavLink>
|
||||
</NavItem>
|
||||
<NavThemes />
|
||||
<NavTags />
|
||||
{#if $settings && $settings.start >= $settings.recvTime && $teams && Object.keys($teams).length}
|
||||
{#if $settings && $settings.end - $settings.start > 0 && $teams && Object.keys($teams).length}
|
||||
<NavItem>
|
||||
<NavLink href="rank">
|
||||
<Icon name="sort-down" />
|
||||
|
@ -25,18 +25,23 @@
|
||||
{#if th.id != 0}
|
||||
<DropdownItem href="{th.urlid}" active={$current_theme && $current_theme.id == th.id}>
|
||||
{th.name}
|
||||
{#if $my && $my.team_id && th.exercice_count && $myThemes[th.id].exercice_solved >= th.exercice_count}
|
||||
<Badge color="success" pill>
|
||||
<Icon name="check" />
|
||||
</Badge>
|
||||
{/if}
|
||||
{#if $max_solved > 1 && th.solved == $max_solved}
|
||||
<Badge color="danger">
|
||||
<Badge color="danger" pill>
|
||||
<Icon name="heart-fill" />
|
||||
</Badge>
|
||||
{/if}
|
||||
{#if th.exercice_coeff_max > 1}
|
||||
<Badge color="success">
|
||||
<Badge color="warning" pill>
|
||||
<Icon name="gift-fill" />
|
||||
</Badge>
|
||||
{/if}
|
||||
{#if th.locked}
|
||||
<Badge color="light">
|
||||
<Badge color="secondary" pill>
|
||||
<Icon name="lock-fill" />
|
||||
</Badge>
|
||||
{/if}
|
||||
@ -52,7 +57,7 @@
|
||||
{#if $themesStore && $themesStore["0"] && $themesStore["0"].exercices}
|
||||
<Dropdown nav inNavbar active={$current_theme && $current_theme && $current_theme.id == 0}>
|
||||
<DropdownToggle nav caret>
|
||||
<Icon name="pencil" />
|
||||
<Icon name="box-seam" />
|
||||
Défis
|
||||
</DropdownToggle>
|
||||
<DropdownMenu class="niceborder">
|
||||
@ -61,17 +66,17 @@
|
||||
<DropdownItem href="{$themesStore["0"].urlid}/{exercice.urlid}" active={$current_theme && $current_theme.id == 0 && $current_exercice && $current_exercice.id == exercice.id}>
|
||||
{exercice.title}
|
||||
{#if exercice.solved}
|
||||
<Badge color="secondary">
|
||||
<Badge color="success" pill>
|
||||
<Icon name="check" />
|
||||
</Badge>
|
||||
{/if}
|
||||
{#if exercice.curcoeff > 1}
|
||||
<Badge color="success">
|
||||
<Badge color="warning" pill>
|
||||
<Icon name="gift-fill" />
|
||||
</Badge>
|
||||
{/if}
|
||||
{#if $themesStore["0"].locked || exercice.disabled}
|
||||
<Badge color="light">
|
||||
{#if $themesStore["0"].locked || exercice.disabled || ($my && !$my.exercices[exercice.id])}
|
||||
<Badge color="secondary" pill>
|
||||
<Icon name="lock-fill" />
|
||||
</Badge>
|
||||
{/if}
|
||||
|
@ -98,7 +98,7 @@
|
||||
{@const exercice = item.exercice}
|
||||
<CardTheme
|
||||
style="opacity: {$my && !$my.exercices[exercice.id] ? 0.6 : 1}"
|
||||
class="{$my && $my.team_id && exercice.solved?'border-light ':''}{exercice.curcoeff > 1?'border-success ':''}{theme.locked || exercice.disabled || ($my && !$my.exercices[exercice.id])?' border-secondary ':''}"
|
||||
class="{$my && $my.team_id && exercice.solved?'border-success ':''}{exercice.curcoeff > 1?'border-warning ':''}{theme.locked || exercice.disabled || ($my && !$my.exercices[exercice.id])?' border-secondary ':''}"
|
||||
{theme}
|
||||
{exercice}
|
||||
on:click={goto(`${theme.urlid}/${exercice.urlid}`)}
|
||||
@ -106,7 +106,7 @@
|
||||
{:else}
|
||||
{@const th = item.theme}
|
||||
<CardTheme
|
||||
class="{$my && $my.team_id && $myThemes[th.id].exercice_solved > 0?'border-light ':''}{th.exercice_coeff_max > 1?'border-success ':''}{th.locked?' border-secondary ':''}"
|
||||
class="{$my && $my.team_id && $myThemes[th.id].exercice_solved > 0?'border-light ':''}{th.exercice_coeff_max > 1?'border-warning ':''}{th.locked?' border-secondary ':''}"
|
||||
theme={th}
|
||||
color={item.color ? item.color : "dark"}
|
||||
on:click={goto(`${th.urlid}`)}
|
||||
|
@ -30,7 +30,7 @@
|
||||
>
|
||||
<CardTheme
|
||||
style="opacity: {$my && !$my.exercices[exercice.id] ? 0.6 : 1}"
|
||||
class="{$my && $my.team_id && exercice.solved?'border-light ':''}{exercice.curcoeff > 1?'border-success ':''}{$current_theme.locked || exercice.disabled || ($my && !$my.exercices[exercice.id])?' border-secondary ':''}"
|
||||
class="{$my && $my.team_id && exercice.solved?'border-success ':''}{exercice.curcoeff > 1?'border-warning ':''}{$current_theme.locked || exercice.disabled || ($my && !$my.exercices[exercice.id])?' border-secondary ':''}"
|
||||
theme={$current_theme}
|
||||
{exercice}
|
||||
on:click={goto(`${$current_theme.urlid}/${exercice.urlid}`)}
|
||||
|
@ -51,7 +51,8 @@
|
||||
</script>
|
||||
|
||||
{#if $current_exercice}
|
||||
<Card body class="niceborder text-indent my-3">
|
||||
<Card class="niceborder text-indent my-3">
|
||||
<CardBody class="bg-dark">
|
||||
{#if $current_theme.locked}
|
||||
<div style="position: absolute; z-index: 0; top: 0; bottom: 0; left: 0; right: 0;" class="d-flex justify-content-center align-items-center">
|
||||
<div style="transform: rotate(-25deg)">
|
||||
@ -86,7 +87,8 @@
|
||||
</Alert>
|
||||
{/if}
|
||||
{/if}
|
||||
<hr class="mt-0 mb-4">
|
||||
</CardBody>
|
||||
<CardBody>
|
||||
<Row>
|
||||
<Col>
|
||||
<Row class="level" cols={{xs:2, md:3, xl:4}}>
|
||||
@ -210,6 +212,7 @@
|
||||
</Col>
|
||||
{/if}
|
||||
</Row>
|
||||
</CardBody>
|
||||
</Card>
|
||||
|
||||
{#if $my && $my.exercices[$current_exercice.id]}
|
||||
|
Loading…
Reference in New Issue
Block a user