Temp page

This commit is contained in:
Ram Reddy 2021-02-20 12:10:56 -08:00
parent 77374095a7
commit 46832dc5de
No known key found for this signature in database
GPG Key ID: 2CD6B38BE14BDE53
3 changed files with 92 additions and 0 deletions

View File

@ -5,6 +5,7 @@ import ContactForm from "./components/Contact";
import Home from "./components/Home";
import PostDetail from "./components/PostDetail";
import Blog from "./components/Blog";
import Donate from "./components/Donate";
import Navbar from "./components/Navbar";
function App() {
@ -16,6 +17,7 @@ function App() {
<Route component={ContactForm} path="/contact" />
<Route component={PostDetail} path="/blog/:slug" />
<Route component={Blog} path="/blog" />
<Route component={Donate} path="/donate" />
<Route component={Home} path="/" />
</Switch>
</BrowserRouter>

54
src/components/Donate.js Normal file
View File

@ -0,0 +1,54 @@
import React, {Component} from "react";
import {createGlobalStyle} from 'styled-components';
import bot2 from "./assets/img/bot2.png";
import './assets/Donate.scss'
const GlobalStyle = createGlobalStyle`
html {
height: 100%
}
body {
background-color: #293241;
font-family: Arial, Helvetica, sans-serif;
height: 100%;
margin: 0;
color: #555;
}
`;
class Donate extends Component {
render() {
return(
<>
<GlobalStyle />
{/* <div className="content-box"> hjalsdklANSDFKJASNDF</div> */}
<div className="centered">
<p>
<h1>Donate Today</h1>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<h2>Paypal widget here</h2>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<span><br></br></span>
<h2>Gofundme widget here</h2>
</p>
</div>
<img className="landing-robot" src={bot2}>
</img>
</>
);
}
}
export default Donate;

View File

@ -0,0 +1,36 @@
.centered {
position: absolute;
top: 50%;
left: 50%;
height: 60%;
zoom: 1;
filter: alpha(opacity=100);
opacity: 0.8;
width: 40%;
background-color:#3d5a80;
border-radius: 10px;
transform: translate(-50%, -50%);
}
p {
margin-left:4em;
vertical-align: middle;
}
h1 {
font-family: "Poppins", sans-serif;
font-size:250%;
position: absolute;
color:#e0fbfc;
}
h2{
font-family: "Poppins", sans-serif;
font-size: 2em;
position: absolute;
color:#e0fbfc;
}
.landing-robot {
opacity: 0;
left: 8vw;
overflow: hidden;
animation: navLinkFade 0.5s ease forwards 0.5s;
height: 80%;
}