boudjeml/parcoursup
boudjeml/parcoursup
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

$

Browse Source
This commit is contained in:
pro.boooooo 2023-03-07 21:51:35 +01:00
parent 4c12f72db6
commit 753cf67823
6 changed files with 128 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/app.riot
View File

@ -56,7 +56,6 @@
<style>
:host {
padding: 6%;
background: #B8CBD0;
min-height: 100vh;
}

106
src/components/global/generalytics/generalytics.riot
View File

@ -1,3 +1,107 @@
<generalytics>
<p>gen</p>
<style>
#generalytics {
width: 60vw;
height: auto;
overflow: auto;
}
#generalytics
#generalytics-stat-container
#generalytics-stat-glob {
padding: 20px;
background: red;
color: white;
display: flex;
flex-direction: column;
}
#generalytics
#generalytics-stat-container
#generalytics-stat-glob
.generalytics-stat-atom {
display: flex;
flex-direction: row;
justify-content: space-between;
}
#generalytics
#generalytics-stat-container
#generalytics-stat-glob
.generalytics-stat-atom
#generalytics-stat-progress {
width: 40vw;
}
#generalytics
#generalytics-stat-container
#generalytics-stat-gender {
text-align: center;
background: blue;
color: white;
}
#generalytics
#generalytics-stat-container
#generalytics-stat-gender
.generalytics-gender-progress {
}
#generalytics
#generalytics-stat-container
#generalytics-stat-gender-m, #generalytics-stat-gender-f {
padding: 20px;
display: flex;
justify-content: space-between;
}
#generalytics
#generalytics-stat-container
#generalytics-stat-gender
.generalytics-gender-progress {
background-color: #000;
}
</style>
<div id="generalytics">
<div id="generalytics-stat-container">
<div id="generalytics-stat-glob" >
<div class="generalytics-stat-atom">
<span>Moyenne</span>
<span>342</span>
</div>
<div class="generalytics-stat-atom">
<span>Nb formations</span>
<span>49</span>
</div>
<div class="generalytics-stat-atom">
<span>Capacite</span>
<span>38</span>
</div>
<div class="generalytics-stat-atom">
<span>Selectivite (50%)</span>
<progress id="generalytics-stat-progress" max="100" min="40" value="50"/>
</div>
</div>
<div id="generalytics-stat-gender">
<span>Repartition par genre</span>
<div id="generalytics-stat-gender-m">
<span>Homme</span>
<progress class="generalytics-gender-progress" max="100" min="40" value="80"/>
</div>
<div id="generalytics-stat-gender-f">
<span>Femme</span>
<progress class="generalytics-gender-progress" max="100" min="40" value="20"/>
</div>
</div>
</div>
</div>
</generalytics>

6
src/components/global/localisationpath/loc.riot
View File

@ -1,3 +1,9 @@
<loc>
<script>
import * as riot from 'riot';
</script>
<style>
</style>
<p>BUT - PRODUCTION - Informatique</p>
</loc>

7
src/components/global/selector/selector.riot
View File

@ -1,13 +1,9 @@
<selector>
<style>
#selector {
width: 500px;
width: 20vw;
height: auto;
max-height: 700px;
padding: 20px;
box-shadow: 0px 0px 9px 1px black;
background: #7A90A4;
border-radius: 10px;
overflow: auto;
}
@ -20,6 +16,7 @@
justify-content: space-between;
position: relative;
min-height: 100px;
gap: 3%;
}
#selector

2
src/index.html
View File

@ -12,9 +12,9 @@
<style>
#root {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
flex-direction: row;
}
</style>

41
src/pages/home.riot
View File

@ -1,49 +1,36 @@
<home>
<style>
#main-container {
position: relative;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap: 10%;
justify-content: space-around;
}
#main-container
#left
generalytics {
margin-bottom: 5%;
}
#main-container
#left
generalytics, etablanalytics {
display: flex;
flex-direction: column;
width: 525px;
height: 300px;
#right, #left generalytics, #left etablanalytics {
padding: 20px;
box-shadow: 0px 0px 9px 1px black;
background: #7A90A4;
border-radius: 10px;
}
#main-container
#top
loc {
display: flex;
justify-content: center;
align-items: center;
width: 200px;
height: 10px;
#right {
align-self: flex-start;
}
#main-container
#left {
display: flex;
flex-direction: column;
justify-content: center;
align-self: center;
}
</style>
<div id="main-container">
<div id="top">
<loc />
</div>
<div id="right">
<selector />
</div>