Hotfix: Nom des dossiers + Ajout /functions/slug
Divlo
0
backend/.gitignore → api/.gitignore
vendored
BIN
api/assets/images/functions/calculateAge.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
api/assets/images/functions/convertCurrency.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
api/assets/images/functions/randomNumber.png
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
api/assets/images/functions/weatherRequest.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
|
Before Width: | Height: | Size: 140 KiB |
|
Before Width: | Height: | Size: 111 KiB |
|
Before Width: | Height: | Size: 76 KiB |
|
Before Width: | Height: | Size: 91 KiB |
@@ -12,10 +12,15 @@ const FunctionCard = forwardRef((props, ref) => {
|
||||
}
|
||||
|
||||
return (
|
||||
<Link href={`/functions/${props.slug}`}>
|
||||
{/* Elément à une hauteur pendant chargement */}
|
||||
<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} />
|
||||
@@ -2,7 +2,7 @@ import Head from 'next/head';
|
||||
|
||||
const HeadTag = ({ title, image, description }) => (
|
||||
<Head>
|
||||
<title>{title}</title>
|
||||
<title>{title || ""}</title>
|
||||
<link rel="icon" type="image/png" href={image} />
|
||||
|
||||
{/* Meta Tag */}
|
||||
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;
|
||||
@@ -1,11 +1,11 @@
|
||||
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';
|
||||
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 = () => {
|
||||
|
||||