Commit 392719eb authored by Thivanka Saparamadu's avatar Thivanka Saparamadu

Updated

parents 4b0c6de7 b93ecf9e
File added
This diff is collapsed.
......@@ -3,6 +3,7 @@
"version": "0.1.0",
"private": true,
"dependencies": {
"@amcharts/amcharts4": "^4.10.38",
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
"@mui/icons-material": "^5.14.6",
......@@ -12,9 +13,11 @@
"@testing-library/user-event": "^13.5.0",
"axios": "^1.5.0",
"file-saver": "^2.0.5",
"chart.js": "^4.4.0",
"install": "^0.13.0",
"npm": "^9.8.1",
"react": "^18.2.0",
"react-chartjs-2": "^5.2.0",
"react-dom": "^18.2.0",
"react-router": "^6.15.0",
"react-router-dom": "^6.15.0",
......
import React from "react";
import Backdrop from "@mui/material/Backdrop";
import CircularProgress from "@mui/material/CircularProgress";
import Typography from "@mui/material/Typography";
export default function Loader({ openState, message }) {
return (
<div>
<Backdrop
sx={{ color: "#fff", zIndex: (theme) => theme.zIndex.drawer + 1 }}
open={openState}
>
<div style={{ textAlign: "center" }}>
<CircularProgress color="inherit" sx={{ fontWeight: "bold" }} />
<Typography variant="h5" sx={{ fontWeight: "bold" }}>
{message}
</Typography>
</div>
</Backdrop>
</div>
);
}
import React from "react";
import "../css/side-navigation.css";
import { NavLink } from "react-router-dom";
import HomeOutlinedIcon from "@mui/icons-material/HomeOutlined";
import DashboardOutlinedIcon from "@mui/icons-material/DashboardOutlined";
import MovieOutlinedIcon from "@mui/icons-material/MovieOutlined";
......@@ -20,10 +19,10 @@ function SideNavigation() {
Movie Analysis
</div>
</NavLink>
<NavLink to="/home/actor-identify" className="side-nav-link">
<NavLink to="/home/actor-marketing-analysis" className="side-nav-link">
<div className="side-nav-link-wrapper">
<MovieOutlinedIcon sx={{ marginRight: "15px" }} />
Actor Identify
Actor & Marketing Analysis
</div>
</NavLink>
<NavLink to="/home/pose-identify" className="side-nav-link">
......
......@@ -4,7 +4,7 @@ import Logo from "../images/logo2.png";
import User from "../images/user.jpg";
import { NavLink } from "react-router-dom";
import SearchIcon from '@mui/icons-material/Search';
import PermIdentityRoundedIcon from "@mui/icons-material/PermIdentityRounded";
// import PermIdentityRoundedIcon from "@mui/icons-material/PermIdentityRounded";
function TopNavigation() {
return (
......
.actor-marketing-container {
height: 88vh;
width: 79.5%;
margin-left: auto;
margin-right: 0;
overflow: auto;
/* background-color: yellowgreen; */
}
.actor-marketing-title {
padding-top: 3%;
font-size: 23px;
font-weight: 500;
font-family: system-ui;
}
.actor-marketing-input-container {
padding-top: 3%;
}
.actor-marketing-button-container {
display: flex;
justify-content: center;
}
.actor-marketing-results-contend-container {
display: flex;
/* justify-content: space-around; */
padding-top: 1%;
width: 100%;
height: auto;
flex-wrap: wrap;
}
.actor-marketing-results-actor-container {
margin-bottom: 1%;
width: 50%;
}
.actor-marketing-results-actor-warper {
width: 100%;
display: flex;
gap: 5%;
padding-top: 2%;
flex-wrap: wrap;
}
.actor-marketing-results-actor-title {
font-size: 15px;
font-weight: 500;
font-style: italic;
font-family: system-ui;
}
.card {
width: 11rem;
height: 15rem;
border-radius: 10px;
overflow: hidden;
cursor: pointer;
position: relative;
color: rgb(240, 240, 240);
box-shadow: 0 10px 30px 5px rgba(0, 0, 0, 0.2);
}
.card-img {
position: absolute;
object-fit: cover;
width: 100%;
height: 100%;
top: 0;
left: 0;
opacity: 0.8;
transition: opacity 0.2s ease-out;
}
.card-content-topic {
position: absolute;
inset: auto auto 30px 20px;
margin: 0;
transition: inset 0.3s 0.3s ease-out;
font-family: "Roboto Condensed", sans-serif;
font-weight: bolder;
text-transform: uppercase;
}
.card-content-para {
position: absolute;
opacity: 0;
max-width: 80%;
transition: opacity 0.3s ease-out;
inset: auto auto 25px 20px;
font-weight: bold;
}
.card:hover .card-content-topic {
inset: auto auto 50px 20px;
transition: inset 0.3s ease-out;
}
.card:hover .card-content-para {
opacity: 1;
transition: opacity 0.5s 0.1s ease-in;
}
.card:hover .card-img {
transition: opacity 0.3s ease-in;
opacity: 1;
}
.actor-marketing-results-pie-chart-container {
width: 50%;
}
.actor-marketing-results-pie-chart-title {
font-size: 15px;
font-weight: 500;
font-style: italic;
font-family: system-ui;
}
.actor-marketing-results-pie-chart-wrapper {
margin-top: 2%;
display: flex;
justify-content: center;
height: 35vh;
}
.actor-marketing-results-suggestions-container {
padding-top: 3%;
width: 50%;
}
.actor-marketing-results-suggestions-title {
font-size: 15px;
font-weight: 500;
font-style: italic;
font-family: system-ui;
}
.actor-marketing-results-suggestions-wrapper {
padding-top: 1%;
}
.actor-marketing-results-suggestions-romantic {
padding-top: 1%;
text-shadow: rgba(0, 0, 0, 0.288) 0.1em 0.1em 0.2em
}
.actor-marketing-results-suggestions-action {
padding-top: 2%;
height: 10vh;
text-shadow: rgba(0, 0, 0, 0.288) 0.1em 0.1em 0.2em
}
\ No newline at end of file
......@@ -21,32 +21,31 @@
align-items: center;
margin-top: 50px;
color: white;
font-weight:500;
font-weight: 500;
font-size: 16px;
}
.active .side-nav-link-wrapper {
background-color: white;
color: #5143B8;
position: relative;
color: #5143b8;
position: relative;
}
.active .side-nav-link-wrapper:before {
content:'';
content: "";
position: absolute;
top:-30px;
right:0;
top: -30px;
right: 0;
width: 30px;
height: 30px;
border-radius: 50%;
box-shadow: 15px 15px 0 rgb(255, 255, 255);
}
.active .side-nav-link-wrapper:after {
content:'';
content: "";
position: absolute;
bottom:-30px;
right:0;
bottom: -30px;
right: 0;
width: 30px;
height: 30px;
border-radius: 50%;
box-shadow: 15px -15px 0 rgb(255, 255, 255);
}
......@@ -2,6 +2,7 @@
width: 100%;
height: 12vh;
display: flex;
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.top-nav-logo-container {
width: 18%;
......@@ -18,7 +19,7 @@
gap: 50px;
padding-left: 50px;
}
.top-nav-link-text {
font-size: 16px;
font-weight: 500;
......@@ -47,31 +48,30 @@
width: 30%;
background-color: #5143b8;
border-bottom-left-radius: 50px;
display:flex;
align-items:center;
justify-content:space-evenly
display: flex;
align-items: center;
justify-content: space-evenly;
}
.top-nav-search-container-wrapper{
width: 280px;
height: 40px;
background-color: #46399E;
border-radius: 20px;
display: flex;
align-items: center;
justify-content:space-evenly;
.top-nav-search-container-wrapper {
width: 280px;
height: 40px;
background-color: #46399e;
border-radius: 20px;
display: flex;
align-items: center;
justify-content: space-evenly;
}
.top-nav-search{
width: 200px;
height:30px;
border: none;
background-color: transparent;
outline: none;
color:white;
.top-nav-search {
width: 200px;
height: 30px;
border: none;
background-color: transparent;
outline: none;
color: white;
}
::placeholder{
color:white
::placeholder {
color: white;
}
.profile-picture{
.profile-picture {
border-radius: 50%;
}
\ No newline at end of file
}
This diff is collapsed.
......@@ -8,6 +8,7 @@ import Contact from "../pages/contact";
import Dashboard from "../pages/dashboard";
import MovieAnalysis from "../pages/movie-analysis";
import ActorMarketingAnalysis from "../pages/actor-marketing-analysis";
function PageRoutes() {
return (
......@@ -21,6 +22,10 @@ function PageRoutes() {
<Route path="/home" element={<SubApp />}>
<Route path="/home/dashboard" element={<Dashboard />} />
<Route path="/home/movie-analysis" element={<MovieAnalysis />} />
<Route
path="/home/actor-marketing-analysis"
element={<ActorMarketingAnalysis />}
/>
</Route>
<Route path="/about" element={<Contact />} />
<Route path="/contact" element={<About />} />
......
.App {
text-align: center;
/* text-align: center; */
}
.App-logo {
......
......@@ -12,28 +12,29 @@ import DirectorProfile from './director pages/DirectorProfile/DirectorProfile';
import DirectorChat from './director pages/DirectorChat/DirectorChat';
import DirectorRequest from './director pages/DirectorRequest/DirectorRequest';
import Dashboard from './components/Dashboard';
import FilmMarketing from './director pages/Film Marketing/Film-Marketing';
function App() {
return (
<div>
<Router>
<div className="App">
<Routes>
<Route path="/" element={<Register />} />
<Route path="/login" element={<Login />} />
<Route path="/home" element={<Home />} />
<Route path="/profile" element={<Profile />} />
<Route path="/request" element={<Request />} />
<Route path="/chat" element={<Chat />} />
<Route path="/dhome" element={<DirectorHome />} />
<Route path="/dprofile" element={<DirectorProfile />} />
<Route path="/dchat" element={<DirectorChat />} />
<Route path="/drequest" element={<DirectorRequest />} />
</Routes>
</div>
</Router>
<Router>
<div className="App">
<Routes>
<Route path="/" element={<Register />} />
<Route path="/login" element={<Login />} />
<Route path="/home" element={<Home />} />
<Route path="/profile" element={<Profile />} />
<Route path="/request" element={<Request />} />
<Route path="/chat" element={<Chat />} />
<Route path="/dhome" element={<DirectorHome />} />
<Route path="/dprofile" element={<DirectorProfile />} />
<Route path="/dchat" element={<DirectorChat />} />
<Route path="/drequest" element={<DirectorRequest />} />
<Route path="/film-marketing" element={<FilmMarketing />} />
</Routes>
</div>
</Router>
</div>
);
}
......
......@@ -103,6 +103,9 @@ export default function DirectorNavBar() {
</NavLink>
<NavLink to="/dprofile" className={classes.navLink} activeClassName="active">
Profile
</NavLink>
<NavLink to="/film-marketing" className={classes.navLink} activeClassName="active">
Film Marketing
</NavLink>
{/* <Button
variant="outlined"
......
import React from "react";
export default function FilmMarketing() {
return <div>Film-Marketing</div>;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment