fix ui
This commit is contained in:
sajjad
parent
deb6e1fbcd
commit
4c6b767736
82
package-lock.json
generated
82
package-lock.json
generated
@ -21,10 +21,13 @@
|
||||
"react-redux": "^8.1.3",
|
||||
"react-scripts": "5.0.1",
|
||||
"styled-components": "^6.1.1",
|
||||
"swiper": "^11.0.4",
|
||||
"web-vitals": "^2.1.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"react-router-dom": "^6.18.0"
|
||||
"react-router-dom": "^6.18.0",
|
||||
"sass": "^1.69.5",
|
||||
"tailwindcss": "^3.3.5"
|
||||
}
|
||||
},
|
||||
"node_modules/@aashutoshrathi/word-wrap": {
|
||||
@ -9812,6 +9815,12 @@
|
||||
"url": "https://opencollective.com/immer"
|
||||
}
|
||||
},
|
||||
"node_modules/immutable": {
|
||||
"version": "4.3.4",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.4.tgz",
|
||||
"integrity": "sha512-fsXeu4J4i6WNWSikpI88v/PcVflZz+6kMhUfIwc5SY+poQRPnaf5V7qds6SUyUN3cVxEzuCab7QIoLOQ+DQ1wA==",
|
||||
"devOptional": true
|
||||
},
|
||||
"node_modules/import-fresh": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
|
||||
@ -15950,6 +15959,23 @@
|
||||
"resolved": "https://registry.npmjs.org/sanitize.css/-/sanitize.css-13.0.0.tgz",
|
||||
"integrity": "sha512-ZRwKbh/eQ6w9vmTjkuG0Ioi3HBwPFce0O+v//ve+aOq1oeCy7jMV2qzzAlpsNuqpqCBjjriM1lbtZbF/Q8jVyA=="
|
||||
},
|
||||
"node_modules/sass": {
|
||||
"version": "1.69.5",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.69.5.tgz",
|
||||
"integrity": "sha512-qg2+UCJibLr2LCVOt3OlPhr/dqVHWOa9XtZf2OjbLs/T4VPSJ00udtgJxH3neXZm+QqX8B+3cU7RaLqp1iVfcQ==",
|
||||
"devOptional": true,
|
||||
"dependencies": {
|
||||
"chokidar": ">=3.0.0 <4.0.0",
|
||||
"immutable": "^4.0.0",
|
||||
"source-map-js": ">=0.6.2 <2.0.0"
|
||||
},
|
||||
"bin": {
|
||||
"sass": "sass.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/sass-loader": {
|
||||
"version": "12.6.0",
|
||||
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-12.6.0.tgz",
|
||||
@ -16979,6 +17005,24 @@
|
||||
"boolbase": "~1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/swiper": {
|
||||
"version": "11.0.4",
|
||||
"resolved": "https://registry.npmjs.org/swiper/-/swiper-11.0.4.tgz",
|
||||
"integrity": "sha512-qtUxILrD4aD++rpKzGrkz3IAWL92f9uTrDwjb6HaNLmPvJhZCE/83DL+9w4kIgDDJeF6QKalV47rMBN77UOVYQ==",
|
||||
"funding": [
|
||||
{
|
||||
"type": "patreon",
|
||||
"url": "https://www.patreon.com/swiperjs"
|
||||
},
|
||||
{
|
||||
"type": "open_collective",
|
||||
"url": "http://opencollective.com/swiper"
|
||||
}
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 4.7.0"
|
||||
}
|
||||
},
|
||||
"node_modules/symbol-tree": {
|
||||
"version": "3.2.4",
|
||||
"resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
|
||||
@ -17422,16 +17466,16 @@
|
||||
}
|
||||
},
|
||||
"node_modules/typescript": {
|
||||
"version": "5.2.2",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz",
|
||||
"integrity": "sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==",
|
||||
"version": "4.9.5",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz",
|
||||
"integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"tsc": "bin/tsc",
|
||||
"tsserver": "bin/tsserver"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.17"
|
||||
"node": ">=4.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/unbox-primitive": {
|
||||
@ -25549,6 +25593,12 @@
|
||||
"resolved": "https://registry.npmjs.org/immer/-/immer-9.0.21.tgz",
|
||||
"integrity": "sha512-bc4NBHqOqSfRW7POMkHd51LvClaeMXpm8dx0e8oE2GORbq5aRK7Bxl4FyzVLdGtLmvLKL7BTDBG5ACQm4HWjTA=="
|
||||
},
|
||||
"immutable": {
|
||||
"version": "4.3.4",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.4.tgz",
|
||||
"integrity": "sha512-fsXeu4J4i6WNWSikpI88v/PcVflZz+6kMhUfIwc5SY+poQRPnaf5V7qds6SUyUN3cVxEzuCab7QIoLOQ+DQ1wA==",
|
||||
"devOptional": true
|
||||
},
|
||||
"import-fresh": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
|
||||
@ -29777,6 +29827,17 @@
|
||||
"resolved": "https://registry.npmjs.org/sanitize.css/-/sanitize.css-13.0.0.tgz",
|
||||
"integrity": "sha512-ZRwKbh/eQ6w9vmTjkuG0Ioi3HBwPFce0O+v//ve+aOq1oeCy7jMV2qzzAlpsNuqpqCBjjriM1lbtZbF/Q8jVyA=="
|
||||
},
|
||||
"sass": {
|
||||
"version": "1.69.5",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.69.5.tgz",
|
||||
"integrity": "sha512-qg2+UCJibLr2LCVOt3OlPhr/dqVHWOa9XtZf2OjbLs/T4VPSJ00udtgJxH3neXZm+QqX8B+3cU7RaLqp1iVfcQ==",
|
||||
"devOptional": true,
|
||||
"requires": {
|
||||
"chokidar": ">=3.0.0 <4.0.0",
|
||||
"immutable": "^4.0.0",
|
||||
"source-map-js": ">=0.6.2 <2.0.0"
|
||||
}
|
||||
},
|
||||
"sass-loader": {
|
||||
"version": "12.6.0",
|
||||
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-12.6.0.tgz",
|
||||
@ -30562,6 +30623,11 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"swiper": {
|
||||
"version": "11.0.4",
|
||||
"resolved": "https://registry.npmjs.org/swiper/-/swiper-11.0.4.tgz",
|
||||
"integrity": "sha512-qtUxILrD4aD++rpKzGrkz3IAWL92f9uTrDwjb6HaNLmPvJhZCE/83DL+9w4kIgDDJeF6QKalV47rMBN77UOVYQ=="
|
||||
},
|
||||
"symbol-tree": {
|
||||
"version": "3.2.4",
|
||||
"resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
|
||||
@ -30888,9 +30954,9 @@
|
||||
}
|
||||
},
|
||||
"typescript": {
|
||||
"version": "5.2.2",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz",
|
||||
"integrity": "sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==",
|
||||
"version": "4.9.5",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz",
|
||||
"integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
|
||||
"peer": true
|
||||
},
|
||||
"unbox-primitive": {
|
||||
|
||||
@ -16,6 +16,7 @@
|
||||
"react-redux": "^8.1.3",
|
||||
"react-scripts": "5.0.1",
|
||||
"styled-components": "^6.1.1",
|
||||
"swiper": "^11.0.4",
|
||||
"web-vitals": "^2.1.4"
|
||||
},
|
||||
"scripts": {
|
||||
@ -43,6 +44,8 @@
|
||||
]
|
||||
},
|
||||
"devDependencies": {
|
||||
"react-router-dom": "^6.18.0"
|
||||
"react-router-dom": "^6.18.0",
|
||||
"sass": "^1.69.5",
|
||||
"tailwindcss": "^3.3.5"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
46
src/App.js
46
src/App.js
@ -1,18 +1,42 @@
|
||||
import './App.css';
|
||||
import { Outlet } from 'react-router-dom';
|
||||
import Grid from '@mui/material/Grid';
|
||||
import MainNav from './components/Global/main-nav/MainNav';
|
||||
import "./App.css";
|
||||
import { Outlet } from "react-router-dom";
|
||||
import Grid from "@mui/material/Grid";
|
||||
import MainNav from "./components/Global/main-nav/MainNav";
|
||||
import { createTheme, ThemeProvider } from "@mui/material/styles";
|
||||
|
||||
const theme = createTheme({
|
||||
palette: {
|
||||
primary: {
|
||||
main: "#0095f6",
|
||||
// light: will be calculated from palette.primary.main,
|
||||
// dark: will be calculated from palette.primary.main,
|
||||
// contrastText: will be calculated to contrast with palette.primary.main
|
||||
},
|
||||
secondary: {
|
||||
main: "#E0C2FF",
|
||||
light: "#F5EBFF",
|
||||
// dark: will be calculated from palette.secondary.main,
|
||||
contrastText: "#47008F",
|
||||
},
|
||||
black: {
|
||||
main: "#000",
|
||||
},
|
||||
},
|
||||
});
|
||||
function App() {
|
||||
return (
|
||||
<div className="App">
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={2}>
|
||||
<MainNav />
|
||||
<ThemeProvider theme={theme}>
|
||||
<div className="App">
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={1.8}>
|
||||
<MainNav />
|
||||
</Grid>
|
||||
<Grid item xs={10.2}>
|
||||
<Outlet />
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Outlet />
|
||||
</div>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -1,26 +1,163 @@
|
||||
// base
|
||||
import { Link } from "react-router-dom";
|
||||
import { useState } from "react";
|
||||
|
||||
// components
|
||||
import MainNavItem from "./MainNavItem";
|
||||
import HomeIcon from '@mui/icons-material/Home';
|
||||
import { Divider, List, IconButton } from "@mui/material";
|
||||
import MuiDrawer from "@mui/material/Drawer";
|
||||
|
||||
// Icons
|
||||
import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
|
||||
import ChevronRightIcon from "@mui/icons-material/ChevronRight";
|
||||
import HomeOutlinedIcon from "@mui/icons-material/HomeOutlined";
|
||||
import HomeSharpIcon from "@mui/icons-material/HomeSharp";
|
||||
import SearchOutlinedIcon from "@mui/icons-material/SearchOutlined";
|
||||
import SearchSharpIcon from "@mui/icons-material/SearchSharp";
|
||||
import ExploreOutlinedIcon from "@mui/icons-material/ExploreOutlined";
|
||||
import ExploreSharpIcon from "@mui/icons-material/ExploreSharp";
|
||||
import SendIcon from "@mui/icons-material/Send";
|
||||
import SendOutlinedIcon from "@mui/icons-material/SendOutlined";
|
||||
import AddBoxOutlinedIcon from "@mui/icons-material/AddBoxOutlined";
|
||||
// styles
|
||||
import { styled, useTheme, Theme, CSSObject } from "@mui/material/styles";
|
||||
|
||||
const DrawerHeader = styled("div")(({ theme }) => ({
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "flex-end",
|
||||
padding: theme.spacing(0, 1),
|
||||
// necessary for content to be below app bar
|
||||
...theme.mixins.toolbar,
|
||||
}));
|
||||
|
||||
const openedMixin = (theme: Theme): CSSObject => ({
|
||||
width: 240,
|
||||
transition: theme.transitions.create("width", {
|
||||
easing: theme.transitions.easing.sharp,
|
||||
duration: theme.transitions.duration.enteringScreen,
|
||||
}),
|
||||
overflowX: "hidden",
|
||||
});
|
||||
|
||||
const closedMixin = (theme: Theme): CSSObject => ({
|
||||
transition: theme.transitions.create("width", {
|
||||
easing: theme.transitions.easing.sharp,
|
||||
duration: theme.transitions.duration.leavingScreen,
|
||||
}),
|
||||
overflowX: "hidden",
|
||||
width: `calc(${theme.spacing(7)} + 1px)`,
|
||||
[theme.breakpoints.up("sm")]: {
|
||||
width: `calc(${theme.spacing(7)} + 1px)`,
|
||||
},
|
||||
});
|
||||
|
||||
const Drawer = styled(MuiDrawer, {
|
||||
shouldForwardProp: (prop) => prop !== "open",
|
||||
})(({ theme, open }) => ({
|
||||
width: 240,
|
||||
flexShrink: 0,
|
||||
whiteSpace: "nowrap",
|
||||
boxSizing: "border-box",
|
||||
...(open && {
|
||||
...openedMixin(theme),
|
||||
"& .MuiDrawer-paper": openedMixin(theme),
|
||||
}),
|
||||
...(!open && {
|
||||
...closedMixin(theme),
|
||||
"& .MuiDrawer-paper": closedMixin(theme),
|
||||
}),
|
||||
}));
|
||||
const MainNav = () => {
|
||||
const navItems = [
|
||||
{
|
||||
text: 'Home',
|
||||
path: '/',
|
||||
icon: HomeIcon
|
||||
}
|
||||
];
|
||||
return (
|
||||
<div>
|
||||
{
|
||||
navItems.map((navItem, i) => {
|
||||
return (
|
||||
<Link to={navItem.path} key={i}>
|
||||
<MainNavItem text={navItem.text} icon={navItem.icon} />
|
||||
</Link>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div >
|
||||
)
|
||||
const [activeItem, setActiveItem] = useState(0);
|
||||
const navItems = [
|
||||
{
|
||||
text: "Home",
|
||||
path: "/",
|
||||
icon: HomeOutlinedIcon,
|
||||
activeIcon: HomeSharpIcon,
|
||||
},
|
||||
{
|
||||
text: "Search",
|
||||
path: null,
|
||||
icon: SearchOutlinedIcon,
|
||||
activeIcon: SearchSharpIcon,
|
||||
},
|
||||
{
|
||||
text: "Explore",
|
||||
path: "/",
|
||||
icon: ExploreOutlinedIcon,
|
||||
activeIcon: ExploreSharpIcon,
|
||||
},
|
||||
{
|
||||
text: "Messages",
|
||||
path: "/messages",
|
||||
icon: SendOutlinedIcon,
|
||||
activeIcon: SendIcon,
|
||||
},
|
||||
{
|
||||
text: "Create",
|
||||
path: "/",
|
||||
icon: AddBoxOutlinedIcon,
|
||||
},
|
||||
{
|
||||
text: "Profile",
|
||||
path: "/",
|
||||
icon: SearchOutlinedIcon,
|
||||
},
|
||||
];
|
||||
const [open, setOpen] = useState(true);
|
||||
const handleListItemClick = (index) => {
|
||||
setActiveItem(index);
|
||||
if (!navItems[index].path) {
|
||||
handleDrawerClose();
|
||||
}
|
||||
};
|
||||
|
||||
const handleDrawerOpen = () => {
|
||||
setOpen(true);
|
||||
};
|
||||
|
||||
const handleDrawerClose = () => {
|
||||
setOpen(false);
|
||||
};
|
||||
return (
|
||||
<div>
|
||||
<Drawer variant="permanent" open={open}>
|
||||
<DrawerHeader>
|
||||
{open ? (
|
||||
<IconButton className="p-0" onClick={handleDrawerClose}>
|
||||
<ChevronLeftIcon />
|
||||
</IconButton>
|
||||
) : (
|
||||
<IconButton className="p-0" onClick={handleDrawerOpen}>
|
||||
<ChevronRightIcon />
|
||||
</IconButton>
|
||||
)}
|
||||
</DrawerHeader>
|
||||
<Divider />
|
||||
<List>
|
||||
{navItems.map((navItem, i) => {
|
||||
return (
|
||||
<Link to={navItem.path} key={i}>
|
||||
<MainNavItem
|
||||
onClick={(e) => {
|
||||
!navItem.path ?? e.preventDefault();
|
||||
handleListItemClick(i);
|
||||
}}
|
||||
text={navItem.text}
|
||||
icon={navItem.icon}
|
||||
activeIcon={navItem.activeIcon}
|
||||
index={i}
|
||||
activeItem={activeItem}
|
||||
open={open}
|
||||
/>
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
</List>
|
||||
</Drawer>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default MainNav;
|
||||
export default MainNav;
|
||||
|
||||
@ -1,5 +1,14 @@
|
||||
.main__nav__item {
|
||||
.main__nav__item--text span {
|
||||
font-size: 20px;
|
||||
}
|
||||
.MainNavItem {
|
||||
.MainNavItemText span {
|
||||
color: gray;
|
||||
font-size: 16px;
|
||||
}
|
||||
.MainNavItemIcon {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
.MainNavItemActive {
|
||||
.MainNavItemText span {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,16 +1,44 @@
|
||||
import { ListItemButton, ListItemText, ListItemIcon } from '@mui/material';
|
||||
import styles from './MainNav.module.scss';
|
||||
import { ListItemButton, ListItemText, ListItemIcon } from "@mui/material";
|
||||
import styled from "./MainNav.module.scss";
|
||||
|
||||
const MainNavItem = ({ text, path, icon }) => {
|
||||
const MainNavItemIcon = icon;
|
||||
return (
|
||||
<ListItemButton className={styles.main__nav__item} href={path}>
|
||||
<ListItemIcon className="main__nav__item--icon" sx={{ 'min-width': '30px' }}>
|
||||
<MainNavItemIcon fontSize="large" />
|
||||
</ListItemIcon>
|
||||
<ListItemText className="main__nav__item--text" primary={text} />
|
||||
</ListItemButton>
|
||||
);
|
||||
const MainNavItem = ({
|
||||
text,
|
||||
path,
|
||||
icon,
|
||||
index,
|
||||
onClick,
|
||||
activeItem,
|
||||
activeIcon,
|
||||
open,
|
||||
}) => {
|
||||
const MainNavItemIcon = index === activeItem ? activeIcon : icon;
|
||||
|
||||
return (
|
||||
<ListItemButton
|
||||
onClick={onClick}
|
||||
className={`${styled.MainNavItem} ${
|
||||
index === activeItem ? styled.MainNavItemActive : ""
|
||||
}`}
|
||||
href={path}
|
||||
sx={{
|
||||
minHeight: 48,
|
||||
justifyContent: open ? "initial" : "center",
|
||||
px: 2.5,
|
||||
}}
|
||||
>
|
||||
<ListItemIcon
|
||||
className={styled.MainNavItemIcon}
|
||||
sx={{
|
||||
minWidth: open ? 0 : "60px",
|
||||
mr: 1,
|
||||
justifyContent: 'center'
|
||||
}}
|
||||
>
|
||||
<MainNavItemIcon fontSize="medium" />
|
||||
</ListItemIcon>
|
||||
<ListItemText className={styled.MainNavItemText} primary={text} />
|
||||
</ListItemButton>
|
||||
);
|
||||
};
|
||||
|
||||
export default MainNavItem;
|
||||
export default MainNavItem;
|
||||
|
||||
13
src/components/Global/profile-image/ProfileImage.jsx
Normal file
13
src/components/Global/profile-image/ProfileImage.jsx
Normal file
@ -0,0 +1,13 @@
|
||||
import styled from "./ProfileImage.module.scss";
|
||||
const ProfileImage = ({ image, title, active }) => {
|
||||
return (
|
||||
<div
|
||||
className={`${styled.ImageListItem} ${
|
||||
active ? styled.ImageListItemActive : ""
|
||||
}`}
|
||||
>
|
||||
<img src={image} alt={title ? title : "image"} loading="lazy" />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default ProfileImage;
|
||||
18
src/components/Global/profile-image/ProfileImage.module.scss
Normal file
18
src/components/Global/profile-image/ProfileImage.module.scss
Normal file
@ -0,0 +1,18 @@
|
||||
.ImageListItem {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
margin: 0 auto;
|
||||
border-radius: 50%;
|
||||
&.ImageListItemActive {
|
||||
background: linear-gradient(to right, red, orange) padding-box,
|
||||
linear-gradient(to right, red, orange) border-box;
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
108
src/components/Global/slider/Slider.jsx
Normal file
108
src/components/Global/slider/Slider.jsx
Normal file
@ -0,0 +1,108 @@
|
||||
import styled from "./Slider.module.scss";
|
||||
import React from "react";
|
||||
import ArrowCircleRightTwoToneIcon from "@mui/icons-material/ArrowCircleRightTwoTone";
|
||||
import ArrowCircleLeftTwoToneIcon from "@mui/icons-material/ArrowCircleLeftTwoTone";
|
||||
import { useRef } from "react";
|
||||
// Import Swiper React components
|
||||
import { Swiper, SwiperSlide } from "swiper/react";
|
||||
|
||||
// Import Swiper styles
|
||||
import "swiper/css";
|
||||
import "swiper/css/pagination";
|
||||
import "swiper/css/navigation";
|
||||
// import required modules
|
||||
import { Navigation } from "swiper/modules";
|
||||
|
||||
const Slider = ({ body, items, sliderBodyCallBack, slidesPerView = 8 }) => {
|
||||
const swiperRef = useRef();
|
||||
return (
|
||||
<Swiper
|
||||
slidesPerView={slidesPerView}
|
||||
spaceBetween={3}
|
||||
modules={[Navigation]}
|
||||
className={styled.mySwiper}
|
||||
onBeforeInit={(swiper) => {
|
||||
swiperRef.current = swiper;
|
||||
}}
|
||||
>
|
||||
<div
|
||||
className={styled.CustomSwiperPrevButton}
|
||||
onClick={() => swiperRef.current?.slidePrev()}
|
||||
>
|
||||
{items && items.length > 1 && (
|
||||
<ArrowCircleLeftTwoToneIcon fontSize="medium" />
|
||||
)}
|
||||
</div>
|
||||
{items &&
|
||||
items.map((item, i) => (
|
||||
<SwiperSlide key={i}>
|
||||
{sliderBodyCallBack({ data: item, index: i })}
|
||||
</SwiperSlide>
|
||||
))}
|
||||
<div
|
||||
className={styled.CustomSwiperNextButton}
|
||||
onClick={() => swiperRef.current?.slideNext()}
|
||||
>
|
||||
{items && items.length > 1 && (
|
||||
<ArrowCircleRightTwoToneIcon fontSize="medium" />
|
||||
)}
|
||||
</div>
|
||||
</Swiper>
|
||||
);
|
||||
};
|
||||
|
||||
export default Slider;
|
||||
|
||||
// function Body() {
|
||||
// return null;
|
||||
// }
|
||||
|
||||
// class Slider extends React.Component {
|
||||
// static Body = Body;
|
||||
// constructor(props) {
|
||||
// super(props);
|
||||
// this.swiperRef = React.createRef(null);
|
||||
// }
|
||||
// render() {
|
||||
// // const swiperRef = useRef();
|
||||
// const { children, items, sendDataToParent, handleCallBack } = this.props;
|
||||
// const body = children;
|
||||
// return (
|
||||
// <Swiper
|
||||
// slidesPerView={8}
|
||||
// spaceBetween={3}
|
||||
// modules={[Navigation]}
|
||||
// className={styled.mySwiper}
|
||||
// onBeforeInit={(swiper) => {
|
||||
// this.swiperRef.current = swiper;
|
||||
// }}
|
||||
// >
|
||||
// <div
|
||||
// className={styled.CustomSwiperPrevButton}
|
||||
// onClick={() => this.swiperRef.current?.slidePrev()}
|
||||
// >
|
||||
// <ArrowCircleLeftTwoToneIcon fontSize="medium" />
|
||||
// </div>
|
||||
// {items &&
|
||||
// items.map((item, i) => {
|
||||
// sendDataToParent(item, i);
|
||||
// console.log(body);
|
||||
// return (
|
||||
// <SwiperSlide key={i}>
|
||||
// {body ? body.props.children : null}
|
||||
// {handleCallBack(item)}
|
||||
// </SwiperSlide>
|
||||
// );
|
||||
// })}
|
||||
// <div
|
||||
// className={styled.CustomSwiperNextButton}
|
||||
// onClick={() => this.swiperRef.current?.slideNext()}
|
||||
// >
|
||||
// <ArrowCircleRightTwoToneIcon fontSize="medium" />
|
||||
// </div>
|
||||
// </Swiper>
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
|
||||
// export default Slider;
|
||||
25
src/components/Global/slider/Slider.module.scss
Normal file
25
src/components/Global/slider/Slider.module.scss
Normal file
@ -0,0 +1,25 @@
|
||||
.ImageListItemBar {
|
||||
text-align: center;
|
||||
div {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
.mySwiper {
|
||||
position: relative;
|
||||
float: right;
|
||||
width: 100%;
|
||||
}
|
||||
.CustomSwiperPrevButton {
|
||||
position: absolute;
|
||||
bottom: 45%;
|
||||
left: 15px;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.CustomSwiperNextButton {
|
||||
position: absolute;
|
||||
bottom: 45%;
|
||||
right: 15px;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
26
src/components/Global/user-card/UserCard.jsx
Normal file
26
src/components/Global/user-card/UserCard.jsx
Normal file
@ -0,0 +1,26 @@
|
||||
// components
|
||||
import ProfileImage from "../profile-image/ProfileImage";
|
||||
import { Button } from "@mui/material";
|
||||
// styles
|
||||
import styled from "./UserCard.module.scss";
|
||||
const UserCard = ({ title, image, subTitle }) => {
|
||||
return (
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center">
|
||||
<div className={styled.UserCardImage}>
|
||||
<ProfileImage image={image} title="user profile image" />
|
||||
</div>
|
||||
<div className="ml-3">
|
||||
<div className="text-[14px] font-semibold">sajjad_talkhabi_</div>
|
||||
<div className={`${styled.UserCardSubTitle} text-sm/4 text-gray-500`}>
|
||||
followed by sajjad_talkhabi_
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Button variant="text" className="primary capitalize">
|
||||
Follow
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default UserCard;
|
||||
11
src/components/Global/user-card/UserCard.module.scss
Normal file
11
src/components/Global/user-card/UserCard.module.scss
Normal file
@ -0,0 +1,11 @@
|
||||
.UserCardImage {
|
||||
width: 2.5vw;
|
||||
height: 2.5vw;
|
||||
}
|
||||
|
||||
.UserCardSubTitle {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 160px;
|
||||
}
|
||||
117
src/components/posts/Item.jsx
Normal file
117
src/components/posts/Item.jsx
Normal file
@ -0,0 +1,117 @@
|
||||
// styles
|
||||
import styled from "./Item.module.scss";
|
||||
// components
|
||||
import Slider from "../Global/slider/Slider";
|
||||
import { TextField, Button } from "@mui/material";
|
||||
import ProfileImage from "../Global/profile-image/ProfileImage";
|
||||
|
||||
// icons
|
||||
import MoreHorizOutlinedIcon from "@mui/icons-material/MoreHorizOutlined";
|
||||
import FavoriteBorderIcon from "@mui/icons-material/FavoriteBorder";
|
||||
import FavoriteSharpIcon from "@mui/icons-material/FavoriteSharp";
|
||||
import ChatBubbleOutlineOutlinedIcon from "@mui/icons-material/ChatBubbleOutlineOutlined";
|
||||
import SendSharpIcon from "@mui/icons-material/SendSharp";
|
||||
import BookmarkBorderOutlinedIcon from "@mui/icons-material/BookmarkBorderOutlined";
|
||||
import BookmarkSharpIcon from "@mui/icons-material/BookmarkSharp";
|
||||
// colors
|
||||
import { red } from "@mui/material/colors";
|
||||
|
||||
const Post = () => {
|
||||
const posts = [
|
||||
{
|
||||
img: "data:image/jpeg;base64,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",
|
||||
},
|
||||
];
|
||||
return (
|
||||
<div className={styled.PostItem}>
|
||||
<div
|
||||
className={`${styled.PostItemHeader} flex items-center justify-between`}
|
||||
>
|
||||
<div className={`${styled.PostItemHeaderAccount} flex items-center`}>
|
||||
<div className={styled.PostItemHeaderAccountImage}>
|
||||
<ProfileImage image={posts[0].img} alt={"fad"} active={true} />
|
||||
</div>
|
||||
<div
|
||||
className={`${styled.PostItemHeaderAccountContent} flex ml-3 text-sm `}
|
||||
>
|
||||
<div className="font-semibold">sajjad_talkhabi_</div>
|
||||
<div className={styled.PostItemHeaderAccountDot}>
|
||||
<span></span>
|
||||
</div>
|
||||
<div className="text-gray-500">1h</div>
|
||||
<div className="flex items-center">
|
||||
<div className={styled.PostItemHeaderAccountDot}>
|
||||
<span></span>
|
||||
</div>
|
||||
<div className="text-sky-600 capitalize tracking-wide">
|
||||
follow
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<MoreHorizOutlinedIcon />
|
||||
</div>
|
||||
<div className={styled.PostItemBody}>
|
||||
<div className="flex">
|
||||
<Slider
|
||||
slidesPerView={1}
|
||||
items={posts}
|
||||
sliderBodyCallBack={({ data }) => (
|
||||
<img
|
||||
src={data.img}
|
||||
alt="alt"
|
||||
className="object-fit w-full rounded mt-3"
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex items-center justify-between mt-2">
|
||||
<div className="flex items-center">
|
||||
<FavoriteBorderIcon sx={{ fontSize: 30 }} />
|
||||
{/* <FavoriteSharpIcon sx={{ color: red[600], fontSize: 30 }} /> */}
|
||||
<ChatBubbleOutlineOutlinedIcon
|
||||
sx={{ fontSize: 30 }}
|
||||
className="mx-2"
|
||||
/>
|
||||
<SendSharpIcon
|
||||
sx={{
|
||||
transform: "rotate(-25deg)",
|
||||
marginTop: "-5px",
|
||||
fontSize: 30,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<BookmarkBorderOutlinedIcon sx={{ fontSize: 30 }} />
|
||||
<BookmarkSharpIcon sx={{ fontSize: 30 }} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="block text-sm font-semibold mt-4">6 likes</div>
|
||||
<div className="block text-sm font-semibold">
|
||||
sajjad_talkhabi_
|
||||
<span className="font-normal ml-3">تجربش کردی؟🥲💔</span>
|
||||
</div>
|
||||
<div className="flex items-center mb-2">
|
||||
<div className="block text-[14px] font-semibold mt-3">
|
||||
mohammadh.safa
|
||||
<span className="font-normal ml-3">اره جیب خالی😂</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center">
|
||||
<TextField
|
||||
placeholder="Add a comment"
|
||||
color="black"
|
||||
multiline
|
||||
rows={1}
|
||||
fullWidth
|
||||
maxRows={4}
|
||||
variant="standard"
|
||||
/>
|
||||
<Button variant="text">Post</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default Post;
|
||||
20
src/components/posts/Item.module.scss
Normal file
20
src/components/posts/Item.module.scss
Normal file
@ -0,0 +1,20 @@
|
||||
.PostItem {
|
||||
.PostItemHeader {
|
||||
.PostItemHeaderAccount {
|
||||
.PostItemHeaderAccountImage {
|
||||
height: 2.5vw;
|
||||
width: 2.5vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
.PostItemHeaderAccountDot {
|
||||
span {
|
||||
height: 4px;
|
||||
width: 4px;
|
||||
margin: 0 8px;
|
||||
background-color: #bbb;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,3 +1,6 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
||||
|
||||
@ -1,7 +1,97 @@
|
||||
const Dashboard = () => (
|
||||
// components
|
||||
import Slider from "../../components/Global/slider/Slider";
|
||||
import PostItem from "../../components/posts/Item";
|
||||
import ProfileImage from "../../components/Global/profile-image/ProfileImage";
|
||||
import { ImageListItemBar, ImageListItem, Grid, Divider } from "@mui/material";
|
||||
// styles
|
||||
import styled from "./Dashboard.module.scss";
|
||||
import UserCard from "../../components/Global/user-card/UserCard";
|
||||
const Dashboard = () => {
|
||||
const stories = [
|
||||
{
|
||||
img: "data:image/jpeg;base64,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",
|
||||
author: "sajjad",
|
||||
title: "story item",
|
||||
},
|
||||
{
|
||||
img: "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3N//AABEIAJ4AngMBIgACEQEDEQH/xAAbAAABBQEBAAAAAAAAAAAAAAAGAQIDBAUHAP/EADgQAAEEAQMCBAQDBgYDAAAAAAEAAgMRBAUSITFBBhNRYSIycYEUUpEHI0KhweEVFjNi0fEkU7H/xAAZAQADAQEBAAAAAAAAAAAAAAABAgMEAAX/xAAiEQACAgICAgMBAQAAAAAAAAAAAQIRAyESMTJBEyJRYUL/2gAMAwEAAhEDEQA/AByuU4JT1Xu6881C8psrwyMueQGjkkpxNIf8SagDD+FhNucfir0TRXJ0BuiHP1YZL3NjNRt6OPc+yy5Xve6x0VeNw5NUWjuonyPJu1rUUiVllzqIbuFnqVPthDSS0u7WSVTi2h7S/d9itItjEVg8daciAqSNcJmGEHY7gBLP1vrwkkIjf8JsH+H0UjR5gLQLPUnsETiKN8jiGVYCtPgLBd0QSoW7A4tbZI60lc4MaXF3Hb3QOEc9uw2TY7rX0fUmxOEMji6M8Weo/ssJjfNG5poD1TY2Pif1JCElaCnR0Tr0TFS0XL/EYoY426P4VeJFrG1Toshjkwp7ykc4bVwSF5DeqrPnF8BTPaXdVF5LfRMhaNA9UoSHqvE0EgTG1/VDjMEEH+q7qfQIaaBvuRxc8jmyrHiJ9anJfcDuslrjuu+fVa8caiRk9llzd54PReaB0oH3pOD2bbNh3oOijEhc6r4TgLMEJf8AFXI7WrjmGRgvr3FchVsaabgNJF9AAiHS9EydQftDTzV8dErkkOoNmLHgPe2Qhp3AcWoKliaY3gt5sn3XS8HwJKHNMkpr8pV7K8AxSx042T+iX5EP8LOSg7bLb3HumTuDyLBsd7XUG/s+ia7mwP5lNm/Z5j7eGvBHThB5UgrA2cwhc3d8t+5UrpPgG4A+iJNW8IS4dmMuLfoheVpxsjZO2xymjNS6Jzxyh2bPh3La2Z8buC4IhZK2QEss0gWMBr2yBx+y0MXPmhcT5h2gdCUk8duzoyCgj3TSo8eXzomyDo4eqeVGih602koFpaXHFjuo53tihe9xoNbalVXVGh+BO0tJBYUF2c+gI1KY5eQ6XpfA+irsiN9j909wAoH6pgfR9lsWkZySQlrQDfsE7Dx3Sv8AhFnslx4TkyhtmiugeH9C8gNkbG17iOjjVJMk+KLYsfNmNo+izMex8jLLvlC6n4a0kwxl8oAe4gmlBg6XcjZp2sBb8rW9B7+6I8bjgBZnJyZtUVFaLzYWX2KmEYroFFG410UgceqrEixDGPQFV5oR6BWC4n0UclkJZJBjdmHqmGyWJzS2/suUeM9EdE3zoW3RXYso8EFDetYkc0DmuHHVSi+MrKyjyjRwsyloq6T45em7n0tWdXwxBqU0Q6BxpVoIy95ZtPAtbl1Z51Uwo8PO3YjmX8rlq0sXw3bTLGetArcIWWfZWI1oXkoXilGJmg2s/WsyPHgLDIGlw6FXZ3bI3uN8NPRAWdnSzSkvO/mhvuwnxxtiSdIrvJ3H06Jg4PCcSat20+lJrDZWoibXh+Lfks7rqWjg1GOyAPC2MdrZQO6PtPmix2NdO9sbR1Lj0WPK7Z6GCNRsKsdpLR9FoQRoXb4q02EhoL3D84FgK3F4v0rvkBg/3BCMWNKSCljU8jssfE1/Cymh2PkxPH+0rQZlscAQ4G1VUiTTJi1Me1NdlMrhZmoa7iYLbnmYz6lcwpMny4+qwdSafKcCq+T410q6Mx9gAqf+ZdOzXeWH7Sehcoyi+yikjmni2Py9ZPHzi1UwWD8dEfztK0vHZMeowFv8TTz9/wC6yYHkPa8Hlo4K1R8DHPzYT6fhMxWucBbpOSSVbKr4OXHkwNLLBHUKzdrO79jIafh5XtqceQkB4QCOn/038/wlc+zxGJ3mKnMvgjujjVQ+bT8iOI/G5hApCTdNnjhlLmElrb2kq+OkSlshlwmx6eyV1iR3NOHUdqVCIc8o8xtMiy9JxZZhTG4zTdXyhSTB/wDIDWklu7gpo5LtMplw0k0HHhDHrAa4jryFqTQxCcy5R3hvyt7BP0DF8rFgjH5QrmoaRLktLYnBt9ysjds2RVRSMefIxMncIcYOY3gyE7Wj7lYeXgQTPd5D8aQgctjy7IVkeHppxkRZz3NbRbEB8jD60FJ4c8KSQ50cmpSQyY0QIawODt3Xjp6klXilXZGfJukihpsRwJ28yxOH8Ll0rw3kS5EIo3QWA3QQ+VzSd0FnaHH4mfQ9x7In8JYv4Z5iI/VTb2VSpFnWZZMOIu7AXa5brGSc3Jcdz5nk9QaaPqV1jxljfiMMRtJaHOAJb6IDy/DsM+PkxPc0Bzah29Gn1I9fdFeQO4g1jYmEx26afFkeefLbk27/AIRBg/4bJGYfw4aehvlZWneF3x5Zk1SeOWNsexrQ7f7AdOyt6NoGTDO7a9zoL4BNEBNOvTEhyvaB3xxC+N+CTfDHtB9aIpD0DntPDS4+y6D+0fBazAxXgcsfV+l/9IPOOyKFjzw40Rx2VIS+qIZIPm2M07OkgymO5q6c1GDHB7Q5vQoT0+AzZQBHF3ddUUMFNFcJMnYsSW0qZ1NJ9qY42+FSzWOLZS3kFh+H7K47gKL+qKFNbwrGcvwhDFt/eeWQPX4XEEfzWbrOlxY+NHM1ptr2WCOi0PCWQzbLp0ttNl0R9FoeJcNroHTHcJHt2uYDwSOhSye7NsaljSJdFfuLL7IsxYmPAJQPos9Na490Z6bLuaCkXY3aHZXh6OZ3mRyPjceu3kFQs8Ou4DpZXfU0iLHe2gCVM8taLPCsoqibkwdk06LDjAb8ykwG+XmMIHXqpNTyGOnaxnxP/KEmmlzphvbtddKb8in+S/rTPgAPN0sp2m4+VFtczn17j6Lc1FglYCewWXjzmHIMcrasWD2KaWmJDxMs+GbcduRMGntavYulR4bKF/dbDZAWqvky/Cg0HZz79ouN52nMawWfNbxSFcvChHlRvYC+ONoohdA1dgyMqJjhbQ/dSCcyUTZUsnq7hGHRLMkkU4IRHJvrbxtaB2VsFR8cJbTGceDyn2owlQCK5Rv9kpKY48LgETp34zvNhcWyN5aV7I8eOdiugysa5aq2/Kf16KLL4iJ6+1IOy5N8riau+oVIwUuw/LKHTOnabLeHBK3o5oPHuiXS82gASgvwrL5+jY4J5aNv6LZYXxPFHj1WeSqVG3HK42HEOftN7uFDm6o41HEbcUPieQR7geArODbXB8z273dieiNj6G6hmu0t7MuS5ARTvZV9O8b47syzGWX+Ztf9rbngiyoCCWm1gZ/htkkZMbSPcJkgNm3qHjfGhxi/gnpVKrp2rP1rH8yKNzPLJokVZWTpnhoG3Sbn89XdkUYWNFhRbBQA6IP+gVIbi6k4NLJT8Q4S5GaC3grO1GMeaZYn12PuqEsj92w3aUa0V9b1cYZFC3y21h9OnKG668r3i+WsyCL8oDuO1n+ybuaWij19VRKkYssrkKEo5KaCvBEmSE0nXahceQE5pXHCvNJrk2S0t8LgFPUt5w3hho1+qD5ODyKNozzSfJIAsIZ1DDEbg5jrsfL1KrDQkgk8GTFuDXbzCEZMAkhPqgXwlubgTNIIc2Xdz9EV4WUAACVnyr7s3YX9Eb+K1s2OY75HKoahp2pvkD8GWJuznbICbSYuQY5hyaJRBDK10fX6JLKglE/xCHFsjG0O0UgapTkazGeMbNHr/EP5Ihmcx172jjoQoP8AFHQODC+QsHTbXCrGSZWLVGMc/WJBzj5fs0N2j+ibFl+IXO8mOAbXf+54ofots6s6VuwOdXqQpsYsrdQN9T6rpNHSaooabh5zTtzpGuc7mm9AFJLs/EPcPlA6qzm5RbGXt+Y8BDGu6mMDT3tLvjktorrykStmeUqQI67nHN1md7T+7a/Y37K/A/zImu9kLOlIlJHS+iJcA3hxGq+FaGqMN2y1aUHhR2nDolCOa4F1d1MBSrN+F9qcO5QoI1ySqCS0j3dPS+UQCPaCCDyFW8pu9x2jjoaVshROFXSICxpcY8yRgoB4Urt2PL3oFR6Sd05og0aNdlrZeOHtsBQyeRsxbgexsprwD/8AURaa8PaPQoIdujPFrS0vVvJcGSGvRLQ90HDsDf8AQrw8OwytvfRPVRYGsRPhG5wtX4tWhHSk8aC7Kn+Xooujr+yQ4IhYeVck1WMg8rF1TWoo47sWuaOvWynrE7I3Vfyjouf+IWSZmeQXcMoAfZEzZX5c7pXmxdoRztUjj1bIilB+F9BwCbH3ozZ3pFKXSxG9pL3G+CKW1CC2JrT1AUbHx5FFhulNVFVbfsghQnfRMKUIBHk9l4E33UdncCphS44QrwXqVbMyfw7BQtx6Lkr0dZYklZC0ulO1oFrEGPma1qAjikeyE8uN8NH9VWyppJiS9xJJWjouWcHJieBuDjtIVeDjF/okWnLfQV6fpkOn47IIB8LepPVx7krVbHuiql4RgsB9VNH8iwNtu2enFJKkYefiFtuCx5W39kaTQtfGUPZ+I1jyRSZAaM+HJnhrY40PUq0NWyWgUoBELUrIAU4B/wCPy5eN1D6pY43yOt5Lj7pzYGtIWliwta0P6lBgQjIvKg91z3xNgvhzpckNJjldw4dnei6PN8v1WdPjRS400czA5pB4IRxz4MTLj5IBNPe6OEG+Vtw5G5jXOHBHZZG1rAWs+UHhXsQ/uWrfxUls8/oviilVF5LTYJBKdHlPBAdyFN4n6GU/0uFPBTGOD2bqTgLUmqHs/9k=",
|
||||
author: "sajjad",
|
||||
title: "story item",
|
||||
},
|
||||
{
|
||||
img: "data:image/jpeg;base64,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",
|
||||
author: "sajjad",
|
||||
title: "story item",
|
||||
},
|
||||
{
|
||||
img: "data:image/jpeg;base64,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",
|
||||
author: "sajjad",
|
||||
title: "story item",
|
||||
},
|
||||
{
|
||||
img: "data:image/jpeg;base64,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",
|
||||
author: "sajjad",
|
||||
title: "story item",
|
||||
},
|
||||
{
|
||||
img: "data:image/jpeg;base64,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",
|
||||
author: "sajjad",
|
||||
title: "story item",
|
||||
},
|
||||
{
|
||||
img: "data:image/jpeg;base64,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",
|
||||
author: "sajjad",
|
||||
title: "story item",
|
||||
},
|
||||
{
|
||||
img: "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3N//AABEIAJ4AngMBIgACEQEDEQH/xAAbAAABBQEBAAAAAAAAAAAAAAAGAQIDBAUHAP/EADgQAAEEAQMCBAQDBgYDAAAAAAEAAgMRBAUSITFBBhNRYSIycYEUUpEHI0KhweEVFjNi0fEkU7H/xAAZAQADAQEBAAAAAAAAAAAAAAABAgMEAAX/xAAiEQACAgICAgMBAQAAAAAAAAAAAQIRAyESMTJBEyJRYUL/2gAMAwEAAhEDEQA/AByuU4JT1Xu6881C8psrwyMueQGjkkpxNIf8SagDD+FhNucfir0TRXJ0BuiHP1YZL3NjNRt6OPc+yy5Xve6x0VeNw5NUWjuonyPJu1rUUiVllzqIbuFnqVPthDSS0u7WSVTi2h7S/d9itItjEVg8daciAqSNcJmGEHY7gBLP1vrwkkIjf8JsH+H0UjR5gLQLPUnsETiKN8jiGVYCtPgLBd0QSoW7A4tbZI60lc4MaXF3Hb3QOEc9uw2TY7rX0fUmxOEMji6M8Weo/ssJjfNG5poD1TY2Pif1JCElaCnR0Tr0TFS0XL/EYoY426P4VeJFrG1Toshjkwp7ykc4bVwSF5DeqrPnF8BTPaXdVF5LfRMhaNA9UoSHqvE0EgTG1/VDjMEEH+q7qfQIaaBvuRxc8jmyrHiJ9anJfcDuslrjuu+fVa8caiRk9llzd54PReaB0oH3pOD2bbNh3oOijEhc6r4TgLMEJf8AFXI7WrjmGRgvr3FchVsaabgNJF9AAiHS9EydQftDTzV8dErkkOoNmLHgPe2Qhp3AcWoKliaY3gt5sn3XS8HwJKHNMkpr8pV7K8AxSx042T+iX5EP8LOSg7bLb3HumTuDyLBsd7XUG/s+ia7mwP5lNm/Z5j7eGvBHThB5UgrA2cwhc3d8t+5UrpPgG4A+iJNW8IS4dmMuLfoheVpxsjZO2xymjNS6Jzxyh2bPh3La2Z8buC4IhZK2QEss0gWMBr2yBx+y0MXPmhcT5h2gdCUk8duzoyCgj3TSo8eXzomyDo4eqeVGih602koFpaXHFjuo53tihe9xoNbalVXVGh+BO0tJBYUF2c+gI1KY5eQ6XpfA+irsiN9j909wAoH6pgfR9lsWkZySQlrQDfsE7Dx3Sv8AhFnslx4TkyhtmiugeH9C8gNkbG17iOjjVJMk+KLYsfNmNo+izMex8jLLvlC6n4a0kwxl8oAe4gmlBg6XcjZp2sBb8rW9B7+6I8bjgBZnJyZtUVFaLzYWX2KmEYroFFG410UgceqrEixDGPQFV5oR6BWC4n0UclkJZJBjdmHqmGyWJzS2/suUeM9EdE3zoW3RXYso8EFDetYkc0DmuHHVSi+MrKyjyjRwsyloq6T45em7n0tWdXwxBqU0Q6BxpVoIy95ZtPAtbl1Z51Uwo8PO3YjmX8rlq0sXw3bTLGetArcIWWfZWI1oXkoXilGJmg2s/WsyPHgLDIGlw6FXZ3bI3uN8NPRAWdnSzSkvO/mhvuwnxxtiSdIrvJ3H06Jg4PCcSat20+lJrDZWoibXh+Lfks7rqWjg1GOyAPC2MdrZQO6PtPmix2NdO9sbR1Lj0WPK7Z6GCNRsKsdpLR9FoQRoXb4q02EhoL3D84FgK3F4v0rvkBg/3BCMWNKSCljU8jssfE1/Cymh2PkxPH+0rQZlscAQ4G1VUiTTJi1Me1NdlMrhZmoa7iYLbnmYz6lcwpMny4+qwdSafKcCq+T410q6Mx9gAqf+ZdOzXeWH7Sehcoyi+yikjmni2Py9ZPHzi1UwWD8dEfztK0vHZMeowFv8TTz9/wC6yYHkPa8Hlo4K1R8DHPzYT6fhMxWucBbpOSSVbKr4OXHkwNLLBHUKzdrO79jIafh5XtqceQkB4QCOn/038/wlc+zxGJ3mKnMvgjujjVQ+bT8iOI/G5hApCTdNnjhlLmElrb2kq+OkSlshlwmx6eyV1iR3NOHUdqVCIc8o8xtMiy9JxZZhTG4zTdXyhSTB/wDIDWklu7gpo5LtMplw0k0HHhDHrAa4jryFqTQxCcy5R3hvyt7BP0DF8rFgjH5QrmoaRLktLYnBt9ysjds2RVRSMefIxMncIcYOY3gyE7Wj7lYeXgQTPd5D8aQgctjy7IVkeHppxkRZz3NbRbEB8jD60FJ4c8KSQ50cmpSQyY0QIawODt3Xjp6klXilXZGfJukihpsRwJ28yxOH8Ll0rw3kS5EIo3QWA3QQ+VzSd0FnaHH4mfQ9x7In8JYv4Z5iI/VTb2VSpFnWZZMOIu7AXa5brGSc3Jcdz5nk9QaaPqV1jxljfiMMRtJaHOAJb6IDy/DsM+PkxPc0Bzah29Gn1I9fdFeQO4g1jYmEx26afFkeefLbk27/AIRBg/4bJGYfw4aehvlZWneF3x5Zk1SeOWNsexrQ7f7AdOyt6NoGTDO7a9zoL4BNEBNOvTEhyvaB3xxC+N+CTfDHtB9aIpD0DntPDS4+y6D+0fBazAxXgcsfV+l/9IPOOyKFjzw40Rx2VIS+qIZIPm2M07OkgymO5q6c1GDHB7Q5vQoT0+AzZQBHF3ddUUMFNFcJMnYsSW0qZ1NJ9qY42+FSzWOLZS3kFh+H7K47gKL+qKFNbwrGcvwhDFt/eeWQPX4XEEfzWbrOlxY+NHM1ptr2WCOi0PCWQzbLp0ttNl0R9FoeJcNroHTHcJHt2uYDwSOhSye7NsaljSJdFfuLL7IsxYmPAJQPos9Na490Z6bLuaCkXY3aHZXh6OZ3mRyPjceu3kFQs8Ou4DpZXfU0iLHe2gCVM8taLPCsoqibkwdk06LDjAb8ykwG+XmMIHXqpNTyGOnaxnxP/KEmmlzphvbtddKb8in+S/rTPgAPN0sp2m4+VFtczn17j6Lc1FglYCewWXjzmHIMcrasWD2KaWmJDxMs+GbcduRMGntavYulR4bKF/dbDZAWqvky/Cg0HZz79ouN52nMawWfNbxSFcvChHlRvYC+ONoohdA1dgyMqJjhbQ/dSCcyUTZUsnq7hGHRLMkkU4IRHJvrbxtaB2VsFR8cJbTGceDyn2owlQCK5Rv9kpKY48LgETp34zvNhcWyN5aV7I8eOdiugysa5aq2/Kf16KLL4iJ6+1IOy5N8riau+oVIwUuw/LKHTOnabLeHBK3o5oPHuiXS82gASgvwrL5+jY4J5aNv6LZYXxPFHj1WeSqVG3HK42HEOftN7uFDm6o41HEbcUPieQR7geArODbXB8z273dieiNj6G6hmu0t7MuS5ARTvZV9O8b47syzGWX+Ztf9rbngiyoCCWm1gZ/htkkZMbSPcJkgNm3qHjfGhxi/gnpVKrp2rP1rH8yKNzPLJokVZWTpnhoG3Sbn89XdkUYWNFhRbBQA6IP+gVIbi6k4NLJT8Q4S5GaC3grO1GMeaZYn12PuqEsj92w3aUa0V9b1cYZFC3y21h9OnKG668r3i+WsyCL8oDuO1n+ybuaWij19VRKkYssrkKEo5KaCvBEmSE0nXahceQE5pXHCvNJrk2S0t8LgFPUt5w3hho1+qD5ODyKNozzSfJIAsIZ1DDEbg5jrsfL1KrDQkgk8GTFuDXbzCEZMAkhPqgXwlubgTNIIc2Xdz9EV4WUAACVnyr7s3YX9Eb+K1s2OY75HKoahp2pvkD8GWJuznbICbSYuQY5hyaJRBDK10fX6JLKglE/xCHFsjG0O0UgapTkazGeMbNHr/EP5Ihmcx172jjoQoP8AFHQODC+QsHTbXCrGSZWLVGMc/WJBzj5fs0N2j+ibFl+IXO8mOAbXf+54ofots6s6VuwOdXqQpsYsrdQN9T6rpNHSaooabh5zTtzpGuc7mm9AFJLs/EPcPlA6qzm5RbGXt+Y8BDGu6mMDT3tLvjktorrykStmeUqQI67nHN1md7T+7a/Y37K/A/zImu9kLOlIlJHS+iJcA3hxGq+FaGqMN2y1aUHhR2nDolCOa4F1d1MBSrN+F9qcO5QoI1ySqCS0j3dPS+UQCPaCCDyFW8pu9x2jjoaVshROFXSICxpcY8yRgoB4Urt2PL3oFR6Sd05og0aNdlrZeOHtsBQyeRsxbgexsprwD/8AURaa8PaPQoIdujPFrS0vVvJcGSGvRLQ90HDsDf8AQrw8OwytvfRPVRYGsRPhG5wtX4tWhHSk8aC7Kn+Xooujr+yQ4IhYeVck1WMg8rF1TWoo47sWuaOvWynrE7I3Vfyjouf+IWSZmeQXcMoAfZEzZX5c7pXmxdoRztUjj1bIilB+F9BwCbH3ozZ3pFKXSxG9pL3G+CKW1CC2JrT1AUbHx5FFhulNVFVbfsghQnfRMKUIBHk9l4E33UdncCphS44QrwXqVbMyfw7BQtx6Lkr0dZYklZC0ulO1oFrEGPma1qAjikeyE8uN8NH9VWyppJiS9xJJWjouWcHJieBuDjtIVeDjF/okWnLfQV6fpkOn47IIB8LepPVx7krVbHuiql4RgsB9VNH8iwNtu2enFJKkYefiFtuCx5W39kaTQtfGUPZ+I1jyRSZAaM+HJnhrY40PUq0NWyWgUoBELUrIAU4B/wCPy5eN1D6pY43yOt5Lj7pzYGtIWliwta0P6lBgQjIvKg91z3xNgvhzpckNJjldw4dnei6PN8v1WdPjRS400czA5pB4IRxz4MTLj5IBNPe6OEG+Vtw5G5jXOHBHZZG1rAWs+UHhXsQ/uWrfxUls8/oviilVF5LTYJBKdHlPBAdyFN4n6GU/0uFPBTGOD2bqTgLUmqHs/9k=",
|
||||
author: "sajjad",
|
||||
title: "story item",
|
||||
},
|
||||
{
|
||||
img: "data:image/jpeg;base64,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",
|
||||
author: "sajjad",
|
||||
title: "story item",
|
||||
},
|
||||
];
|
||||
return (
|
||||
<div className="App">
|
||||
dashboard
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={8} paddingLeft={5} className="h-full">
|
||||
<div className="mt-3 flex ml-60">
|
||||
<Slider
|
||||
items={stories}
|
||||
sliderBodyCallBack={({ data }) => <StoryItem story={data} />}
|
||||
/>
|
||||
</div>
|
||||
<div className="ml-60 mr-20 px-20">
|
||||
<PostItem />
|
||||
<div className="mt-2">
|
||||
<Divider />
|
||||
</div>
|
||||
</div>
|
||||
</Grid>
|
||||
<Grid item xs={4} className="px-20">
|
||||
<div className="mt-7">
|
||||
<UserCard image={stories[0].img} />
|
||||
</div>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</div>
|
||||
);
|
||||
|
||||
);
|
||||
};
|
||||
const StoryItem = ({ story }) => {
|
||||
return (
|
||||
<ImageListItem>
|
||||
<div className={styled.StoryItemImage}>
|
||||
<ProfileImage image={story.img} tilte={story.title} active={true} />
|
||||
</div>
|
||||
<ImageListItemBar
|
||||
className={styled.ImageListItemBar}
|
||||
position="below"
|
||||
title={story.author}
|
||||
/>
|
||||
</ImageListItem>
|
||||
);
|
||||
};
|
||||
export default Dashboard;
|
||||
|
||||
27
src/views/dashboard/Dashboard.module.scss
Normal file
27
src/views/dashboard/Dashboard.module.scss
Normal file
@ -0,0 +1,27 @@
|
||||
.ImageListItem {
|
||||
position: relative;
|
||||
width: 4vw;
|
||||
height: 4vw;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
|
||||
.StoryItemImage {
|
||||
width: 4vw;
|
||||
height: 4vw;
|
||||
}
|
||||
.swiper-button-next {
|
||||
background-image: url("data:image/jpeg;base64,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");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% auto;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.swiper-button-next::after {
|
||||
display: none;
|
||||
}
|
||||
9
tailwind.config.js
Normal file
9
tailwind.config.js
Normal file
@ -0,0 +1,9 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
important: true,
|
||||
content: ["./src/**/*.{js,jsx,ts,tsx}"],
|
||||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [],
|
||||
};
|
||||
Loading…
Reference in New Issue
Block a user