sonika/sony_intranet_remake2023
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

project style changes

Browse Source
This commit is contained in:
Sonika 2023-12-15 21:51:08 +05:30
parent 22b6745de0
commit c02fb613c5
2 changed files with 42 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/projects/Projects.tsx
View File

@ -9,10 +9,12 @@ import { Box, Card, CardContent, FormControl, Grid, InputLabel, MenuItem, Paper,
import { getPublishedProjects } from "../../APIs/ProjectScreenAPIs/getPublishedProject"; import { getPublishedProjects } from "../../APIs/ProjectScreenAPIs/getPublishedProject";
import { getUnlinkedProjects } from "../../APIs/ProjectScreenAPIs/getUnlinkedProject"; import { getUnlinkedProjects } from "../../APIs/ProjectScreenAPIs/getUnlinkedProject";
export default function Projects(){ export default function Projects(){
const [selectedContractFilter, setSelectedContractFilter] = useState<any>('All'); const [selectedContractFilter, setSelectedContractFilter] = useState<any>('All');
const [ContractFilterResponseData, setContractFilterResponseData] = useState<any>(); const [ContractFilterResponseData, setContractFilterResponseData] = useState<any>();
const [searchByFilter, setSearchByFilter] = useState(''); const [searchByFilter, setSearchByFilter] = useState('');
const [searchByFilterOnBlur, setSearchByFilterOnBlur] = useState('');
const { data: getProjectDataList, isLoading, isError } = useGetProjectDataRQ(searchByFilter); const { data: getProjectDataList, isLoading, isError } = useGetProjectDataRQ(searchByFilter);
useEffect(()=>{ useEffect(()=>{
@ -37,12 +39,17 @@ export default function Projects(){
return( return(
<> <>
<Card style={{margin: '1%', backgroundColor:'rgb(24 24 23)'}}> <Card square style={{ backgroundColor:'rgb(13 13 13)'}}>
<Card sx={{margin:'1%', backgroundColor:'rgb(23 23 22)'}}>
<CardContent> <CardContent>
<FormControl className="select-field" variant="standard" style={{marginTop: '1%'}}> <FormControl className="select-field" variant="standard" style={{marginTop: '1%'}}>
<InputLabel htmlFor="contract-list" >Select Contract</InputLabel> <InputLabel htmlFor="contract-list" >Select Contract</InputLabel>
<Select <Select
sx={{input: { color: 'white' }}} sx={{color: 'white',
'& .MuiSelect-iconOutlined ': {
color: '#393939',
},
}}
value={selectedContractFilter} value={selectedContractFilter}
inputProps={{ inputProps={{
name: 'contracts', name: 'contracts',
@ -62,17 +69,43 @@ export default function Projects(){
id="standard-name" id="standard-name"
variant="standard" variant="standard"
label="Search By" label="Search By"
value={searchByFilter} value={searchByFilterOnBlur}
onChange={(e)=>{ onChange={(e)=>{
setSearchByFilter(e.target.value); setSearchByFilterOnBlur(e.target.value);
}}
onBlur={(e)=>{
setSearchByFilter(searchByFilter);
// setSearchByFilterOnBlur(searchByFilter);
}}
sx={{input: { color: 'white' },
"& label": {
color: "white"
},
"& label.Mui-focused": {
color: "white"
},
"& .MuiInput-underline:after": {
borderBottomColor: "white"
},
"& .MuiOutlinedInput-root": {
"& fieldset": {
borderColor: "white"
}},
"&:hover fieldset": {
borderColor: "white",
borderWidth: 2
},
"&.Mui-focused fieldset": {
borderColor: "white"
}
}} }}
sx={{input: { color: 'white' }}}
placeholder="Search By Title, Project Title, Contract No, Asset Title, Track Grid, ISRC" placeholder="Search By Title, Project Title, Contract No, Asset Title, Track Grid, ISRC"
style={{marginLeft: '10%', width: '45%'}} style={{marginLeft: '10%', width: '45%'}}
margin="normal" margin="normal"
/> />
</CardContent> </CardContent>
</Card> </Card>
</Card>
<ProjectList projectData={getProjectDataList}/> <ProjectList projectData={getProjectDataList}/>
</> </>

4
src/components/projects/ProjectsList.tsx
View File

@ -79,7 +79,8 @@ export default function ProjectList({projectData}:Props) {
return ( return (
<Paper square className='projectScreen-background' sx={{ width: '100%', overflow: 'hidden' }}> <Paper square className='projectScreen-background' sx={{ width: '100%', overflow: 'hidden',backgroundColor:'rgb(13 13 13)' }}>
<Paper className='projectScreen-background' sx={{ margin:'1%', width: '100%', overflow: 'hidden' }}>
<TableContainer sx={{ maxHeight: '600px'}}> <TableContainer sx={{ maxHeight: '600px'}}>
<Table stickyHeader aria-label="sticky table"> <Table stickyHeader aria-label="sticky table">
<TableHead > <TableHead >
@ -131,5 +132,6 @@ export default function ProjectList({projectData}:Props) {
onRowsPerPageChange={handleChangeRowsPerPage} onRowsPerPageChange={handleChangeRowsPerPage}
/> />
</Paper> </Paper>
</Paper>
); );
} }