Commit d3083909 authored by Kenzo-Hugo Hillion's avatar Kenzo-Hugo Hillion
Browse files

add logos and start about page

parent 8424100a
Pipeline #31922 passed with stages
in 3 minutes and 47 seconds
<div class="logos">
<v-container fluid grid-list-md>
<v-layout wrap row align-center justify-center>
<v-flex v-for="item in mediumLogos"
sm12 md6 lg3 xl2
>
<v-img
:src="item.src"
:alt="item.alt"
/>
</v-flex>
<v-flex v-for="item in smallLogos"
sm6 md3 lg1
>
<v-img
:src="item.src"
:alt="item.alt"
/>
</v-flex>
</v-layout>
</v-container>
</div>
\ No newline at end of file
export default {
computed: {
pasteurLogo() {
return {
'src': require("/app/public/img/logos/pasteur.png"),
'alt': 'Institut Pasteur'
};
},
bpiLogo() {
return {
'src': require("/app/public/img/logos/bpifrance.png"),
'alt': 'BPI France'
}
},
elvesysLogo() {
return {
'src': require("/app/public/img/logos/elvesys.png"),
'alt': 'Elvesys'
}
},
riskInPregnancyLogo() {
return {
'src': require("/app/public/img/logos/riskinpregnancy.png"),
'alt': 'Risk in Pregnancy'
}
},
aphpLogo() {
return {
'src': require("/app/public/img/logos/aphp.png"),
'alt': 'APHP'
}
},
insermLogo() {
return {
'src': require("/app/public/img/logos/inserm.png"),
'alt': 'Inserm'
}
},
uniParisLogo() {
return {
'src': require("/app/public/img/logos/uniparis.png"),
'alt': 'Université de Paris'
}
},
mediumLogos() {
return [
this.pasteurLogo,
this.aphpLogo,
this.elvesysLogo,
this.uniParisLogo,
this.insermLogo,
]
},
smallLogos() {
return [
this.riskInPregnancyLogo,
this.bpiLogo,
]
}
}
}
\ No newline at end of file
<template src="./logos.html" lang="html"></template>
<script src="./logos.js" lang="js"></script>
\ No newline at end of file
<div class="about">
<h1>This is an about page</h1>
<v-toolbar class="secondary darken-1 white--text" dense>
<v-icon class="white--text">contact_support</v-icon>
<v-toolbar-title>About</v-toolbar-title>
</v-toolbar>
<v-card>
<v-card-title class="pb-2">
<v-container fluid>
<v-layout>
<v-flex md6 class="pa-1">
<h3 class="mb-1">MetageneDB</h3>
<div>This work is lead by the Metagenomics Signature group at Institut Pasteur and is part of the InSPIRe project.</div>
<h4 class="mt-2">Technical details</h4>
<div>Give more details about technical stacks, links to gitlab again, thanks to DSI for Kubernetes...</div>
</v-flex>
<v-flex md6>
<v-img src="https://cdn.vuetifyjs.com/images/parallax/material.jpg"/>
</v-flex>
</v-layout>
</v-container>
</v-card-title>
<v-card-title class="pt-2">
<v-container fluid>
<v-layout>
<v-flex md8 class="pa-1">
<h3 class="mb-1">InSPIRe project</h3>
<div>
The <b>In</b>novative <b>S</b>trategies for <b>P</b>erinatal <b>I</b>nfection Risk-<b>Re</b>duction project is coordinated by Elvesys, INSERM, Institut Pasteur and APHP.
It aims to... (need more details here, perhaps a diagram that summarize the project?)
This work is founded by BPI France
</div>
</v-flex>
<v-flex md4>
<v-img src="https://cdn.vuetifyjs.com/images/parallax/material2.jpg"/>
</v-flex>
</v-layout>
</v-container>
</v-card-title>
</v-card>
<!-- Logos -->
<logos/>
</div>
\ No newline at end of file
import Logos from '@/components/logos/logos.vue';
export default {
components: {
logos: Logos,
},
}
\ No newline at end of file
<div class="compare">
<v-flex>
<v-toolbar class="secondary darken-1 white--text" dense>
<v-icon class="white--text">far fa-clone</v-icon>
<v-toolbar-title>Taxonomy comparison</v-toolbar-title>
<v-spacer/>
<v-flex xs3 md2>
<v-select
dark
:items="selectLevel"
v-model="taxLevel"
color="taxonomy ligthen-1"
@change="getAllStats"
></v-select>
</v-flex>
</v-toolbar>
<v-toolbar class="secondary darken-1 white--text" dense>
<v-icon class="white--text">far fa-clone</v-icon>
<v-toolbar-title>Taxonomy comparison</v-toolbar-title>
<v-spacer/>
<v-flex xs3 md2>
<v-select
dark
:items="selectLevel"
v-model="taxLevel"
color="taxonomy ligthen-1"
@change="getAllStats"
></v-select>
</v-flex>
</v-toolbar>
<v-card>
<v-container
fluid
grid-list-md
>
<v-layout row wrap class="mt-2">
<!-- First Doughnut -->
<v-flex md6>
<v-toolbar
class="taxonomy"
<v-card>
<v-container
fluid
grid-list-md
>
<v-layout row wrap class="mt-2">
<!-- First Doughnut -->
<v-flex md6>
<v-toolbar
class="taxonomy"
dark
dense
>
<v-icon class="white--text">fa-sitemap</v-icon>
<v-toolbar-title>{{firstGeneSource}} <span class="font-weight-thin">- {{firstGeneCounts}} genes</span></v-toolbar-title>
<v-spacer></v-spacer>
<v-flex xs12 sm6 md4 lg2 d-flex>
<v-select
dark
dense
>
<v-icon class="white--text">fa-sitemap</v-icon>
<v-toolbar-title>{{firstGeneSource}} <span class="font-weight-thin">- {{firstGeneCounts}} genes</span></v-toolbar-title>
<v-spacer></v-spacer>
<v-flex xs12 sm6 md4 lg2 d-flex>
<v-select
dark
:items="geneSources"
v-model="firstGeneSource"
@change="getAllFirstStats"
></v-select>
</v-flex>
</v-toolbar>
<doughnut :doughnutData="firstTaxoCounts" chartId="first_taxo_annotation"></doughnut>
:items="geneSources"
v-model="firstGeneSource"
@change="getAllFirstStats"
></v-select>
</v-flex>
<!-- Second Doughnut -->
<v-flex md6>
<v-toolbar
class="taxonomy"
</v-toolbar>
<doughnut :doughnutData="firstTaxoCounts" chartId="first_taxo_annotation"></doughnut>
</v-flex>
<!-- Second Doughnut -->
<v-flex md6>
<v-toolbar
class="taxonomy"
dark
dense
>
<v-icon class="white--text">fa-sitemap</v-icon>
<v-toolbar-title>{{secondGeneSource}} <span class="font-weight-thin">- {{secondGeneCounts}} genes</span></v-toolbar-title>
<v-spacer></v-spacer>
<v-flex xs12 sm6 md4 lg2 d-flex>
<v-select
dark
dense
>
<v-icon class="white--text">fa-sitemap</v-icon>
<v-toolbar-title>{{secondGeneSource}} <span class="font-weight-thin">- {{secondGeneCounts}} genes</span></v-toolbar-title>
<v-spacer></v-spacer>
<v-flex xs12 sm6 md4 lg2 d-flex>
<v-select
dark
:items="geneSources"
v-model="secondGeneSource"
@change="getAllSecondStats"
></v-select>
</v-flex>
</v-toolbar>
<doughnut :doughnutData="secondTaxoCounts" chartId="second_taxo_annotation"></doughnut>
:items="geneSources"
v-model="secondGeneSource"
@change="getAllSecondStats"
></v-select>
</v-flex>
</v-layout>
</v-container>
</v-card>
</v-flex>
</div>
\ No newline at end of file
</v-toolbar>
<doughnut :doughnutData="secondTaxoCounts" chartId="second_taxo_annotation"></doughnut>
</v-flex>
</v-layout>
</v-container>
</v-card>
</div>
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment