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> <app>
<div class="container"> <div class="container">
<router> <router>
<div if={state.showNotFound} class="row"> <div if={state.showNotFound} class="row">
<div class="column column-60"> <div class="column column-60">
<not-found /> <not-found />
</div> </div>
</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>
<script> <div if={!state.showNotFound}>
import { Router, Route, route, toRegexp, match } from '@riotjs/route' <route each={page in state.pages} path={page.path}>
import lazy from '@riotjs/lazy' <main is={page.componentName} />
import Loader from './components/includes/loader/loader.riot' </route>
import NotFound from './pages/not-found.riot' </div>
import pages from './pages' </router>
</div>
export default { <script>
components: { import { Router, Route, route, toRegexp, match } from '@riotjs/route'
Router, import lazy from '@riotjs/lazy'
Route, import Loader from './components/includes/loader/loader.riot'
NotFound, import NotFound from './pages/not-found.riot'
Home: lazy(Loader, () => import( import pages from './pages'
/* 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)))
this.update({ export default {
activePage, components: {
showNotFound: !activePage Router,
}) Route,
}, NotFound,
onBeforeUnmount() { Home: lazy(Loader, () => import(
this.anyRouteStream.end() './pages/home.riot'
} )),
} },
</script> 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> this.update({
:host { activePage,
padding: 2rem 0; showNotFound: !activePage
} })
},
onBeforeUnmount() {
this.anyRouteStream.end()
}
}
</script>
.menu { <style>
margin: 1rem -1rem; :host {
} padding: 6%;
background: #B8CBD0;
.menu a { min-height: 100vh;
padding: 0 1rem; }
color: black; </style>
}
.menu a.active.active {
font-weight: bold;
text-decoration: none;
}
.menu a:hover, .menu a:focus, .menu a:active {
text-decoration: underline;
}
</style>
</app> </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> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>Parcoursup Analytic's</title> <title>Parcoursup Analytic's</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic"> <meta charset="UTF-8"></meta>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css"> <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/milligram/1.4.0/milligram.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
</head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.0/milligram.css">
<body> </head>
<div id="root"></div>
</body> <body>
<style>
#root {
display: flex;
justify-content: center;
align-items: center;
flex-direction: row;
}
</style>
<div id="root"></div>
</body>
</html> </html>

41
src/pages/home.riot
View File

@ -1,3 +1,42 @@
<home> <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> </home>