Hotfix: Nom des dossiers + Ajout /functions/slug
This commit is contained in:
Divlo
25
website/.gitignore
vendored
Normal file
25
website/.gitignore
vendored
Normal file
@ -0,0 +1,25 @@
|
||||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
/.pnp
|
||||
.pnp.js
|
||||
|
||||
# testing
|
||||
/coverage
|
||||
|
||||
# next.js
|
||||
/.next/
|
||||
/out/
|
||||
|
||||
# production
|
||||
/build
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
.env*
|
||||
|
||||
# debug
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
6
website/components/Footer/Footer.css
Normal file
6
website/components/Footer/Footer.css
Normal file
@ -0,0 +1,6 @@
|
||||
.footer {
|
||||
border-top: var(--border-header-footer);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
9
website/components/Footer/Footer.js
Normal file
9
website/components/Footer/Footer.js
Normal file
@ -0,0 +1,9 @@
|
||||
import './Footer.css';
|
||||
|
||||
export default function Footer() {
|
||||
return (
|
||||
<footer className="footer">
|
||||
<p className="footer-text"><a href="https://divlo.fr/" target="_blank" rel="noopener noreferrer">Divlo</a> | Tous droits réservés</p>
|
||||
</footer>
|
||||
);
|
||||
}
|
||||
65
website/components/FunctionCard/FunctionCard.css
Normal file
65
website/components/FunctionCard/FunctionCard.css
Normal file
@ -0,0 +1,65 @@
|
||||
.FunctionCard {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
flex-direction: column;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px 6px rgba(0, 0, 0, .25);
|
||||
border: 1px solid black;
|
||||
border-radius: 1rem;
|
||||
margin: 0 0 50px 0;
|
||||
cursor: pointer;
|
||||
transition: all .3s;
|
||||
}
|
||||
.FunctionCard__container {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.FunctionCard:hover {
|
||||
transform: translateY(-7px);
|
||||
}
|
||||
/* col-md */
|
||||
@media (min-width: 768px) {
|
||||
.FunctionCard {
|
||||
margin: 0 30px 50px 30px;
|
||||
}
|
||||
}
|
||||
/* col-xl */
|
||||
@media (min-width: 1200px) {
|
||||
.FunctionCard {
|
||||
margin: 0 20px 50px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.FunctionCard__top {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
flex-grow: 1;
|
||||
}
|
||||
.FunctionCard__image {
|
||||
width: 150px;
|
||||
}
|
||||
.FunctionCard__title {
|
||||
font-size: 1.4em;
|
||||
margin: 0;
|
||||
color: var(--important);
|
||||
font-weight: 300;
|
||||
}
|
||||
.FunctionCard__description {
|
||||
margin: 20px 0 10px 0;
|
||||
}
|
||||
.FunctionCard__info {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
.FunctionCard__category {
|
||||
border-radius: 0.5em;
|
||||
padding: 0.5em;
|
||||
margin-right: 20px;
|
||||
font-size: 16.4px;
|
||||
}
|
||||
40
website/components/FunctionCard/FunctionCard.js
Normal file
40
website/components/FunctionCard/FunctionCard.js
Normal file
@ -0,0 +1,40 @@
|
||||
import Link from 'next/link';
|
||||
import { useState, forwardRef } from 'react';
|
||||
import Loader from '../Loader';
|
||||
import './FunctionCard.css';
|
||||
|
||||
const FunctionCard = forwardRef((props, ref) => {
|
||||
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
|
||||
const handleLoad = () => {
|
||||
setIsLoading(false);
|
||||
}
|
||||
|
||||
return (
|
||||
<Link
|
||||
href={"/functions/[slug]"}
|
||||
as={`/functions/${props.slug}`}
|
||||
>
|
||||
{/* FunctionCard a une hauteur pendant chargement */}
|
||||
<div ref={ref} style={isLoading ? { height: "360px", justifyContent: "center" } : null} className={"FunctionCard col-sm-24 col-md-10 col-xl-7"}>
|
||||
|
||||
{isLoading && <Loader width="125px" height="125px" />}
|
||||
|
||||
<div className={`FunctionCard__container ${isLoading ? "d-none" : ""}`}>
|
||||
<div className="FunctionCard__top">
|
||||
<img onLoad={handleLoad} className="FunctionCard__image" alt={props.title} src={props.image} />
|
||||
<h2 className="FunctionCard__title">{props.title}</h2>
|
||||
<p className="FunctionCard__description">{props.description}</p>
|
||||
</div>
|
||||
<div className="FunctionCard__info">
|
||||
<p className="FunctionCard__category" style={{ backgroundColor: props.category.color }}>{props.category.name}</p>
|
||||
<p className="FunctionCard__publication-date">{props.publicationDate}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
);
|
||||
})
|
||||
|
||||
export default FunctionCard;
|
||||
37
website/components/HeadTag.js
Normal file
37
website/components/HeadTag.js
Normal file
@ -0,0 +1,37 @@
|
||||
import Head from 'next/head';
|
||||
|
||||
const HeadTag = ({ title, image, description }) => (
|
||||
<Head>
|
||||
<title>{title || ""}</title>
|
||||
<link rel="icon" type="image/png" href={image} />
|
||||
|
||||
{/* Meta Tag */}
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="description" content={description} />
|
||||
<link rel="canonical" href="function.divlo.fr"/>
|
||||
<meta name="Language" content="fr" />
|
||||
<meta name="theme-color" content="#ffd800" />
|
||||
|
||||
{/* Open Graph Metadata */}
|
||||
<meta property="og:title" content={title} />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:url" content="https://function.divlo.fr/" />
|
||||
<meta property="og:image" content={image} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta property="og:locale" content="fr_FR" />
|
||||
<meta property="og:site_name" content="FunctionProject" />
|
||||
|
||||
{/* Twitter card Metadata */}
|
||||
<meta name="twitter:card" content="summary" />
|
||||
<meta name="twitter:description" content={description} />
|
||||
<meta name="twitter:title" content={title} />
|
||||
<meta name="twitter:site" content="@Divlo_FR" />
|
||||
<meta name="twitter:image:src" content={image} />
|
||||
<meta name="twitter:creator" content="@Divlo_FR" />
|
||||
|
||||
{/* Preloader script */}
|
||||
<script src="/js/preloader.js"></script>
|
||||
</Head>
|
||||
);
|
||||
|
||||
export default HeadTag;
|
||||
161
website/components/Header/Header.css
Normal file
161
website/components/Header/Header.css
Normal file
@ -0,0 +1,161 @@
|
||||
/* HEADER */
|
||||
.Header {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: .5rem 1rem;
|
||||
|
||||
border-bottom: var(--border-header-footer);
|
||||
background-color: var(--background-color);
|
||||
}
|
||||
@media (min-width: 992px) {
|
||||
.Header {
|
||||
flex-flow: row nowrap;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
.Header > .container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
@media (min-width: 992px) {
|
||||
.Header > .container {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
}
|
||||
/* Brand */
|
||||
.Header__brand-link {
|
||||
display: inline-block;
|
||||
padding-top: .3125rem;
|
||||
padding-bottom: .3125rem;
|
||||
margin-right: 1rem;
|
||||
font-size: 1.25rem;
|
||||
line-height: inherit;
|
||||
white-space: nowrap;
|
||||
}
|
||||
#brand-link__logo-small-screen {
|
||||
display: none;
|
||||
}
|
||||
@media (max-width: 496px) {
|
||||
#brand-link__logo {
|
||||
display: none;
|
||||
}
|
||||
.Header__brand-link {
|
||||
width: 30%;
|
||||
}
|
||||
#brand-link__logo-small-screen {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.Header .Header__navbar {
|
||||
display: flex;
|
||||
flex-basis: auto;
|
||||
}
|
||||
}
|
||||
.Header__navbar {
|
||||
flex-basis: 100%;
|
||||
flex-grow: 1;
|
||||
align-items: center;
|
||||
}
|
||||
.navbar__list {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-left: auto;
|
||||
}
|
||||
.navbar__list.navbar__list-active {
|
||||
margin: 0 !important;
|
||||
display: flex;
|
||||
}
|
||||
@media (max-width: 992px) {
|
||||
.navbar__list {
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-left: 0;
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
.navbar-link {
|
||||
display: block;
|
||||
padding: .5rem 1rem;
|
||||
}
|
||||
|
||||
/* Details Styling */
|
||||
.navbar-link:hover {
|
||||
text-decoration: none;
|
||||
color: rgba(255, 255, 255, .75);
|
||||
}
|
||||
.navbar-link, .navbar-link-active {
|
||||
color: rgba(255, 255, 255, .5);
|
||||
}
|
||||
.navbar-link-active, .navbar-link-active:hover, .Header__brand-link {
|
||||
color: var(--text-color);
|
||||
}
|
||||
.navbar-item {
|
||||
list-style: none;
|
||||
}
|
||||
.navbar-link {
|
||||
font-size: 16px;
|
||||
padding: .5rem;
|
||||
}
|
||||
|
||||
/* Hamburger Icon */
|
||||
.Header__hamburger {
|
||||
display: none;
|
||||
width: 56px;
|
||||
height: 40px;
|
||||
cursor: pointer;
|
||||
background-color: transparent;
|
||||
border: 1px solid rgba(255, 255, 255, .1);
|
||||
border-radius: .25rem;
|
||||
position: relative;
|
||||
}
|
||||
.Header__hamburger > span, .Header__hamburger > span::before, .Header__hamburger > span::after {
|
||||
position: absolute;
|
||||
width: 22px;
|
||||
height: 1.3px;
|
||||
background-color: rgba(255, 255, 255);
|
||||
}
|
||||
.Header__hamburger > span {
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
transition: background-color .3s ease-in-out;
|
||||
}
|
||||
.Header__hamburger > span::before, .Header__hamburger > span::after {
|
||||
content: '';
|
||||
transition: transform .3s ease-in-out;
|
||||
}
|
||||
.Header__hamburger > span::before {
|
||||
transform: translateY(-8px);
|
||||
}
|
||||
.Header__hamburger > span::after {
|
||||
transform: translateY(8px);
|
||||
}
|
||||
.Header__hamburger-active span {
|
||||
background-color: transparent;
|
||||
}
|
||||
.Header__hamburger-active > span::before {
|
||||
transform: translateY(0px) rotateZ(45deg);
|
||||
}
|
||||
.Header__hamburger-active > span::after {
|
||||
transform: translateY(0px) rotateZ(-45deg);
|
||||
}
|
||||
/* Apparition du hamburger */
|
||||
@media (max-width: 992px) {
|
||||
.Header__hamburger {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
49
website/components/Header/Header.js
Normal file
49
website/components/Header/Header.js
Normal file
@ -0,0 +1,49 @@
|
||||
import { useState } from 'react';
|
||||
import Link from 'next/link';
|
||||
import NavigationLink from './NavigationLink';
|
||||
import './Header.css';
|
||||
|
||||
export default function Header() {
|
||||
|
||||
const [hamburgerIcon, setHamburgerIcon] = useState("");
|
||||
const [navbarList, setNavbarList] = useState("");
|
||||
|
||||
const toggleNavbar = () => {
|
||||
if (hamburgerIcon) {
|
||||
setHamburgerIcon("");
|
||||
setNavbarList("");
|
||||
} else {
|
||||
setHamburgerIcon("Header__hamburger-active");
|
||||
setNavbarList("navbar__list-active");
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<header className="Header">
|
||||
<div className="container">
|
||||
|
||||
{/* Brand */}
|
||||
<Link href={"/"}>
|
||||
<a className="Header__brand-link">
|
||||
<img id="brand-link__logo" src="/images/FunctionProject_brand-logo.png" alt="FunctionProject" />
|
||||
<img id="brand-link__logo-small-screen" src="/images/FunctionProject_icon_small.png" alt="FunctionProject" />
|
||||
</a>
|
||||
</Link>
|
||||
|
||||
{/* Hamburger icon on Mobile */}
|
||||
<div onClick={toggleNavbar} className={"Header__hamburger " + hamburgerIcon}>
|
||||
<span></span>
|
||||
</div>
|
||||
|
||||
{/* Navigation */}
|
||||
<nav className="Header__navbar">
|
||||
<ul className={"navbar__list " + navbarList}>
|
||||
<NavigationLink name="Accueil" path="/" />
|
||||
<NavigationLink name="Fonctions" path="/functions" />
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
}
|
||||
18
website/components/Header/NavigationLink.js
Normal file
18
website/components/Header/NavigationLink.js
Normal file
@ -0,0 +1,18 @@
|
||||
import Link from 'next/link';
|
||||
import { useRouter } from 'next/router';
|
||||
import './Header.css';
|
||||
|
||||
export default function NavigationLink(props) {
|
||||
|
||||
const { pathname } = useRouter();
|
||||
|
||||
return (
|
||||
<li className="navbar-item">
|
||||
<Link href={props.path}>
|
||||
<a className={`navbar-link ${pathname === props.path ? "navbar-link-active" : null}`}>
|
||||
{props.name}
|
||||
</a>
|
||||
</Link>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
15
website/components/Loader.js
Normal file
15
website/components/Loader.js
Normal file
@ -0,0 +1,15 @@
|
||||
const Loader = ({ width, height, speed }) => (
|
||||
<svg width={width} height={height} viewBox="0 0 100 100">
|
||||
<g transform="translate(50 50) rotate(0) scale(1 1) translate(-50 -50)">
|
||||
<image style={{transformOrigin: "50% 50%", animation: `${speed} linear 0s infinite normal forwards running Loader__spin`}} x="0" y="0" width="100" height="100" href="/images/FunctionProject_icon.png"></image>
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
|
||||
Loader.defaultProps = {
|
||||
width: "100px",
|
||||
height: "100px",
|
||||
speed: ".9s"
|
||||
}
|
||||
|
||||
export default Loader;
|
||||
11
website/config/api.js
Normal file
11
website/config/api.js
Normal file
@ -0,0 +1,11 @@
|
||||
import axios from 'axios';
|
||||
import { API_URL } from './config';
|
||||
|
||||
const api = axios.create({
|
||||
baseURL: API_URL,
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
});
|
||||
|
||||
export default api;
|
||||
1
website/config/config.js
Normal file
1
website/config/config.js
Normal file
@ -0,0 +1 @@
|
||||
export const API_URL = "http://localhost:8080";
|
||||
31
website/hooks/useAPI.js
Normal file
31
website/hooks/useAPI.js
Normal file
@ -0,0 +1,31 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import api from '../config/api';
|
||||
|
||||
/**
|
||||
* @param {String} url
|
||||
* @param {*} defaultData
|
||||
* @param {String} method
|
||||
* @param {Object} options
|
||||
*/
|
||||
function useAPI(url, defaultData = [], method = "get", options = {}) {
|
||||
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [data, setData] = useState(defaultData);
|
||||
const [hasError, setHasError] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
api[method](url, options)
|
||||
.then((result) => {
|
||||
setData(result.data);
|
||||
setIsLoading(false);
|
||||
})
|
||||
.catch((error) => {
|
||||
setHasError(true);
|
||||
console.error(error);
|
||||
});
|
||||
}, []);
|
||||
|
||||
return [isLoading, data, hasError];
|
||||
}
|
||||
|
||||
export default useAPI;
|
||||
3
website/next.config.js
Normal file
3
website/next.config.js
Normal file
@ -0,0 +1,3 @@
|
||||
const withCSS = require('@zeit/next-css');
|
||||
const withFonts = require('next-fonts');
|
||||
module.exports = withFonts(withCSS());
|
||||
7995
website/package-lock.json
generated
Normal file
7995
website/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
19
website/package.json
Normal file
19
website/package.json
Normal file
@ -0,0 +1,19 @@
|
||||
{
|
||||
"name": "functionproject-next",
|
||||
"version": "1.0.0",
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"prod": "next export"
|
||||
},
|
||||
"dependencies": {
|
||||
"@zeit/next-css": "^1.0.1",
|
||||
"axios": "^0.19.2",
|
||||
"next": "9.3.1",
|
||||
"next-fonts": "^1.0.3",
|
||||
"nprogress": "^0.2.0",
|
||||
"react": "16.13.0",
|
||||
"react-dom": "16.13.0"
|
||||
}
|
||||
}
|
||||
29
website/pages/404.js
Normal file
29
website/pages/404.js
Normal file
@ -0,0 +1,29 @@
|
||||
import { Fragment } from 'react';
|
||||
import Link from 'next/link';
|
||||
import HeadTag from '../components/HeadTag';
|
||||
import '../public/css/pages/404.css';
|
||||
|
||||
const Error404 = () => (
|
||||
<Fragment>
|
||||
<HeadTag
|
||||
title="Erreur 404"
|
||||
description="Cette page n'existe pas!"
|
||||
image="/images/error404.png"
|
||||
/>
|
||||
<div className="Error404__container">
|
||||
<h1>Erreur <span className="important">404</span></h1>
|
||||
<p className="text-center">
|
||||
Cette page n'existe pas! <Link href={"/"}><a>Revenir à la page d'accueil ?</a></Link>
|
||||
</p>
|
||||
</div>
|
||||
<style>
|
||||
{`
|
||||
#__next {
|
||||
padding-top: 0;
|
||||
}
|
||||
`}
|
||||
</style>
|
||||
</Fragment>
|
||||
);
|
||||
|
||||
export default Error404;
|
||||
31
website/pages/_app.js
Normal file
31
website/pages/_app.js
Normal file
@ -0,0 +1,31 @@
|
||||
/* Libraries Imports */
|
||||
import { Fragment } from 'react';
|
||||
import Router from 'next/router'
|
||||
import NProgress from 'nprogress';
|
||||
|
||||
/* Components Imports */
|
||||
import Header from '../components/Header/Header';
|
||||
import Footer from '../components/Footer/Footer';
|
||||
|
||||
/* CSS Imports */
|
||||
import '../public/fonts/Montserrat/Montserrat.css';
|
||||
import '../public/css/normalize.css';
|
||||
import '../public/css/grid.css';
|
||||
import '../public/css/general.css';
|
||||
import '../public/css/nprogress.css';
|
||||
|
||||
Router.events.on('routeChangeStart', () => NProgress.start());
|
||||
Router.events.on('routeChangeComplete', () => NProgress.done());
|
||||
Router.events.on('routeChangeError', () => NProgress.done());
|
||||
|
||||
const App = ({ Component, pageProps }) => (
|
||||
<Fragment>
|
||||
<Header />
|
||||
<div className="content container-fluid">
|
||||
<Component {...pageProps} />
|
||||
</div>
|
||||
<Footer />
|
||||
</Fragment>
|
||||
);
|
||||
|
||||
export default App;
|
||||
28
website/pages/_document.js
Normal file
28
website/pages/_document.js
Normal file
@ -0,0 +1,28 @@
|
||||
import Document, { Html, Head, Main, NextScript } from "next/document";
|
||||
import Loader from '../components/Loader';
|
||||
|
||||
class MyDocument extends Document {
|
||||
static async getInitialProps(ctx) {
|
||||
const initialProps = await Document.getInitialProps(ctx);
|
||||
return { ...initialProps };
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Html lang="fr">
|
||||
<Head />
|
||||
<body>
|
||||
<div id="preloader">
|
||||
<Loader />
|
||||
</div>
|
||||
<div className="isLoading">
|
||||
<Main />
|
||||
</div>
|
||||
<NextScript />
|
||||
</body>
|
||||
</Html>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default MyDocument;
|
||||
26
website/pages/functions/[slug].js
Normal file
26
website/pages/functions/[slug].js
Normal file
@ -0,0 +1,26 @@
|
||||
import { Fragment } from 'react';
|
||||
import { useRouter } from 'next/router';
|
||||
import HeadTag from '../../components/HeadTag';
|
||||
import { API_URL } from '../../config/config';
|
||||
|
||||
const FunctionComponent = () => {
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<HeadTag
|
||||
title={router.query.slug}
|
||||
description={router.query.slug}
|
||||
image={`${API_URL}/images/functions/${router.query.slug}.png`}
|
||||
/>
|
||||
<div className="container text-center">
|
||||
<div className="row justify-content-center">
|
||||
<h1>{router.query.slug}</h1>
|
||||
</div>
|
||||
</div>
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
export default FunctionComponent;
|
||||
100
website/pages/functions/index.js
Normal file
100
website/pages/functions/index.js
Normal file
@ -0,0 +1,100 @@
|
||||
import { Fragment, useState, useEffect, useRef, useCallback } from 'react';
|
||||
import HeadTag from '../../components/HeadTag';
|
||||
import FunctionCard from '../../components/FunctionCard/FunctionCard';
|
||||
import Loader from '../../components/Loader';
|
||||
import '../../public/css/pages/functions.css';
|
||||
import { API_URL } from '../../config/config';
|
||||
import api from '../../config/api';
|
||||
import useAPI from '../../hooks/useAPI';
|
||||
|
||||
const Functions = () => {
|
||||
|
||||
// State de recherche et de catégories
|
||||
const [, categories] = useAPI('/categories');
|
||||
const [inputSearch, setInputSearch] = useState({ search: "", selectedCategory: "0" });
|
||||
|
||||
// State pour afficher les fonctions
|
||||
const [functionsData, setFunctionsData] = useState({ hasMore: true, rows: [] });
|
||||
const [isLoadingFunctions, setLoadingFunctions] = useState(true);
|
||||
const [pageFunctions, setPageFunctions] = useState(1);
|
||||
|
||||
// Permet la pagination au scroll
|
||||
const observer = useRef();
|
||||
const lastFunctionCardRef = useCallback((node) => {
|
||||
if (isLoadingFunctions) return;
|
||||
if (observer.current) observer.current.disconnect();
|
||||
observer.current = new IntersectionObserver((entries) => {
|
||||
if (entries[0].isIntersecting && functionsData.hasMore) {
|
||||
setPageFunctions(pageFunctions + 1);
|
||||
}
|
||||
}, { threshold: 1 });
|
||||
if (node) observer.current.observe(node);
|
||||
}, [isLoadingFunctions, functionsData.hasMore]);
|
||||
|
||||
const getFunctionsData = () => {
|
||||
setLoadingFunctions(true);
|
||||
return new Promise(async (next) => {
|
||||
const result = await api.get(`/functions?page=${pageFunctions}&limit=10&categoryId=${inputSearch.selectedCategory}&search=${inputSearch.search}`);
|
||||
setLoadingFunctions(false);
|
||||
next(result.data);
|
||||
});
|
||||
}
|
||||
|
||||
// Récupère les fonctions si la page change
|
||||
useEffect(() => {
|
||||
getFunctionsData().then((data) => setFunctionsData({
|
||||
hasMore: data.hasMore,
|
||||
rows: [...functionsData.rows, ...data.rows]
|
||||
}));
|
||||
}, [pageFunctions]);
|
||||
|
||||
// Récupère les fonctions si la catégorie/recherche change
|
||||
useEffect(() => {
|
||||
getFunctionsData().then((data) => setFunctionsData(data));
|
||||
}, [inputSearch.selectedCategory, inputSearch.search]);
|
||||
|
||||
const handleChange = (event) => {
|
||||
const inputSearchNew = { ...inputSearch };
|
||||
inputSearchNew[event.target.name] = event.target.value;
|
||||
setInputSearch(inputSearchNew);
|
||||
}
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<HeadTag
|
||||
title="Fonctions"
|
||||
description="Liste des fonctions."
|
||||
image="/images/FunctionProject_icon_small.png"
|
||||
/>
|
||||
|
||||
<div className="container text-center">
|
||||
<div className="row justify-content-center">
|
||||
<h1 className="Functions__title">Fonctions</h1>
|
||||
</div>
|
||||
|
||||
<div className="Functions__search-container row justify-content-center">
|
||||
<select name="selectedCategory" value={inputSearch.selectedCategory} onChange={handleChange} className="Functions__select form-control">
|
||||
<option value="0">Toutes catégories</option>
|
||||
{categories.map((category) => (
|
||||
<option key={category.id} value={category.id} className="Functions__select-option" style={{ backgroundColor: category.color }}>{category.name}</option>
|
||||
))}
|
||||
</select>
|
||||
<input value={inputSearch.search} onChange={handleChange} type="search" className="form-control Functions__search-input" name="search" id="search" placeholder="🔎 Rechercher..."></input>
|
||||
</div>
|
||||
|
||||
<div className="row justify-content-center">
|
||||
{functionsData.rows.map((f, index) => {
|
||||
// Si c'est le dernier élément
|
||||
if (functionsData.rows.length === index + 1) {
|
||||
return <FunctionCard ref={lastFunctionCardRef} key={f.id} slug={f.slug} image={API_URL + f.image} title={f.title} description={f.description} category={f.categorie} publicationDate={new Date(f.createdAt).toLocaleDateString('fr-FR')} />;
|
||||
}
|
||||
return <FunctionCard key={f.id} slug={f.slug} image={API_URL + f.image} title={f.title} description={f.description} category={f.categorie} publicationDate={new Date(f.createdAt).toLocaleDateString('fr-FR')} />;
|
||||
})}
|
||||
</div>
|
||||
{isLoadingFunctions && <Loader />}
|
||||
</div>
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
export default Functions;
|
||||
25
website/pages/index.js
Normal file
25
website/pages/index.js
Normal file
@ -0,0 +1,25 @@
|
||||
import { Fragment, useEffect } from 'react';
|
||||
import HeadTag from '../components/HeadTag';
|
||||
|
||||
const Home = () => {
|
||||
|
||||
useEffect(() => {
|
||||
console.log(
|
||||
'%c ⚙️ FunctionProject',
|
||||
'color: #ffd800; font-weight: bold; background-color: #181818;padding: 10px;border-radius: 10px;font-size: 20px'
|
||||
);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<HeadTag
|
||||
title="FunctionProject"
|
||||
description="FunctionProject est un projet créé par Divlo qui a pour but de rassembler plein de mini-programme permettant de faire plusieurs choses comme savoir la météo, générer un nombre aléatoire, etc."
|
||||
image="/images/FunctionProject_icon_small.png"
|
||||
/>
|
||||
<div>Home</div>
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
export default Home;
|
||||
117
website/public/css/general.css
Normal file
117
website/public/css/general.css
Normal file
@ -0,0 +1,117 @@
|
||||
/* GENERAL */
|
||||
:root {
|
||||
--border-header-footer: 3px rgba(255, 255, 255, .7) solid;
|
||||
--background-color: #181818;
|
||||
--text-color: rgb(222, 222, 222);
|
||||
--important: #ffd800;
|
||||
}
|
||||
html {
|
||||
line-height: initial;
|
||||
}
|
||||
body {
|
||||
background-color: var(--background-color);
|
||||
}
|
||||
#__next {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-flow: column wrap;
|
||||
background-color: var(--background-color);
|
||||
color: var(--text-color);
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
padding-top: 99px; /* Height of the Header */
|
||||
}
|
||||
p {
|
||||
font-size: 18px;
|
||||
line-height: 1.9;
|
||||
}
|
||||
h2 {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* CONTENT */
|
||||
.content {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
}
|
||||
.centeredContainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* LOADING */
|
||||
.isLoading {
|
||||
display: none;
|
||||
}
|
||||
#preloader {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
@keyframes Loader__spin {
|
||||
0% {
|
||||
animation-timing-function: cubic-bezier(0.5856, 0.0703, 0.4143, 0.9297);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
/* UTILITIES */
|
||||
.text-center {
|
||||
text-align: center;
|
||||
word-break: break-word;
|
||||
}
|
||||
.justify-content-center {
|
||||
justify-content: center;
|
||||
}
|
||||
.align-items-center {
|
||||
align-items: center;
|
||||
}
|
||||
a, .important {
|
||||
color: var(--important);
|
||||
text-decoration: none;
|
||||
}
|
||||
.d-none {
|
||||
display: none !important;
|
||||
}
|
||||
.form-control {
|
||||
display: block;
|
||||
height: calc(1.5em + .75rem + 2px);
|
||||
padding: .375rem .75rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.5;
|
||||
color: #495057;
|
||||
background-color: #fff;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid #ced4da;
|
||||
border-radius: .5em;
|
||||
}
|
||||
.btn {
|
||||
cursor: pointer;
|
||||
border: 1px solid transparent;
|
||||
padding: .375rem .75rem;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
border-radius: .25rem;
|
||||
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
|
||||
}
|
||||
.btn-dark:hover {
|
||||
color: #fff;
|
||||
background-color: #23272b;
|
||||
border-color: #1d2124;
|
||||
}
|
||||
.btn-dark {
|
||||
color: #fff;
|
||||
background-color: #343a40;
|
||||
border-color: #343a40;
|
||||
}
|
||||
595
website/public/css/grid.css
Normal file
595
website/public/css/grid.css
Normal file
@ -0,0 +1,595 @@
|
||||
/*!
|
||||
* Bootstrap Grid v4.4.1 (https://getbootstrap.com/)
|
||||
* Edited by Divlo (col, col-sm, col-md, col-lg, col-xl) and 24 columns (no offsets)
|
||||
*/
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.container-fluid {
|
||||
width: 100%;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.container {
|
||||
max-width: 540px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 576px) {
|
||||
.container {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.container {
|
||||
max-width: 720px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.container {
|
||||
max-width: 960px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
max-width: 1140px;
|
||||
}
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-right: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
|
||||
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col-13, .col-14, .col-15, .col-16, .col-17, .col-18, .col-19, .col-20, .col-21, .col-22, .col-23, .col-24,
|
||||
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-13, .col-sm-14, .col-sm-15, .col-sm-16, .col-sm-17, .col-sm-18, .col-sm-19, .col-sm-20, .col-sm-21, .col-sm-22, .col-sm-23, .col-sm-24,
|
||||
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md-13, .col-md-14, .col-md-15, .col-md-16, .col-md-17, .col-md-18, .col-md-19, .col-md-20, .col-md-21, .col-md-22, .col-md-23, .col-md-24,
|
||||
.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-13, .col-lg-14, .col-lg-15, .col-lg-16, .col-lg-17, .col-lg-18, .col-lg-19, .col-lg-20, .col-lg-21, .col-lg-22, .col-lg-23, .col-lg-24,
|
||||
.col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-13, .col-xl-14, .col-xl-15, .col-xl-16, .col-xl-17, .col-xl-18, .col-xl-19, .col-xl-20, .col-xl-21, .col-xl-22, .col-xl-23, .col-xl-24 {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
/* col- */
|
||||
.col-1 {
|
||||
flex: 0 0 4.16667%;
|
||||
max-width: 4.16667%;
|
||||
}
|
||||
|
||||
.col-2 {
|
||||
flex: 0 0 8.33333%;
|
||||
max-width: 8.33333%;
|
||||
}
|
||||
|
||||
.col-3 {
|
||||
flex: 0 0 12.5%;
|
||||
max-width: 12.5%;
|
||||
}
|
||||
|
||||
.col-4 {
|
||||
flex: 0 0 16.66667%;
|
||||
max-width: 16.66667%;
|
||||
}
|
||||
|
||||
.col-5 {
|
||||
flex: 0 0 20.83333%;
|
||||
max-width: 20.83333%;
|
||||
}
|
||||
|
||||
.col-6 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
|
||||
.col-7 {
|
||||
flex: 0 0 29.16667%;
|
||||
max-width: 29.16667%;
|
||||
}
|
||||
|
||||
.col-8 {
|
||||
flex: 0 0 33.33333%;
|
||||
max-width: 33.33333%;
|
||||
}
|
||||
|
||||
.col-9 {
|
||||
flex: 0 0 37.5%;
|
||||
max-width: 37.5%;
|
||||
}
|
||||
|
||||
.col-10 {
|
||||
flex: 0 0 41.66667%;
|
||||
max-width: 41.66667%;
|
||||
}
|
||||
|
||||
.col-11 {
|
||||
flex: 0 0 45.83333%;
|
||||
max-width: 45.83333%;
|
||||
}
|
||||
|
||||
.col-12 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
.col-13 {
|
||||
flex: 0 0 54.16667%;
|
||||
max-width: 54.16667%;
|
||||
}
|
||||
|
||||
.col-14 {
|
||||
flex: 0 0 58.33333%;
|
||||
max-width: 58.33333%;
|
||||
}
|
||||
|
||||
.col-15 {
|
||||
flex: 0 0 62.5%;
|
||||
max-width: 62.5%;
|
||||
}
|
||||
|
||||
.col-16 {
|
||||
flex: 0 0 66.66667%;
|
||||
max-width: 66.66667%;
|
||||
}
|
||||
|
||||
.col-17 {
|
||||
flex: 0 0 70.83333%;
|
||||
max-width: 70.83333%;
|
||||
}
|
||||
|
||||
.col-18 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
|
||||
.col-19 {
|
||||
flex: 0 0 79.16667%;
|
||||
max-width: 79.16667%;
|
||||
}
|
||||
|
||||
.col-20 {
|
||||
flex: 0 0 83.33333%;
|
||||
max-width: 83.33333%;
|
||||
}
|
||||
|
||||
.col-21 {
|
||||
flex: 0 0 87.5%;
|
||||
max-width: 87.5%;
|
||||
}
|
||||
|
||||
.col-22 {
|
||||
flex: 0 0 91.66667%;
|
||||
max-width: 91.66667%;
|
||||
}
|
||||
|
||||
.col-23 {
|
||||
flex: 0 0 95.83333%;
|
||||
max-width: 95.83333%;
|
||||
}
|
||||
|
||||
.col-24 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* col-sm */
|
||||
@media (min-width: 576px) {
|
||||
.col-sm-1 {
|
||||
flex: 0 0 4.16667%;
|
||||
max-width: 4.16667%;
|
||||
}
|
||||
.col-sm-2 {
|
||||
flex: 0 0 8.33333%;
|
||||
max-width: 8.33333%;
|
||||
}
|
||||
.col-sm-3 {
|
||||
flex: 0 0 12.5%;
|
||||
max-width: 12.5%;
|
||||
}
|
||||
.col-sm-4 {
|
||||
flex: 0 0 16.66667%;
|
||||
max-width: 16.66667%;
|
||||
}
|
||||
.col-sm-5 {
|
||||
flex: 0 0 20.83333%;
|
||||
max-width: 20.83333%;
|
||||
}
|
||||
.col-sm-6 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
.col-sm-7 {
|
||||
flex: 0 0 29.16667%;
|
||||
max-width: 29.16667%;
|
||||
}
|
||||
.col-sm-8 {
|
||||
flex: 0 0 33.33333%;
|
||||
max-width: 33.33333%;
|
||||
}
|
||||
.col-sm-9 {
|
||||
flex: 0 0 37.5%;
|
||||
max-width: 37.5%;
|
||||
}
|
||||
.col-sm-10 {
|
||||
flex: 0 0 41.66667%;
|
||||
max-width: 41.66667%;
|
||||
}
|
||||
.col-sm-11 {
|
||||
flex: 0 0 45.83333%;
|
||||
max-width: 45.83333%;
|
||||
}
|
||||
.col-sm-12 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
.col-sm-13 {
|
||||
flex: 0 0 54.16667%;
|
||||
max-width: 54.16667%;
|
||||
}
|
||||
.col-sm-14 {
|
||||
flex: 0 0 58.33333%;
|
||||
max-width: 58.33333%;
|
||||
}
|
||||
.col-sm-15 {
|
||||
flex: 0 0 62.5%;
|
||||
max-width: 62.5%;
|
||||
}
|
||||
.col-sm-16 {
|
||||
flex: 0 0 66.66667%;
|
||||
max-width: 66.66667%;
|
||||
}
|
||||
.col-sm-17 {
|
||||
flex: 0 0 70.83333%;
|
||||
max-width: 70.83333%;
|
||||
}
|
||||
.col-sm-18 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
.col-sm-19 {
|
||||
flex: 0 0 79.16667%;
|
||||
max-width: 79.16667%;
|
||||
}
|
||||
.col-sm-20 {
|
||||
flex: 0 0 83.33333%;
|
||||
max-width: 83.33333%;
|
||||
}
|
||||
.col-sm-21 {
|
||||
flex: 0 0 87.5%;
|
||||
max-width: 87.5%;
|
||||
}
|
||||
.col-sm-22 {
|
||||
flex: 0 0 91.66667%;
|
||||
max-width: 91.66667%;
|
||||
}
|
||||
.col-sm-23 {
|
||||
flex: 0 0 95.83333%;
|
||||
max-width: 95.83333%;
|
||||
}
|
||||
.col-sm-24 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* col-md */
|
||||
@media (min-width: 768px) {
|
||||
.col-md-1 {
|
||||
flex: 0 0 4.16667%;
|
||||
max-width: 4.16667%;
|
||||
}
|
||||
.col-md-2 {
|
||||
flex: 0 0 8.33333%;
|
||||
max-width: 8.33333%;
|
||||
}
|
||||
.col-md-3 {
|
||||
flex: 0 0 12.5%;
|
||||
max-width: 12.5%;
|
||||
}
|
||||
.col-md-4 {
|
||||
flex: 0 0 16.66667%;
|
||||
max-width: 16.66667%;
|
||||
}
|
||||
.col-md-5 {
|
||||
flex: 0 0 20.83333%;
|
||||
max-width: 20.83333%;
|
||||
}
|
||||
.col-md-6 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
.col-md-7 {
|
||||
flex: 0 0 29.16667%;
|
||||
max-width: 29.16667%;
|
||||
}
|
||||
.col-md-8 {
|
||||
flex: 0 0 33.33333%;
|
||||
max-width: 33.33333%;
|
||||
}
|
||||
.col-md-9 {
|
||||
flex: 0 0 37.5%;
|
||||
max-width: 37.5%;
|
||||
}
|
||||
.col-md-10 {
|
||||
flex: 0 0 41.66667%;
|
||||
max-width: 41.66667%;
|
||||
}
|
||||
.col-md-11 {
|
||||
flex: 0 0 45.83333%;
|
||||
max-width: 45.83333%;
|
||||
}
|
||||
.col-md-12 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
.col-md-13 {
|
||||
flex: 0 0 54.16667%;
|
||||
max-width: 54.16667%;
|
||||
}
|
||||
.col-md-14 {
|
||||
flex: 0 0 58.33333%;
|
||||
max-width: 58.33333%;
|
||||
}
|
||||
.col-md-15 {
|
||||
flex: 0 0 62.5%;
|
||||
max-width: 62.5%;
|
||||
}
|
||||
.col-md-16 {
|
||||
flex: 0 0 66.66667%;
|
||||
max-width: 66.66667%;
|
||||
}
|
||||
.col-md-17 {
|
||||
flex: 0 0 70.83333%;
|
||||
max-width: 70.83333%;
|
||||
}
|
||||
.col-md-18 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
.col-md-19 {
|
||||
flex: 0 0 79.16667%;
|
||||
max-width: 79.16667%;
|
||||
}
|
||||
.col-md-20 {
|
||||
flex: 0 0 83.33333%;
|
||||
max-width: 83.33333%;
|
||||
}
|
||||
.col-md-21 {
|
||||
flex: 0 0 87.5%;
|
||||
max-width: 87.5%;
|
||||
}
|
||||
.col-md-22 {
|
||||
flex: 0 0 91.66667%;
|
||||
max-width: 91.66667%;
|
||||
}
|
||||
.col-md-23 {
|
||||
flex: 0 0 95.83333%;
|
||||
max-width: 95.83333%;
|
||||
}
|
||||
.col-md-24 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* col-lg */
|
||||
@media (min-width: 992px) {
|
||||
.col-lg-1 {
|
||||
flex: 0 0 4.16667%;
|
||||
max-width: 4.16667%;
|
||||
}
|
||||
.col-lg-2 {
|
||||
flex: 0 0 8.33333%;
|
||||
max-width: 8.33333%;
|
||||
}
|
||||
.col-lg-3 {
|
||||
flex: 0 0 12.5%;
|
||||
max-width: 12.5%;
|
||||
}
|
||||
.col-lg-4 {
|
||||
flex: 0 0 16.66667%;
|
||||
max-width: 16.66667%;
|
||||
}
|
||||
.col-lg-5 {
|
||||
flex: 0 0 20.83333%;
|
||||
max-width: 20.83333%;
|
||||
}
|
||||
.col-lg-6 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
.col-lg-7 {
|
||||
flex: 0 0 29.16667%;
|
||||
max-width: 29.16667%;
|
||||
}
|
||||
.col-lg-8 {
|
||||
flex: 0 0 33.33333%;
|
||||
max-width: 33.33333%;
|
||||
}
|
||||
.col-lg-9 {
|
||||
flex: 0 0 37.5%;
|
||||
max-width: 37.5%;
|
||||
}
|
||||
.col-lg-10 {
|
||||
flex: 0 0 41.66667%;
|
||||
max-width: 41.66667%;
|
||||
}
|
||||
.col-lg-11 {
|
||||
flex: 0 0 45.83333%;
|
||||
max-width: 45.83333%;
|
||||
}
|
||||
.col-lg-12 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
.col-lg-13 {
|
||||
flex: 0 0 54.16667%;
|
||||
max-width: 54.16667%;
|
||||
}
|
||||
.col-lg-14 {
|
||||
flex: 0 0 58.33333%;
|
||||
max-width: 58.33333%;
|
||||
}
|
||||
.col-lg-15 {
|
||||
flex: 0 0 62.5%;
|
||||
max-width: 62.5%;
|
||||
}
|
||||
.col-lg-16 {
|
||||
flex: 0 0 66.66667%;
|
||||
max-width: 66.66667%;
|
||||
}
|
||||
.col-lg-17 {
|
||||
flex: 0 0 70.83333%;
|
||||
max-width: 70.83333%;
|
||||
}
|
||||
.col-lg-18 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
.col-lg-19 {
|
||||
flex: 0 0 79.16667%;
|
||||
max-width: 79.16667%;
|
||||
}
|
||||
.col-lg-20 {
|
||||
flex: 0 0 83.33333%;
|
||||
max-width: 83.33333%;
|
||||
}
|
||||
.col-lg-21 {
|
||||
flex: 0 0 87.5%;
|
||||
max-width: 87.5%;
|
||||
}
|
||||
.col-lg-22 {
|
||||
flex: 0 0 91.66667%;
|
||||
max-width: 91.66667%;
|
||||
}
|
||||
.col-lg-23 {
|
||||
flex: 0 0 95.83333%;
|
||||
max-width: 95.83333%;
|
||||
}
|
||||
.col-lg-24 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* col-xl */
|
||||
@media (min-width: 1200px) {
|
||||
.col-xl-1 {
|
||||
flex: 0 0 4.16667%;
|
||||
max-width: 4.16667%;
|
||||
}
|
||||
.col-xl-2 {
|
||||
flex: 0 0 8.33333%;
|
||||
max-width: 8.33333%;
|
||||
}
|
||||
.col-xl-3 {
|
||||
flex: 0 0 12.5%;
|
||||
max-width: 12.5%;
|
||||
}
|
||||
.col-xl-4 {
|
||||
flex: 0 0 16.66667%;
|
||||
max-width: 16.66667%;
|
||||
}
|
||||
.col-xl-5 {
|
||||
flex: 0 0 20.83333%;
|
||||
max-width: 20.83333%;
|
||||
}
|
||||
.col-xl-6 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
.col-xl-7 {
|
||||
flex: 0 0 29.16667%;
|
||||
max-width: 29.16667%;
|
||||
}
|
||||
.col-xl-8 {
|
||||
flex: 0 0 33.33333%;
|
||||
max-width: 33.33333%;
|
||||
}
|
||||
.col-xl-9 {
|
||||
flex: 0 0 37.5%;
|
||||
max-width: 37.5%;
|
||||
}
|
||||
.col-xl-10 {
|
||||
flex: 0 0 41.66667%;
|
||||
max-width: 41.66667%;
|
||||
}
|
||||
.col-xl-11 {
|
||||
flex: 0 0 45.83333%;
|
||||
max-width: 45.83333%;
|
||||
}
|
||||
.col-xl-12 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
.col-xl-13 {
|
||||
flex: 0 0 54.16667%;
|
||||
max-width: 54.16667%;
|
||||
}
|
||||
.col-xl-14 {
|
||||
flex: 0 0 58.33333%;
|
||||
max-width: 58.33333%;
|
||||
}
|
||||
.col-xl-15 {
|
||||
flex: 0 0 62.5%;
|
||||
max-width: 62.5%;
|
||||
}
|
||||
.col-xl-16 {
|
||||
flex: 0 0 66.66667%;
|
||||
max-width: 66.66667%;
|
||||
}
|
||||
.col-xl-17 {
|
||||
flex: 0 0 70.83333%;
|
||||
max-width: 70.83333%;
|
||||
}
|
||||
.col-xl-18 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
.col-xl-19 {
|
||||
flex: 0 0 79.16667%;
|
||||
max-width: 79.16667%;
|
||||
}
|
||||
.col-xl-20 {
|
||||
flex: 0 0 83.33333%;
|
||||
max-width: 83.33333%;
|
||||
}
|
||||
.col-xl-21 {
|
||||
flex: 0 0 87.5%;
|
||||
max-width: 87.5%;
|
||||
}
|
||||
.col-xl-22 {
|
||||
flex: 0 0 91.66667%;
|
||||
max-width: 91.66667%;
|
||||
}
|
||||
.col-xl-23 {
|
||||
flex: 0 0 95.83333%;
|
||||
max-width: 95.83333%;
|
||||
}
|
||||
.col-xl-24 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
349
website/public/css/normalize.css
vendored
Normal file
349
website/public/css/normalize.css
vendored
Normal file
@ -0,0 +1,349 @@
|
||||
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
|
||||
|
||||
/* Document
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Correct the line height in all browsers.
|
||||
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
||||
*/
|
||||
|
||||
html {
|
||||
line-height: 1.15; /* 1 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/* Sections
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the margin in all browsers.
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render the `main` element consistently in IE.
|
||||
*/
|
||||
|
||||
main {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the font size and margin on `h1` elements within `section` and
|
||||
* `article` contexts in Chrome, Firefox, and Safari.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in Firefox.
|
||||
* 2. Show the overflow in Edge and IE.
|
||||
*/
|
||||
|
||||
hr {
|
||||
box-sizing: content-box; /* 1 */
|
||||
height: 0; /* 1 */
|
||||
overflow: visible; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the gray background on active links in IE 10.
|
||||
*/
|
||||
|
||||
a {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Remove the bottom border in Chrome 57-
|
||||
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: none; /* 1 */
|
||||
text-decoration: underline; /* 2 */
|
||||
text-decoration: underline dotted; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||
* all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the border on images inside links in IE 10.
|
||||
*/
|
||||
|
||||
img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Change the font styles in all browsers.
|
||||
* 2. Remove the margin in Firefox and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit; /* 1 */
|
||||
font-size: 100%; /* 1 */
|
||||
line-height: 1.15; /* 1 */
|
||||
margin: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the overflow in IE.
|
||||
* 1. Show the overflow in Edge.
|
||||
*/
|
||||
|
||||
button,
|
||||
input { /* 1 */
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||
* 1. Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select { /* 1 */
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner border and padding in Firefox.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Restore the focus styles unset by the previous rule.
|
||||
*/
|
||||
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the padding in Firefox.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
padding: 0.35em 0.75em 0.625em;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
* 3. Remove the padding so developers are not caught out when they zero out
|
||||
* `fieldset` elements in all browsers.
|
||||
*/
|
||||
|
||||
legend {
|
||||
box-sizing: border-box; /* 1 */
|
||||
color: inherit; /* 2 */
|
||||
display: table; /* 1 */
|
||||
max-width: 100%; /* 1 */
|
||||
padding: 0; /* 3 */
|
||||
white-space: normal; /* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
|
||||
progress {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the default vertical scrollbar in IE 10+.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in IE 10.
|
||||
* 2. Remove the padding in IE 10.
|
||||
*/
|
||||
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||
*/
|
||||
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
outline-offset: -2px; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner padding in Chrome and Safari on macOS.
|
||||
*/
|
||||
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/* Interactive
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Add the correct display in Edge, IE 10+, and Firefox.
|
||||
*/
|
||||
|
||||
details {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Add the correct display in all browsers.
|
||||
*/
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
/* Misc
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10+.
|
||||
*/
|
||||
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10.
|
||||
*/
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
81
website/public/css/nprogress.css
Normal file
81
website/public/css/nprogress.css
Normal file
@ -0,0 +1,81 @@
|
||||
/* Make clicks pass-through */
|
||||
#nprogress {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#nprogress .bar {
|
||||
background: var(--important);
|
||||
|
||||
position: fixed;
|
||||
z-index: 1031;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
}
|
||||
|
||||
/* Fancy blur effect */
|
||||
#nprogress .peg {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
width: 100px;
|
||||
height: 100%;
|
||||
box-shadow: 0 0 10px var(--important), 0 0 5px var(--important);
|
||||
opacity: 1;
|
||||
|
||||
-webkit-transform: rotate(3deg) translate(0px, -4px);
|
||||
-ms-transform: rotate(3deg) translate(0px, -4px);
|
||||
transform: rotate(3deg) translate(0px, -4px);
|
||||
}
|
||||
|
||||
/* Remove these to get rid of the spinner */
|
||||
#nprogress .spinner {
|
||||
display: block;
|
||||
position: fixed;
|
||||
z-index: 1031;
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
}
|
||||
|
||||
#nprogress .spinner-icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
box-sizing: border-box;
|
||||
|
||||
border: solid 2px transparent;
|
||||
border-top-color: var(--important);
|
||||
border-left-color: var(--important);
|
||||
border-radius: 50%;
|
||||
|
||||
-webkit-animation: nprogress-spinner 400ms linear infinite;
|
||||
animation: nprogress-spinner 400ms linear infinite;
|
||||
}
|
||||
|
||||
.nprogress-custom-parent {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nprogress-custom-parent #nprogress .spinner,
|
||||
.nprogress-custom-parent #nprogress .bar {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
@-webkit-keyframes nprogress-spinner {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes nprogress-spinner {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
7
website/public/css/pages/404.css
Normal file
7
website/public/css/pages/404.css
Normal file
@ -0,0 +1,7 @@
|
||||
.Error404__container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-width: 100%;
|
||||
}
|
||||
28
website/public/css/pages/functions.css
Normal file
28
website/public/css/pages/functions.css
Normal file
@ -0,0 +1,28 @@
|
||||
.Functions__title {
|
||||
padding: 20px 0 20px 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.Functions__search-container {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.Functions__select-option {
|
||||
color: rgb(221, 220, 220);
|
||||
}
|
||||
.Functions__search-input {
|
||||
width: 40%;
|
||||
}
|
||||
/* col-sm */
|
||||
@media (max-width: 576px) {
|
||||
.Functions__search-container {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.Functions__select {
|
||||
width: 90%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.Functions__search-input {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
217
website/public/fonts/Montserrat/Montserrat.css
Normal file
217
website/public/fonts/Montserrat/Montserrat.css
Normal file
@ -0,0 +1,217 @@
|
||||
/* montserrat-100normal - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 100;
|
||||
src: local("Montserrat Thin "), local("Montserrat-Thin"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-100.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */ url("/fonts/Montserrat/files/montserrat-latin-100.woff")
|
||||
format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-100italic - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-weight: 100;
|
||||
src: local("Montserrat Thin italic"), local("Montserrat-Thinitalic"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-100italic.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("/fonts/Montserrat/files/montserrat-latin-100italic.woff") format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-200normal - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 200;
|
||||
src: local("Montserrat Extra Light "), local("Montserrat-Extra Light"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-200.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */ url("/fonts/Montserrat/files/montserrat-latin-200.woff")
|
||||
format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-200italic - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-weight: 200;
|
||||
src: local("Montserrat Extra Light italic"),
|
||||
local("Montserrat-Extra Lightitalic"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-200italic.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("/fonts/Montserrat/files/montserrat-latin-200italic.woff") format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-300normal - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 300;
|
||||
src: local("Montserrat Light "), local("Montserrat-Light"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-300.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */ url("/fonts/Montserrat/files/montserrat-latin-300.woff")
|
||||
format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-300italic - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-weight: 300;
|
||||
src: local("Montserrat Light italic"), local("Montserrat-Lightitalic"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-300italic.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("/fonts/Montserrat/files/montserrat-latin-300italic.woff") format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-400normal - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 400;
|
||||
src: local("Montserrat Regular "), local("Montserrat-Regular"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-400.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */ url("/fonts/Montserrat/files/montserrat-latin-400.woff")
|
||||
format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-400italic - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-weight: 400;
|
||||
src: local("Montserrat Regular italic"), local("Montserrat-Regularitalic"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-400italic.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("/fonts/Montserrat/files/montserrat-latin-400italic.woff") format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-500normal - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 500;
|
||||
src: local("Montserrat Medium "), local("Montserrat-Medium"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-500.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */ url("/fonts/Montserrat/files/montserrat-latin-500.woff")
|
||||
format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-500italic - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-weight: 500;
|
||||
src: local("Montserrat Medium italic"), local("Montserrat-Mediumitalic"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-500italic.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("/fonts/Montserrat/files/montserrat-latin-500italic.woff") format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-600normal - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 600;
|
||||
src: local("Montserrat SemiBold "), local("Montserrat-SemiBold"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-600.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */ url("/fonts/Montserrat/files/montserrat-latin-600.woff")
|
||||
format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-600italic - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-weight: 600;
|
||||
src: local("Montserrat SemiBold italic"), local("Montserrat-SemiBolditalic"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-600italic.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("/fonts/Montserrat/files/montserrat-latin-600italic.woff") format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-700normal - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 700;
|
||||
src: local("Montserrat Bold "), local("Montserrat-Bold"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-700.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */ url("/fonts/Montserrat/files/montserrat-latin-700.woff")
|
||||
format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-700italic - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-weight: 700;
|
||||
src: local("Montserrat Bold italic"), local("Montserrat-Bolditalic"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-700italic.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("/fonts/Montserrat/files/montserrat-latin-700italic.woff") format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-800normal - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 800;
|
||||
src: local("Montserrat ExtraBold "), local("Montserrat-ExtraBold"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-800.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */ url("/fonts/Montserrat/files/montserrat-latin-800.woff")
|
||||
format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-800italic - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-weight: 800;
|
||||
src: local("Montserrat ExtraBold italic"),
|
||||
local("Montserrat-ExtraBolditalic"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-800italic.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("/fonts/Montserrat/files/montserrat-latin-800italic.woff") format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-900normal - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-weight: 900;
|
||||
src: local("Montserrat Black "), local("Montserrat-Black"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-900.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */ url("/fonts/Montserrat/files/montserrat-latin-900.woff")
|
||||
format("woff"); /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* montserrat-900italic - latin */
|
||||
@font-face {
|
||||
font-family: "Montserrat";
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-weight: 900;
|
||||
src: local("Montserrat Black italic"), local("Montserrat-Blackitalic"),
|
||||
url("/fonts/Montserrat/files/montserrat-latin-900italic.woff2") format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("/fonts/Montserrat/files/montserrat-latin-900italic.woff") format("woff"); /* Modern Browsers */
|
||||
}
|
||||
BIN
website/public/fonts/Montserrat/files/montserrat-latin-100.woff
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-100.woff
Normal file
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-100.woff2
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-100.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-200.woff
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-200.woff
Normal file
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-200.woff2
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-200.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-300.woff
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-300.woff
Normal file
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-300.woff2
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-300.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-400.woff
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-400.woff
Normal file
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-400.woff2
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-400.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-500.woff
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-500.woff
Normal file
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-500.woff2
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-500.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-600.woff
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-600.woff
Normal file
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-600.woff2
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-600.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-700.woff
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-700.woff
Normal file
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-700.woff2
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-700.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-800.woff
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-800.woff
Normal file
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-800.woff2
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-800.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-900.woff
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-900.woff
Normal file
Binary file not shown.
BIN
website/public/fonts/Montserrat/files/montserrat-latin-900.woff2
Normal file
BIN
website/public/fonts/Montserrat/files/montserrat-latin-900.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
website/public/images/FunctionProject_brand-logo.png
Normal file
BIN
website/public/images/FunctionProject_brand-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
website/public/images/FunctionProject_icon.png
Normal file
BIN
website/public/images/FunctionProject_icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
BIN
website/public/images/FunctionProject_icon_small.png
Normal file
BIN
website/public/images/FunctionProject_icon_small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
BIN
website/public/images/error404.png
Normal file
BIN
website/public/images/error404.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 168 KiB |
4
website/public/js/preloader.js
Normal file
4
website/public/js/preloader.js
Normal file
@ -0,0 +1,4 @@
|
||||
window.addEventListener('load', () => {
|
||||
document.querySelector('.isLoading').classList.remove('isLoading');
|
||||
document.getElementById('preloader').remove();
|
||||
});
|
||||
Reference in New Issue
Block a user