Skip to content
Snippets Groups Projects
Commit d9e8677c authored by amulya's avatar amulya
Browse files

Footer component

parent ee5d99b6
No related branches found
No related tags found
2 merge requests!7Revert "Merge branch 'features/Adam/image' into 'development'",!5Features/ashok/cards
This commit is part of merge request !7. Comments created here will be created in the context of that merge request.
Show whitespace changes
Inline Side-by-side
Showing
with 281 additions and 3 deletions
package-lock.json
+ 63
− 0
Edit View file @ d9e8677c
......@@ -11,10 +11,13 @@
"@testing-library/jest-dom": "^5.16.1",
"@testing-library/react": "^12.1.2",
"@testing-library/user-event": "^13.5.0",
"bootstrap": "^4.6.0",
"classnames": "^2.3.1",
"jquery": "^3.6.0",
"node-sass": "^7.0.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-icons": "^4.3.1",
"react-router-dom": "^6.2.1",
"react-scripts": "5.0.0",
"web-vitals": "^2.1.2"
......@@ -4862,6 +4865,19 @@
"resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
"integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
},
"node_modules/bootstrap": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.0.tgz",
"integrity": "sha512-Io55IuQY3kydzHtbGvQya3H+KorS/M9rSNyfCGCg9WZ4pyT/lCxIlpJgG1GXW/PswzC84Tr2fBYi+7+jFVQQBw==",
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/bootstrap"
},
"peerDependencies": {
"jquery": "1.9.1 - 3",
"popper.js": "^1.16.1"
}
},
"node_modules/brace-expansion": {
"version": "1.1.11",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
......@@ -10859,6 +10875,11 @@
"url": "https://github.com/chalk/supports-color?sponsor=1"
}
},
"node_modules/jquery": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz",
"integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw=="
},
"node_modules/js-base64": {
"version": "2.6.4",
"resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz",
......@@ -12492,6 +12513,17 @@
"node": ">=4"
}
},
"node_modules/popper.js": {
"version": "1.16.1",
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
"integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==",
"deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1",
"peer": true,
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/popperjs"
}
},
"node_modules/portfinder": {
"version": "1.0.28",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
......@@ -13949,6 +13981,14 @@
"resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.10.tgz",
"integrity": "sha512-mKR90fX7Pm5seCOfz8q9F+66VCc1PGsWSBxKbITjfKVQHMNF2zudxHnMdJiB1fRCb+XsbQV9sO9DCkgsMQgBIA=="
},
"node_modules/react-icons": {
"version": "4.3.1",
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.3.1.tgz",
"integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ==",
"peerDependencies": {
"react": "*"
}
},
"node_modules/react-is": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
......@@ -20802,6 +20842,12 @@
"resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
"integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
},
"bootstrap": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.0.tgz",
"integrity": "sha512-Io55IuQY3kydzHtbGvQya3H+KorS/M9rSNyfCGCg9WZ4pyT/lCxIlpJgG1GXW/PswzC84Tr2fBYi+7+jFVQQBw==",
"requires": {}
},
"brace-expansion": {
"version": "1.1.11",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
......@@ -25164,6 +25210,11 @@
}
}
},
"jquery": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz",
"integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw=="
},
"js-base64": {
"version": "2.6.4",
"resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz",
......@@ -26365,6 +26416,12 @@
}
}
},
"popper.js": {
"version": "1.16.1",
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
"integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==",
"peer": true
},
"portfinder": {
"version": "1.0.28",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
......@@ -27317,6 +27374,12 @@
"resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.10.tgz",
"integrity": "sha512-mKR90fX7Pm5seCOfz8q9F+66VCc1PGsWSBxKbITjfKVQHMNF2zudxHnMdJiB1fRCb+XsbQV9sO9DCkgsMQgBIA=="
},
"react-icons": {
"version": "4.3.1",
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.3.1.tgz",
"integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ==",
"requires": {}
},
"react-is": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
src/App.js
+ 15
− 2
Edit View file @ d9e8677c
import Footer from './components/Footer/Footer'
import Button from './components/Button/index'
import React, { lazy, Suspense } from "react";
import { BrowserRouter, Route, Routes } from "react-router-dom";
const Login = lazy(() => import("./containers/Login"));
function App() {
return (
<div className="App">
<BrowserRouter>
{/* <BrowserRouter>
<Suspense fallback={<div> loading</div>}>
<Routes>
<Route exact path="/login" element={<Login />} />
<Route path="/" element={<Login />} />
</Routes>
</Suspense>
</BrowserRouter>
</BrowserRouter> */}
<Footer/>
</div>
);
}
export default App;
src/components/Btns/Btns.css 0 → 100644
+ 13
− 0
Edit View file @ d9e8677c
.btns{
color:darkblue;
width:70px;
position: relative;
top: 0;
transition: top ease 0.3s;
border-radius: 5px;
}
.btns:hover{
top: -2px;
}
src/components/Btns/Btns.js 0 → 100644
+ 16
− 0
Edit View file @ d9e8677c
import classNames from "classnames";
import React from "react";
import './Btns.css'
function Btns1 (props) {
return (
//<div style={{backgroundColor:"blue"}}>
<button className="btns">
{props.buttonName}
</button>
)}
export default Btns1;
\ No newline at end of file
src/components/Button/index.jsx
+ 6
− 1
Edit View file @ d9e8677c
......@@ -3,8 +3,13 @@ import PropTypes from "prop-types";
import cs from "classnames";
import styles from "./Button.module.scss";
function Button(props) {
return <div className={cs(styles.customButton)}>here</div>;
return (
<div>
</div>
)
}
Button.propTypes = {};
......
src/components/Footer/About.js 0 → 100644
+ 10
− 0
Edit View file @ d9e8677c
import React from 'react';
function About () {
return <div>
Read more about us
</div>
}
export default About;
\ No newline at end of file
src/components/Footer/Blog.css 0 → 100644
+ 0
− 0
Edit View file @ d9e8677c
src/components/Footer/Blog.js 0 → 100644
+ 7
− 0
Edit View file @ d9e8677c
import React from 'react';
function Blog(){
return <h1>Welcome</h1>
}
export default Blog;
\ No newline at end of file
src/components/Footer/CreativeTim.js 0 → 100644
+ 9
− 0
Edit View file @ d9e8677c
import React from 'react'
export default function CreativeTim() {
return (
<div>
happy
</div>
)
}
\ No newline at end of file
src/components/Footer/Footer.css 0 → 100644
+ 45
− 0
Edit View file @ d9e8677c
.main{
padding-top: 20px;
}
.icons{
float: left;
padding-left: 10px;
color: gray;
padding-right: 5px;
}
.number{
float:left;
padding-left:2px;
padding-right: 10px;
}
.Creative{
color: blue;
float: left;
padding-right: 1250px;
}
Link:hover {
background:black;
}
.new{
float: left;
margin-left: 1600px;
background-color: whitesmoke;
padding-right: 15px;
}
.filter{
margin-top: 20px;
}
.Creative:hover{
color: black !important;
}
\ No newline at end of file
src/components/Footer/Footer.js 0 → 100644
+ 79
− 0
Edit View file @ d9e8677c
import React from 'react'
import './Footer.css';
import {FaRegCopyright } from "react-icons/fa";
import About from './About';
import Blog from './Blog';
import { BrowserRouter as Router,Routes, Route, Link} from 'react-router-dom';
import MITLicense from './MITLicense';
import CreativeTim from './CreativeTim';
import Btns from 'components/Btns/Btns';
const Footer = (props)=> {
return (
<div>
<div className="new" handleFunction={()=> alert("new")} >
<Btns buttonName="New"/>
</div>
<div className="filter" >
<Btns buttonName="filters"/>
</div>
<div className='main'>
<div className='icons'>
<FaRegCopyright/>
</div>
<div className='number'>
2020
</div>
<Router>
<div className="App">
<ul className="App-header">
{/* <div className='Creative'>CreativeTim</div> */}
<Link style={{paddingRight:"30px" ,color:"blue", textDecoration: "none" }} to="/CreativeTim">CreativeTim</Link>
<Link style={{paddingRight:"30px", paddingLeft:"1200px" ,color:"gray",textDecoration: "none"}} to="/CreativeTim">Creative Tim </Link>
<Link style={{paddingRight:"30px" ,color:"gray",textDecoration: "none"}} to="/blog">Blog </Link>
<Link style={{paddingRight:"30px" ,color:"gray",textDecoration: "none"}} to="/about">About Us</Link>
<Link style={{paddingRight:"30px" ,color:"gray",textDecoration: "none"}} to="/MITLicense">MIT License</Link>
</ul>
<Routes>
<Route exact path='/CreativeTim' element={< CreativeTim />}></Route>
<Route exact path='/CreativeTim' element={< CreativeTim />}></Route>
<Route exact path='/blog' element={< Blog/>}></Route>
<Route exact path='/about' element={< About />}></Route>
<Route exact path='/MITLicense' element={< MITLicense />}></Route>
</Routes>
</div>
</Router>
</div>
</div>
);
};
export default Footer;
\ No newline at end of file
src/components/Footer/MITLicense.js 0 → 100644
+ 12
− 0
Edit View file @ d9e8677c
import React from 'react';
function MITLicense(){
return <address>
You can find us here:<br />
5th & 6th Floor, <br />
Noida, Uttar Pradesh
</address>
}
export default MITLicense;
\ No newline at end of file
src/index.js
+ 3
− 0
Edit View file @ d9e8677c
......@@ -3,6 +3,9 @@ import ReactDOM from "react-dom";
import App from "./App";
import reportWebVitals from "./reportWebVitals";
import "./assets/scss/argon.scss";
import "jquery/dist/jquery.slim.min";
import "bootstrap/dist/js/bootstrap.bundle.min";
import "bootstrap/dist/css/bootstrap.min.css";
ReactDOM.render(
<React.StrictMode>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment