-
Notifications
You must be signed in to change notification settings - Fork 10
/
AdvertWidget.jsx
37 lines (34 loc) · 1.24 KB
/
AdvertWidget.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
import { Typography, useTheme } from "@mui/material";
import FlexBetween from "components/FlexBetween";
import WidgetWrapper from "components/WidgetWrapper";
const AdvertWidget = () => {
const { palette } = useTheme();
const dark = palette.neutral.dark;
const main = palette.neutral.main;
const medium = palette.neutral.medium;
return (
<WidgetWrapper>
<FlexBetween>
<Typography color={dark} variant="h5" fontWeight="500">
Sponsored
</Typography>
<Typography color={medium}>Create Ad</Typography>
</FlexBetween>
<img
width="100%"
height="auto"
alt="advert"
src="https://via.placeholder.com/350x150"
style={{ borderRadius: "0.75rem", margin: "0.75rem 0" }}
/>
<FlexBetween>
<Typography color={main}>ADSPACE</Typography>
<Typography color={medium}>ADSPACE.DEMO</Typography>
</FlexBetween>
<Typography color={medium} m="0.5rem 0">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Commodi cumque, fugit sequi nulla, fugiat, repellat velit aut nesciunt enim expedita non obcaecati eius dolores placeat atque. Facilis libero quae error!
</Typography>
</WidgetWrapper>
);
};
export default AdvertWidget;