rushilwiz/website
1
0
Fork 0
mirror of https://github.com/PotentiaRobotics/website.git synced 2025-04-28 15:59:54 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

Changes in appearance

Browse Source
This commit is contained in:
Ram Reddy 2021-02-04 14:14:41 -05:00
parent 25f25b6fda
commit a0d14ded1a
2 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Contact.js
View File

@ -9,6 +9,7 @@ const GlobalStyle = createGlobalStyle`
height: 100% height: 100%
} }
body { body {
background-color: #293241;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
height: 100%; height: 100%;
margin: 0; margin: 0;
@ -118,8 +119,7 @@ class ContactForm extends Component {
onChange={this.handleMessageChange} onChange={this.handleMessageChange}
/> />
<StyledError> <StyledError>
<p>{this.state.error}</p> <p>{this.state.error}</p>
<p></p>
</StyledError> </StyledError>
<StyledButton type="submit">Send Message</StyledButton> <StyledButton type="submit">Send Message</StyledButton>

16
src/components/assets/StyledContactForm.js
View File

@ -1,7 +1,7 @@
import styled, { createGlobalStyle, css } from 'styled-components'; import styled, { createGlobalStyle, css } from 'styled-components';
const sharedStyles = css` const sharedStyles = css`
background-color: #eee; background-color: #ccc;
height: 40px; height: 40px;
border-radius: 5px; border-radius: 5px;
border: 1px solid #ddd; border: 1px solid #ddd;
@ -22,12 +22,14 @@ const StyledForm = styled.form`
width: 100%; width: 100%;
max-width: 700px; max-width: 700px;
padding: 40px; padding: 40px;
background-color: #fff; background-color: #eee;
border-radius: 10px; color: #3d5a80;
box-sizing: border-box; box-sizing: border-box;
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 20px 0px rgba(250, 250, 250, 0.4);
`; `;
// border-radius: 10px; (if we want a round form)
const StyledInput = styled.input` const StyledInput = styled.input`
display: block; display: block;
width: 100%; width: 100%;
@ -35,7 +37,7 @@ const StyledInput = styled.input`
`; `;
const StyledTextAreaSubject = styled.textarea` const StyledTextAreaSubject = styled.textarea`
background-color: #eee; background-color: #98c1d9;
width: 100%; width: 100%;
min-height: 60px; min-height: 60px;
resize: none; resize: none;
@ -43,7 +45,7 @@ const StyledTextAreaSubject = styled.textarea`
`; `;
const StyledTextArea = styled.textarea` const StyledTextArea = styled.textarea`
background-color: #eee; background-color: #98c1d9;
width: 100%; width: 100%;
min-height: 100px; min-height: 100px;
resize: none; resize: none;
@ -51,7 +53,7 @@ const StyledTextArea = styled.textarea`
`; `;
const StyledButton = styled.button` const StyledButton = styled.button`
display: block; display: block;
background-color: #f7797d; background-color: #ee6c4d;
color: #fff; color: #fff;
font-size: 0.9rem; font-size: 0.9rem;
border: 0; border: 0;