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

$

Browse Source
This commit is contained in:
lalBi94 2023-03-06 17:09:06 +01:00
parent de2a768813
commit e857bb23ea
5 changed files with 123 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

134
src/app.riot
View File

@ -1,84 +1,64 @@
<app>
<div class="container">
<router>
<div if={state.showNotFound} class="row">
<div class="column column-60">
<not-found />
</div>
</div>
<div if={!state.showNotFound} class="">
<div class="column column-60">
<route each={page in state.pages} path={page.path}>
<main is={page.componentName} />
</route>
</div>
</div>
</router>
</div>
<div class="container">
<router>
<div if={state.showNotFound} class="row">
<div class="column column-60">
<not-found />
</div>
</div>
<script>
import { Router, Route, route, toRegexp, match } from '@riotjs/route'
import lazy from '@riotjs/lazy'
import Loader from './components/includes/loader/loader.riot'
import NotFound from './pages/not-found.riot'
import pages from './pages'
<div if={!state.showNotFound}>
<route each={page in state.pages} path={page.path}>
<main is={page.componentName} />
</route>
</div>
</router>
</div>
export default {
components: {
Router,
Route,
NotFound,
Home: lazy(Loader, () => import(
/* webpackPrefetch: true, webpackChunkName: 'pages/home' */
'./pages/home.riot'
)),
},
state: {
pages,
showNotFound: false,
activePage: null
},
onBeforeMount({ isServer }) {
// create a stream on all routes to catch the not-found page
this.anyRouteStream = route('(.*)')
this.anyRouteStream.on.value(this.onAnyRoute)
},
onAnyRoute(path) {
// show the not found page if none of the page paths are matched
const activePage = pages.find(p => match(path.pathname, toRegexp(p.path)))
<script>
import { Router, Route, route, toRegexp, match } from '@riotjs/route'
import lazy from '@riotjs/lazy'
import Loader from './components/includes/loader/loader.riot'
import NotFound from './pages/not-found.riot'
import pages from './pages'
this.update({
activePage,
showNotFound: !activePage
})
},
onBeforeUnmount() {
this.anyRouteStream.end()
}
}
</script>
export default {
components: {
Router,
Route,
NotFound,
Home: lazy(Loader, () => import(
'./pages/home.riot'
)),
},
state: {
pages,
showNotFound: false,
activePage: null
},
onBeforeMount({ isServer }) {
this.anyRouteStream = route('(.*)')
this.anyRouteStream.on.value(this.onAnyRoute)
},
onAnyRoute(path) {// show the not found page if none of the page paths are matched
const activePage = pages.find(p => match(path.pathname, toRegexp(p.path)))
<style>
:host {
padding: 2rem 0;
}
this.update({
activePage,
showNotFound: !activePage
})
},
onBeforeUnmount() {
this.anyRouteStream.end()
}
}
</script>
.menu {
margin: 1rem -1rem;
}
.menu a {
padding: 0 1rem;
color: black;
}
.menu a.active.active {
font-weight: bold;
text-decoration: none;
}
.menu a:hover, .menu a:focus, .menu a:active {
text-decoration: underline;
}
</style>
<style>
:host {
padding: 6%;
background: #B8CBD0;
min-height: 100vh;
}
</style>
</app>

3
src/components/global/etablanalytics/etablanalytics.riot Normal file
View File

@ -0,0 +1,3 @@
<etablanalytics>
<p>eta</p>
</etablanalytics>

3
src/components/global/generalytics/generalytics.riot Normal file
View File

@ -0,0 +1,3 @@
<generalytics>
<p>gen</p>
</generalytics>

29
src/index.html
View File

@ -1,12 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<title>Parcoursup Analytic's</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.0/milligram.css">
</head>
<body>
<div id="root"></div>
</body>
<head>
<title>Parcoursup Analytic's</title>
<meta charset="UTF-8"></meta>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.0/milligram.css">
</head>
<body>
<style>
#root {
display: flex;
justify-content: center;
align-items: center;
flex-direction: row;
}
</style>
<div id="root"></div>
</body>
</html>

41
src/pages/home.riot
View File

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