├── src ├── Components │ ├── RecruiterLogin │ │ ├── RecLogin.module.css │ │ └── RecruiterLogin.jsx │ ├── ChatBot │ │ ├── send.png │ │ ├── Chatbox.png │ │ ├── ChatBot.module.css │ │ └── ChatBot.jsx │ ├── Popouts │ │ ├── dog.jpg │ │ ├── error.png │ │ └── LoginFail.jsx │ ├── LogIn │ │ ├── images │ │ │ ├── fb.png │ │ │ ├── ld.png │ │ │ └── google1.png │ │ ├── SocialFollow.js │ │ ├── Login.module.css │ │ └── Login.jsx │ ├── JobPost │ │ ├── JobPost.jsx │ │ ├── JobPost.module.css │ │ └── JobPostInput.jsx │ ├── FireAuth │ │ ├── FireLogin.jsx │ │ └── auth.js │ ├── Home │ │ ├── PageNotFound.jsx │ │ ├── Why.jsx │ │ ├── Course.jsx │ │ ├── SearchBar.jsx │ │ ├── CoolPlaces.jsx │ │ ├── TotalCompany.jsx │ │ ├── Premium.jsx │ │ ├── Resume.jsx │ │ ├── Home.jsx │ │ ├── GetJob.jsx │ │ ├── AdvanceSearch1.jsx │ │ ├── AdvanceSearch.jsx │ │ ├── AdvancedComponent.jsx │ │ ├── Footer.jsx │ │ └── home.module.css │ ├── CreateJobAlert │ │ ├── JobAlert.jsx │ │ ├── JobAlertFooter.jsx │ │ ├── JobAlertFAQ.jsx │ │ ├── JobAlert.module.css │ │ └── JobAlertInput.jsx │ ├── Register │ │ ├── Regifooter.jsx │ │ └── Register.module.css │ ├── JobSearch │ │ ├── JobList.jsx │ │ └── JobSearch.jsx │ ├── JobDescription │ │ ├── Tabs.module.css │ │ └── JobDescriptionSidebar.jsx │ ├── Modal │ │ └── Modal.jsx │ ├── Navbar │ │ ├── NavBar.module.css │ │ ├── AfterLoginNav.jsx │ │ └── NavBar.jsx │ └── RecruiterDash │ │ ├── Dashboard.module.css │ │ └── RecruiterDashboard.jsx ├── Redux │ ├── Register │ │ ├── actiontype.js │ │ ├── regireducer.js │ │ └── action.js │ ├── Login │ │ ├── actiontype.js │ │ ├── action.js │ │ └── loginreducer.js │ ├── RecLogin │ │ ├── actionType.js │ │ ├── RecLoginReducer.js │ │ └── action.js │ ├── RecruiterDash │ │ ├── actionType.js │ │ ├── action.js │ │ └── RecruiterDasReducer.js │ └── store.js ├── App.js ├── setupTests.js ├── App.test.js ├── index.css ├── reportWebVitals.js ├── Routes │ ├── PrivateRoutes.jsx │ └── Routes.jsx ├── index.js └── database │ └── db.json ├── public ├── robots.txt ├── favicon.ico ├── logo192.png ├── logo512.png ├── Snapshots │ ├── doc.png │ ├── fb.png │ ├── ld.png │ ├── man.png │ ├── logo1.png │ ├── regi.png │ ├── search.png │ ├── google1.png │ ├── afterLogin.jpg │ ├── jobDetails.jpg │ ├── landingPage.jpg │ ├── loginPage.jpg │ ├── advanceSearch.jpg │ ├── registration │ │ ├── non.png │ │ ├── male.png │ │ ├── female.png │ │ └── prefer.png │ ├── searchByCities.jpg │ └── recuriterDasboard.jpg ├── manifest.json └── index.html ├── .gitignore ├── package.json └── README.md /src/Components/RecruiterLogin/RecLogin.module.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/logo512.png -------------------------------------------------------------------------------- /public/Snapshots/doc.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/doc.png -------------------------------------------------------------------------------- /public/Snapshots/fb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/fb.png -------------------------------------------------------------------------------- /public/Snapshots/ld.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/ld.png -------------------------------------------------------------------------------- /public/Snapshots/man.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/man.png -------------------------------------------------------------------------------- /public/Snapshots/logo1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/logo1.png -------------------------------------------------------------------------------- /public/Snapshots/regi.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/regi.png -------------------------------------------------------------------------------- /public/Snapshots/search.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/search.png -------------------------------------------------------------------------------- /public/Snapshots/google1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/google1.png -------------------------------------------------------------------------------- /public/Snapshots/afterLogin.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/afterLogin.jpg -------------------------------------------------------------------------------- /public/Snapshots/jobDetails.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/jobDetails.jpg -------------------------------------------------------------------------------- /public/Snapshots/landingPage.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/landingPage.jpg -------------------------------------------------------------------------------- /public/Snapshots/loginPage.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/loginPage.jpg -------------------------------------------------------------------------------- /src/Components/ChatBot/send.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/src/Components/ChatBot/send.png -------------------------------------------------------------------------------- /src/Components/Popouts/dog.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/src/Components/Popouts/dog.jpg -------------------------------------------------------------------------------- /src/Components/Popouts/error.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/src/Components/Popouts/error.png -------------------------------------------------------------------------------- /public/Snapshots/advanceSearch.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/advanceSearch.jpg -------------------------------------------------------------------------------- /src/Components/ChatBot/Chatbox.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/src/Components/ChatBot/Chatbox.png -------------------------------------------------------------------------------- /src/Components/LogIn/images/fb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/src/Components/LogIn/images/fb.png -------------------------------------------------------------------------------- /src/Components/LogIn/images/ld.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/src/Components/LogIn/images/ld.png -------------------------------------------------------------------------------- /public/Snapshots/registration/non.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/registration/non.png -------------------------------------------------------------------------------- /public/Snapshots/searchByCities.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/searchByCities.jpg -------------------------------------------------------------------------------- /public/Snapshots/recuriterDasboard.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/recuriterDasboard.jpg -------------------------------------------------------------------------------- /public/Snapshots/registration/male.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/registration/male.png -------------------------------------------------------------------------------- /src/Components/LogIn/images/google1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/src/Components/LogIn/images/google1.png -------------------------------------------------------------------------------- /public/Snapshots/registration/female.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/registration/female.png -------------------------------------------------------------------------------- /public/Snapshots/registration/prefer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Shubhamsharma585/Shine-masai/HEAD/public/Snapshots/registration/prefer.png -------------------------------------------------------------------------------- /src/Redux/Register/actiontype.js: -------------------------------------------------------------------------------- 1 | 2 | //register 3 | export const REGISTER_REQUEST = "REGISTER_REQUEST" 4 | export const REGISTER_SUCCESS = "REGISTER_SUCCESS" 5 | -------------------------------------------------------------------------------- /src/Redux/Login/actiontype.js: -------------------------------------------------------------------------------- 1 | 2 | //register 3 | export const LOGIN_REQUEST = "LOGIN_REQUEST" 4 | export const LOGIN_SUCCESS = "LOGIN_SUCCESS" 5 | export const LOGIN_FAILURE = "LOGIN_FAILURE" 6 | -------------------------------------------------------------------------------- /src/Redux/RecLogin/actionType.js: -------------------------------------------------------------------------------- 1 | export const REC_LOGIN_REQUEST = "REC_LOGIN_REQUEST" 2 | export const REC_LOGIN_SUCCESS = "REC_LOGIN_SUCCESS" 3 | export const REC_LOGIN_FAILURE = "REC_LOGIN_FAILURE" -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import Routes from "./Routes/Routes"; 2 | 3 | function App() { 4 | return ( 5 |
6 | 7 |
8 | ); 9 | } 10 | 11 | export default App; 12 | -------------------------------------------------------------------------------- /src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /src/App.test.js: -------------------------------------------------------------------------------- 1 | import { render, screen } from '@testing-library/react'; 2 | import App from './App'; 3 | 4 | test('renders learn react link', () => { 5 | render(); 6 | const linkElement = screen.getByText(/learn react/i); 7 | expect(linkElement).toBeInTheDocument(); 8 | }); 9 | -------------------------------------------------------------------------------- /src/Components/JobPost/JobPost.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import JobPostInput from './JobPostInput' 3 | 4 | function JobPost() { 5 | return ( 6 |
7 |
8 | 9 |
10 |
11 | ) 12 | } 13 | 14 | export default JobPost 15 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | /FireAuth 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | } 9 | 10 | code { 11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 12 | monospace; 13 | } 14 | -------------------------------------------------------------------------------- /src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | if (onPerfEntry && onPerfEntry instanceof Function) { 3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 4 | getCLS(onPerfEntry); 5 | getFID(onPerfEntry); 6 | getFCP(onPerfEntry); 7 | getLCP(onPerfEntry); 8 | getTTFB(onPerfEntry); 9 | }); 10 | } 11 | }; 12 | 13 | export default reportWebVitals; 14 | -------------------------------------------------------------------------------- /src/Components/FireAuth/FireLogin.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import {auth, google} from "../FireAuth/auth" 3 | 4 | const FireLogin = () => { 5 | 6 | const handleLogin = () => { 7 | auth.signInWithPopup(google) 8 | .then(resp => console.log(resp)) 9 | .catch((err) => console.log(err)); 10 | } 11 | 12 | 13 | 14 | 15 | return ( 16 |
17 | 18 |
19 | ) 20 | } 21 | 22 | export {FireLogin} -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /src/Routes/PrivateRoutes.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import {Redirect, Route} from "react-router-dom" 3 | import { useSelector } from "react-redux" 4 | 5 | const PrivateRoute = ({ 6 | children, 7 | path, 8 | redirectPath = "/recruiter/login", 9 | exact = false, 10 | push = false 11 | }) => { 12 | 13 | const recAuth = useSelector(state => state.RecLogin.recAuth) 14 | 15 | return recAuth ? ( 16 | 17 | {children} 18 | 19 | ): 20 | 21 | } 22 | 23 | export {PrivateRoute} -------------------------------------------------------------------------------- /src/Redux/RecruiterDash/actionType.js: -------------------------------------------------------------------------------- 1 | export const RECRUITER_DASH_REQUEST = "RECRUITER_DASH_REQ" 2 | export const RECRUITER_DASH_SUCCESS = "RECRUITER_DASH_SUCCESS" 3 | export const RECRUITER_DASH_FAILURE = "RECRUITER_DASH_FAILURE" 4 | 5 | export const DASHBOARD_CANDIDATE_REQUEST = "DASHBOARD_CANDIDATE_REQUEST" 6 | export const DASHBOARD_CANDIDATE_SUCCESS = "DASHBOARD_CANDIDATE_SUCCESS" 7 | export const DASHBOARD_CANDIDATE_FAILURE = "DASHBOARD_CANDIDATE_FAILURE" 8 | 9 | export const COMMENTS_REQUEST = "COMMENTS_REQUEST" 10 | export const COMMENTS_SUCCESS = "COMMENTS_SUCCESS" 11 | export const COMMENTS_FAILURE = "COMMENTS_FAILURE" 12 | -------------------------------------------------------------------------------- /src/Components/FireAuth/auth.js: -------------------------------------------------------------------------------- 1 | import firebase from "firebase/app"; 2 | import "firebase/auth"; 3 | 4 | var firebaseConfig = { 5 | apiKey: "AIzaSyCFC5rWZHdsDcC3Fe6edJYFKM6sZmGk8LE", 6 | authDomain: "fire-login-react.firebaseapp.com", 7 | projectId: "fire-login-react", 8 | storageBucket: "fire-login-react.appspot.com", 9 | messagingSenderId: "624213465070", 10 | appId: "1:624213465070:web:eb38f4cb13ea8ef6dea0ff" 11 | }; 12 | // Initialize Firebase 13 | firebase.initializeApp(firebaseConfig); 14 | 15 | const auth = firebase.auth(); 16 | const google = new firebase.auth.GoogleAuthProvider(); 17 | 18 | export { auth, google }; -------------------------------------------------------------------------------- /src/Components/Home/PageNotFound.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styles from "./home.module.css"; 3 | 4 | function PageNotFound() { 5 | return ( 6 |
7 |
8 |
9 | 404 14 |
15 |
16 |
17 | ); 18 | } 19 | 20 | export default PageNotFound; 21 | -------------------------------------------------------------------------------- /src/Components/CreateJobAlert/JobAlert.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import JobAlertFAQ from './JobAlertFAQ' 3 | import JobAlertInput from './JobAlertInput' 4 | import Styles from "./JobAlert.module.css" 5 | import JobAlertFooter from './JobAlertFooter' 6 | 7 | function JobAlert() { 8 | return ( 9 |
10 |
11 |
12 | 13 |
14 |
15 | 16 |
17 |
18 |
19 | 20 |
21 |
22 | ) 23 | } 24 | 25 | export default JobAlert 26 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import "./index.css"; 4 | import App from "./App"; 5 | import reportWebVitals from "./reportWebVitals"; 6 | import { BrowserRouter } from "react-router-dom"; 7 | import { Provider } from "react-redux"; 8 | import store from "./Redux/store"; 9 | 10 | ReactDOM.render( 11 | 12 | 13 | 14 | 15 | 16 | 17 | , 18 | document.getElementById("root") 19 | ); 20 | 21 | // If you want to start measuring performance in your app, pass a function 22 | // to log results (for example: reportWebVitals(console.log)) 23 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 24 | reportWebVitals(); 25 | -------------------------------------------------------------------------------- /src/Redux/store.js: -------------------------------------------------------------------------------- 1 | import { applyMiddleware, combineReducers, createStore } from "redux" 2 | import { compose } from "redux" 3 | import thunk from "redux-thunk" 4 | import loginreducer from "./Login/loginreducer" 5 | import regireducer from "./Register/regireducer" 6 | import {RecruiterDashReducer} from "./RecruiterDash/RecruiterDasReducer" 7 | import {RecLoginReducer} from "./RecLogin/RecLoginReducer" 8 | 9 | const rootreducer = combineReducers({ 10 | regi: regireducer, 11 | RecruiterDash: RecruiterDashReducer, 12 | logi: loginreducer, 13 | RecLogin: RecLoginReducer, 14 | }) 15 | 16 | 17 | const store = createStore(rootreducer, 18 | compose(applyMiddleware(thunk), 19 | window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__() 20 | )) 21 | 22 | 23 | console.log(store.getState()) 24 | 25 | export default store; -------------------------------------------------------------------------------- /src/Components/Home/Why.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styles from "./home.module.css"; 3 | 4 | function Why() { 5 | return ( 6 |
7 |

Why Shine

8 |
9 |
10 |
11 | 3.4 crores+ 12 |
13 |

Candidates

14 |
15 |
16 |
17 | 300,000+ 18 |
19 |

Jobs

20 |
21 |
22 |
23 | 15,000+ 24 |
25 |

Companies

26 |
27 |
28 |
29 | ); 30 | } 31 | 32 | export default Why; 33 | -------------------------------------------------------------------------------- /src/Redux/RecLogin/RecLoginReducer.js: -------------------------------------------------------------------------------- 1 | import { REC_LOGIN_REQUEST, REC_LOGIN_SUCCESS, REC_LOGIN_FAILURE } from "./actionType" 2 | 3 | const initState = { 4 | recAuth: false, 5 | isLoading: false, 6 | isError: false, 7 | } 8 | 9 | export const RecLoginReducer = (state=initState, action) => { 10 | switch(action.type){ 11 | case REC_LOGIN_REQUEST:{ 12 | return{ 13 | ...state, 14 | isLoading: true, 15 | isError: false, 16 | } 17 | } 18 | case REC_LOGIN_SUCCESS:{ 19 | return{ 20 | ...state, 21 | recAuth: true, 22 | isLoading: false, 23 | } 24 | } 25 | case REC_LOGIN_FAILURE:{ 26 | return{ 27 | ...state, 28 | isLoading: false, 29 | isError: true, 30 | } 31 | } 32 | default: return state 33 | } 34 | } -------------------------------------------------------------------------------- /src/Components/Popouts/LoginFail.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | // import { Link } from 'react-router-dom' 3 | import Dog from "./dog.jpg" 4 | 5 | 6 | function LoginFail() { 7 | 8 | 9 | function rel() 10 | { 11 | window.location.reload(); 12 | } 13 | 14 | 15 | 16 | 17 | return ( 18 |
19 |
20 | 21 |

Sorry..! Something went wrong..

22 | 23 |
24 |
25 |

rel()}>Please Click here to retry

26 |
27 | 28 |
29 | ) 30 | } 31 | 32 | export default LoginFail 33 | -------------------------------------------------------------------------------- /src/Components/LogIn/SocialFollow.js: -------------------------------------------------------------------------------- 1 | //Reference article:-- https://www.digitalocean.com/community/tutorials/creating-a-social-follow-component-in-react 2 | 3 | 4 | import React from "react"; 5 | import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; 6 | import styles from "../LogIn/Login.module.css" 7 | 8 | import { 9 | faFacebook, 10 | faTwitter, 11 | faLinkedin 12 | } from "@fortawesome/free-brands-svg-icons"; 13 | 14 | 15 | export default function SocialFollow() { 16 | return ( 17 |
18 | 19 | 21 | 22 | 23 | 24 | 26 | 27 | 28 | 30 | 31 | 32 | 33 |
34 | ); 35 | } -------------------------------------------------------------------------------- /src/Redux/RecLogin/action.js: -------------------------------------------------------------------------------- 1 | import { REC_LOGIN_SUCCESS, REC_LOGIN_FAILURE } from "./actionType" 2 | import axios from "axios" 3 | 4 | const recauth = (email, pass) => (dispatch) =>{ 5 | console.log(email, pass) 6 | axios.get(`https://json-heroku-shubham.herokuapp.com/rec_login?email=${email}&password=${pass}`) 7 | .then(resp => { 8 | if(resp.data.length === 0){ 9 | alert("Invalid Email or Password, Pleasde try again") 10 | dispatch(loginfailure()) 11 | } 12 | else{ 13 | dispatch(loginsuccess()) 14 | } 15 | }) 16 | } 17 | 18 | 19 | // const logingin = (payload) => (dispatch) => { 20 | // const loginRec = loginrequest() 21 | // dispatch(loginRec) 22 | 23 | // const loginSuc = loginsuccess(payload) 24 | // dispatch(loginSuc) 25 | 26 | // const loginFail = loginfailure() 27 | // dispatch(loginFail) 28 | 29 | // } 30 | 31 | 32 | 33 | const loginsuccess = () => { 34 | return { 35 | type: REC_LOGIN_SUCCESS, 36 | } 37 | } 38 | 39 | const loginfailure = () => { 40 | return { 41 | type: REC_LOGIN_FAILURE, 42 | } 43 | } 44 | 45 | export {recauth} -------------------------------------------------------------------------------- /src/Components/Home/Course.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styles from "./home.module.css"; 3 | 4 | function Course() { 5 | return ( 6 |
7 |
8 |
9 |

18 | Want to make your career future ready? 19 |

20 |

29 | Upgrade your skills, give your career a boost 30 |

31 | 32 | 38 |
39 |
40 | ); 41 | } 42 | 43 | export default Course; 44 | -------------------------------------------------------------------------------- /src/Redux/Login/action.js: -------------------------------------------------------------------------------- 1 | import { LOGIN_REQUEST, LOGIN_SUCCESS, LOGIN_FAILURE } from "./actiontype" 2 | import Axios from "axios" 3 | 4 | 5 | 6 | 7 | 8 | export const logingin = (payload) => dispatch => { 9 | console.log("loging") 10 | console.log(payload) 11 | 12 | dispatch(loginrequest()) 13 | Axios.get("https://json-heroku-shubham.herokuapp.com/applicant",{ 14 | params:{ 15 | email: payload 16 | } 17 | 18 | } 19 | 20 | ) 21 | .then((res) => { 22 | console.log(res.data) 23 | //console.log(res.data.length) 24 | if(res.data.length === 0) 25 | { 26 | dispatch(loginfailure(res.data)) 27 | } 28 | else 29 | { 30 | const payload = res.data[0] 31 | dispatch(loginsuccess(payload)) 32 | } 33 | }) 34 | 35 | } 36 | 37 | 38 | 39 | const loginrequest = (payload) => { 40 | return { 41 | type: LOGIN_REQUEST, 42 | payload 43 | } 44 | } 45 | 46 | const loginsuccess = (payload) => { 47 | return { 48 | type: LOGIN_SUCCESS, 49 | payload 50 | } 51 | } 52 | 53 | const loginfailure = (payload) => { 54 | return { 55 | type: LOGIN_FAILURE, 56 | payload 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /src/Components/Home/SearchBar.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | import AdvanceSearch1 from "./AdvanceSearch1"; 3 | 4 | import styles from "./home.module.css"; 5 | 6 | function SearchBar() { 7 | const [isAuth, setIsAuth] = useState(false); 8 | return ( 9 |
16 | {isAuth ? ( 17 | 18 | ) : ( 19 | <> 20 |
{ 22 | setIsAuth(true); 23 | }} 24 | style={{ 25 | width: "880px", 26 | backgroundColor: "#fff", 27 | margin: "auto", 28 | marginBottom: "5px", 29 | height: "38px", 30 | border: "1px solid #e7e7e7", 31 | paddingLeft: "15px", 32 | }} 33 | > 34 | 39 |
40 |
41 | 42 | )} 43 |
44 | ); 45 | } 46 | 47 | export default SearchBar; 48 | -------------------------------------------------------------------------------- /src/Components/Register/Regifooter.jsx: -------------------------------------------------------------------------------- 1 | import React from "react" 2 | import styles from "./Register.module.css" 3 | 4 | 5 | function Regifooter() 6 | { 7 | 8 | 9 | 10 | return( 11 |
12 | 13 |
14 | 25 |
26 | 27 |
28 | ) 29 | } 30 | 31 | export default Regifooter; -------------------------------------------------------------------------------- /src/Components/CreateJobAlert/JobAlertFooter.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Styles from "./JobAlert.module.css" 3 | 4 | function JobAlertFooter() { 5 | return ( 6 |
7 |

Shine.com free job alert 2020 is the perfect place to get quick updates for the most relevant jobs matching your job profile and requirements. We offer free job alert notifications for all kind of jobs. These jobs are delivered straight to your mailbox, and also you can also access them on your mobile. We send you customized job alert based on your preferred location, CTC expectations, job field, industry type, experience level and different organization. Our free job alert notifies you about the trending jobs which are posted on our portal and gives you a chance to be the first applicant to apply. 8 | The most useful part is that you can create your unique job alert on various industries and locations at the same time. For instance; you can create a job alert for digital marketing jobs or IT jobs and another job alert for banking jobs or government jobs. The benefit of creating job alerts is that you can be the first to apply to the vacancies, which creates an opportunity to be selected from recruiter early. 9 | 10 | To create a job alert, you have to fill out our form, and you will start receiving push notifications once you create a job alert.

11 |
12 | ) 13 | } 14 | 15 | export default JobAlertFooter 16 | -------------------------------------------------------------------------------- /src/Components/JobPost/JobPost.module.css: -------------------------------------------------------------------------------- 1 | .sub1{ 2 | width: 50%; 3 | margin: auto; 4 | margin-bottom: 125px; 5 | } 6 | .sub1 label{ 7 | align-items: left; 8 | width: 100%; 9 | margin: 40px; 10 | margin-left: 0px; 11 | } 12 | 13 | .input{ 14 | width: 60%; 15 | padding: 40px; 16 | box-shadow: 5px 10px 10px #cecece; 17 | border: 1px solid black; 18 | background-color: #cecece; 19 | border-radius: 10px; 20 | 21 | } 22 | .input input{ 23 | width: 80%; 24 | height: 4vh; 25 | margin:40px; 26 | } 27 | .input select{ 28 | width: 80%; 29 | height: 6vh; 30 | margin:40px; 31 | } 32 | 33 | .Register button{ 34 | width: 150px; 35 | height: 5vh; 36 | background-image: linear-gradient(136deg,#a296d9 0%,#7faee0 100%); 37 | color: white; 38 | font-size: 18px; 39 | border-radius: 10px; 40 | border:none; 41 | outline: none; 42 | cursor: pointer; 43 | margin-left: 40%; 44 | } 45 | .addbtn{ 46 | margin-top: 40px; 47 | width: 50px; 48 | height: 30px; 49 | background-image: linear-gradient(136deg,#a296d9 0%,#7faee0 100%); 50 | font-size: 16px; 51 | outline: none; 52 | border: none; 53 | cursor: pointer; 54 | } 55 | .outetpostdiv{ 56 | background-image: url("https://cdn.dribbble.com/users/729161/screenshots/13876818/media/8b3b975a8f4d695cbae3efeda5d01971.png"); 57 | background-position: 100% 0vh; 58 | background-size: cover; 59 | margin-top: -25px; 60 | } -------------------------------------------------------------------------------- /src/Components/JobSearch/JobList.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Link } from "react-router-dom"; 3 | 4 | function JobList({ heading, list }) { 5 | return ( 6 |
7 |
17 |
18 |

25 | {heading} 26 |

27 |
28 |
29 | {list.map((li) => ( 30 |
31 | {" "} 32 | 41 | Jobs in {li} 42 | 43 |
44 | ))} 45 |
46 |
47 |
48 |
49 | ); 50 | } 51 | 52 | export default JobList; 53 | -------------------------------------------------------------------------------- /src/Components/RecruiterLogin/RecruiterLogin.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react" 2 | import styles from "../LogIn/Login.module.css" 3 | import { useDispatch, useSelector } from "react-redux" 4 | import { Redirect } from "react-router-dom" 5 | import ChatBot from "../ChatBot/ChatBot" 6 | import {recauth} from "../../Redux/RecLogin/action" 7 | 8 | function RecruiterLogin() { 9 | 10 | const dispatch = useDispatch() 11 | const recAuth = useSelector(state => state.RecLogin.recAuth) 12 | 13 | const [email, setEmail] = useState(""); 14 | const [pass, setPass] = useState(""); 15 | 16 | const handleLogin = () => { 17 | dispatch(recauth(email, pass)) 18 | } 19 | 20 | if(recAuth){ 21 | return 22 | } 23 | 24 | return( 25 |
26 |
27 |
28 |
29 |

Recruiter Login

30 | setEmail(e.target.value)} />

31 | setPass(e.target.value)}/>

32 |
Login
33 |

By syncing your social media account, you agree to shine terms and conditions

34 |
35 |
36 | 37 |
38 | ) 39 | } 40 | 41 | export default RecruiterLogin 42 | -------------------------------------------------------------------------------- /src/Components/JobDescription/Tabs.module.css: -------------------------------------------------------------------------------- 1 | .tabs{ 2 | width: 90%; 3 | margin: auto; 4 | margin-top: 2%; 5 | } 6 | 7 | .tabsList{ 8 | display: flex; 9 | border-bottom: 1px solid; 10 | } 11 | 12 | .tab{ 13 | margin-right: 4%; 14 | list-style: none; 15 | cursor: pointer; 16 | } 17 | 18 | .tab:hover{ 19 | color: blue; 20 | } 21 | 22 | /*----------sidebar--------*/ 23 | 24 | .loadingBox{ 25 | width: 150px; 26 | height: 150px; 27 | margin: auto; 28 | margin-top: 10%; 29 | } 30 | 31 | .img{ 32 | width: 100%; 33 | height: 100%; 34 | } 35 | 36 | 37 | .box{ 38 | background: #f6faff; 39 | cursor: pointer; 40 | margin-top: 5px; 41 | 42 | } 43 | .box:hover{ 44 | box-shadow: 0 1px 0 0 #99a6eb, 0 0 10px 0 rgb(0 0 0 / 10%); 45 | 46 | } 47 | .pre{ 48 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 49 | background-position: -1px -183px; 50 | background-repeat: no-repeat; 51 | float: left; 52 | width: 18px; 53 | height: 20px; 54 | margin-top: 12px; 55 | } 56 | .point{ 57 | background-color: #d3e3ec; 58 | width: 5px; 59 | height: 5px; 60 | float: left; 61 | margin-top: 8px; 62 | margin-right: 4px; 63 | 64 | 65 | 66 | } 67 | .right{ 68 | width: 140%; 69 | /* min-height: 500px; */ 70 | max-height:75vh; 71 | /* border: 1px solid; */ 72 | overflow-x: hidden; 73 | overflow-y: auto; 74 | padding: 20px; 75 | 76 | } 77 | .right1{ 78 | width: 90%; 79 | /* min-height: 500px; */ 80 | max-height:75vh; 81 | /* border: 1px solid; */ 82 | overflow-x: hidden; 83 | overflow-y: auto; 84 | padding: 20px; 85 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "shine", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@fortawesome/fontawesome-svg-core": "^1.2.35", 7 | "@fortawesome/free-brands-svg-icons": "^5.15.3", 8 | "@fortawesome/free-regular-svg-icons": "^5.15.3", 9 | "@fortawesome/free-solid-svg-icons": "^5.15.3", 10 | "@fortawesome/react-fontawesome": "^0.1.14", 11 | "@material-ui/core": "^4.11.3", 12 | "@testing-library/jest-dom": "^5.11.4", 13 | "@testing-library/react": "^11.1.0", 14 | "@testing-library/user-event": "^12.1.10", 15 | "axios": "^0.21.1", 16 | "create-react-app": "^4.0.3", 17 | "dom": "^0.0.3", 18 | "firebase": "^8.4.1", 19 | "prop-types": "^15.7.2", 20 | "react": "^17.0.2", 21 | "react-dom": "^17.0.2", 22 | "react-motion": "^0.5.2", 23 | "react-redux": "^7.2.3", 24 | "react-router-dom": "^5.2.0", 25 | "react-scripts": "4.0.3", 26 | "react-tabs": "^3.2.2", 27 | "react-text-collapse": "^0.5.2", 28 | "redux": "^4.0.5", 29 | "redux-thunk": "^2.3.0", 30 | "router": "^1.3.5", 31 | "styled-components": "^5.2.3", 32 | "web-vitals": "^1.0.1" 33 | }, 34 | "scripts": { 35 | "start": "react-scripts start", 36 | "build": "react-scripts build", 37 | "test": "react-scripts test", 38 | "eject": "react-scripts eject" 39 | }, 40 | "eslintConfig": { 41 | "extends": [ 42 | "react-app", 43 | "react-app/jest" 44 | ] 45 | }, 46 | "browserslist": { 47 | "production": [ 48 | ">0.2%", 49 | "not dead", 50 | "not op_mini all" 51 | ], 52 | "development": [ 53 | "last 1 chrome version", 54 | "last 1 firefox version", 55 | "last 1 safari version" 56 | ] 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /src/Components/Modal/Modal.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { makeStyles } from '@material-ui/core/styles'; 3 | import Modal from '@material-ui/core/Modal'; 4 | import Backdrop from '@material-ui/core/Backdrop'; 5 | import Fade from '@material-ui/core/Fade'; 6 | 7 | const useStyles = makeStyles((theme) => ({ 8 | modal: { 9 | display: 'flex', 10 | alignItems: 'center', 11 | justifyContent: 'center', 12 | }, 13 | paper: { 14 | backgroundColor: theme.palette.background.paper, 15 | border: '2px solid #000', 16 | boxShadow: theme.shadows[5], 17 | padding: theme.spacing(2, 4, 3), 18 | }, 19 | })); 20 | 21 | function TransitionsModal() { 22 | const classes = useStyles(); 23 | const [open, setOpen] = React.useState(false); 24 | 25 | const handleOpen = () => { 26 | setOpen(true); 27 | }; 28 | 29 | const handleClose = () => { 30 | setOpen(false); 31 | }; 32 | 33 | return ( 34 |
35 | 38 | 50 | 51 |
52 |

Transition modal

53 |

react-transition-group animates me.

54 |
55 | 56 | 57 |
58 | ); 59 | } 60 | 61 | export {TransitionsModal} -------------------------------------------------------------------------------- /src/Components/ChatBot/ChatBot.module.css: -------------------------------------------------------------------------------- 1 | .chatbotbutton{ 2 | width: 60px; 3 | height: 60px; 4 | bottom: 50px; 5 | position: fixed; 6 | right: 50px; 7 | background-color:rgb(86,81,199); 8 | border-radius: 50px; 9 | align-items: center; 10 | } 11 | .chatbotimg{ 12 | width: 40px; 13 | height: 40px; 14 | padding-left: 10px; 15 | padding-top: 15px; 16 | border-radius: 20px; 17 | } 18 | 19 | .conv{ 20 | width: 300px; 21 | height: 300px; 22 | right: 50px; 23 | bottom: 150px; 24 | background-color: rgb(242, 247, 247); 25 | position: fixed; 26 | transition: ease-in-out 1s; 27 | border-radius: 20px; 28 | border:1px solid rgb(86,81,199); 29 | } 30 | .conv2{ 31 | display: none; 32 | } 33 | .chatbothead{ 34 | display: flex; 35 | flex-direction: row; 36 | background-color:rgb(86,81,199) ; 37 | width: 100%; 38 | height: 50px; 39 | border-top-left-radius: 20px; 40 | border-top-right-radius: 20px; 41 | 42 | } 43 | .chatbothead p{ 44 | width: 100px; 45 | color: white; 46 | font-size: 30px; 47 | margin: 0%; 48 | padding: 0%; 49 | margin-left: 25px; 50 | } 51 | .chatbothead button{ 52 | width: 50px; 53 | height: 50px; 54 | color:white; 55 | background-color:rgb(86,81,199) ; 56 | font-size: 30px; 57 | margin: 0%; 58 | padding: 0%; 59 | margin-left: 100px; 60 | border-radius: 25px; 61 | outline: none; 62 | border:none; 63 | } 64 | .Selectbtn{ 65 | width: 120px; 66 | height: 5vh; 67 | margin: 10px; 68 | border:1px solid rgb(86,81,199); 69 | border-radius:10px; 70 | } 71 | .Selectbtn2{ 72 | width: 120px; 73 | height: 5vh; 74 | margin-left: 140px; 75 | border:1px solid rgb(86,81,199); 76 | border-radius:10px; 77 | } 78 | .rply{ 79 | background-color: whitesmoke; 80 | padding: 8px; 81 | } -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 13 | 17 | 18 | 27 | Jobs 2021 - Search Jobs in India, Latest Job Vacancies, Recruitment - Shine.com 28 | 29 | 30 | 31 |
32 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /src/Redux/Register/regireducer.js: -------------------------------------------------------------------------------- 1 | import { REGISTER_REQUEST, REGISTER_SUCCESS } from "./actiontype" 2 | 3 | 4 | 5 | const initstate = 6 | { 7 | isauth: false, 8 | isloading: false, 9 | iserror: false, 10 | password:"", 11 | resume:"", 12 | personal: { 13 | name:"", 14 | email:"", 15 | mobile:"", 16 | dob:"", 17 | location:"", 18 | gender:"" 19 | }, 20 | worksummary:{ 21 | title:"", 22 | summary:"", 23 | experience:[1, 4], 24 | largestteam:"", 25 | anualsalary:"", 26 | notice:"" 27 | }, 28 | employment:{ 29 | title:"", 30 | company:"", 31 | duration:"", 32 | industry: "", 33 | functionalarea:"" 34 | }, 35 | education:[{ 36 | title:"", 37 | branch:"", 38 | college:"" 39 | }], 40 | skills: [], 41 | desired:{ 42 | role:"Not mentioned", 43 | location:"All India", 44 | department:"", 45 | industry:"- Any -", 46 | jobtype:"- Any -", 47 | shifttype:"", 48 | salary:"" 49 | } 50 | 51 | 52 | 53 | 54 | } 55 | 56 | 57 | 58 | 59 | function regireducer(state = initstate, { type, payload}) 60 | { 61 | console.log(state, type, payload) 62 | switch(type) 63 | { 64 | 65 | case REGISTER_SUCCESS: 66 | { 67 | return { 68 | ...state, 69 | isloading: false, 70 | isauth: false, 71 | 72 | } 73 | } 74 | case REGISTER_REQUEST: 75 | { 76 | return { 77 | ...state, 78 | isauth: false, 79 | } 80 | } 81 | 82 | default: { 83 | return { 84 | ...state 85 | } 86 | 87 | } 88 | 89 | } 90 | 91 | } 92 | export default regireducer; -------------------------------------------------------------------------------- /src/Components/Home/CoolPlaces.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styles from "./home.module.css"; 3 | 4 | function CoolPlaces() { 5 | const work = [ 6 | { 7 | img: "https://static2.shine.com/r/m/images/employerbranding/78f6785288bd42f181187b8de9dccafb.png", 8 | nam: "https://static2.shine.com/r/m/images/employerbranding/a7277bda1c874825b9831cafaf6f759d.png", 9 | }, 10 | { 11 | img: "https://static2.shine.com/r/m/images/employerbranding/c250bee50f5b490aac4b63fe281ab79e.png", 12 | nam: "https://static2.shine.com/r/m/images/employerbranding/4ba34994bc414de7984c38c9cee86ebe.png", 13 | }, 14 | { 15 | img: "https://static2.shine.com/r/m/images/employerbranding/608a7830f65e4ac4a70869e145c55c25.png", 16 | nam: "https://static2.shine.com/r/m/images/employerbranding/449660b6ea5c4aada2e211f4831cc945.png", 17 | }, 18 | { 19 | img: "https://static2.shine.com/r/m/images/employerbranding/26c83ce6d9df4733a9bbc06d2e3b8f0e.png", 20 | nam: "https://static2.shine.com/r/m/images/employerbranding/4dfb695a95c847889217673f9b1c6b32.png", 21 | }, 22 | { 23 | img: "https://static2.shine.com/r/m/images/employerbranding/d98a014b326648178fbb08eef46ac70e.png", 24 | nam: "https://static2.shine.com/r/m/images/employerbranding/6c23dfb3c9224480870c900b8dddf299.png", 25 | }, 26 | ]; 27 | return ( 28 |
29 |

Cool places to work

30 |
31 | {work.map((el) => ( 32 |
33 |
34 | company 35 |
36 |
37 | {" "} 38 | company name 43 |
44 |
45 | ))} 46 |
47 |
48 | ); 49 | } 50 | 51 | export default CoolPlaces; 52 | -------------------------------------------------------------------------------- /src/Redux/Register/action.js: -------------------------------------------------------------------------------- 1 | import { REGISTER_REQUEST, REGISTER_SUCCESS } from "./actiontype" 2 | import Axios from "axios" 3 | 4 | 5 | 6 | 7 | 8 | export const registering = (payload) => dispatch => { 9 | console.log("registering") 10 | console.log(payload) 11 | const {name, email, mobile, gender, location, degree, 12 | college, course, skills, title, 13 | company, industry, functionalarea } = payload 14 | 15 | dispatch(registerrequest()) 16 | Axios.post("https://json-heroku-shubham.herokuapp.com/applicant",{ 17 | "name": name, 18 | "title": "", 19 | "email": email, 20 | "mobile": mobile, 21 | "resume": "", 22 | "personal": { 23 | "name": name, 24 | "email": email, 25 | "mobile": mobile, 26 | "dob": "", 27 | "location": location, 28 | "gender": gender 29 | }, 30 | "worksummary": { 31 | "title": title, 32 | "summary": "", 33 | "experience": [ ], 34 | "largestteam": "", 35 | "anualsalary": "", 36 | "notice": "" 37 | }, 38 | "employment": { 39 | "title": title, 40 | "company": company, 41 | "duration": "", 42 | "industry": industry, 43 | "functionalarea": functionalarea 44 | }, 45 | "education": 46 | { 47 | "title": degree, 48 | "branch": course, 49 | "college": college 50 | } 51 | , 52 | "skills": skills, 53 | "desired": { 54 | "role": "", 55 | "location": "", 56 | "department": "", 57 | "industry": "", 58 | "jobtype": "", 59 | "shifttype": "", 60 | "salary": "" 61 | } 62 | 63 | 64 | }) 65 | .then((res) => { 66 | console.log(res.data) 67 | dispatch(registersuccess(res.data)) 68 | }) 69 | 70 | } 71 | 72 | 73 | 74 | const registerrequest = (payload) => { 75 | return { 76 | type: REGISTER_REQUEST, 77 | payload 78 | } 79 | } 80 | 81 | const registersuccess = (payload) => { 82 | return { 83 | type: REGISTER_SUCCESS, 84 | payload 85 | } 86 | } 87 | -------------------------------------------------------------------------------- /src/Components/Home/TotalCompany.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styles from "./home.module.css"; 3 | 4 | function TotalCompany() { 5 | const image = [ 6 | "https://static2.shine.com/r/m/images/employerbranding/ab28f0af876f42cb96302faaea9e1671.png", 7 | "https://static2.shine.com/r/m/images/employerbranding/8ec12c71c03445248ec99942e16a812c.png", 8 | "https://static2.shine.com/r/m/images/employerbranding/5bce8f621d0946ad809145aac70fc3ae.png", 9 | "https://static2.shine.com/r/m/images/employerbranding/8b3d3868f9444657ad239ed43eb423b8.png", 10 | "https://static2.shine.com/r/m/images/employerbranding/c9e56f9bb48e4989853bf49e7b67dae3.png", 11 | "https://static2.shine.com/r/m/images/employerbranding/3312a542609b462fad0ba4ae351d5730.jpg", 12 | "https://static2.shine.com/r/m/images/employerbranding/9f53b7d4345d41ac9b657b726b6b3349.png", 13 | "https://static2.shine.com/r/m/images/employerbranding/da1f7501c8f740498dbb4b28fde081c2.png", 14 | "https://static2.shine.com/r/m/images/employerbranding/f85756b6a88e4997beaf87c6f1bb5cfd.png", 15 | "https://static2.shine.com/r/m/images/employerbranding/f548e2c309c24db1a8b9d4ff9d97b02e.png", 16 | "https://static2.shine.com/r/m/images/employerbranding/0d05cc5f036a4643ae5fa0a29a974326.png", 17 | "https://static2.shine.com/r/m/images/employerbranding/c969fd8c9049479ebf9133033e77df03.png", 18 | "https://static2.shine.com/r/m/images/employerbranding/6cf7d2611de84b7585d75db2f40e81b8.png", 19 | "https://static2.shine.com/r/m/images/employerbranding/b48b41afcd524c0b8a9e596cd945ad89.png", 20 | "https://static2.shine.com/r/m/images/employerbranding/3d1475db6ef84d5d98cbda15f16d4c5d.png", 21 | ]; 22 | return ( 23 |
24 |

Top companies hiring now

25 |
26 | {image.map((el) => ( 27 |
28 | Companies logo 29 |
30 | ))} 31 |
32 |
33 | ); 34 | } 35 | 36 | export default TotalCompany; 37 | -------------------------------------------------------------------------------- /src/Components/ChatBot/ChatBot.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Chatbox from "./Chatbox.png" 3 | import Styles from "./ChatBot.module.css" 4 | // import JobAlert from '../CreateJobAlert/JobAlert' 5 | function ChatBot() { 6 | const [status, setStatus]=React.useState(true) 7 | const [hide, setHide]=React.useState("") 8 | const [chat, setChat]= React.useState([]) 9 | const [reply, setReply]=React.useState(false) 10 | 11 | const handleBtn=()=>{ 12 | setChat([...chat,hide]); 13 | setReply(true); 14 | setHide("") 15 | } 16 | return ( 17 |
18 |
19 |
20 |

Alisha

21 |
22 |
23 |

Hi, I am Alisha, Welcome aboard!

24 |

How can i help you today?

25 |
26 |
{chat.map(el=>

{el}

) 27 | } 28 |
29 |

30 | We are happy to Help you, Kindly contact our Customer Care number 080-47105555 31 |

32 |
33 | setHide(e.target.value)} type="text"/> 34 | 35 |
36 | 37 |
38 |
39 |
setStatus(!status)} className={Styles.chatbotbutton}>
40 |
41 |
42 | 43 | 44 | ) 45 | } 46 | 47 | export default ChatBot 48 | -------------------------------------------------------------------------------- /src/Redux/RecruiterDash/action.js: -------------------------------------------------------------------------------- 1 | import { 2 | RECRUITER_DASH_REQUEST, 3 | RECRUITER_DASH_SUCCESS, 4 | RECRUITER_DASH_FAILURE, 5 | DASHBOARD_CANDIDATE_REQUEST, 6 | DASHBOARD_CANDIDATE_SUCCESS, 7 | DASHBOARD_CANDIDATE_FAILURE, 8 | } from "./actionType" 9 | import axios from "axios" 10 | 11 | const getUserData = () => (dispatch) => { 12 | const dashRequest = recruiter_dash_request() 13 | dispatch(dashRequest) 14 | 15 | return axios.get("https://json-heroku-shubham.herokuapp.com/applications") 16 | .then(resp => { 17 | const dashSuccess = recruiter_dash_success(resp.data) 18 | dispatch(dashSuccess) 19 | }) 20 | .catch(err => { 21 | const dashFailure = recruiter_dash_failure() 22 | dispatch(dashFailure) 23 | }) 24 | } 25 | 26 | const singleUserData = (id) => (dispatch) => { 27 | const singleRequest = dashboard_candidate_request() 28 | dispatch(singleRequest) 29 | return axios.get(`https://json-heroku-shubham.herokuapp.com/applications/${id}`) 30 | .then(resp => { 31 | const singleSuccess = dashboard_candidate_success(resp.data) 32 | dispatch(singleSuccess) 33 | }) 34 | .catch(err => { 35 | const singleFailure = dashboard_candidate_failure() 36 | dispatch(singleFailure) 37 | }) 38 | } 39 | 40 | const recruiter_dash_request = () => { 41 | return{ 42 | type: RECRUITER_DASH_REQUEST 43 | } 44 | } 45 | 46 | const recruiter_dash_success = (payload) => { 47 | return{ 48 | type: RECRUITER_DASH_SUCCESS, 49 | payload 50 | } 51 | } 52 | 53 | const recruiter_dash_failure = () => { 54 | return{ 55 | type: RECRUITER_DASH_FAILURE 56 | } 57 | } 58 | 59 | const dashboard_candidate_request = () => { 60 | return{ 61 | type: DASHBOARD_CANDIDATE_REQUEST 62 | } 63 | } 64 | 65 | const dashboard_candidate_success = (payload) => { 66 | return{ 67 | type: DASHBOARD_CANDIDATE_SUCCESS, 68 | payload 69 | } 70 | } 71 | 72 | const dashboard_candidate_failure = () => { 73 | return{ 74 | type: DASHBOARD_CANDIDATE_FAILURE 75 | } 76 | } 77 | 78 | export {getUserData, singleUserData} -------------------------------------------------------------------------------- /src/Components/Home/Premium.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styles from "./home.module.css"; 3 | 4 | function Premium() { 5 | return ( 6 |
7 |
8 |
9 |
10 |
11 |
12 |
21 | Shine Premium 22 |
23 |
24 |
25 | 26 |
34 | Fastrack your jon search with our premium services 35 |
36 |
37 |
38 |
39 |
40 | Enhanced Profile 41 |
42 |
43 |
44 | 10x higher visibility to recruters 45 |
46 |
47 |
48 | Insights on other applicants 49 |
50 |
51 |
52 | Interview Ready 53 |
54 |
55 |
56 |
57 | 58 |
59 |
60 | 61 |
62 |
63 | ); 64 | } 65 | 66 | export default Premium; 67 | -------------------------------------------------------------------------------- /src/Redux/Login/loginreducer.js: -------------------------------------------------------------------------------- 1 | import { LOGIN_REQUEST, LOGIN_SUCCESS, LOGIN_FAILURE } from "./actiontype" 2 | 3 | 4 | 5 | const initstate = 6 | { 7 | isauth: false, 8 | isloading: false, 9 | iserror: false, 10 | isfailure: false, 11 | payload: { 12 | id: "", 13 | name: "", 14 | title: "", 15 | email: "", 16 | mobile: "", 17 | resume: "", 18 | personal: { 19 | name: "", 20 | email: "", 21 | mobile: "", 22 | dob: "", 23 | location: "", 24 | gender: "" 25 | }, 26 | worksummary: { 27 | title: "", 28 | summary: "", 29 | experience: [ 30 | 1, 31 | 4 32 | ], 33 | largestteam: "", 34 | anualsalary: "", 35 | notice: "" 36 | }, 37 | employment: { 38 | title: "", 39 | company: "", 40 | duration: "", 41 | industry: "", 42 | functionalarea: "" 43 | }, 44 | education: { 45 | title: "", 46 | branch: "", 47 | college: "" 48 | }, 49 | skills: [ 50 | 51 | ], 52 | desired: { 53 | role: "", 54 | location: "", 55 | department: "", 56 | industry: "", 57 | jobtype: "", 58 | shifttype: "", 59 | salary: "" 60 | } 61 | } 62 | 63 | } 64 | 65 | 66 | 67 | 68 | function loginreducer(state = initstate, { type, payload}) 69 | { 70 | 71 | console.log(state, type, payload) 72 | switch(type) 73 | { 74 | 75 | case LOGIN_SUCCESS: 76 | { 77 | 78 | console.log(payload) 79 | 80 | return { 81 | ...state, 82 | isauth: true, 83 | isloading: false, 84 | payload 85 | } 86 | } 87 | case LOGIN_REQUEST: 88 | { 89 | return { 90 | ...state, 91 | isauth: false, 92 | } 93 | } 94 | 95 | case LOGIN_FAILURE: 96 | { 97 | return { 98 | ...state, 99 | isauth: false, 100 | isfailure: true 101 | } 102 | } 103 | 104 | 105 | 106 | default: { 107 | return { 108 | ...state 109 | } 110 | 111 | } 112 | 113 | } 114 | 115 | } 116 | export default loginreducer; -------------------------------------------------------------------------------- /src/Routes/Routes.jsx: -------------------------------------------------------------------------------- 1 | import React from "react" 2 | import { Route, Switch } from "react-router-dom" 3 | import Login from "../Components/LogIn/Login" 4 | import Register from "../Components/Register/Register"; 5 | import Home from "../Components/Home/Home" 6 | import NavBar from "../Components/Navbar/NavBar"; 7 | import JobAlert from "../Components/CreateJobAlert/JobAlert"; 8 | import { RecruiterDashboard } from "../Components/RecruiterDash/RecruiterDashboard"; 9 | import JobDescriptionSidebar from "../Components/JobDescription/JobDescriptionSidebar"; 10 | import JobSearch from "../Components/JobSearch/JobSearch"; 11 | import JobPost from "../Components/JobPost/JobPost"; 12 | import { AfterLoginNav } from "../Components/Navbar/AfterLoginNav"; 13 | import { useSelector } from "react-redux"; 14 | import AdvancedComponent from "../Components/Home/AdvancedComponent"; 15 | import PageNotFound from "../Components/Home/PageNotFound"; 16 | import { TransitionsModal } from "../Components/Modal/Modal"; 17 | import RecruiterLogin from "../Components/RecruiterLogin/RecruiterLogin" 18 | import LoginFail from "../Components/Popouts/LoginFail"; 19 | import {PrivateRoute} from "./PrivateRoutes" 20 | 21 | function Routes() 22 | { 23 | const isAuth = useSelector((state) => state.logi.isauth) 24 | 25 | return( 26 |
27 | {isAuth? : } 28 | {console.log(isAuth)} 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 |
71 | ) 72 | 73 | } 74 | 75 | export default Routes; -------------------------------------------------------------------------------- /src/Components/CreateJobAlert/JobAlertFAQ.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Styles from "./JobAlert.module.css" 3 | 4 | function JobAlertFAQ() { 5 | const [ptag1, setPtag1]=React.useState(true) 6 | const [ptag2, setPtag2]=React.useState(false) 7 | const [ptag3, setPtag3]=React.useState(false) 8 | return ( 9 |
10 |
11 |

Not Registered on Shine?

12 |

Register now and get discovered by over 14,000 recruiters!

13 | 14 |
15 |
16 |
17 | FAQs 18 |
19 |
20 |
21 |

Our free job alert service helps you to get notified for jobs suiting your career goals and makes it easier for you to respond to job openings directly from your inbox. Besides, it helps you to stay updated with the current job market and career opportunities, along with information about salary trends. It is highly beneficial for active as well as passive job seekers. By opting for free job alert service, we make sure you do not miss any openings based on your highly targeted and specific job matches.


22 |
23 |

To get job notifications on your inbox, you need to sign in to shine.com or register with us. You will find a new tab ‘Create Job Alert’ on the top right side of the website. Fill out the details based on your profile and work area. You will start receiving job alerts when a recruiter will start posting vacancies on our job portal. You can create as many job alerts you wish to.


24 |
25 |

You can fetch some of the best job opportunities by providing targeted and detailed information. The system is an automated mechanism which operates and generates matched jobs based on the details you provide. To narrow your feeds, you must provide specific keywords, salary details, experience, location, department and industry. If you do not fill out information for these fields, you will receive job notifications for all job openings. We highly recommend providing specific details while creating a free job alert.

26 |
27 |
28 |
29 | ) 30 | } 31 | 32 | export default JobAlertFAQ 33 | -------------------------------------------------------------------------------- /src/Components/CreateJobAlert/JobAlert.module.css: -------------------------------------------------------------------------------- 1 | .main_div{ 2 | display: flex; 3 | flex-direction: row; 4 | justify-content: space-evenly; 5 | width: 100%; 6 | background-color: whitesmoke; 7 | } 8 | .main_input{ 9 | width: 40%; 10 | } 11 | .sub1{ 12 | width: 100%; 13 | margin: 100px; 14 | } 15 | .sub2{ 16 | width:80%; 17 | margin-left: 100px; 18 | } 19 | .sub1 label{ 20 | align-items: left; 21 | width: 100%; 22 | margin: 30px; 23 | margin-left: 0px; 24 | } 25 | 26 | .sub_div1{ 27 | margin-top: 100px; 28 | width: 40%; 29 | margin-left: 100px; 30 | border: 1px solid black; 31 | border-radius: 10px; 32 | background-color: white; 33 | padding: 25px; 34 | text-align: left; 35 | } 36 | .sub_div1 button{ 37 | width: 75px; 38 | height: 3vh; 39 | background-color: rgb(211, 180, 5); 40 | color: white; 41 | border:none; 42 | } 43 | .sub_div1 button:hover{ 44 | background-color: rgb(240, 205, 6); 45 | } 46 | .input{ 47 | padding: 40px; 48 | border:1px solid black; 49 | background-color: white; 50 | border-radius: 10px; 51 | } 52 | .input input{ 53 | width: 80%; 54 | height: 4vh; 55 | margin:40px; 56 | 57 | } 58 | .input select{ 59 | width: 80%; 60 | height: 4vh; 61 | margin:50px; 62 | } 63 | .sub_div2{ 64 | width: 60%; 65 | height: 120vh; 66 | margin-top: 100px; 67 | margin-left: 80px; 68 | border: 1px solid black; 69 | border-radius: 10px; 70 | background-color: white; 71 | } 72 | .p_tag{ 73 | display: none; 74 | 75 | } 76 | .p_tag2{ 77 | text-align: center; 78 | } 79 | .sub_div2 button{ 80 | margin-top: 20px; 81 | width: 100%; 82 | border: none; 83 | outline: none; 84 | height: 5vh; 85 | font-size: 20px; 86 | background-color: white; 87 | } 88 | .Register{ 89 | text-align: center; 90 | } 91 | .Register button{ 92 | width: 150px; 93 | height: 5vh; 94 | background-image: linear-gradient(136deg,#a296d9 0%,#7faee0 100%); 95 | color: white; 96 | font-size: 18px; 97 | border-radius: 10px; 98 | border:none; 99 | outline: none; 100 | cursor: pointer; 101 | } 102 | .registerbtn{ 103 | width: 90%; 104 | margin-top: 50px; 105 | display: flex; 106 | flex-direction: row; 107 | border:1px solid black; 108 | border-radius: 10px; 109 | text-align: left; 110 | } 111 | .registerbtn h3{ 112 | margin-left: 50px; 113 | } 114 | .registerbtn p{ 115 | margin-left: 50px; 116 | } 117 | .registerbtn button{ 118 | margin-top: 15px; 119 | width: 125px; 120 | height: 6vh; 121 | font-size: 20px; 122 | margin-left: 200px; 123 | padding: 10px; 124 | background-color: white; 125 | color: blue; 126 | outline: none; 127 | cursor: pointer; 128 | } 129 | .JobAlertFooter{ 130 | width: 55%; 131 | padding: 1%; 132 | margin: 100px; 133 | border:1px solid black; 134 | border-radius: 10px; 135 | background-color: white; 136 | } -------------------------------------------------------------------------------- /src/Components/Home/Resume.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styles from "./home.module.css"; 3 | 4 | function Resume() { 5 | return ( 6 |
7 |
17 |

Having trouble writing your resume?

18 |
19 |
20 | 29 | Resume Writing 30 | 31 | 40 | Highlight right skills on resume to get noticed by recruiters and 41 | hired faster 42 | 43 |
44 | 45 |
46 |
47 |
48 |
49 | 58 | Resume Builder 59 | 60 | 69 | Build impressive resume instantly with ready to use templates 70 | 71 |
72 | 73 |
74 |
75 |
76 |
77 |
78 | resume 87 |
88 |
89 |
90 | ); 91 | } 92 | 93 | export default Resume; 94 | -------------------------------------------------------------------------------- /src/Redux/RecruiterDash/RecruiterDasReducer.js: -------------------------------------------------------------------------------- 1 | import { 2 | RECRUITER_DASH_REQUEST, 3 | RECRUITER_DASH_SUCCESS, 4 | RECRUITER_DASH_FAILURE, 5 | DASHBOARD_CANDIDATE_REQUEST, 6 | DASHBOARD_CANDIDATE_SUCCESS, 7 | DASHBOARD_CANDIDATE_FAILURE, 8 | } from "./actionType" 9 | 10 | const initState = { 11 | data: [], 12 | CandiData: { 13 | userName: "", 14 | call: false, 15 | interview_status: "Not_Submitted", 16 | gender: "", 17 | dob: "", 18 | email: "", 19 | phone: "", 20 | applied_company: "", 21 | applied_position: "", 22 | location: "", 23 | experience: "", 24 | qualification: "", 25 | skills: [], 26 | comments: [], 27 | id: "" 28 | }, 29 | isLoading: false, 30 | isError: false, 31 | } 32 | 33 | export const RecruiterDashReducer = (state=initState, action) => { 34 | switch(action.type){ 35 | case RECRUITER_DASH_REQUEST:{ 36 | return{ 37 | ...state, 38 | isLoading: true, 39 | isError: false, 40 | } 41 | } 42 | 43 | case RECRUITER_DASH_SUCCESS:{ 44 | return{ 45 | ...state, 46 | data: action.payload, 47 | isLoading: false, 48 | } 49 | } 50 | 51 | case RECRUITER_DASH_FAILURE:{ 52 | return{ 53 | ...state, 54 | isLoading: false, 55 | isError: true, 56 | } 57 | } 58 | 59 | case DASHBOARD_CANDIDATE_REQUEST:{ 60 | return{ 61 | ...state, 62 | isLoading: true, 63 | isError: false, 64 | } 65 | } 66 | 67 | case DASHBOARD_CANDIDATE_SUCCESS:{ 68 | return{ 69 | ...state, 70 | CandiData: { 71 | userName: action.payload.name, 72 | call: action.payload.call, 73 | interview_status: action.payload.interview_status, 74 | gender: action.payload.gender, 75 | dob: action.payload.dob, 76 | email: action.payload.email, 77 | phone: action.payload.phone, 78 | applied_company: action.payload.applied_company, 79 | applied_position: action.payload.applied_position, 80 | location: action.payload.location, 81 | experience: action.payload.experience, 82 | qualification: action.payload.qualification, 83 | skills: action.payload.skills, 84 | comments: action.payload.comments, 85 | id: action.payload.id 86 | }, 87 | // remark: action.payload.comments, 88 | isLoading: false, 89 | } 90 | } 91 | 92 | case DASHBOARD_CANDIDATE_FAILURE:{ 93 | return{ 94 | ...state, 95 | isLoading: false, 96 | isError: true, 97 | } 98 | } 99 | 100 | default: return state 101 | } 102 | } -------------------------------------------------------------------------------- /src/Components/Home/Home.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | import { useSelector } from "react-redux"; 3 | import { Link } from "react-router-dom"; 4 | import AdvanceSearch from "./AdvanceSearch"; 5 | import CoolPlaces from "./CoolPlaces"; 6 | import Course from "./Course"; 7 | import Footer from "./Footer"; 8 | import GetJob from "./GetJob"; 9 | import styles from "./home.module.css"; 10 | import Premium from "./Premium"; 11 | import Resume from "./Resume"; 12 | import TotalCompany from "./TotalCompany"; 13 | import Why from "./Why"; 14 | 15 | function Home() { 16 | const [isAuth, setIsAuth] = useState(false); 17 | const newAuth = useSelector((state) => state.logi.isauth); 18 | 19 | return ( 20 |
21 |
22 | {isAuth ? ( 23 | 24 | ) : ( 25 | <> 26 |
27 |

Growth on your mind?

28 |

Explore 300,000+ jobs

29 | 37 |
38 | {!newAuth && ( 39 |
40 | 41 | 44 | 45 | 46 | {" "} 47 |
48 |

Sign in

49 |
50 | 51 |
52 | )} 53 | 54 | )} 55 |
56 | 57 | 58 |
59 | 75 |
76 | 77 |
78 | company banner 83 |
84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 |
96 |
97 | ); 98 | } 99 | 100 | export default Home; 101 | -------------------------------------------------------------------------------- /src/Components/Home/GetJob.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styles from "./home.module.css"; 3 | 4 | function GetJob() { 5 | return ( 6 |
7 |

8 | Get instant job alerts from top companies 9 |

10 |

11 | Be the first one to apply to jobs 12 |

13 | 14 |
15 |
16 |
24 |
25 |
26 | 91 27 | 28 |
29 |
30 | 45 |
46 |
47 |
55 |
56 | Rated{" "} 57 |
{" "} 58 |
{" "} 59 |
{" "} 60 |
{" "} 61 |
62 |
63 |
66 | |{" "} 67 | 68 | 10 million 69 | {" "} 70 | downloads 71 |
72 |
73 |
74 |
75 |
76 | 79 |
80 |
81 | 84 |
85 |
86 |
87 |
88 |
89 |
90 | ); 91 | } 92 | 93 | export default GetJob; 94 | -------------------------------------------------------------------------------- /src/Components/Navbar/NavBar.module.css: -------------------------------------------------------------------------------- 1 | .navContainer, .navAfterContainer{ 2 | width: 100%; 3 | height: 60px; 4 | /* border-bottom: 1px solid; 5 | border-top: 1px solid; */ 6 | display: flex; 7 | background: linear-gradient(135deg,#5a3ea5 0%,#4b30bd 50%,#4b30bd 100%); 8 | position: sticky; 9 | top: 0; 10 | } 11 | 12 | .navAfterContainer{ 13 | background: white; 14 | } 15 | 16 | .LogoBox{ 17 | width: 85px; 18 | height: 60px; 19 | /* border: 1px solid; */ 20 | } 21 | 22 | .navContainer_Links, .navAfterContainer_Links{ 23 | display: flex; 24 | text-decoration: none; 25 | color: black; 26 | width: 40%; 27 | height: 40px; 28 | margin-left: 1%; 29 | margin-right: 12%; 30 | /* border: 1px solid; */ 31 | margin-top: 0.8%; 32 | } 33 | 34 | .navContainer_Links>a, .navAfterContainer_Links>a{ 35 | text-decoration: none; 36 | color: black; 37 | padding: 5px; 38 | color: white; 39 | margin-left: 4%; 40 | border: 1px inherit; 41 | height: 20px; 42 | margin-top: 1%; 43 | border-top-right-radius: 5px; 44 | border-top-left-radius: 5px; 45 | } 46 | 47 | .navAfterContainer_Links>a{ 48 | color: black; 49 | text-decoration: none; 50 | } 51 | 52 | .navAfterContainer_Links>a:hover{ 53 | color: blue; 54 | } 55 | 56 | .navContainer_Links>a:hover, .navContainer_Jalert:hover, .navContainer_Jalert1:hover{ 57 | background-color: white; 58 | color: black; 59 | } 60 | 61 | .navContainer_Links>a:hover{ 62 | box-shadow: 0 1px 8px rgba(0, 0, 0, 0.3); 63 | } 64 | 65 | 66 | .navContainer_Img{ 67 | width: 8%; 68 | height: 70px; 69 | /* border: 1px solid; */ 70 | cursor: pointer; 71 | margin-left: 2%; 72 | border-radius: 20px; 73 | background-image: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 74 | background-position: -2px 0px; 75 | } 76 | 77 | .img{ 78 | width: 100%; 79 | height: 100%; 80 | } 81 | 82 | .navContainer_Jalert, .navContainer_Jalert1, .navContainer_Jalert2{ 83 | width: 10%; 84 | height: 35px; 85 | border: none; 86 | border: 1px solid white; 87 | text-align: center; 88 | margin-top: 0.8%; 89 | margin-left: 2%; 90 | background-color: inherit; 91 | color: white; 92 | border-radius: 5px; 93 | cursor: pointer; 94 | } 95 | 96 | .navContainer_Jalert1{ 97 | width: 100%; 98 | margin-top: 12.5%; 99 | margin-left: 2%; 100 | } 101 | .navContainer_Jalert2{ 102 | width: 100%; 103 | margin-top: 18%; 104 | margin-left: 20%; 105 | } 106 | 107 | .navContainer_Jalert{ 108 | width: 120%; 109 | margin-top: 13.5%; 110 | margin-left: 30%; 111 | } 112 | 113 | .navContainer_Contact{ 114 | width: 10%; 115 | height: 35px; 116 | /* border: 1px solid; */ 117 | text-align: center; 118 | margin-top: 0.8%; 119 | margin-left: 5%; 120 | } 121 | 122 | .navContainer_Contact>div:nth-child(1){ 123 | font-size: 15px; 124 | color: white; 125 | } 126 | 127 | .navContainer_Contact>div:nth-child(2){ 128 | font-size: 12px; 129 | color: #6e4a97; 130 | } 131 | 132 | .menuItems{ 133 | width: auto; 134 | height: auto; 135 | padding: 5px; 136 | border: 1px solid black; 137 | } 138 | 139 | .userName{ 140 | width: auto; 141 | height: 35px; 142 | border: 1px solid rgb(201, 201, 201); 143 | border-radius: 5px; 144 | margin-top: 1%; 145 | cursor: pointer; 146 | background: inherit; 147 | } 148 | 149 | .userButton{ 150 | margin-top: 1%; 151 | margin-left: 20%; 152 | } 153 | 154 | .navtitle1{ 155 | text-decoration: none; 156 | color: ""; 157 | } 158 | 159 | .navLink2{ 160 | text-decoration: none; 161 | color: white; 162 | } -------------------------------------------------------------------------------- /src/Components/Home/AdvanceSearch1.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect } from "react"; 2 | import { useHistory } from "react-router-dom"; 3 | import styles from "./home.module.css"; 4 | const payload = { 5 | title: "", 6 | location: "", 7 | experience: "", 8 | }; 9 | 10 | function AdvanceSearch1({ setIsAuth }) { 11 | const [userData, setUserData] = React.useState(payload); 12 | const { title, location, experience } = userData; 13 | 14 | let parm = new URLSearchParams(); 15 | let history = useHistory(); 16 | 17 | const handleSubmit = () => { 18 | history.push("/advancesearch?" + parm.toString()); 19 | }; 20 | 21 | useEffect(() => { 22 | for (let key in userData) { 23 | if (userData[key]) { 24 | parm.set(key, userData[key]); 25 | } 26 | } 27 | }, [userData, parm]); 28 | 29 | const exp = [ 30 | "Experience", 31 | "0", 32 | "1", 33 | "2", 34 | "3", 35 | "4", 36 | "5", 37 | "6", 38 | "7", 39 | "8", 40 | "9", 41 | "10", 42 | "11", 43 | "12", 44 | "13", 45 | "14", 46 | "15", 47 | "16", 48 | "17", 49 | "18", 50 | "19", 51 | "20", 52 | "21", 53 | "22", 54 | "23", 55 | "24", 56 | "25+", 57 | ]; 58 | const handleUserData = (e) => { 59 | const { value, name } = e.target; 60 | 61 | setUserData({ ...userData, [name]: value }); 62 | }; 63 | 64 | console.log(userData); 65 | return ( 66 |
67 | 80 | 81 |
82 |
83 | 84 | 91 |
104 | Required 105 |
106 |
107 |
108 | 109 | 116 |
117 |
121 | 134 |
135 | 136 |
145 | {" "} 158 | Advanced search 159 |
160 |
161 |
162 | ); 163 | } 164 | 165 | export default AdvanceSearch1; 166 | -------------------------------------------------------------------------------- /src/Components/Home/AdvanceSearch.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect } from "react"; 2 | import { useHistory } from "react-router-dom"; 3 | import styles from "./home.module.css"; 4 | const payload = { 5 | title: "", 6 | location: "", 7 | experience: "", 8 | }; 9 | 10 | function AdvanceSearch({ setIsAuth }) { 11 | const [userData, setUserData] = React.useState(payload); 12 | const { title, location, experience } = userData; 13 | 14 | let parm = new URLSearchParams(); 15 | let history = useHistory(); 16 | 17 | const handleSubmit = () => { 18 | history.push("/advancesearch?" + parm.toString()); 19 | }; 20 | 21 | useEffect(() => { 22 | for (let key in userData) { 23 | if (userData[key]) { 24 | parm.set(key, userData[key]); 25 | } 26 | } 27 | }, [userData, parm]); 28 | 29 | const exp = [ 30 | "Experience", 31 | "0", 32 | "1", 33 | "2", 34 | "3", 35 | "4", 36 | "5", 37 | "6", 38 | "7", 39 | "8", 40 | "9", 41 | "10", 42 | "11", 43 | "12", 44 | "13", 45 | "14", 46 | "15", 47 | "16", 48 | "17", 49 | "18", 50 | "19", 51 | "20", 52 | "21", 53 | "22", 54 | "23", 55 | "24", 56 | "25+", 57 | ]; 58 | const handleUserData = (e) => { 59 | const { value, name } = e.target; 60 | 61 | setUserData({ ...userData, [name]: value }); 62 | }; 63 | 64 | return ( 65 |
66 |

67 | Growth on your mind?{" "} 68 | 80 |

81 | 82 |
83 |
84 | 85 | 92 |
105 | Required 106 |
107 |
108 |
109 | 110 | 117 |
118 |
122 | 135 |
136 | 137 |
146 | {" "} 159 | Advanced search 160 |
161 |
162 |
163 | ); 164 | } 165 | 166 | export default AdvanceSearch; 167 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Shine (clone) 🌐 2 | 3 | **Shine.com** is the most innovative and second largest online job portal in India. Founded in 2008, over the past decade, Shine.com has become a prominent name in the recruitment industry. The popularity of the portal is evident from the fact that it has crossed 3.90 crore candidate landmark and has more than 3 lakh latest job vacancies from leading companies on site. 4 | 5 | In this project we have tried to make a look alike clone of **Shine.com**. With our efforts and the technology stack, that we have learned so far in the masai school, we were able to clone the front end with high precision and quality. 6 | 7 | # Technology Stack Used 💻 8 | 9 | In this project we have used the following tech stack. 10 | 11 | - React: [React](https://www.npmjs.com/package/react) 12 | - Redux: [Redux](https://www.npmjs.com/package/redux) 13 | - CSS: [CSS](https://styled-components.com/) 14 | 15 |
16 | 17 | ## Libraries Used 🌟 18 | 19 | 1. Custom UI: [Custom UI](https://www.npmjs.com/package/@shubhamsharma585/custom-ui-shinemasai) 20 | 2. React-Redux: [React-Redux](https://www.npmjs.com/package/react-redux) 21 | 3. Redux-thunks: [Redux-thunks](https://www.npmjs.com/package/thunks) 22 | 4. Images: [Shine](https://www.shine.com/) 23 | 5. Fonts: [Google Fonts](https://fonts.google.com/) 24 | 6. Icons:[Awesome Icon](https://www.w3schools.com/icons/fontawesome5_intro.asp) 25 | 7. Axios: [Axios](https://www.npmjs.com/package/axios) 26 | 8. Material UI: [Material UI](https://material-ui.com/) 27 | 9. Firebase: [Firebase](https://firebase.google.com/) 28 | 10. React Tabs: [React Tabs](https://www.npmjs.com/package/react-tabs) 29 | 11. React Text Collapse: [React Text Collapse](https://www.npmjs.com/package/react-text-collapse) 30 | 31 | You can install the libraries using the "**npm install**" command 32 |
33 | 34 | ## How to run the project 📑 35 | 36 | In this project we were able to achieve a near to perfect clone of the original website. As we do not want to overwhelm you, we haven't shared all the pages here.Please fork the repository and then use it on your own. If you want to collaborate with us on this project then please feel free to reach out to us. 37 | 38 | You can also take the glimpse of our Project,just follow the below steps: 39 | 40 | 1.run the command npm run start in terminal to start the app at port 3000. 41 | 42 | 2.Go to the browser you will land in the landing page just Register and login if you have signed up before or do the signup. 43 | 44 | 3.Our website had 2 things User can apply for post and company can post jobs. 45 | 46 |
47 | 48 | ## Snapshots 📷 49 | 50 | 1. Shine Page 51 | 52 | ![shine](https://github.com/Shubhamsharma585/Shine-masai/blob/main/public/Snapshots/landingPage.jpg) 53 | 54 | 2. Advanced Search Page 55 | 56 | ![shine](https://github.com/Shubhamsharma585/Shine-masai/blob/main/public/Snapshots/advanceSearch.jpg) 57 | 58 | 3. Login Page 59 | 60 | ![shine](https://github.com/Shubhamsharma585/Shine-masai/blob/main/public/Snapshots/loginPage.jpg) 61 | 62 | 4. Landing Page After Login 63 | 64 | ![shine](https://github.com/Shubhamsharma585/Shine-masai/blob/main/public/Snapshots//afterLogin.jpg) 65 | 66 | 5. Job Details Page 67 | 68 | ![shine](https://github.com/Shubhamsharma585/Shine-masai/blob/main/public/Snapshots/jobDetails.jpg) 69 | 70 | 6. Search By Cities Page 71 | 72 | ![shine](https://github.com/Shubhamsharma585/Shine-masai/blob/main/public/Snapshots/searchByCities.jpg) 73 | 74 | 7. Dashboard for Recruiter 75 | 76 | ![shine](https://github.com/Shubhamsharma585/Shine-masai/blob/main/public/Snapshots/recuriterDasboard.jpg) 77 | 78 |
79 | 80 | ## Features 81 | 82 | 1. User can apply for the post accordingly to their skills. 83 | 2. User can post candidates requirement easily. 84 | 85 |
86 | 87 | ## Limitations 88 | 89 | 1. Not responsive yet and might not be properly visible on small screen devices 90 | 91 |
92 | 93 | ## Website Link: 94 | 95 | [Shine](https://shine-masai.vercel.app/) 96 | 97 | ## Team Members and Contributors 😇 98 | 99 | 👤 **Ankit Bajpai** 100 | 101 | - Github: [Ankit Bajpai](https://github.com/ankitbajpai1607) 102 | 103 | 👤 **Shubham Sharma** 104 | 105 | - Github: [Shubham Sharma](https://github.com/Shubhamsharma585) 106 | 107 | 👤 **Deepak Hegde** 108 | 109 | - Github: [Deepak Hegde](https://github.com/Dee-Hegde) 110 | 111 | 👤 **Vinesh Nair** 112 | 113 | - Github: [Vinesh Nair](https://github.com/Vinesh3124) 114 | 115 | ********************************************************************** 116 | -------------------------------------------------------------------------------- /src/Components/RecruiterDash/Dashboard.module.css: -------------------------------------------------------------------------------- 1 | /* body{ 2 | background-color: #cfd8dc; 3 | } */ 4 | 5 | .dash_MainContainer{ 6 | width: 100%; 7 | height: auto; 8 | /* border-top: 1px solid; 9 | border-bottom: 1px solid; */ 10 | /* margin-top: 1%; */ 11 | display: flex; 12 | } 13 | 14 | .mainContainer_CandidateCard_Container{ 15 | width: 40%; 16 | min-height: 500px; 17 | max-height: 750px; 18 | /* border: 1px solid; */ 19 | overflow-x: hidden; 20 | overflow-y: auto; 21 | background-color: whitesmoke; 22 | } 23 | 24 | .mainContainer_CandidateCard{ 25 | width: 95%; 26 | height: auto; 27 | border: 1px solid rgb(216, 216, 216); 28 | margin: auto; 29 | margin-top: 1%; 30 | border-radius: 5px; 31 | box-shadow: -5px 5px 10px #bdbdbd; 32 | } 33 | 34 | .mainContainer_CandidateCard:hover{ 35 | box-shadow: -5px 5px 10px #7c7c7c; 36 | } 37 | 38 | .mainContainer_CandidateCard_Info{ 39 | display: flex; 40 | /* border: 1px solid; */ 41 | flex-wrap: wrap; 42 | width: 95%; 43 | margin: auto; 44 | margin-top: 1%; 45 | padding: 5px; 46 | cursor: pointer; 47 | } 48 | 49 | .mainContainer_CandidateCard_Info>p{ 50 | margin-left: 2%; 51 | } 52 | 53 | .mainContainer_CandidateInfo_Container{ 54 | width: 60%; 55 | height: auto; 56 | /* border: 1px solid; */ 57 | background-color: rgb(236, 236, 236); 58 | } 59 | 60 | .mainContainer_Name, .mainContainer_Email, .mainContainer_Phone, 61 | .mainContainer_Company, .mainContainer_Position, .mainContainer_Location, 62 | .mainContainer_Gender, .mainContainer_DOB, .mainContainer_Exp, .mainContainer_Education, 63 | .mainContainer_Skills{ 64 | width: 90%; 65 | height: auto; 66 | padding: 5px; 67 | margin: auto; 68 | padding: 5px; 69 | margin-top: 1%; 70 | border-bottom: 1px solid rgb(209, 209, 209); 71 | display: flex; 72 | } 73 | 74 | .mainContainer_Gender, .mainContainer_DOB, .mainContainer_Exp, .mainContainer_Location{ 75 | width: 50%; 76 | } 77 | 78 | .mainContainer_Name>div:nth-child(2), .mainContainer_Email>div:nth-child(2), 79 | .mainContainer_Phone>div:nth-child(2), .mainContainer_Company>div:nth-child(2), 80 | .mainContainer_Position>div:nth-child(2), .mainContainer_Location>div:nth-child(2), 81 | .mainContainer_Gender>div:nth-child(2), .mainContainer_DOB>div:nth-child(2), 82 | .mainContainer_Exp>div:nth-child(2), .mainContainer_Education>div:nth-child(2), 83 | .mainContainer_Skills>div:nth-child(2){ 84 | margin-left: 2%; 85 | } 86 | 87 | .mainContainer_Name>div:nth-child(3){ 88 | margin-left: 8%; 89 | width: 35%; 90 | display: flex; 91 | /* border: 1px solid; */ 92 | justify-content: space-between; 93 | } 94 | 95 | .mainContainer_Name>div:nth-child(3)>label{ 96 | display: flex; 97 | } 98 | 99 | .mainContainer_Name>div:nth-child(3)>label>div{ 100 | /* border: 1px solid; */ 101 | width: 20px; 102 | height: 20px; 103 | border-radius: 50%; 104 | } 105 | 106 | .mainContainer_TwoOne{ 107 | display: flex; 108 | width: 91.5%; 109 | margin: auto; 110 | } 111 | 112 | .comments_Buttons_Container{ 113 | width: 92%; 114 | height: 350px; 115 | border: 1px solid rgb(202, 202, 202); 116 | margin: auto; 117 | margin-top: 2%; 118 | margin-bottom: 2%; 119 | display: flex; 120 | border-radius: 5px; 121 | } 122 | 123 | .comments_Container{ 124 | width: 60%; 125 | height: 100%; 126 | /* border: 1px solid; */ 127 | } 128 | 129 | .buttons_Container{ 130 | width: 40%; 131 | height: 100%; 132 | border-left: 1px solid rgb(202, 202, 202); 133 | } 134 | 135 | .comments_Box{ 136 | width: 98%; 137 | height: 70%; 138 | margin: auto; 139 | /* border: 1px solid; */ 140 | overflow-x: hidden; 141 | overflow-y: auto; 142 | margin-top: 1%; 143 | font-size: 14px; 144 | } 145 | 146 | .input_Box{ 147 | width: 100%; 148 | height: 29%; 149 | margin-left: 1%; 150 | /* border: 1px solid; */ 151 | } 152 | 153 | .buttons_Container>button{ 154 | padding: 5px; 155 | margin-top: 2%; 156 | margin-left: 2%; 157 | cursor: pointer; 158 | } 159 | 160 | .dash_MainContainer_Loading{ 161 | width: 150px; 162 | height: 150px; 163 | margin: auto; 164 | margin-top: 15%; 165 | } 166 | 167 | .img{ 168 | width: 100%; 169 | height: 100%; 170 | } 171 | 172 | .mainContainer_Skills_Container{ 173 | display: flex; 174 | flex-wrap: wrap; 175 | } 176 | 177 | .mainContainer_Skills_Container_Item{ 178 | padding: 2px; 179 | border: 1px solid rgb(228, 228, 228); 180 | margin-left: 1%; 181 | margin-top: 1%; 182 | border-radius: 5px; 183 | } -------------------------------------------------------------------------------- /src/Components/Navbar/AfterLoginNav.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Link } from 'react-router-dom' 3 | import styles from "../Navbar/NavBar.module.css" 4 | import styled from "styled-components" 5 | import { useSelector } from "react-redux"; 6 | 7 | const LinkItems = styled.div` 8 | display: none; 9 | position: absolute; 10 | background-color: white; 11 | min-width: 160px; 12 | box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0, 2); 13 | padding: 12px 16px; 14 | z-index: 1; 15 | top: 110.5%; 16 | left: -6.10%; 17 | color: black; 18 | border-top-right-radius: 5px; 19 | border-bottom-right-radius: 5px; 20 | border-bottom-left-radius: 5px; 21 | ` 22 | 23 | const LinkContainer = styled.div` 24 | position: relative; 25 | &:hover ${LinkItems} { 26 | display: block; 27 | } 28 | ` 29 | 30 | const Navtitle = styled.p` 31 | font-size: 12px; 32 | &:hover ${LinkItems} { 33 | display: block; 34 | } 35 | &:hover{ 36 | background-color: #f3f3f3; 37 | cursor: pointer; 38 | padding: 2px; 39 | } 40 | ` 41 | 42 | const AfterLoginNav = () => { 43 | const UserName = useSelector((state) => state.logi.payload?.name) 44 | 45 | const handleLogout = () => { 46 | window.location.reload() 47 | } 48 | 49 | return ( 50 |
51 |
52 |
53 |
54 |
55 | 56 | 57 |
Search Jobs
58 | 59 | Jobs in Top Cities 60 | Jobs by Skills 61 | Jobs by Courses 62 | Jobs by Education 63 | Jobs by Designation 64 | Jobs by Companies 65 | 66 | 67 | 68 | 69 |
Jobs for You
70 | 71 | 72 |
Mailbox
73 | 74 | 75 | 76 |
Profile
77 | 78 | Jobs by Skills 79 | Jobs by Courses 80 | 81 | 82 | 83 | 84 | 85 | 86 |
Services
87 |
88 | 89 | Jobs in Top Cities 90 | Jobs by Skills 91 | Jobs by Courses 92 | Jobs by Education 93 | Jobs by Designation 94 | Jobs by Companies 95 | Jobs in Top Cities 96 | Jobs by Skills 97 | Jobs by Courses 98 | Jobs by Education 99 | Jobs by Designation 100 | Jobs by Companies 101 | 102 |
103 | 104 | 105 |
106 |
107 | 108 | 109 | 112 | 113 | Account Settings 114 | Sign out 115 | 116 | 117 | 118 |
119 |
120 | ) 121 | } 122 | 123 | export {AfterLoginNav} -------------------------------------------------------------------------------- /src/Components/JobDescription/JobDescriptionSidebar.jsx: -------------------------------------------------------------------------------- 1 | import axios from "axios"; 2 | import React, { useState } from "react"; 3 | import { useParams } from "react-router"; 4 | import { JobDescription } from "./JobDescription"; 5 | import styles from "./Tabs.module.css"; 6 | import SearchBar from "../Home/SearchBar"; 7 | 8 | function JobDescriptionSidebar() { 9 | const [data, setData] = useState([]); 10 | const [page, setPage] = React.useState(1); 11 | const [limit, setLimit] = useState(5); 12 | const [isLoading, setIsloading] = React.useState(false); 13 | const [dis, setDis] = useState({}); 14 | 15 | const { location } = useParams(); 16 | 17 | const handleSearch = () => { 18 | setIsloading(true); 19 | const requestParam = { 20 | method: "get", 21 | url: `https://json-heroku-shubham.herokuapp.com/jobDetails?location=${location}`, 22 | params: { 23 | limit: limit, 24 | page: page, 25 | }, 26 | }; 27 | axios(requestParam) 28 | .then((res) => { 29 | setData(res.data); 30 | 31 | setIsloading(false); 32 | }) 33 | .catch((err) => console.log("err")); 34 | }; 35 | 36 | const getData = (id) => { 37 | axios 38 | .get(`https://json-heroku-shubham.herokuapp.com/jobDetails/${id}`) 39 | .then((res) => { 40 | setDis(res.data); 41 | }) 42 | .catch((err) => console.log("err")); 43 | }; 44 | 45 | React.useEffect(handleSearch, [page, limit]); 46 | React.useEffect(() => { 47 | setDis(data[0]); 48 | }, [data, location]); 49 | 50 | return ( 51 | <> 52 |
53 | 54 |
55 |
56 | {isLoading ? ( 57 |
58 | 63 |
64 | ) : ( 65 |
66 |
67 | {data.map((el) => ( 68 |
getData(el.id)} 71 | className={styles.box} 72 | style={{ width: "300px", height: "100px", padding: "5px" }} 73 | > 74 |
75 |
76 |
84 |

91 | {el.title} 92 |

93 |
94 |
95 | 103 | {el.subTitle} 104 | 105 |
106 | 114 |
0 to {el.experience} 115 | Yrs 116 | 117 | 125 |
{el.location} 126 | 127 |
128 |
129 | ))} 130 |
131 |
132 | )} 133 | 134 |
{dis && }
135 |
136 | 137 | ); 138 | } 139 | 140 | export default JobDescriptionSidebar; 141 | -------------------------------------------------------------------------------- /src/Components/Home/AdvancedComponent.jsx: -------------------------------------------------------------------------------- 1 | import axios from "axios"; 2 | import React, { useEffect, useState } from "react"; 3 | import { JobDescription } from "../JobDescription/JobDescription"; 4 | 5 | import styles from "../JobDescription/Tabs.module.css"; 6 | import SearchBar from "./SearchBar"; 7 | 8 | function AdvancedComponent() { 9 | const [datar, setDatar] = useState([]); 10 | const [isLoading, setIsloading] = React.useState(false); 11 | const [data1, setData1] = useState({}); 12 | const [data, setData] = useState([]); 13 | 14 | const [dis, setDis] = useState({}); 15 | 16 | const parms = new URLSearchParams(window.location.search); 17 | 18 | const handleSubmit = () => { 19 | const requestParam = { 20 | method: "get", 21 | url: `https://json-heroku-shubham.herokuapp.com/jobDetails`, 22 | }; 23 | axios(requestParam) 24 | .then((res) => { 25 | setDatar(res.data); 26 | }) 27 | 28 | .catch((err) => console.log("err")); 29 | }; 30 | const results = () => { 31 | const filterData = datar.filter((el) => { 32 | return ( 33 | el.location === data1.location || 34 | el.experience === Number(data1.experience) || 35 | el.skills.includes(data1.title) 36 | ); 37 | }); 38 | setData(filterData); 39 | }; 40 | 41 | console.log(data); 42 | 43 | const getData = (id) => { 44 | axios 45 | .get(`https://json-heroku-shubham.herokuapp.com/jobDetails/${id}`) 46 | .then((res) => { 47 | setDis(res.data); 48 | }) 49 | .catch((err) => console.log("err")); 50 | }; 51 | 52 | React.useEffect(() => { 53 | setDis(data[0]); 54 | }, [data]); 55 | React.useEffect(results, [datar]); 56 | useEffect(() => { 57 | let obj = {}; 58 | for (var pair of parms.entries()) { 59 | obj[pair[0]] = pair[1]; 60 | } 61 | setData1(obj); 62 | handleSubmit(); 63 | }, []); 64 | 65 | console.log(data1); 66 | 67 | return ( 68 |
69 | 70 |
71 | {isLoading ? ( 72 |
73 | 78 |
79 | ) : ( 80 |
81 |
82 | {data.map((el) => ( 83 |
getData(el.id)} 86 | className={styles.box} 87 | style={{ width: "300px", height: "100px", padding: "5px" }} 88 | > 89 |
90 |
91 |
99 |

106 | {el.title} 107 |

108 |
109 |
110 | 118 | {el.subTitle} 119 | 120 |
121 | 129 |
0 to {el.experience} 130 | Yrs 131 | 132 | 140 |
{el.location} 141 | 142 |
143 |
144 | ))} 145 |
146 |
147 | )} 148 | 149 |
{dis && }
150 |
151 |
152 | ); 153 | } 154 | 155 | export default AdvancedComponent; 156 | -------------------------------------------------------------------------------- /src/Components/Navbar/NavBar.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Link } from 'react-router-dom' 3 | import styles from "../Navbar/NavBar.module.css" 4 | import styled from "styled-components" 5 | import { useSelector } from "react-redux" 6 | 7 | const LinkItems = styled.div` 8 | display: none; 9 | position: absolute; 10 | background-color: white; 11 | min-width: 160px; 12 | box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0, 2); 13 | padding: 12px 16px; 14 | z-index: 1; 15 | top: 110.5%; 16 | left: -6.10%; 17 | color: black; 18 | border-top-right-radius: 5px; 19 | border-bottom-right-radius: 5px; 20 | border-bottom-left-radius: 5px; 21 | ` 22 | 23 | const LinkContainer = styled.div` 24 | position: relative; 25 | &:hover ${LinkItems} { 26 | display: block; 27 | } 28 | ` 29 | 30 | const Navtitle = styled.p` 31 | font-size: 12px; 32 | &:hover ${LinkItems} { 33 | display: block; 34 | } 35 | &:hover{ 36 | background-color: #f3f3f3; 37 | cursor: pointer; 38 | padding: 2px; 39 | } 40 | ` 41 | 42 | const NavBar = () => { 43 | 44 | const recAuth = useSelector(state => state.RecLogin.recAuth) 45 | 46 | const handleRecLogout = () => { 47 | window.location.reload() 48 | } 49 | 50 | return ( 51 |
52 | 53 |
54 |
55 |
56 | {!recAuth &&
57 | 58 | 59 | 60 |
Search Jobs
61 | 62 | Jobs in Top Cities 63 | Jobs by Skills 64 | Jobs by Courses 65 | Jobs by Education 66 | Jobs by Designation 67 | Jobs by Companies 68 | 69 | 70 | 71 | 72 | 73 |
Services
74 |
75 | 76 | Jobs in Top Cities 77 | Jobs by Skills 78 | Jobs by Courses 79 | Jobs by Education 80 | Jobs by Designation 81 | Jobs by Companies 82 | Jobs in Top Cities 83 | Jobs by Skills 84 | Jobs by Courses 85 | Jobs by Education 86 | Jobs by Designation 87 | Jobs by Companies 88 | 89 |
90 | 91 | 92 | 93 | 94 |
Resources
95 | 96 | Blog 97 | Resume Tips 98 | Career Help 99 | Career Prospects 100 | Jobs Search Guidance 101 | Interview Tips 102 | 103 | 104 | 105 | 106 |
Recruiter
107 | 108 | 109 |
Walk-ins
110 | 111 |
} 112 | {!recAuth && 113 | 114 | } 115 | {recAuth && 116 | 119 | } 120 | {recAuth && 121 | 124 | } 125 | 126 | 129 | 130 | {!recAuth &&
131 |
080-47105555
132 |
9am - 6pm, Mon to Sat
133 |
} 134 |
135 | ) 136 | } 137 | 138 | export default NavBar 139 | -------------------------------------------------------------------------------- /src/Components/LogIn/Login.module.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | .top 4 | { 5 | height: 60px; 6 | text-align: left; 7 | padding-left: 10%; 8 | } 9 | 10 | .top1 11 | { 12 | height: 90px; 13 | background-color: #f4f5f5; 14 | box-shadow: 0px 0px 2px 2px rgb(201, 201, 201); 15 | } 16 | 17 | .cont 18 | { 19 | border: rgb(215, 215, 215) solid 1px; 20 | height: 550px; 21 | display: flex; 22 | flex-direction: row; 23 | background-color: #fbfbfb; 24 | padding: 80px 30px 80px 30px; 25 | justify-content:space-between 26 | 27 | } 28 | 29 | .cont1login 30 | { 31 | border: black solid 0px; 32 | width: 430px; 33 | height: 450px; 34 | margin-left: 10%; 35 | padding-left: 30px; 36 | text-align: left; 37 | box-shadow: 0px 0px 10px 5px rgb(213, 213, 213); 38 | } 39 | 40 | .cont1login > input 41 | { 42 | width: 400px; 43 | border: rgb(55, 55, 55) solid 0px; 44 | border-bottom: rgb(125, 125, 125) solid 1px; 45 | 46 | } 47 | 48 | input:focus{ 49 | outline: none; 50 | } 51 | 52 | .Register 53 | { 54 | background-color: rgb(220, 220, 220); 55 | margin-left: -30px; 56 | padding-top: 10px; 57 | height: 35px; 58 | margin-top: 100px; 59 | border-bottom: rgb(218, 218, 218) solid 1px; 60 | text-align: center; 61 | color: rgb(70, 70, 70); 62 | font-weight: 500; 63 | } 64 | 65 | 66 | .login 67 | { 68 | background-image: linear-gradient( 135deg, rgb(162, 150, 217) 0%, rgb(127, 174, 224) 100%); 69 | box-shadow: 0 4px 4px 0 rgb(0 0 0 / 21%); 70 | padding-top: 10px; 71 | cursor: pointer; 72 | text-align: center; 73 | height: 35px; 74 | width: 400px; 75 | color: white; 76 | } 77 | 78 | .social 79 | { 80 | display: flex; 81 | } 82 | 83 | .social > div 84 | { 85 | margin-right: 10px; 86 | width: 126px; 87 | padding-top: -5px; 88 | cursor: pointer; 89 | padding-bottom: 5px; 90 | height: 40px; 91 | box-shadow: rgb(201, 201, 201) 0px 0px 5px 5px; 92 | color: rgb(50, 49, 49); 93 | display: flex; 94 | 95 | } 96 | 97 | .social > div > img 98 | { 99 | height: 30px; 100 | width: 30px; 101 | margin-right: 10px; 102 | margin-left: 5px; 103 | margin-top: 5%; 104 | } 105 | 106 | .social > div > p 107 | { 108 | margin-top: 10%; 109 | font-weight: 450; 110 | color: rgb(79, 78, 78); 111 | } 112 | 113 | 114 | .cont2 115 | { 116 | width: 550px; 117 | height: 450px; 118 | margin-left: 35px; 119 | margin-right: 10%; 120 | margin-top: 3%; 121 | color: #505e6b; 122 | font-weight: 400; 123 | font-size: 14px; 124 | font-family: Roboto,Arial,Times,serif; 125 | } 126 | 127 | .cont2 > ul 128 | { 129 | margin: 0; 130 | padding: 0; 131 | font-weight: 400; 132 | list-style: none; 133 | font-style: normal; 134 | font-size: 12px; 135 | text-decoration: none; 136 | text-align: left; 137 | } 138 | 139 | 140 | .cont2 > ul > li 141 | { 142 | font-size: 14px; 143 | padding: 10px 0; 144 | display: flex; 145 | width: 97%; 146 | 147 | } 148 | 149 | .cont2 > ul > li > div 150 | { 151 | margin: 10px; 152 | } 153 | 154 | 155 | 156 | 157 | .create > span 158 | { 159 | font-size: 40px; 160 | padding: 0; 161 | margin: 0; 162 | text-align: left; 163 | } 164 | 165 | .jobs 166 | { 167 | font-size: 16px; 168 | font-weight: 600; 169 | text-align: left; 170 | } 171 | 172 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | .btm 180 | { 181 | height: 150px; 182 | display: flex; 183 | 184 | } 185 | 186 | .btm_left 187 | { 188 | 189 | width: 60%; 190 | text-align: left; 191 | padding: 0; 192 | box-sizing: border-box; 193 | -webkit-font-smoothing: antialiased; 194 | -moz-osx-font-smoothing: grayscale; 195 | list-style: none; 196 | box-sizing: border-box; 197 | flex: 0 0 83%; 198 | -webkit-font-smoothing: antialiased; 199 | display: block; 200 | } 201 | 202 | 203 | .btm_left > ul > li 204 | { 205 | display: inline-block; 206 | font-size: 12px; 207 | padding: 0; 208 | padding-right: 5px; 209 | margin: 0 2px; 210 | font-weight: 400; 211 | -webkit-font-smoothing: antialiased; 212 | text-align: left; 213 | } 214 | 215 | .btm_right 216 | { 217 | border: black solid 0px; 218 | width: 50%; 219 | margin-top: 20px; 220 | margin-left: 2%; 221 | height: 80px; 222 | text-align: left; 223 | } 224 | .socialcontainer { 225 | background: #eee; 226 | padding: 25px 50px; 227 | } 228 | 229 | a.social { 230 | margin: 0 1rem; 231 | transition: transform 250ms; 232 | display: inline-block; 233 | } 234 | 235 | a.social:hover { 236 | transform: translateY(-2px); 237 | } 238 | 239 | .linkedinsocial { 240 | color: #0077b5; 241 | } 242 | 243 | .facebooksocial { 244 | color: #4968ad; 245 | } 246 | 247 | .twittersocial { 248 | color: #49a1eb; 249 | } 250 | 251 | 252 | 253 | 254 | .footer 255 | { 256 | height: 100px; 257 | text-align: left; 258 | color: #6d7883; 259 | } 260 | 261 | .footer > ul > li 262 | { 263 | display: inline-block; 264 | font-size: 12px; 265 | padding: 0; 266 | padding-right: 5px; 267 | margin: 0 2px; 268 | font-weight: 400; 269 | border-right: #6d7883 solid 2px; 270 | -webkit-font-smoothing: antialiased; 271 | } 272 | 273 | li 274 | { 275 | text-align: -webkit-match-parent; 276 | font-family: Roboto,Arial,Times,serif; 277 | box-sizing: border-box; 278 | color: #6d7883; 279 | } 280 | 281 | .footer > ul> li > a 282 | { 283 | color: #6d7883; 284 | } 285 | 286 | .revamp_footer__contact-us { 287 | flex: 0 0 17%; 288 | padding-top: 10px; 289 | } 290 | 291 | div { 292 | display: block; 293 | } 294 | 295 | .btm_right 296 | { 297 | font-size: 12px; 298 | } 299 | 300 | .follow > ul 301 | { 302 | display: flex; 303 | flex-direction: column; 304 | list-style: none; 305 | list-style-type: none; 306 | } 307 | .recruiterloginimg{ 308 | width: 100%; 309 | height: 90vh; 310 | background-image: url("https://cdn.dribbble.com/users/733072/screenshots/5548709/dribbble_hr.png"); 311 | background-position: 100% 89vh; 312 | background-size: cover; 313 | margin-left: 2%; 314 | border: 1px solid white; 315 | 316 | } 317 | .contrecruiter 318 | { 319 | border: rgb(215, 215, 215) solid 0px; 320 | height: auto; 321 | display: flex; 322 | flex-direction: row; 323 | background-color: #fff; 324 | padding: 80px 30px 80px 30px; 325 | justify-content:space-between; 326 | padding-right: 45px; 327 | 328 | } 329 | .cont1loginrecruiter > input 330 | { 331 | width: 350px; 332 | border: rgb(55, 55, 55) solid 0px; 333 | border-bottom: rgb(125, 125, 125) solid 1px; 334 | } 335 | /* recruiter login page css */ 336 | .mainbox{ 337 | display: flex; 338 | } 339 | 340 | .recloginptage{ 341 | font-size: 10px; 342 | color: rgb(112, 82, 82); 343 | } 344 | 345 | .recloginspantage{ 346 | color: blue; 347 | } -------------------------------------------------------------------------------- /src/Components/CreateJobAlert/JobAlertInput.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Styles from "./JobAlert.module.css" 3 | // const payload={ 4 | // title:"", 5 | // salary:"", 6 | // department:"", 7 | // location:"", 8 | // experience:"", 9 | // email:"", 10 | // alert:"" 11 | // } 12 | 13 | function JobAlertInput() { 14 | //const [data, setData]=React.useState(payload) 15 | return ( 16 |
17 |
18 |

Create a Free Job Alert 2021

19 |

You can create upto 5 alerts

20 |
21 |
22 |

Let us know what kind of job you are looking for and we'll send them to your Inbox.

23 |
24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 |
33 |
34 | 36 | 59 | 60 | 80 | 81 | 103 | 104 | 105 | 124 | 125 | 126 | 127 | 128 |
129 |
130 |
131 | 132 |

or

133 |
134 | 135 |
136 |
137 |

Get calls from Recruiters

138 |

Show them your education, experience and skills

139 |
140 |
141 | 142 |
143 | 144 | 145 |
146 | 147 |
148 | 149 |
150 | ) 151 | } 152 | 153 | export default JobAlertInput 154 | -------------------------------------------------------------------------------- /src/Components/LogIn/Login.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react" 2 | import styles from "../LogIn/Login.module.css" 3 | import {auth, google} from "../FireAuth/auth" 4 | import { useDispatch, useSelector } from "react-redux" 5 | import { logingin } from "../../Redux/Login/action" 6 | import { Link, Redirect } from "react-router-dom" 7 | import SocialFollow from "./SocialFollow" 8 | import fb from "./images/fb.png" 9 | import google1 from "./images/google1.png" 10 | import ld from "./images/ld.png" 11 | import Popouts from "../Popouts/LoginFail" 12 | import SearchBar from "../Home/SearchBar" 13 | 14 | 15 | function Login() 16 | { 17 | 18 | const dispatch = useDispatch() 19 | const isauth = useSelector(state => state.logi.isauth) 20 | console.log(isauth) 21 | 22 | const isfailure = useSelector(state => state.logi.isfailure) 23 | 24 | const data = useSelector(state => state.logi) 25 | console.log(data) 26 | console.log(data.payload) 27 | console.log(data.payload.name) 28 | 29 | 30 | 31 | 32 | 33 | const [email, setEmail] = useState(""); 34 | const [pass, setPass] = useState(""); 35 | 36 | 37 | 38 | function handlelogin() 39 | { 40 | auth.signInWithPopup(google) 41 | .then(resp => 42 | {return (console.log(resp), setEmail(resp.user.email), 43 | dispatch(logingin(resp.user.email))) 44 | 45 | } ) 46 | .catch((err) => console.log(err)); 47 | } 48 | 49 | 50 | if(isfailure) 51 | { 52 | return 53 | } 54 | 55 | 56 | 57 | 58 | return isauth?( 59 | 60 | 61 | 62 | 63 | ):( 64 |
65 | 66 |
67 | 68 |
69 | 70 |
71 |
72 |

Login

73 | setEmail(e.target.value)} />

74 | setPass(e.target.value)}/>

75 |
Login
76 | 77 | 78 |

or

79 | 80 |
81 |
handlelogin()}>

Google

82 |

Linkedin

83 |

Facebook

84 | 85 |
86 |

By syncing your social media account, you agree to shine terms and conditions

87 | 88 |
Don't have Shine account? Register Now
89 |
90 | 91 | 92 | 93 | 94 | 95 | 96 |
97 |

300,000 jobs from 15,000 companies

98 |
    99 |
  • 100 |
    101 |
    Create your account and receive matching jobs automatically
    102 | Fill in your profile details and let our unique matching technology bring you the most relevant job 103 | opportunities.
    104 |
    • 105 | 106 | 107 |
  • 108 |
    109 |
    Be completely anonymous
    110 | You choose which recruiters see your personal and contact detail
    111 |
    • 112 | 113 | 114 |
  • 115 |
    116 |
    Equip yourself for a great career
    117 | Research industries and employ our career services to be better equipped for your professional life.
    118 |
    • 119 | 120 |
121 |
122 |
123 | 124 | 125 | 126 | 127 |
128 | 133 | 134 |
135 |
136 |
Contact us-08047105555 137 |

138 | contactus@shine.com 139 |

140 |
141 |
142 |
143 | Follow us 144 |
145 | 146 |
147 |
148 | 149 |
150 | 151 | 152 | 153 | 154 |
155 | 156 | ) 169 | 170 | 171 |
172 | ) 173 | } 174 | 175 | export default Login; -------------------------------------------------------------------------------- /src/Components/JobPost/JobPostInput.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Styles from "./JobPost.module.css" 3 | import {v4 as uuid} from "uuid" 4 | import axios from 'axios' 5 | // import styles from "../LogIn/Login.module.css" 6 | // import SocialFollow from '../LogIn/SocialFollow' 7 | import Footer from '../Home/Footer' 8 | 9 | const payload={ 10 | id:uuid(), 11 | title:"", 12 | salary:"any", 13 | qulification:"BA", 14 | subtitle:"", 15 | department: "Audit", 16 | location:"Bangalore", 17 | experience:"any", 18 | email:"", 19 | description:"", 20 | telephone:"", 21 | skills:[] 22 | } 23 | 24 | function JobPostInput() { 25 | const [data, setData]=React.useState(payload) 26 | const [skillData, setSkillData]= React.useState("") 27 | const {title,salary,subtitle,department,location,experience,email,description,telephone,qualification}=data 28 | 29 | const handleChange=(e)=>{ 30 | const {value,name}=e.target; 31 | if(name !== 'skills'){ 32 | setData({...data,[name]:value}) 33 | } 34 | } 35 | 36 | const handlearr=(skillData)=>{ 37 | ( data.skills).push(skillData+" ") 38 | setSkillData("") 39 | } 40 | 41 | const handleSubmit=()=>{ 42 | axios({ 43 | method:"post", 44 | url:"https://json-heroku-shubham.herokuapp.com/jobDetails", 45 | data:data 46 | }).then(res=>{ 47 | console.log(res) 48 | alert("Data Posted") 49 | }).catch(err => { 50 | alert("Sorry... Somthing Went Wrong") 51 | }) 52 | } 53 | return ( 54 |
55 |
56 |
57 |

Create Job Post 2021

58 |

You can create job post here

59 |
60 |
61 |

Let us know what kind of employee you are looking for and we'll send them to your Inbox.

62 |
63 |
64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 |
76 |
77 | 78 | 79 | 93 | 94 | 114 | 115 | 134 | 135 | 148 | 149 | 168 | 169 | 170 | 171 |
172 | setSkillData(e.target.value)} name="skills" placeholder="Skills" type="text"/> 173 | 174 | 175 |
176 | 177 |
178 |
179 |
180 | 181 |
182 |
183 |
184 |
185 |
186 | 187 | ) 188 | } 189 | 190 | export default JobPostInput 191 | -------------------------------------------------------------------------------- /src/Components/RecruiterDash/RecruiterDashboard.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import styles from "../RecruiterDash/Dashboard.module.css" 3 | import {getUserData, singleUserData} from '../../Redux/RecruiterDash/action' 4 | import { useDispatch, useSelector } from "react-redux"; 5 | import axios from "axios" 6 | 7 | const RecruiterDashboard = () => { 8 | 9 | const [call, setCall] = React.useState(false) 10 | const [interviewColor, setInterviewColor] = React.useState("") 11 | const dispatch = useDispatch() 12 | const data = useSelector((state) => state.RecruiterDash.data) 13 | const CandiData = useSelector((state) => state.RecruiterDash.CandiData) 14 | const isLoading = useSelector((state) => state.RecruiterDash.isLoading) 15 | 16 | const commentData = useSelector((state) => state.RecruiterDash.CandiData.comments) 17 | // const [comments, setComments] = React.useState([]) 18 | const [text, setText] = React.useState("") 19 | 20 | const handleChange = (e) => { 21 | let value = e.target.value 22 | setText(value) 23 | } 24 | 25 | const handleAdd = (id) => { 26 | // setComments([...comments, text]) 27 | commentData.push(text) 28 | handlePatch(id) 29 | } 30 | 31 | const handlePatch = (id) => { 32 | console.log(id) 33 | axios.patch(`https://json-heroku-shubham.herokuapp.com/applications/${id}`,{ 34 | comments: commentData, 35 | call: call, 36 | interview_status: interviewColor 37 | }).then(()=>handleShow(id)) 38 | } 39 | 40 | 41 | React.useEffect(()=>{ 42 | onloadFunction() 43 | }, []) 44 | 45 | const onloadFunction = () => { 46 | dispatch(getUserData()) 47 | } 48 | 49 | const handleShow = (id) =>{ 50 | console.log(id) 51 | // dispatch(singleUserData(id)) 52 | } 53 | console.log(data) 54 | return ( 55 |
56 | {isLoading ?
57 | loding-gif 58 |
: 59 |
60 | {data?.map(el=> 61 |
handleShow(el.id)} className={styles.mainContainer_CandidateCard}> 62 |
63 |

Name: {`${el?.name}`}

64 |

Email: {`${el.email}`}

65 |

Location: {`${el.location}`}

66 |

Mobile: {`${el.phone}`}

67 |
68 |
69 | )} 70 |
} 71 | 72 |
73 |
74 |
75 | Candidate Name: 76 |
77 |
78 | {CandiData.userName} 79 |
80 |
81 | 84 | 90 |
91 |
92 | 93 |
94 |
95 |
96 | Candidate Gender: 97 |
98 |
99 | {CandiData.gender} 100 |
101 |
102 |
103 |
104 | DOB: 105 |
106 |
107 | {CandiData.dob} 108 |
109 |
110 |
111 | 112 |
113 |
114 | Candidate Email: 115 |
116 |
117 | {CandiData.email} 118 |
119 |
120 | 121 |
122 |
123 | Candidate Phone: 124 |
125 |
126 | {CandiData.phone} 127 |
128 |
129 | 130 |
131 |
132 | Applied Company: 133 |
134 |
135 | {CandiData.applied_company} 136 |
137 |
138 | 139 |
140 |
141 | Applied Position: 142 |
143 |
144 | {CandiData.applied_position} 145 |
146 |
147 | 148 |
149 |
150 |
151 | Location: 152 |
153 |
154 | {CandiData.location} 155 |
156 |
157 |
158 |
159 | Total Experience: 160 |
161 |
162 | { 163 | CandiData.experience.length === 0 ? 0 yrs : {CandiData.experience} yrs 164 | } 165 |
166 |
167 |
168 | 169 |
170 |
171 | Highest Qualification: 172 |
173 |
174 | {CandiData.qualification} 175 |
176 |
177 | 178 |
179 |
180 | Skills: 181 |
182 |
183 | {CandiData.skills.map(el => 184 |
{el}
185 | )} 186 |
187 |
188 | 189 |
190 |
191 | {isLoading ?

...loading

:
192 | {commentData.map(el =>

{el}

)} 193 |
} 194 |
195 | 196 | 197 |
198 |
199 |
200 |
201 | 202 | 203 | 204 | 205 |
206 |
207 |
208 |
209 | ) 210 | } 211 | 212 | export {RecruiterDashboard} 213 | -------------------------------------------------------------------------------- /src/database/db.json: -------------------------------------------------------------------------------- 1 | { 2 | 3 | "recruiter": [ 4 | { 5 | "id": 1, 6 | "title": "Network Support Analyst", 7 | "subtitle": "NTT Global Delivery Services Limited", 8 | "experience": [0, 5], 9 | "location": "Noida", 10 | "skills": "incident management, asap, basic", 11 | "posted": "Apr 9, 2021", 12 | "jobdescription": { 13 | "job Description":"EFI is looking for a Senior IT Engineer in our Bangalore office. As a successful candidate you will get an opportunity to work in a dynamic environment where your responsibilities range from solution designing, implementing, supporting Engineering / Enterprise Applications", 14 | "responsibilities":"You will provide hands-on technical and functional input to design, maintenance, build, integration and testing of complex software components according to functional and technical design specifications. You will provide input to the software engineering manager for estimates, resource needs, milestones and risks; ensure effective delegation, monitoring tasks, identifying risks and handling mitigation and escalations", 15 | "requirements":"Must possess solid English written and verbal communication skills and have an aptitude for thriving in complex situations. Maintain and provide support for the existing in-house Atlassian infrastructure on Linux platform. Act as the Atlassian Stack expert in troubleshooting of critical production problems as required.Review and optimize existing workflows and workflow automations. Excellent debugging, problem solving, & process implementation skills.", 16 | "skills":["Proficient in Linux Operating System.", "4+ years of experience in the administration of Atlassian stack applications.", "Preferred additional hands on knowledge in JQL, Regular Expressions, Velocity script, XML and open source technologies.", "Database exposure & administration experience (MySQL, SQL, PostgreSQL).", "3+ years of experience working in CI/CD tools such as Bitbucket, Bamboo, Jenkins. Proficient in Confluence, Bitbucket and Bamboo administration."] 17 | }, 18 | 19 | "otherdetails": { 20 | "department": "Network / System Administration", 21 | "industry": "IT - Software", 22 | "skills": ["Proficient in Linux Operating System.", "4+ years of experience in the administration of Atlassian stack applications.", "Preferred additional hands on knowledge in JQL, Regular Expressions, Velocity script, XML and open source technologies.", "Database exposure & administration experience (MySQL, SQL, PostgreSQL).", "3+ years of experience working in CI/CD tools such as Bitbucket, Bamboo, Jenkins. Proficient in Confluence, Bitbucket and Bamboo administration."], 23 | "otherSkills": "cisco", 24 | "education": "B.Tech/B.E (Other)Other (Architecture)" }, 25 | 26 | "recruiter details": { 27 | "companyName": "NTT Global Delivery Services Limited", 28 | "companyDescription": "NTT Global Delivery Services Limited" 29 | } 30 | 31 | }, 32 | 33 | 34 | 35 | { 36 | "id": 2, 37 | "title": "Cloud Solutions Engineer in TEST", 38 | "subtitle": "Intel Technology India Pvt Ltd", 39 | "experience": [0, 1], 40 | "location": "Bangalore", 41 | "skills": ["automated testing", "artificial intelligence", "test automation"], 42 | "posted": "Apr 13, 2021", 43 | "jobdescription": { 44 | "job Description":"You will be part of the Data Center Security Architecture and Development team in the Intel's Data Center Group. This team is responsible for enabling hardware and firmware security features from silicon all the way up to the application space, providing hardware-assured security for data and applications. This trust is the basis for the team's development of security solutions, which include workload integrity, boundary control, end-to-end data encryption for cloud domains.", 45 | "responsibilities":"", 46 | "requirements":"BS in CS with 4+ years or MS with 2+ years of systems integration and validation/QA experience. 1+ years of experience in Cloud computing, virtualization and Security technologies. Skilled in Development/Scripting - Java, C, Python or Bash. Experience in Container Technologies (Docker, Kubernetes, CRIO), OpenStack, RHEL, VMware vSphere, Windows Server, Experience in using development/testing tools to become part of end-end product testing lifecycle like - TeamCity, JIRA, Ansible, ReadyAPI, Postman, REST API, GitHub", 47 | "skills":["Development/Scripting - Java, C, Python or Bash.", "Experience in Container Technologies (Docker, Kubernetes, CRIO), OpenStack, RHEL, VMware vSphere, Windows Server"] 48 | }, 49 | "otherdetails": { 50 | "department": "General / Other Software, Testing", 51 | "industry": "IT - Software", 52 | "skills": ["automated testing", "artificial intelligence", "test automation"], 53 | "otherSkills": "", 54 | "education": "other" }, 55 | "recruiter details": { 56 | "companyName": "Intel Technology India Pvt Ltd", 57 | "companyDescription": "You may know us for our processors. But we do so much more. Intel invents at the boundaries of technology to make amazing experiences possible for business and society, and for every person on Earth. Harnessing the capability of the cloud, the ubiquity of the Internet of Things, the latest advances in memory and programmable solutions, and the promise of always-on 5G connectivity, Intel is disrupting industries and solving global challenges." 58 | } 59 | } 60 | 61 | ], 62 | 63 | 64 | "applicant": 65 | [ { 66 | "id":1, 67 | "name": "Shubham sharma", 68 | "title":"Cloud Solutions Engineer in TEST", 69 | "email":"shubhamsharma585@gmail.com", 70 | "mobile":"8619941188", 71 | "resume":"", 72 | "personal": { 73 | "name":"Shubham sharma", 74 | "email":"shubhamsharma585@gmail.com", 75 | "mobile":"8619941188", 76 | "dob":"1 Jan 1994", 77 | "location":"Bangalore", 78 | "gender":"Male" 79 | }, 80 | "worksummary":{ 81 | "title":"Network Support Analyst", 82 | "summary":"Not mentioned", 83 | "experience":[1, 4], 84 | "largestteam":"50", 85 | "anualsalary":"Rs. 12 Lakh 15 thousand", 86 | "notice":"Not mentioned" 87 | }, 88 | "employment":{ 89 | "title":"JEE Faculty", 90 | "company":"TIME Banglore", 91 | "duration":"Jun 2020 To Present", 92 | "industry": "Engineering / Construction", 93 | "functionalarea": "Mechanical Engineering" 94 | }, 95 | "education":[{ 96 | "title":"M.Tech", 97 | "branch":"Automobile Engineering", 98 | "college": "National Institute of Technology, Warangal (NITW)" 99 | }], 100 | "skills": ["Statistics", "ANSYS", "MATLAB", "CREO", "gate qualified", "bussiness research"], 101 | "desired":{ 102 | "role":"Not mentioned", 103 | "location":"Bangalore | All India", 104 | "department":"IT Operations / EDP / MIS | Networking | Network / System Administration | Telecom Network Design / Management | Sector / Business Research | Statistics / Analytics ", 105 | "industry":"- Any -", 106 | "jobtype":"- Any -", 107 | "shifttype":"Morning | Noon", 108 | "salary":"Rs 12 - 14 Lakh / Yr" 109 | } 110 | 111 | }, 112 | 113 | { 114 | "id":2, 115 | "name": "Deepak", 116 | "title":"Cloud Solutions Engineer in TEST", 117 | "email":"deepakH@gmail.com", 118 | "mobile":"4523455262", 119 | "personal": { 120 | "name":"Deepak Hegde", 121 | "email":"Deepakhegde123@gmail.com", 122 | "mobile":"8612341388", 123 | "dob":"1 Jan 1995", 124 | "location":"Bangalore", 125 | "gender":"Male" 126 | }, 127 | "worksummary":{ 128 | "title":"Network Support Analyst", 129 | "summary":"Not mentioned", 130 | "experience":"1 to 4 Yrs", 131 | "largestteam":"50", 132 | "anualsalary":"Rs. 12 Lakh 15 thousand", 133 | "notice":"Not mentioned" 134 | }, 135 | "employment":{ 136 | "title":"Test Engineer", 137 | "company":"cisco Banglore", 138 | "duration":"Jun 2020 To Present", 139 | "industry": "Engineering / Construction", 140 | "functionalarea": "Mechanical Engineering" 141 | }, 142 | "education":{ 143 | "title":"B. Tech", 144 | "branch":"Electronics Engineering", 145 | "college": "ACEIT" 146 | }, 147 | "skills": ["Statistics", "ANSYS", "MATLAB", "CREO", "gate qualified", "bussiness research"], 148 | "desired":{ 149 | "role":"Not mentioned", 150 | "location":"Bangalore | All India", 151 | "department":"IT Operations / EDP / MIS | Networking | Network / System Administration | Telecom Network Design / Management | Sector / Business Research | Statistics / Analytics ", 152 | "industry":"- Any -", 153 | "jobtype":"- Any -", 154 | "shifttype":"Morning | Noon", 155 | "salary":"Rs 12 - 14 Lakh / Yr" 156 | } 157 | 158 | } 159 | ] 160 | } 161 | 162 | 163 | 164 | 165 | 166 | 167 | -------------------------------------------------------------------------------- /src/Components/Home/Footer.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Link } from "react-router-dom"; 3 | import styles from "./home.module.css"; 4 | 5 | function Footer() { 6 | return ( 7 |
17 |
18 |
19 |
20 | 23 | Job seekers 24 | 25 |
26 |
27 | 28 |
35 | Browse Jobs 36 |
37 | 38 |
39 |
40 | 41 |
48 | Job Search 49 |
50 | 51 |
52 |
53 | 54 |
61 | Register Now 62 |
63 | 64 |
65 |
66 | 67 |
74 | Login 75 |
76 | 77 |
78 |
79 | 80 |
87 | Create Free Job Alert 88 |
89 | 90 |
91 |
92 |
93 |
94 | 97 | Employers 98 | 99 |
100 |
101 | 102 |
109 | Recruiter India 110 |
111 | 112 |
113 |
114 | 115 |
122 | Post Jobs 123 |
124 | 125 |
126 |
127 | 128 |
135 | Access Database 136 |
137 | 138 |
139 |
140 |
141 |
142 | 145 | Partner Sites 146 | 147 |
148 |
149 | 150 |
157 | English Mate 158 |
159 | 160 |
161 |
162 | 163 |
170 | Study Mate 171 |
172 | 173 |
174 |
175 | 176 |
183 | Hindustantimes.com 184 |
185 | 186 |
187 |
188 | 189 |
196 | Livemint.com 197 |
198 | 199 |
200 |
201 | 202 |
209 | LiveHindustain.com 210 |
211 | 212 |
213 |
214 | 215 |
222 | OTTplay 223 |
224 | 225 |
226 |
227 |
228 |
229 | 232 | Contact us 233 | 234 |
235 |
236 | 239 | 080-47105555 240 | 241 |
242 |
243 | 244 |
251 | contactus@shine.com 252 |
253 | 254 |
255 |
256 | 259 | Follow us 260 | 261 |
262 |
263 | 264 |
271 |
272 |
273 |
274 |
275 | 276 |
277 |
278 |
279 | 280 |
288 | 299 |
300 | 301 |
302 |
303 |
304 |
311 |
312 | Feedback | FAQs | About Us | Contact Us | Privacy Policy | Cookie 313 | Policy | Fraud Alert | Business News | English News | Terms & 314 | Conditions | Disclaimer | Report a Job Posting 315 |
316 |
317 | © 2021 HT Media Limited 318 |
319 |
320 |
321 | ); 322 | } 323 | 324 | export default Footer; 325 | -------------------------------------------------------------------------------- /src/Components/JobSearch/JobSearch.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import Footer from "../Home/Footer"; 3 | import SearchBar from "../Home/SearchBar"; 4 | import JobList from "./JobList"; 5 | 6 | function JobSearch() { 7 | const topCities = [ 8 | "Bangalore", 9 | "Delhi", 10 | "Hyderabad", 11 | "Chennai", 12 | "Mumbai", 13 | "Kolkata", 14 | "Pune", 15 | "Coimbatore", 16 | "Chandigarh", 17 | "Lucknow", 18 | "Jaipur", 19 | "Ahmedabad", 20 | "Indore", 21 | "Gurgaon", 22 | "Noida", 23 | "Bhubaneswar", 24 | ]; 25 | const cities2 = [ 26 | "Amalapuram", 27 | "Anantpur", 28 | "Chittoor", 29 | "East Godavari", 30 | "Guntakal", 31 | "Guntur", 32 | "Hyderabad", 33 | "Kadapa", 34 | "Kakinada", 35 | "Kavali", 36 | "Kurnool", 37 | "Machilipatnam", 38 | "Nellore", 39 | "Ongole", 40 | "Prakasam", 41 | "Rajahmundry", 42 | "Srikakulam", 43 | "Tadepalligudem", 44 | "Tirumala", 45 | "Tirupati", 46 | "Vijayawada", 47 | "Vishakhapatnam", 48 | "Vizianagaram", 49 | "West Godavari", 50 | ]; 51 | const cities3 = [ 52 | "Anjaw", 53 | "Changlang", 54 | "Dibang Valley", 55 | "East Kameng", 56 | "East Siang", 57 | "Itanagar", 58 | "Kurung Kumey", 59 | "Lohit", 60 | "Papum Pare", 61 | "Tawang", 62 | "Tirap", 63 | "West Kameng", 64 | "West Siang", 65 | ]; 66 | const cities4 = [ 67 | "Baksa", 68 | "Barpeta", 69 | "Bongaigaon", 70 | "Cachar", 71 | "Chirang", 72 | "Darrang", 73 | "Dhemaji", 74 | "Dhubri", 75 | "Dibrugarh", 76 | "Dima Hasao", 77 | "Goalpara", 78 | "Golaghat", 79 | "Guwahati", 80 | "Hailakandi", 81 | "Jorhat", 82 | "Kamrup", 83 | "Kamrup Metropolitan", 84 | "Karbi Anglong", 85 | "Karimganj", 86 | "Kokrajhar", 87 | "Lakhimpur", 88 | "Morigaon", 89 | "Nagaon", 90 | "Nalbari", 91 | "Silchar", 92 | "Sivasagar", 93 | "Sonitpur", 94 | "Tarapur", 95 | "Tinsukia", 96 | "Udalguri", 97 | ]; 98 | const cities5 = [ 99 | "Araria", 100 | "Arwal", 101 | "Begusarai", 102 | "Bhagalpur", 103 | "Bhojpur", 104 | "Buxar", 105 | "Darbhanga", 106 | "Gaya", 107 | "Gopalganj", 108 | "Jamui", 109 | "Jehanabad", 110 | "Kaimur", 111 | "Katihar", 112 | "Khagaria", 113 | "Kishanganj", 114 | "Lakhisarai", 115 | "Madhepura", 116 | "Madhubani", 117 | "Maharajganj", 118 | "Munger", 119 | "Muzaffarpur", 120 | "Muzzafarpur", 121 | "Nalanda", 122 | "Nawada", 123 | "Patna", 124 | "Purnia", 125 | "Rohtas", 126 | "Saharsa", 127 | "Samastipur", 128 | "Saran", 129 | "Sheikhpura", 130 | "Sheohar", 131 | "Sitamarhi", 132 | "Siwan", 133 | "Supaul", 134 | "Vaishali", 135 | ]; 136 | const cities6 = ["Chandigarh", "Mohali", "Panchkula"]; 137 | const cities7 = [ 138 | "Baloda Bazar", 139 | "Bastar", 140 | "Bhillai", 141 | "Bijapur", 142 | "Bilaspur", 143 | "Dakshin Bastar Dantewada", 144 | "Dhamtari", 145 | "Durg", 146 | "Janjgir Champa", 147 | "Kabirdham", 148 | "Korba", 149 | "Koriya", 150 | "Mahasamund", 151 | "Narayanpur", 152 | "Raigarh", 153 | "Raipur", 154 | "Rajnandgaon", 155 | "Surguja", 156 | "Uttar Bastar Kanker", 157 | ]; 158 | const cities8 = ["Dadra Nagar Haveli", "Silvassa"]; 159 | const cities9 = ["Delhi", "Faridabad", "Ghaziabad", "Gurgaon", "Noida"]; 160 | const cities10 = ["North Goa", "Panaji", "South Goa", "Vasco da Gama"]; 161 | const cities11 = [ 162 | "Ahmedabad", 163 | "Amreli", 164 | "Anand", 165 | "Ankleshwar", 166 | "Banaskantha", 167 | "Bharuch", 168 | "Bhavnagar", 169 | "Bhuj", 170 | "Dahod", 171 | "Dang", 172 | "Gandhidham", 173 | "Gandhinagar", 174 | "Gir", 175 | "Halol", 176 | "Jamnagar", 177 | "Junagadh", 178 | "Junagarh", 179 | "Kandla", 180 | "Mahesana", 181 | "Mehsana", 182 | "Mundra", 183 | "Navsari", 184 | "Panchmahal", 185 | "Patan", 186 | "Porbandar", 187 | "Rajkot", 188 | "Surat", 189 | "Surendranagar", 190 | "Tapi", 191 | "Vadodara", 192 | "Valsad", 193 | "Vapi", 194 | ]; 195 | const cities12 = [ 196 | "Ambala", 197 | "Bahadurgarh", 198 | "Bawal", 199 | "Bhiwani", 200 | "Faridabad", 201 | "Fatehabad", 202 | "Gurgaon", 203 | "Hisar", 204 | "Jhajjar", 205 | "Jind", 206 | "Kaithal", 207 | "Karnal", 208 | "Kundli", 209 | "Kurukshetra", 210 | "Manesar", 211 | "Nuh", 212 | "Palwal", 213 | "Panchkula", 214 | "Panipat", 215 | "Rewari", 216 | "Rohtak", 217 | "Saha", 218 | "Sirsa", 219 | "Sonipat", 220 | "Yamunanagar", 221 | ]; 222 | const cities13 = [ 223 | "Baddi", 224 | "Bilaspur", 225 | "Chamba", 226 | "Dalhousie", 227 | "Dharamsala", 228 | "Kangra", 229 | "Kullu", 230 | "Manali", 231 | "Mandi", 232 | "Palampur", 233 | "Shimla", 234 | "Sirmaur", 235 | "Solan", 236 | "Una", 237 | ]; 238 | const cities14 = [ 239 | "Ahmednagar", 240 | "Ahmednagar", 241 | "Akola", 242 | "Ambernath", 243 | "Amravati", 244 | "Aurangabad", 245 | "Baramati", 246 | "Bhandara", 247 | "Bhiwandi", 248 | "Boisar", 249 | "Chakan", 250 | "Chandrapur", 251 | "Dhule", 252 | "Dombivali", 253 | "Gadchiroli", 254 | "Gondia", 255 | "Hingoli", 256 | "Jalgaon", 257 | "Jalna", 258 | "Kalyan", 259 | "Kharghar", 260 | "Kolhapur", 261 | "Latur", 262 | "Manor", 263 | "Mira Bhayandar", 264 | "Mumbai", 265 | "Nagpur", 266 | "Nanded", 267 | "Nandurbar", 268 | "Nashik", 269 | "Navi Mumbai", 270 | "Osmanabad", 271 | "Palghar", 272 | "Panvel", 273 | "Parbhani", 274 | "Pimpri Chinchwad", 275 | "Pune", 276 | "Raigad", 277 | "Ratnagiri", 278 | "Sangli", 279 | "Satara", 280 | "Shirdi", 281 | "Sindhudurg", 282 | "Solapur", 283 | "Thane", 284 | "Vasai", 285 | "Vita", 286 | "Wardha", 287 | "Yavatmal", 288 | ]; 289 | const cities15 = [ 290 | "Agra", 291 | "Aligarh", 292 | "Allahabad", 293 | "Ambedkar Nagar", 294 | "Amroha", 295 | "Auraiya", 296 | "Azamgarh", 297 | "Baghpat", 298 | "Bahraich", 299 | "Balrampur", 300 | "Banda", 301 | "Barabanki", 302 | "Bareilly", 303 | "Basti", 304 | "Bijnor", 305 | "Budaun", 306 | "Bulandshahr", 307 | "Chandauli", 308 | "Chitrakoot", 309 | "Deoria", 310 | "Etah", 311 | "Etawah", 312 | "Faizabad", 313 | "Farrukhabad", 314 | "Fatehpur", 315 | "Firozabad", 316 | "Gautam Buddha Nagar", 317 | "Ghaziabad", 318 | "Ghazipur", 319 | "Gonda", 320 | "Gorakhpur", 321 | "Hamirpur", 322 | "Hardoi", 323 | "Hathras", 324 | "Jalaun", 325 | "Jaunpur", 326 | "Jhansi", 327 | "Kannauj", 328 | "Kanpur", 329 | "Kasganj", 330 | "Kushinagar", 331 | "Lalitpur", 332 | "Lucknow", 333 | "Mahoba", 334 | "Mainpuri", 335 | "Mathura", 336 | "Mau", 337 | "Meerut", 338 | "Mirzapur", 339 | "Moradabad", 340 | "Muzaffarnagar", 341 | "Muzzafarnagar", 342 | "Noida", 343 | "Orai", 344 | "Patti", 345 | "Pilibhit", 346 | "Raebareli", 347 | "Rampur", 348 | "Saharanpur", 349 | "Sant Kabir Nagar", 350 | "Sant Ravidas Nagar", 351 | "Shahjahanpur", 352 | "Shravasti", 353 | "Siddharthnagar", 354 | "Sitapur", 355 | "Sonbhadra", 356 | "Sultanpur", 357 | "Unnao", 358 | "Varanasi", 359 | ]; 360 | const cities16 = [ 361 | "Almora", 362 | "Bageshwar", 363 | "Chamoli", 364 | "Champawat", 365 | "Dehradun", 366 | "Haldwani", 367 | "Haridwar", 368 | "Kashipur", 369 | "Lansdowne", 370 | "Mussoorie", 371 | "Nainital", 372 | "Rishikesh", 373 | "Roorkee", 374 | "Rudrapur", 375 | "Tehri Garhwal", 376 | "Udham Singh Nagar", 377 | "Uttarkashi", 378 | ]; 379 | const cities17 = [ 380 | "Adra", 381 | "Asansol", 382 | "Bally", 383 | "Bankura", 384 | "Bardhaman", 385 | "Birbhum", 386 | "Burdwan", 387 | "Dakshin Dinajpur", 388 | "Darjeeling", 389 | "Durgapur", 390 | "Haldia", 391 | "Haripur", 392 | "Hooghly", 393 | "Howrah", 394 | "Jalpaiguri", 395 | "Kharagpur", 396 | "Kolkata", 397 | "Malda", 398 | "Murshidabad", 399 | "Nadia", 400 | "Nayagarh", 401 | "Purba Medinipur", 402 | "Puruliya", 403 | "Siliguri", 404 | "Uttar Dinajpur", 405 | ]; 406 | 407 | return ( 408 |
409 | 410 | 411 |
419 |
420 |
421 | img{" "} 426 |
427 |
428 | img 433 |
434 | 435 | 436 | 437 | 438 | 439 | 440 | 441 | 442 | 443 | 444 | 445 | 446 | 447 | 448 | 449 | 450 | 451 |
452 | 453 |
455 | ); 456 | } 457 | 458 | export default JobSearch; 459 | -------------------------------------------------------------------------------- /src/Components/Home/home.module.css: -------------------------------------------------------------------------------- 1 | .home { 2 | font-family: "PT Sans", sans-serif; 3 | text-align: center; 4 | } 5 | 6 | .a1background { 7 | background-image: url("https://static1.shine.com/c/s1/images/candidate/new/home_base_new.jpg?6740b54474de"); 8 | padding: 45px; 9 | padding-left: 70px; 10 | justify-content: space-around; 11 | padding-bottom: 70px; 12 | background-size: cover; 13 | display: flex; 14 | text-align: left; 15 | } 16 | .found { 17 | /* -webkit-user-select: none; */ 18 | margin: auto; 19 | cursor: zoom-in; 20 | background-color: hsl(0, 0%, 90%); 21 | transition: background-color 300ms; 22 | width: 674px; 23 | aspect-ratio: auto 674 / 283; 24 | height: 283px; 25 | } 26 | 27 | .searchButton { 28 | width: 600px; 29 | height: 50px; 30 | border-radius: 4px; 31 | line-height: 1.2; 32 | text-align: left; 33 | border: 0 none; 34 | background-color: #fff; 35 | padding-top: 18px; 36 | } 37 | .searchButton > div { 38 | width: 35px; 39 | height: 35px; 40 | margin-top: -25px; 41 | 42 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 43 | background-position: -10px -70px; 44 | } 45 | .ah1 { 46 | font-size: 45px; 47 | margin-top: -15px; 48 | color: #ffffffff; 49 | font-weight: 700; 50 | line-height: 1.2; 51 | margin-bottom: 0px; 52 | } 53 | .ah2 { 54 | font-size: 20px; 55 | color: #fff; 56 | font-weight: 400; 57 | opacity: 0.6; 58 | margin-top: 0px; 59 | } 60 | .a2background { 61 | background-image: url("https://static1.shine.com/c/s1/images/candidate/new/home_reg.png?6740b54474de"); 62 | flex-basis: 430px; 63 | height: 167px; 64 | background-size: cover; 65 | color: #fff; 66 | margin-right: -25px; 67 | background-position: center; 68 | background-repeat: no-repeat; 69 | 70 | border-radius: 5px; 71 | } 72 | .regButton { 73 | font-size: 18px; 74 | width: 185px; 75 | padding: 0.375rem 0.75rem; 76 | border-radius: 5px; 77 | background: #f7a400; 78 | box-shadow: 0px 4px 4px 0px rgb(0 0 0 / 20%); 79 | color: #fff; 80 | font-weight: 400; 81 | border: 0 none; 82 | text-align: center; 83 | margin-top: 55px; 84 | margin-left: 40px; 85 | margin-bottom: 0; 86 | cursor: pointer; 87 | } 88 | .signinp { 89 | margin: auto; 90 | font-size: 17px; 91 | margin-left: 25%; 92 | color: #fff; 93 | margin-top: 15px; 94 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 95 | background-position: -51px -76px; 96 | } 97 | .signinp > p { 98 | margin-top: 0; 99 | margin-left: 17px; 100 | } 101 | .searchInput { 102 | width: 300px; 103 | height: 50px; 104 | border-radius: 4px; 105 | line-height: 1.2; 106 | text-align: left; 107 | border: 0 none; 108 | background-color: #fff; 109 | } 110 | .searchInput > input { 111 | width: 280px; 112 | border: 0 none; 113 | margin-top: 15px; 114 | margin-left: 15px; 115 | } 116 | .searchInput > input:focus, 117 | .searchInput > select:focus { 118 | outline: none; 119 | } 120 | button:focus { 121 | outline: none; 122 | } 123 | .cross { 124 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de") -388px -90px; 125 | width: 36px; 126 | height: 36px; 127 | } 128 | 129 | /*--------------cool places to work--------------*/ 130 | 131 | .coolBox { 132 | box-shadow: 0px 0px 21px rgb(74 77 78 / 34%); 133 | width: 200px; 134 | height: 132px; 135 | margin: auto; 136 | border-radius: 4px; 137 | } 138 | .coolSmallBox { 139 | width: 160px; 140 | height: 56px; 141 | border-radius: 4px; 142 | margin: auto; 143 | margin-top: -30px; 144 | box-shadow: 0px 0px 21px rgb(74 77 78 / 34%); 145 | } 146 | 147 | /*-------------Top companies hiring now---------------*/ 148 | 149 | .topBox { 150 | float: left; 151 | width: 270px; 152 | } 153 | 154 | .topBox > img { 155 | width: 160px; 156 | height: 56px; 157 | margin: 25px; 158 | } 159 | 160 | /*---why shine---*/ 161 | 162 | .why { 163 | flex: 33%; 164 | font-size: 18px; 165 | color: #6d7883; 166 | text-align: left; 167 | padding: 25px; 168 | padding-left: 135px; 169 | } 170 | .whydiv1 { 171 | width: 129px; 172 | height: 72px; 173 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 174 | background-position: -103px -9px; 175 | float: left; 176 | } 177 | .whydiv2 { 178 | width: 93px; 179 | height: 72px; 180 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 181 | background-position: -93px -99px; 182 | float: left; 183 | } 184 | .whydiv3 { 185 | width: 120px; 186 | height: 86px; 187 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 188 | background-position: -183px -84px; 189 | float: left; 190 | } 191 | 192 | .why > strong { 193 | font-size: 22px; 194 | color: #505e6b; 195 | float: left; 196 | margin-bottom: 0; 197 | } 198 | .why > p { 199 | font-size: 18px; 200 | } 201 | 202 | /*------Premium----*/ 203 | 204 | .Premium { 205 | background: url("https://static1.shine.com/c/s1/images/candidate/new/premium_base.png?af2426e6d054") 206 | #7f4089 repeat-y; 207 | padding: 45px; 208 | padding-left: 70px; 209 | height: 300px; 210 | padding-bottom: 15px; 211 | 212 | color: #fff; 213 | } 214 | 215 | .PremiumRight { 216 | background: url("https://static1.shine.com/c/s1/images/candidate/new/premiumgraph.png?af2426e6d054") 217 | top right no-repeat; 218 | width: 400px; 219 | height: 293px; 220 | float: right; 221 | } 222 | .crown { 223 | float: left; 224 | background: #674691; 225 | width: 60px; 226 | height: 60px; 227 | border-radius: 50%; 228 | margin: 0 10px 0 0; 229 | padding: 0; 230 | } 231 | .crown > div { 232 | background: url("https://static1.shine.com/c/s1/images/mobile/new/sprite_resume_score.svg?60f9426d2076"); 233 | background-position: -1px -125px; 234 | width: 44px; 235 | height: 41px; 236 | display: flex; 237 | margin: 6px 3px; 238 | } 239 | .tick { 240 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de") 241 | no-repeat -214px -253px; 242 | width: 14px; 243 | height: 15px; 244 | float: left; 245 | margin-top: 5px; 246 | } 247 | .PremiumButton { 248 | background-image: linear-gradient(136deg, #c87857 0%, #e8b383 100%); 249 | box-shadow: 0 4px 4px 0 rgb(0 0 0 / 21%); 250 | border-radius: 4px; 251 | color: #fff; 252 | font-size: 17px; 253 | font-weight: 600; 254 | padding: 10px 0; 255 | width: 190px; 256 | text-align: center; 257 | margin: 25px 0 0 0; 258 | cursor: pointer; 259 | justify-content: center; 260 | } 261 | 262 | /*-------get job----*/ 263 | 264 | .GetJob1 { 265 | float: left; 266 | width: 540px; 267 | height: 402px; 268 | margin-left: 45px; 269 | background: url("https://static1.shine.com/c/s1/images/candidate/new/app_base.png?6740b54474de") 270 | 90px no-repeat; 271 | } 272 | .Mobile { 273 | border-radius: 4px; 274 | box-shadow: 0px 2px 14px 0px rgb(0 0 0 / 17%); 275 | background: #fff; 276 | font-size: 15px; 277 | color: #6d7883; 278 | width: 533px; 279 | height: 46px; 280 | text-align: left; 281 | padding-left: 15px; 282 | float: left; 283 | } 284 | .Mobile > input { 285 | border: 0px; 286 | margin-top: 15px; 287 | margin-left: 10px; 288 | } 289 | .Mobile > input:focus { 290 | outline: none; 291 | } 292 | .rate { 293 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 294 | background-position: -1px -112px; 295 | width: 17px; 296 | height: 14px; 297 | float: left; 298 | } 299 | .halfrate { 300 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 301 | background-position: -21px -112px; 302 | width: 17px; 303 | height: 14px; 304 | float: left; 305 | } 306 | .play { 307 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 308 | background-position: 13px -142px; 309 | width: 35px; 310 | height: 41px; 311 | float: left; 312 | margin-top: -12px; 313 | } 314 | .store { 315 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de"); 316 | background-position: -19px -142px; 317 | width: 35px; 318 | height: 41px; 319 | float: left; 320 | margin-top: -12px; 321 | margin-left: 5px; 322 | } 323 | .storeButton { 324 | border-radius: 4px; 325 | background-color: #fbfbfb; 326 | box-shadow: 1px 1px 2px 0px rgb(188 188 188 / 40%); 327 | width: 157px; 328 | height: 39px; 329 | font-size: 16px; 330 | color: #5566c3; 331 | text-align: center; 332 | padding: 5px; 333 | padding-top: 10px; 334 | border: none; 335 | } 336 | 337 | /*-------resume------*/ 338 | 339 | .resume { 340 | background: #fff; 341 | box-shadow: 0 3px 14px 0 rgb(212 209 209 / 50%); 342 | border-radius: 4px; 343 | display: flex; 344 | flex-direction: column; 345 | text-align: left; 346 | padding: 10px 20px 10px 0; 347 | box-sizing: border-box; 348 | margin-bottom: 20px; 349 | 350 | width: 680px; 351 | height: 115px; 352 | margin-left: 45px; 353 | } 354 | .resumeButton { 355 | background-image: linear-gradient(136deg, #a296d9 0%, #7faee0 100%); 356 | box-shadow: 0 0 8px 0 rgb(0 0 0 / 21%); 357 | border-radius: 2px; 358 | color: #fff; 359 | font-size: 14px; 360 | margin-left: 14px; 361 | 362 | font-weight: 600; 363 | text-align: center; 364 | float: left; 365 | width: 130px; 366 | height: 30px; 367 | border: 0px; 368 | margin-left: 15px; 369 | padding: 0; 370 | margin-top: 10px; 371 | } 372 | .resumwriting { 373 | background: url("https://static1.shine.com/c/s1/images/mobile/new/sprite_resume_score.svg?60f9426d2076") -239px -79px 374 | no-repeat; 375 | width: 50px; 376 | height: 55px; 377 | float: left; 378 | margin-left: 430px; 379 | margin-top: -15px; 380 | transform: scale(1.3); 381 | } 382 | .resumwriting1 { 383 | background: url("https://static1.shine.com/c/s1/images/mobile/new/sprite_resume_score.svg?60f9426d2076") -81px 384 | 0px no-repeat; 385 | width: 49px; 386 | height: 49px; 387 | float: left; 388 | margin-left: 430px; 389 | margin-top: -15px; 390 | transform: scale(1.3); 391 | } 392 | /*-----course-----*/ 393 | 394 | .course { 395 | background: url("https://static1.shine.com/c/s1/images/candidate/new/purple_base_new.png?af2426e6d054") 396 | left top repeat-x #f5f9fb; 397 | margin-top: -41px; 398 | } 399 | .courselearning { 400 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?6740b54474de") -240px -15px 401 | repeat-x; 402 | width: 182px; 403 | height: 54px; 404 | margin-left: -45px; 405 | } 406 | .learnbutton { 407 | border: solid 1px #a3a3eb; 408 | font-size: 16px; 409 | border-radius: 4px; 410 | color: #fff; 411 | background: transparent; 412 | font-size: 16px; 413 | width: 142px; 414 | height: 42px; 415 | text-align: center; 416 | } 417 | /*-----footer-----*/ 418 | 419 | .footer { 420 | width: 355px; 421 | text-align: left; 422 | } 423 | .footer > strong { 424 | width: 350px; 425 | } 426 | .footer > a { 427 | width: 350px; 428 | text-decoration: none !important; 429 | } 430 | .footer > a > div { 431 | color: #4456bb; 432 | font-size: 13px; 433 | } 434 | .linkdin { 435 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?b11cffa1c046"); 436 | background-position: 1px -343px; 437 | width: 29px; 438 | height: 27px; 439 | float: left; 440 | } 441 | .facebook { 442 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?b11cffa1c046"); 443 | background-position: -33px -343px; 444 | width: 29px; 445 | height: 27px; 446 | float: left; 447 | } 448 | .twitter { 449 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_2019.png?b11cffa1c046"); 450 | background-position: -354px -162px; 451 | width: 29px; 452 | height: 27px; 453 | float: left; 454 | } 455 | .buttonf { 456 | background: #fff; 457 | box-shadow: 0px 4px 12px 0px rgb(0 0 0 / 20%); 458 | width: 170px; 459 | border-radius: 5px; 460 | font-size: 14px; 461 | color: #5364c4; 462 | text-align: center; 463 | padding: 5px; 464 | border: solid 1px #5364c4; 465 | float: left; 466 | } 467 | .blacksearch { 468 | background: url("https://static1.shine.com/c/s1/images/candidate/new/home_new.png?b11cffa1c046") -237px -403px 469 | #b1bac3; 470 | width: 46px; 471 | height: 39px; 472 | float: right; 473 | } 474 | -------------------------------------------------------------------------------- /src/Components/Register/Register.module.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | .top 4 | { 5 | height: 60px; 6 | text-align: left; 7 | padding-left: 10%; 8 | display: flex; 9 | flex-direction: row; 10 | } 11 | 12 | .top > div 13 | { 14 | height: 30px; 15 | width: 80px; 16 | margin-left: 62%; 17 | display: flex; 18 | flex-direction: row; 19 | text-align: center; 20 | padding-left: 35px; 21 | margin-top: 10px; 22 | border-radius: 5px; 23 | cursor: pointer; 24 | } 25 | 26 | .top > img 27 | { 28 | height: 50px; 29 | } 30 | 31 | .top1 32 | { 33 | height: 90px; 34 | background-color: #f4f5f5; 35 | box-shadow: 0px 0px 2px 2px rgb(201, 201, 201); 36 | } 37 | 38 | 39 | .cont 40 | { 41 | border: rgb(215, 215, 215) solid 1px; 42 | height: 550px; 43 | display: flex; 44 | margin: auto; 45 | flex-direction: row; 46 | background-color: #fbfbfb; 47 | padding: 80px 30px 80px 30px; 48 | 49 | } 50 | 51 | .mid 52 | { 53 | margin: auto; 54 | display: flex; 55 | width: 900px; 56 | height: 600px; 57 | border: black solid 0px; 58 | box-shadow: rgb(169, 169, 169) 0px 0px 10px 5px; 59 | 60 | } 61 | 62 | .contimg 63 | { 64 | margin-top: 5%; 65 | } 66 | .cont1 67 | { 68 | border: black solid 0px; 69 | height: 450px; 70 | width: 500px; 71 | margin: auto; 72 | padding-left: 30px; 73 | text-align: left; 74 | box-shadow: 0px 0px 2px 2px rgb(252, 248, 248); 75 | } 76 | 77 | .cont1 > input 78 | { 79 | width: 400px; 80 | border: rgb(143, 141, 141) solid 1px; 81 | border-radius: 5px; 82 | height: 40px; 83 | 84 | } 85 | 86 | .commoncont 87 | { 88 | margin: auto; 89 | display: flex; 90 | flex-direction: column; 91 | width: 900px; 92 | height: 550px; 93 | border: black solid 0px; 94 | box-shadow: rgb(169, 169, 169) 0px 0px 10px 5px; 95 | transition: ease-in-out; 96 | transition: 200ms; 97 | } 98 | 99 | .commonmid 100 | { 101 | border: black solid 0px; 102 | height: 450px; 103 | width: 500px; 104 | margin: auto; 105 | padding-left: 30px; 106 | text-align: left; 107 | box-shadow: 0px 0px 2px 2px rgb(252, 248, 248); 108 | transition: ease-in-out; 109 | transition: 500ms; 110 | } 111 | 112 | .commoncont1 113 | { 114 | border: black solid 0px; 115 | width: 650px; 116 | height: 150px; 117 | margin: auto; 118 | text-align: center; 119 | display: flex; 120 | flex-direction: row; 121 | transition: ease-in-out 300ms; 122 | } 123 | .commoncont2 124 | { 125 | border: black solid 0px; 126 | width: 650px; 127 | height: 60px; 128 | margin: auto; 129 | text-align: right; 130 | justify-content: right; 131 | transition: ease-in-out 300ms; 132 | } 133 | 134 | .identity_third:hover 135 | { 136 | background-color: cornflowerblue; 137 | } 138 | 139 | .identity_third:focus 140 | { 141 | background-color: cornflowerblue; 142 | } 143 | .quali:focus 144 | { 145 | background-color: cornflowerblue; 146 | } 147 | 148 | 149 | .commoncontconti 150 | { 151 | width: 150px; 152 | background-image: linear-gradient( 135deg, rgb(162, 150, 217) 0%, rgb(127, 174, 224) 100%); 153 | box-shadow: 0 4px 4px 0 rgb(0 0 0 / 21%); 154 | border-radius: 5px; 155 | font-weight: 600; 156 | margin-left: 75%; 157 | padding-top: 10px; 158 | text-align: center; 159 | height: 35px; 160 | width: 130px; 161 | color: white; 162 | cursor: pointer; 163 | } 164 | 165 | 166 | .conti 167 | { 168 | width: 150px; 169 | background-image: linear-gradient( 135deg, rgb(162, 150, 217) 0%, rgb(127, 174, 224) 100%); 170 | box-shadow: 0 4px 4px 0 rgb(0 0 0 / 21%); 171 | border-radius: 5px; 172 | font-weight: 600; 173 | margin-left: 55%; 174 | padding-top: 10px; 175 | text-align: center; 176 | height: 35px; 177 | width: 130px; 178 | color: white; 179 | cursor: pointer; 180 | } 181 | 182 | 183 | 184 | .Register 185 | { 186 | background-color: rgb(220, 220, 220); 187 | margin-left: -30px; 188 | padding-top: 10px; 189 | height: 35px; 190 | margin-top: 100px; 191 | border-bottom: rgb(218, 218, 218) solid 1px; 192 | text-align: center; 193 | color: rgb(70, 70, 70); 194 | font-weight: 500; 195 | } 196 | 197 | 198 | .login 199 | { 200 | background-image: linear-gradient( 135deg, rgb(162, 150, 217) 0%, rgb(127, 174, 224) 100%); 201 | box-shadow: 0 4px 4px 0 rgb(0 0 0 / 21%); 202 | padding-top: 10px; 203 | text-align: center; 204 | height: 35px; 205 | width: 400px; 206 | color: white; 207 | } 208 | 209 | .social 210 | { 211 | display: flex; 212 | transition: 1s; 213 | } 214 | 215 | .social > div 216 | { 217 | margin-right: 10px; 218 | width: 126px; 219 | padding-top: -5px; 220 | padding-bottom: 5px; 221 | cursor: pointer; 222 | height: 40px; 223 | box-shadow: rgb(231, 230, 230) 0px 0px 2px 2px; 224 | color: rgb(50, 49, 49); 225 | display: flex; 226 | transition: 1s; 227 | 228 | } 229 | 230 | .social > div > img 231 | { 232 | height: 30px; 233 | width: 30px; 234 | margin-right: 10px; 235 | margin-left: 5px; 236 | margin-top: 5%; 237 | } 238 | 239 | .social > div > p 240 | { 241 | margin-top: 10%; 242 | font-weight: 450; 243 | color: rgb(79, 78, 78); 244 | } 245 | 246 | 247 | 248 | 249 | 250 | .create > span 251 | { 252 | font-size: 40px; 253 | padding: 0; 254 | margin: 0; 255 | text-align: left; 256 | } 257 | 258 | .jobs 259 | { 260 | font-size: 16px; 261 | font-weight: 600; 262 | text-align: left; 263 | } 264 | 265 | 266 | 267 | 268 | 269 | 270 | 271 | 272 | .btm 273 | { 274 | height: 150px; 275 | display: flex; 276 | 277 | } 278 | 279 | .btmleft 280 | { 281 | 282 | width: 60%; 283 | text-align: left; 284 | padding: 0; 285 | box-sizing: border-box; 286 | -webkit-font-smoothing: antialiased; 287 | -moz-osx-font-smoothing: grayscale; 288 | list-style: none; 289 | box-sizing: border-box; 290 | flex: 0 0 83%; 291 | -webkit-font-smoothing: antialiased; 292 | display: block; 293 | } 294 | 295 | 296 | .btmleft > ul > li 297 | { 298 | display: inline-block; 299 | font-size: 12px; 300 | padding: 0; 301 | padding-right: 5px; 302 | margin: 0 2px; 303 | font-weight: 400; 304 | -webkit-font-smoothing: antialiased; 305 | text-align: left; 306 | } 307 | 308 | .btmright 309 | { 310 | border: black solid 1px; 311 | width: 40%; 312 | margin-left: 2%; 313 | height: 80px; 314 | text-align: left; 315 | } 316 | 317 | 318 | 319 | 320 | .footer 321 | { 322 | height: 100px; 323 | text-align: left; 324 | color: #6d7883; 325 | } 326 | 327 | .footer > ul > li 328 | { 329 | display: inline-block; 330 | font-size: 12px; 331 | padding: 0; 332 | padding-right: 5px; 333 | margin: 0 2px; 334 | font-weight: 400; 335 | border-right: #6d7883 solid 2px; 336 | -webkit-font-smoothing: antialiased; 337 | } 338 | 339 | .quali 340 | { 341 | display: flex; 342 | flex-direction: row; 343 | } 344 | 345 | .skills 346 | { 347 | display: flex; 348 | flex-direction: row; 349 | width: 200px; 350 | } 351 | 352 | 353 | 354 | li 355 | { 356 | text-align: -webkit-match-parent; 357 | font-family: Roboto,Arial,Times,serif; 358 | box-sizing: border-box; 359 | color: #6d7883; 360 | } 361 | 362 | .footer > ul> li > a 363 | { 364 | color: #6d7883; 365 | } 366 | 367 | .revamp_footer__contactus { 368 | flex: 0 0 17%; 369 | padding-top: 10px; 370 | } 371 | 372 | div { 373 | display: block; 374 | } 375 | 376 | .btm-right 377 | { 378 | font-size: 12px; 379 | } 380 | 381 | .follow > ul 382 | { 383 | display: flex; 384 | flex-direction: column; 385 | list-style: none; 386 | list-style-type: none; 387 | } 388 | 389 | 390 | .identity 391 | { 392 | border-radius: 10px; 393 | border: black solid 0px; 394 | height: 100px; 395 | width: 100px; 396 | margin: auto; 397 | background-color: rgb(244, 245, 245); 398 | box-shadow: rgb(233, 233, 233) 0px 0px 5px 5px; 399 | cursor: pointer; 400 | } 401 | 402 | .identity1 403 | { 404 | width: 40px; 405 | height: 54px; 406 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 407 | background-position: -85px -62px; 408 | } 409 | .identity2 410 | { 411 | width: 40px; 412 | height: 54px; 413 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 414 | background-position: -86px -11px; 415 | } 416 | .identity3 417 | { 418 | width: 50px; 419 | height: 54px; 420 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 421 | background-position: -11px -129px; 422 | } 423 | .identity4 424 | { 425 | width: 40px; 426 | height: 54px; 427 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 428 | background-position: -88px -117px; 429 | } 430 | .identity5 431 | { 432 | width: 50px; 433 | height: 54px; 434 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 435 | background-position: -132px -10px; 436 | } 437 | .identity6 438 | { 439 | width: 60px; 440 | height: 54px; 441 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 442 | background-position: -135px -61px; 443 | } 444 | .identity7 445 | { 446 | width: 60px; 447 | height: 54px; 448 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 449 | background-position: -131px -114px; 450 | } 451 | .identity8 452 | { 453 | width: 50px; 454 | height: 54px; 455 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 456 | background-position: -138px -166px; 457 | } 458 | .identity9 459 | { 460 | width: 60px; 461 | height: 54px; 462 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 463 | background-position: -217px -76px; 464 | } 465 | .identity10 466 | { 467 | width: 40px; 468 | height: 54px; 469 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 470 | background-position: -209px -12px; 471 | } 472 | 473 | .identity_second 474 | { 475 | border-radius: 10px; 476 | border: black solid 0px; 477 | height: 100px; 478 | width: 300px; 479 | margin: auto; 480 | display: flex; 481 | flex-direction: row; 482 | background-color: rgb(244, 245, 245); 483 | box-shadow: rgb(196, 196, 196) 0px 0px 5px 5px; 484 | cursor: pointer; 485 | } 486 | 487 | .identity_second:hover 488 | { 489 | background-color: rgb(145, 186, 220); 490 | border: rgb(145, 186, 220) solid 5px; 491 | } 492 | 493 | .identity_second:focus 494 | { 495 | background-color: rgb(145, 186, 220); 496 | } 497 | 498 | .identity11 499 | { 500 | width: 60px; 501 | height: 54px; 502 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 503 | background-position: -77px -175px; 504 | } 505 | 506 | .identity12 507 | { 508 | width: 60px; 509 | height: 54px; 510 | background: url("https://static1.shine.com/c/s1/bundles/registration_sprite-1cf96c8.png"); 511 | background-position: -3px -188px; 512 | } 513 | 514 | 515 | .identity:hover 516 | { 517 | background-color: rgb(145, 186, 220); 518 | border: rgb(145, 186, 220) solid 5px; 519 | } 520 | 521 | 522 | .identity:focus 523 | { 524 | background-color: rgb(145, 186, 220); 525 | } 526 | 527 | 528 | .identity_third 529 | { 530 | height: 40px; 531 | margin: auto; 532 | border: black solid 0px; 533 | display: flex; 534 | flex-direction: row; 535 | background-color: rgb(244, 245, 245); 536 | box-shadow: rgb(196, 196, 196) 0px 0px 5px 5px; 537 | cursor: pointer; 538 | } 539 | 540 | .identity_third:hover 541 | { 542 | background-color: rgb(145, 186, 220); 543 | border: rgb(145, 186, 220) solid 5px; 544 | } 545 | 546 | .identity_third:focus 547 | { 548 | background-color: rgb(145, 186, 220); 549 | } 550 | 551 | 552 | .skillcont 553 | { 554 | border: black 0px solid; 555 | width: 650px; 556 | margin: auto; 557 | display: flex; 558 | flex-direction: row; 559 | height: 400px; 560 | 561 | 562 | } 563 | 564 | .skillcont21 565 | { 566 | border: black 0px solid; 567 | width: 300px; 568 | height: 400px; 569 | margin: auto; 570 | 571 | } 572 | 573 | .skillcont22 574 | { 575 | border: black 0px solid; 576 | width: 300px; 577 | height: 250px; 578 | margin: auto; 579 | 580 | } 581 | 582 | --------------------------------------------------------------------------------