Skip to content
Snippets Groups Projects
Commit bb77cab5 authored by zh393's avatar zh393
Browse files

added skeleton to recipe page

parent 2507504c
No related branches found
No related tags found
1 merge request!4Added Banner.mov video
import React, { useEffect, useState } from 'react'
import { useParams } from "react-router-dom"
import { Container, Typography } from '@mui/material';
import { Container, Typography, Skeleton } from '@mui/material';
import parse from 'html-react-parser';
import config from "../../config"
var axios = require("axios").default;
......@@ -29,7 +29,15 @@ function Recipe() {
}, []) // eslint-disable-line react-hooks/exhaustive-deps
let body = <Typography variant="p">Loading...</Typography>;
let body = <div>
<Skeleton sx = {{padding: 2}}variant="text" width="100%" />
<Skeleton sx = {{marginBottom: 10, padding: 2}}variant="text" width="100%" />
<Skeleton variant="text" width="100%" />
<Skeleton variant="text" width="100%" />
<Skeleton variant="text" width="100%" />
<Skeleton variant="text" width="100%" />
</div>;
if (data.length !== 0) {
let pattern = /<.+>/;
if (pattern.test(data.instructions)) {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment