diff --git a/website/.dockerignore b/website/.dockerignore index dd87e2d..6968f9c 100644 --- a/website/.dockerignore +++ b/website/.dockerignore @@ -1,2 +1,4 @@ node_modules build +dist +.next diff --git a/website/.env.example b/website/.env.example index ff27552..1bbc0e9 100644 --- a/website/.env.example +++ b/website/.env.example @@ -1,3 +1,3 @@ COMPOSE_PROJECT_NAME="function.divlo.fr-website" -NEXT_PUBLIC_API_URL = "http://localhost:8080" +NEXT_PUBLIC_API_URL="http://localhost:8080" CONTAINER_API_URL="http://functionproject-api:8080" diff --git a/website/components/Footer.jsx b/website/components/Footer.jsx new file mode 100644 index 0000000..24c257c --- /dev/null +++ b/website/components/Footer.jsx @@ -0,0 +1,33 @@ +import Link from 'next/link' + +export default function Footer() { + return ( + <> + + + + + ) +} diff --git a/website/components/Footer/Footer.css b/website/components/Footer/Footer.css deleted file mode 100644 index cbc781c..0000000 --- a/website/components/Footer/Footer.css +++ /dev/null @@ -1,10 +0,0 @@ -.footer { - border-top: var(--border-header-footer); - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; -} -.footer-text { - line-height: 2.5; -} diff --git a/website/components/Footer/Footer.jsx b/website/components/Footer/Footer.jsx deleted file mode 100644 index 3992445..0000000 --- a/website/components/Footer/Footer.jsx +++ /dev/null @@ -1,19 +0,0 @@ -import Link from 'next/link' -import './Footer.css' - -export default function Footer () { - return ( - - ) -} diff --git a/website/components/FunctionAdmin/AddEditFunction.jsx b/website/components/FunctionAdmin/AddEditFunction.jsx index 9fba0b4..d96ca8f 100644 --- a/website/components/FunctionAdmin/AddEditFunction.jsx +++ b/website/components/FunctionAdmin/AddEditFunction.jsx @@ -3,7 +3,6 @@ import htmlParser from 'html-react-parser' import Loader from '../Loader' import useAPI from '../../hooks/useAPI' import api from '../../utils/api' -import '../../public/css/pages/admin.css' const AddEditFunction = props => { const [, categories] = useAPI('/categories') diff --git a/website/components/FunctionAdmin/EditArticleFunction.jsx b/website/components/FunctionAdmin/EditArticleFunction.jsx index f8e4c81..58bcee9 100644 --- a/website/components/FunctionAdmin/EditArticleFunction.jsx +++ b/website/components/FunctionAdmin/EditArticleFunction.jsx @@ -3,8 +3,6 @@ import dynamic from 'next/dynamic' import { complex } from '../../utils/sunEditorConfig' import api from '../../utils/api' import FunctionArticle from '../FunctionPage/FunctionArticle' -import 'notyf/notyf.min.css' -import '../../public/css/suneditor.min.css' const SunEditor = dynamic(() => import('suneditor-react'), { ssr: false }) diff --git a/website/components/FunctionAdmin/EditFormFunction.jsx b/website/components/FunctionAdmin/EditFormFunction.jsx index 4e82df3..2fc3757 100644 --- a/website/components/FunctionAdmin/EditFormFunction.jsx +++ b/website/components/FunctionAdmin/EditFormFunction.jsx @@ -1,6 +1,5 @@ import { useState } from 'react' import api from '../../utils/api' -import 'notyf/notyf.min.css' const EditFormFunction = props => { const [inputsArray, setInputsArray] = useState( diff --git a/website/components/FunctionCard/FunctionCard.css b/website/components/FunctionCard/FunctionCard.css deleted file mode 100644 index 2fb3cb4..0000000 --- a/website/components/FunctionCard/FunctionCard.css +++ /dev/null @@ -1,67 +0,0 @@ -.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, 0.25); - border: 1px solid black; - border-radius: 1rem; - margin: 0 0 50px 0; - cursor: pointer; - transition: all 0.3s; - color: var(--text-color); - text-decoration: none !important; -} -.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; -} diff --git a/website/components/FunctionCard/FunctionCard.jsx b/website/components/FunctionCard/FunctionCard.jsx index 365c6c1..1d082c1 100644 --- a/website/components/FunctionCard/FunctionCard.jsx +++ b/website/components/FunctionCard/FunctionCard.jsx @@ -3,7 +3,6 @@ import { useState, forwardRef, memo } from 'react' import date from 'date-and-time' import Loader from '../Loader' import { API_URL } from '../../utils/api' -import './FunctionCard.css' const FunctionCard = memo( forwardRef((props, ref) => { @@ -13,66 +12,138 @@ const FunctionCard = memo( setIsLoading(false) } - const handleError = event => { + const handleError = (event) => { event.target.src = API_URL + '/images/functions/default.png' } const isFormOrArticle = props.type === 'form' || props.type === 'article' return ( - - {/* FunctionCard a une hauteur pendant chargement */} - + - {isLoading && } - -
-
- {props.title} -

{props.title}

-

- {props.description} -

+ {isLoading && } + +
+
+ {props.title} +

{props.title}

+

+ {props.description} +

+
+
+

+ {props.categorie.name} +

+

+ {date.format(new Date(props.createdAt), 'DD/MM/YYYY', false)} +

+
-
-

- {props.categorie.name} -

-

- {date.format(new Date(props.createdAt), 'DD/MM/YYYY', false)} -

-
-
- - + + + + + ) }) ) diff --git a/website/components/FunctionPage/CommentCard/CommentCard.jsx b/website/components/FunctionPage/CommentCard/CommentCard.jsx index 71bb9ad..93cbbdb 100644 --- a/website/components/FunctionPage/CommentCard/CommentCard.jsx +++ b/website/components/FunctionPage/CommentCard/CommentCard.jsx @@ -6,7 +6,6 @@ import { UserContext } from '../../../contexts/UserContext' import ReactMarkdown from 'react-markdown' import CodeBlock from '../../CodeBlock' import api, { API_URL } from '../../../utils/api' -import './CommentCard.css' const CommentCard = forwardRef((props, ref) => { const { isAuth, user } = useContext(UserContext) diff --git a/website/components/FunctionPage/FunctionComments/FunctionComments.jsx b/website/components/FunctionPage/FunctionComments/FunctionComments.jsx index 1c5f0ae..870aff1 100644 --- a/website/components/FunctionPage/FunctionComments/FunctionComments.jsx +++ b/website/components/FunctionPage/FunctionComments/FunctionComments.jsx @@ -4,7 +4,6 @@ import { UserContext } from '../../../contexts/UserContext' import CommentCard from '../CommentCard/CommentCard' import Loader from '../../Loader' import api from '../../../utils/api' -import './FunctionComments.css' const FunctionComments = ({ functionId }) => { // State pour poster un commentaire diff --git a/website/components/FunctionPage/FunctionComponentTop.jsx b/website/components/FunctionPage/FunctionComponentTop.jsx index be05655..0979802 100644 --- a/website/components/FunctionPage/FunctionComponentTop.jsx +++ b/website/components/FunctionPage/FunctionComponentTop.jsx @@ -6,7 +6,6 @@ import { faStar as farStar } from '@fortawesome/free-regular-svg-icons' import date from 'date-and-time' import { UserContext } from '../../contexts/UserContext' import api, { API_URL } from '../../utils/api' -import '../FunctionCard/FunctionCard.css' const FunctionComponentTop = props => { const { isAuth, user } = useContext(UserContext) diff --git a/website/components/FunctionPage/FunctionForm.jsx b/website/components/FunctionPage/FunctionForm.jsx index a885376..ad7ddfa 100644 --- a/website/components/FunctionPage/FunctionForm.jsx +++ b/website/components/FunctionPage/FunctionForm.jsx @@ -6,7 +6,6 @@ import api from '../../utils/api' import fr from 'date-fns/locale/fr' import { registerLocale } from 'react-datepicker' import date from 'date-and-time' -import 'react-datepicker/dist/react-datepicker.css' registerLocale('fr', fr) diff --git a/website/components/FunctionPage/FunctionTabs.jsx b/website/components/FunctionPage/FunctionTabs.jsx index 4a49a78..af18b21 100644 --- a/website/components/FunctionPage/FunctionTabs.jsx +++ b/website/components/FunctionPage/FunctionTabs.jsx @@ -1,5 +1,4 @@ import SwipeableViews from 'react-swipeable-views' -import './FunctionTabs.css' const FunctionTabs = props => { return ( diff --git a/website/components/FunctionsList/FunctionsList.jsx b/website/components/FunctionsList/FunctionsList.jsx index b176947..0d6bbe5 100644 --- a/website/components/FunctionsList/FunctionsList.jsx +++ b/website/components/FunctionsList/FunctionsList.jsx @@ -4,7 +4,6 @@ import FunctionCard from '../FunctionCard/FunctionCard' import Loader from '../Loader' import api from '../../utils/api' import useAPI from '../../hooks/useAPI' -import './FunctionsList.css' let pageFunctions = 1 const FunctionsList = props => { diff --git a/website/components/HeadTag.jsx b/website/components/HeadTag.jsx index 3423750..95104f3 100644 --- a/website/components/HeadTag.jsx +++ b/website/components/HeadTag.jsx @@ -1,44 +1,49 @@ import Head from 'next/head' -const HeadTag = ({ title, image, description }) => ( - - {title || ''} - +const HeadTag = (props) => { + const { + title = 'FunctionProject', + image = '/images/FunctionProject_icon_small.png', + description = "Apprenez la programmation grâce à l'apprentissage par projet alias fonction.", + url = 'https://function.divlo.fr/' + } = props - {/* Meta Tag */} - - - - - + return ( + + {title} + - {/* Open Graph Metadata */} - - - - - - - + {/* Meta Tag */} + + + + - {/* Twitter card Metadata */} - - - - - - + {/* Open Graph Metadata */} + + + + + + + - {/* Preloader script */} -