Merge branch 'add-illustrations' into 'master'

Add illustrations

See merge request framasoft/mobilizon!623
This commit is contained in:
Thomas Citharel 2020-10-20 13:54:53 +02:00
commit 447b73493e
16 changed files with 31 additions and 20 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 725 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 133 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 379 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 359 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 376 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 358 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 518 KiB

View file

@ -1,7 +1,6 @@
<template> <template>
<footer class="footer" ref="footer"> <footer class="footer" ref="footer">
<mobilizon-logo :invert="true" class="logo" /> <img :src="`/img/pics/footer_${random}.jpg`" alt="" />
<!-- <img src="../assets/footer.png" :alt="$t('World map')" /> -->
<ul> <ul>
<li> <li>
<router-link :to="{ name: RouteName.ABOUT }">{{ $t("About") }}</router-link> <router-link :to="{ name: RouteName.ABOUT }">{{ $t("About") }}</router-link>
@ -32,41 +31,50 @@
<script lang="ts"> <script lang="ts">
import { Component, Vue } from "vue-property-decorator"; import { Component, Vue } from "vue-property-decorator";
import RouteName from "../router/name"; import RouteName from "../router/name";
import Logo from "./Logo.vue";
@Component({ @Component
components: {
"mobilizon-logo": Logo,
},
})
export default class Footer extends Vue { export default class Footer extends Vue {
RouteName = RouteName; RouteName = RouteName;
// eslint-disable-next-line class-methods-use-this
get random(): number {
return Math.floor(Math.random() * 4) + 1;
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "~bulma/sass/utilities/mixins.sass";
footer.footer { footer.footer {
color: $secondary; color: $secondary;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
font-size: 14px; font-size: 14px;
padding: 1rem 1.5rem;
.logo { img {
fill: $secondary;
flex: 1; flex: 1;
max-width: 300px; max-width: 40rem;
margin-bottom: 2rem; @include mobile {
max-width: 400px;
}
} }
div.content { div.content {
flex: 1; flex: 1;
} }
ul li { ul {
display: inline-flex; display: inline-flex;
margin: auto 5px; flex-wrap: wrap;
a { justify-content: space-around;
font-size: 1.1rem;
li {
display: inline-flex;
margin: auto 5px;
a {
font-size: 1.1rem;
}
} }
} }

View file

@ -1,4 +1,6 @@
@import "~bulma/sass/utilities/_all"; @import "~bulma/sass/utilities/functions.sass";
@import "~bulma/sass/utilities/initial-variables.sass";
@import "~bulma/sass/utilities/derived-variables.scss";
$bleuvert: #1e7d97; $bleuvert: #1e7d97;
$jaune: #ffd599; $jaune: #ffd599;

View file

@ -1,7 +1,8 @@
<template> <template>
<section class="section container has-text-centered not-found"> <section class="section container has-text-centered not-found">
<div class="columns is-vertical"> <div class="columns is-vertical is-centered">
<div class="column is-centered"> <div class="column is-half">
<img src="/img/pics/2020-10-06-mobilizon-illustration-E_realisation.jpg" alt="" />
<h1 class="title">{{ $t("The page you're looking for doesn't exist.") }}</h1> <h1 class="title">{{ $t("The page you're looking for doesn't exist.") }}</h1>
<p> <p>
{{ $t("Please make sure the address is correct and that the page hasn't been moved.") }} {{ $t("Please make sure the address is correct and that the page hasn't been moved.") }}
@ -56,7 +57,7 @@ export default class PageNotFound extends Vue {
<style lang="scss"> <style lang="scss">
.container.not-found { .container.not-found {
margin: auto; margin: auto;
max-width: 600px; background: $white;
img { img {
margin-top: 3rem; margin-top: 3rem;