resolved merge conflict in app.css

This commit is contained in:
Leon Liang
2019-10-02 23:10:12 -04:00
11 changed files with 313 additions and 290 deletions

View File

@@ -1,7 +1,3 @@
/* body {
} */
.app {
font-family: "Segoe UI";
font-size: large;
@@ -52,7 +48,3 @@
color: #1da1f2;
}
.post-container {
max-width: 345px;
max-height: 125px;
}

View File

@@ -10,7 +10,7 @@ import Navbar from './components/layout/NavBar';
import home from './pages/Home';
import register from './pages/Register';
import login from './pages/Login';
import user from './pages/User';
import user from './pages/user';
import writeMicroblog from './Writing_Microblogs.js';
import edit from './pages/edit.js';
@@ -38,4 +38,4 @@ class App extends Component {
}
}
export default App;
export default App;

View File

@@ -2,6 +2,12 @@ import React, { Component } from "react";
import { BrowserRouter as Router } from 'react-router-dom';
import Route from 'react-router-dom/Route';
import axios from 'axios';
import Box from '@material-ui/core/Box'
import {borders} from '@material-ui/system';
import { sizing } from '@material-ui/system';
// var moment = require('moment');
class Userline extends Component {
@@ -23,20 +29,36 @@ class Userline extends Component {
this.setState({microBlogs : post})
})
}
}
render() {
let sortedPosts = [];
const sortedPosts = (this.state.microBlogs).sort((a,b) =>
-a.createdAt.localeCompare(b.createdAt)
)
return (
<ul>
{ this.state.microBlogs.map(microBlog => <p>{microBlog.body}</p>)}
</ul>
)
}
<div>
<div style={{fontsize: "13px", textAlign: "left", marginLeft: "14px"}}>
<p>Userline</p>
</div>
<Box border={1} width="25%" flex="1" height="auto" m={2} fontSize="13px" textAlign= "left" padding="5px" flexWrap= "wrap" flexDirection= "row" >
<div style={{flexWrap: "wrap", flex: "1", flexDirection: "row", wordBreak: "break-word"}}>
<p>
{sortedPosts.map((microBlog) => <p>Microblog Title: {microBlog.microBlogTitle}
<br></br>When post was created: {microBlog.createdAt.substring(0,10) +
" " + microBlog.createdAt.substring(11,19)}
<br></br>Number of comments: {microBlog.commentCount}
<br></br>Number of likes: {microBlog.likeCount}
<br></br>Body of post: {microBlog.body}
<br></br>Tagged topics: {microBlog.microBlogTopics.join("," + " ")}
</p>)}
</p>
</div>
</Box>
</div>
)
}
}
export default Userline;

View File

@@ -12,7 +12,7 @@ class Writing_Microblogs extends Component {
value: '',
title: '',
topics: '',
characterCount: 10
characterCount: 250
};
@@ -48,8 +48,9 @@ class Writing_Microblogs extends Component {
)
console.log(response.data);
alert('Post was shared successfully!');
event.preventDefault();
this.setState({value: '', title: '',characterCount: 10, topics: ''})
this.setState({value: '', title: '',characterCount: 250, topics: ''})
}
handleChangeforPost(event) {
@@ -58,7 +59,7 @@ class Writing_Microblogs extends Component {
handleChangeforCharacterCount(event) {
const charCount = event.target.value.length
const charRemaining = 10 - charCount
const charRemaining = 250 - charCount
this.setState({characterCount: charRemaining })
}
@@ -80,7 +81,7 @@ class Writing_Microblogs extends Component {
<div style={{ width: "200px", marginLeft: "50px"}}>
<form onSubmit={this.handleSubmit}>
<textarea value={this.state.value} required maxLength="10" placeholder= "Write Microblog here..."
<textarea value={this.state.value} required maxLength="250" placeholder= "Write Microblog here..."
onChange = { (e) => { this.handleChangeforPost(e); this.handleChangeforCharacterCount(e) } } cols={40} rows={20} />
<div style={{ fontSize: "14px", marginRight: "-100px"}} >
<p2>Characters Left: {this.state.characterCount}</p2>

View File

@@ -1,41 +1,41 @@
import React, { Component } from "react";
import axios from "axios";
import PropTypes from "prop-types";
// TODO: Fix font, so that it is roboto
// TODO: Add a read-only '@' in the left side of the handle input
// TODO: Add a cancel button, that takes the user back to their profile page
// TODO: Sort imports
// TODO: Add comments
// Material-UI stuff
import Button from "@material-ui/core/Button";
import CircularProgress from "@material-ui/core/CircularProgress";
import Grid from "@material-ui/core/Grid";
import TextField from "@material-ui/core/TextField";
import Typography from "@material-ui/core/Typography";
import withStyles from "@material-ui/core/styles/withStyles";
import Grid from "@material-ui/core/Grid";
import Button from "@material-ui/core/Button";
import CircularProgress from '@material-ui/core/CircularProgress';
const styles = {
form: {
textAlign: "center"
},
textField: {
marginBottom: 40
marginBottom: 30
},
pageTitle: {
marginTop: 40,
// marginTop: 20,
marginBottom: 40
},
button: {
positon: 'relative',
positon: "relative",
marginBottom: 30
},
progress: {
position: 'absolute',
position: "absolute"
}
};
export class edit extends Component {
// Runs as soon as the page loads.
// Sets the default values of all the textboxes to the data
// that is stored in the database for the user.
componentDidMount() {
axios
.get("/getProfileInfo")
@@ -53,6 +53,7 @@ export class edit extends Component {
});
}
// Constructor for the state
constructor() {
super();
this.state = {
@@ -66,6 +67,9 @@ export class edit extends Component {
};
}
// Runs whenever the submit button is clicked.
// Updates the database entry of the signed in user with the
// data stored in the state.
handleSubmit = (event) => {
event.preventDefault();
this.setState({
@@ -95,11 +99,14 @@ export class edit extends Component {
});
};
// Updates the state whenever one of the textboxes changes.
// The key is the name of the textbox and the value is the
// value in the text box.
handleChange = (event) => {
this.setState({
[event.target.name]: event.target.value,
errors: {
[event.target.name]: null,
[event.target.name]: null
}
});
};
@@ -154,6 +161,7 @@ export class edit extends Component {
value={this.state.email}
disabled
helperText="(disabled)"
// INFO: These will be uncommented if changing emails is allowed
// helperText={errors.email}
// error={errors.email ? true : false}
variant="outlined"
@@ -168,6 +176,7 @@ export class edit extends Component {
value={this.state.handle}
disabled
helperText="(disabled)"
// INFO: These will be uncommented if changing usernames is allowed
// helperText={errors.handle}
// error={errors.handle ? true : false}
variant="outlined"
@@ -197,7 +206,7 @@ export class edit extends Component {
>
Submit
{loading && (
<CircularProgress size={30} className={classes.progress}/>
<CircularProgress size={30} className={classes.progress} />
)}
</Button>
</form>