Skip to content
GitLab
Commit 97f308c4 authored by Florent Chehab's avatar Florent Chehab
Browse files

Ça avance !

parent 479992e9
Pipeline #27063 passed with stages
in 2 minutes and 25 seconds
Hide whitespace changes
Inline Side-by-side
frontend/src/components/other/TextLink.js 0 → 100644
View file @ 97f308c4
import React from 'react';
import { withStyles } from '@material-ui/core/styles';
import { lighten, darken } from '@material-ui/core/styles/colorManipulator';
const styles = (theme) => {
const { palette } = theme;
const linkColor = palette.type == 'dark' ? lighten(palette.secondary.main, 0.8) : darken(palette.secondary.main, 0.3);
return {
link: {
color: linkColor,
textDecoration: "none",
borderBottom: "1px dotted"
},
}
}
export default withStyles(styles, { withTheme: true })(({ classes, ...props }) => (
<a href={props.href} className={classes.link} target="_blank">
{props.children}
</a>
))
frontend/src/components/pages/PageHome.js
View file @ 97f308c4
......@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import Typography from '@material-ui/core/Typography';
import Paper from '@material-ui/core/Paper';
import Markdown from '../../utils/Markdown'
import Markdown from '../shared/Markdown';
const styles = theme => ({
myPaper: {
......@@ -26,6 +26,7 @@ Les objectifs de ce service sont :
| Départs possibles | ✔ |
| Informatio sur les universités | ✔ |
[Rendez-vous sur le GitLab de l'UTC !](https://gitlab.utc.fr)
`;
class PageHome extends React.Component {
......
frontend/src/components/pages/PageUniversity.js
View file @ 97f308c4
......@@ -104,7 +104,7 @@ class PageUniversity extends MyComponent {
}
PageUniversity.propTypes = {
classes: PropTypes.object.isRequired,
// classes: PropTypes.object.isRequired,
};
......
frontend/src/components/settings/ColorDemo.js
View file @ 97f308c4
......@@ -8,7 +8,6 @@ import IconButton from '@material-ui/core/IconButton';
import MenuIcon from '@material-ui/icons/Menu';
import Typography from '@material-ui/core/Typography';
import AddIcon from '@material-ui/icons/Add';
// import MarkdownElement from '@material-ui/docs/MarkdownElement';
const styles = theme => ({
root: {
......
frontend/src/components/shared/FullScreenDialog.js 0 → 100644
View file @ 97f308c4
import React from 'react';
import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import Button from '@material-ui/core/Button';
import Dialog from '@material-ui/core/Dialog';
import ListItemText from '@material-ui/core/ListItemText';
import ListItem from '@material-ui/core/ListItem';
import List from '@material-ui/core/List';
import Divider from '@material-ui/core/Divider';
import AppBar from '@material-ui/core/AppBar';
import Toolbar from '@material-ui/core/Toolbar';
import IconButton from '@material-ui/core/IconButton';
import Typography from '@material-ui/core/Typography';
import CloseIcon from '@material-ui/icons/Close';
import Slide from '@material-ui/core/Slide';
const styles = {
appBar: {
position: 'relative',
},
flex: {
flex: 1,
},
};
function Transition(props) {
return <Slide direction="up" {...props} />;
}
class FullScreenDialog extends React.Component {
render() {
const { classes } = this.props;
return (
<div>
<Dialog
fullScreen
open={this.props.open}
onClose={this.props.handleClose}
TransitionComponent={Transition}
>
<AppBar className={classes.appBar}>
<Toolbar>
<IconButton color="inherit" onClick={this.props.handleClose} aria-label="Close">
<CloseIcon />
</IconButton>
<Typography variant="title" color="inherit" className={classes.flex}>
Sound
</Typography>
<Button color="inherit" onClick={this.props.handleClose}>
save
</Button>
</Toolbar>
</AppBar>
<List>
<ListItem button>
<ListItemText primary="Phone ringtone" secondary="Titania" />
</ListItem>
<Divider />
<ListItem button>
<ListItemText primary="Default notification ringtone" secondary="Tethys" />
</ListItem>
</List>
</Dialog>
</div>
);
}
}
FullScreenDialog.propTypes = {
classes: PropTypes.object.isRequired,
};
FullScreenDialog.defaultProps = {
open: false,
handleClose: () => console.log("Dev forgot something...")
};
export default withStyles(styles)(FullScreenDialog);
frontend/src/utils/Markdown.js → frontend/src/components/shared/Markdown.js
View file @ 97f308c4
......@@ -11,8 +11,9 @@ import TableHead from '@material-ui/core/TableHead';
import TableRow from '@material-ui/core/TableRow';
import Paper from '@material-ui/core/Paper';
import { rgbToHex, lighten, darken } from '@material-ui/core/styles/colorManipulator';
import { lighten, darken } from '@material-ui/core/styles/colorManipulator';
import { Divider } from '@material-ui/core';
import LinkText from '../other/TextLink';
const styles = (theme) => {
const { palette } = theme;
......@@ -100,11 +101,7 @@ const renderers = {
</li>
)),
paragraph: props => <Typography {...props} paragraph />,
link: withStyles(styles, { withTheme: true })(({ classes, ...props }) => (
<a href={props.href} className={classes.link}>
{props.children}
</a>
)),
link: props => <LinkText {...props}/>,
code: withStyles(styles, { withTheme: true })(({ classes, ...props }) => (
<Typography variant={"body1"} paragraph>
<pre ><code>
......
frontend/src/components/university/modules/GenericModule.js
View file @ 97f308c4
......@@ -2,14 +2,18 @@ import React from 'react';
import { withStyles } from '@material-ui/core/styles';
import Tooltip from '@material-ui/core/Tooltip';
import Button from '@material-ui/core/Button';
import IconButton from '@material-ui/core/IconButton';
import Badge from '@material-ui/core/Badge';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
import Paper from '@material-ui/core/Paper';
import SettingsBackRestoreIcon from '@material-ui/icons/SettingsBackupRestore';
import CreateIcon from '@material-ui/icons/Create';
import VerifiedUserIcon from '@material-ui/icons/VerifiedUser';
import FullScreenDialog from '../../shared/FullScreenDialog';
import red from '@material-ui/core/colors/red';
import orange from '@material-ui/core/colors/orange';
......@@ -18,6 +22,14 @@ import green from '@material-ui/core/colors/green';
const styles = theme => ({
root: {
flexGrow: 1,
padding: 1 * theme.spacing.unit,
// marginBottom: 2 * theme.spacing.unit
},
badge: {
// margin: 0.5 * theme.spacing.unit,
top: -0.5 * theme.spacing.unit,
right: -0.5 * theme.spacing.unit,
border: `2px solid ${theme.palette.background.paper}`,
},
green: {
color: green.A700,
......@@ -32,50 +44,75 @@ const styles = theme => ({
color: theme.palette.action.disabled
},
button: {
margin: 0.5 * theme.spacing.unit,
width: 5*theme.spacing.unit,
height: 5*theme.spacing.unit,
// margin: 0.5 * theme.spacing.unit,
},
})
class GenericModule extends React.Component {
state = {
fullScreenDialogOpen: false,
};
handleClickOpenFullScreenDialog = () => {
this.setState({ fullScreenDialogOpen: true });
};
handleCloseFullScreenDialog = () => {
this.setState({ fullScreenDialogOpen: false });
};
render() {
const { classes } = this.props;
const { classes, title } = this.props;
return (
<div className={classes.root}>
<Grid container spacing={24}>
<Grid item xs={6}>
Titre
</Grid>
<Grid item xs={6} style={{ textAlign: 'right' }}>
<Tooltip title="Informations sur la modération" placement="top">
<Button variant="fab" mini aria-label="Restorer" className={classes.button}>
<Badge className={classes.margin} badgeContent={4} color="secondary">
<VerifiedUserIcon className={classes.red} />
<div>
<FullScreenDialog open={this.state.fullScreenDialogOpen} handleClose={this.handleCloseFullScreenDialog}/>
<Paper className={classes.root} square={true}>
<Grid container spacing={8}>
<Grid item xs>
<Typography variant='display1'> {title} </Typography>
<Typography variant='caption'> Mis à jour par <em>chehabfl</em> le 08/09/2018 à 15h20</Typography>
</Grid>
<Grid item xs={4} style={{ textAlign: 'right' }}>
<Tooltip title="Informations sur la modération" placement="top">
<Badge classes={{ badge: classes.badge }} badgeContent={4} color="secondary">
<IconButton aria-label="Modération" className={classes.button}>
<VerifiedUserIcon className={classes.red} />
</IconButton>
</Badge>
</Button>
</Tooltip>
<Tooltip title="Informations sur les possibilités d'éditions" placement="top">
<Button variant="fab" mini aria-label="Restorer" className={classes.button}>
<CreateIcon className={classes.green} />
</Button>
</Tooltip>
</Tooltip>
<Tooltip title="Informations sur les versions disponibles" placement="top">
<Button variant="fab" mini aria-label="Restorer" className={classes.button}>
<Badge className={classes.margin} badgeContent={4} color="secondary">
<Tooltip title="Informations sur les possibilités d'éditions" placement="top">
<IconButton aria-label="Éditer" className={classes.button} onClick={this.handleClickOpenFullScreenDialog}>
<CreateIcon className={classes.green} />
</IconButton>
</Tooltip>
<SettingsBackRestoreIcon className={classes.orange} />
<Tooltip title="Informations sur les versions disponibles" placement="top">
<Badge classes={{ badge: classes.badge }} badgeContent={40} color="secondary">
<IconButton aria-label="Restorer" className={classes.button}>
<SettingsBackRestoreIcon className={classes.orange} />
</IconButton>
</Badge>
</Tooltip>
</Grid>
</Button>
</Tooltip>
</Grid>
</Grid>
<div>
{this.props.children}
</div>
</Paper>
</div>
)
}
}
GenericModule.defaultProps = {
title: "Titre du module"
};
export default withStyles(styles, { withTheme: true })(GenericModule);
\ No newline at end of file
frontend/src/components/university/modules/UniversityGeneral.js 0 → 100644
View file @ 97f308c4
import React from 'react';
import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import Typography from '@material-ui/core/Typography';
import PhotoIcon from '@material-ui/icons/Photo';
import MyComponent from '../../MyComponent';
import TextLink from '../../other/TextLink';
import GenericModule from './GenericModule';
import Grid from '@material-ui/core/Grid';
import Divider from '@material-ui/core/Divider';
const styles = theme => ({
});
class UniversityGeneral extends React.Component {
render() {
const { classes, theme } = this.props;
return (
<GenericModule title={"Introduction"}>
<Grid container spacing={16} direction='row'>
<Grid item xs={4}>
<img style={{ width: "100%" }} src={"https://upload.wikimedia.org/wikipedia/commons/f/f4/Logo_EPFL.svg"} />
</Grid>
<Grid item xs>
<Typography variant='headline'> École Polytechnique Fédérale de Lausanne</Typography>
<Typography variant='title'> EPFL</Typography>
<Divider />
<Typography variant='subheading'>Lausanne, Suisse</Typography>
<Typography variant='body1'> Site internet : <TextLink href={"https://www.epfl.ch"}> www.epfl.ch </TextLink> </Typography>
</Grid>
</Grid>
</GenericModule>
)
}
}
export default withStyles(styles, { withTheme: true })(UniversityGeneral);
frontend/src/components/university/tabs/GeneralInfoTab.js
View file @ 97f308c4
......@@ -4,6 +4,11 @@ import { withStyles } from '@material-ui/core/styles';
import MyComponent from '../../MyComponent';
import GenericModule from '../modules/GenericModule';
import UniversityGeneral from '../modules/UniversityGeneral';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
import Lorem from 'react-lorem-component';
const styles = theme => ({
root: {},
......@@ -14,8 +19,26 @@ class GeneralInfo extends MyComponent {
myRender() {
return (
<div>
Informations Générales
<GenericModule/>
<Grid container spacing={16}>
<Grid item xs={8}>
<UniversityGeneral />
</Grid>
<Grid item xs={4}>
<GenericModule title={"Date des semestres"} />
</Grid>
<Grid item xs={12} md={6}>
<GenericModule title={"DRI"} />
</Grid>
<Grid item xs={12} md={6}>
<GenericModule title={"Offres de départs"} />
</Grid>
<Grid item xs={12}>
<GenericModule title={"Résumé Départs"} />
</Grid>
</Grid>
<Lorem count={20} />
</div>
);
}
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment