Skip to content
Snippets Groups Projects
Commit e9e14e3c authored by Chif Gergő's avatar Chif Gergő
Browse files

Remove unnecessary information from news, add some style

parent 73f16a54
No related branches found
No related tags found
No related merge requests found
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Modal, Button, Form, Input, Icon } from 'semantic-ui-react'; import { Modal, Button, Form, Input, Icon } from 'semantic-ui-react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import moment from 'moment';
import { DateTimeInput } from 'semantic-ui-calendar-react'; import { DateTimeInput } from 'semantic-ui-calendar-react';
import { import {
writeEditEvent, writeEditEvent,
...@@ -72,7 +73,7 @@ class EditEventForm extends Component { ...@@ -72,7 +73,7 @@ class EditEventForm extends Component {
label="Dátum:" label="Dátum:"
dateFormat='YYYY-MM-DD' dateFormat='YYYY-MM-DD'
placeholder="Dátum" placeholder="Dátum"
value={date} value={moment(date).format('YYYY-MM-DD hh:mm')}
iconPosition="left" iconPosition="left"
onChange={this.handleChange} onChange={this.handleChange}
/> />
......
...@@ -20,53 +20,41 @@ class News extends Component { ...@@ -20,53 +20,41 @@ class News extends Component {
return this.props.news.map(item => ( return this.props.news.map(item => (
<Item key={item.id}> <Item key={item.id}>
<Item.Content> <Item.Content>
<Item.Header <Container text textAlign='left'>
style={{ fontSize: '2em', width: '100%' }} <Item.Header
> style={{ fontSize: '2em', width: '100%' }}
<Grid> >
<Grid.Column floated='center' width={12}> <Grid>
{item.title} <Grid.Column floated='left' width={8}>
</Grid.Column> {item.title}
{ this.props.user.role === 'Staff' ?
<Grid.Column floated='right' width={4}>
<EditNewsForm
onClick={() => this.props.setSelectedNews(item)}
/>
<ConfirmModal
text={`törölni akarod a következő hírt: ${item.title}`}
button={
<Button
compact
color='red'
size='mini'
>
Törlés
</Button>
}
onAccept={() => this.props.deleteNews(item)}
/>
</Grid.Column>
: null }
</Grid>
</Item.Header>
<Item.Description className='news-text' style={{ fontSize: '1.33em' }}>
{this.renderMultiLine(item.text)}
</Item.Description>
<Item.Extra>
<Grid>
<Grid.Row className='news-extra'>
<Grid.Column floated='left' width={10}>
<p> Készült: {moment(item.created_at).format('LLLL')} </p>
<p> Szerkesztve: {moment(item.updated_at).format('LLLL')}</p>
</Grid.Column> </Grid.Column>
<Grid.Column floated='right' width={5}> { this.props.user.role === 'Staff' ?
<p> Írta: <strong>{item.author_name}</strong></p> <Grid.Column floated='right' width={4}>
{/* TODO get the edited by name */} <EditNewsForm
<p> Szerkesztette: {item.author_name}</p> onClick={() => this.props.setSelectedNews(item)}
</Grid.Column> />
</Grid.Row> <ConfirmModal
</Grid> text={`törölni akarod a következő hírt: ${item.title}`}
</Item.Extra> button={
<Button
compact
color='red'
size='mini'
>
Törlés
</Button>
}
onAccept={() => this.props.deleteNews(item)}
/>
</Grid.Column>
: null }
</Grid>
</Item.Header>
<Item.Meta style={{ fontSize: '0.75em', fontStyle: 'italic' }}>Közzétéve: {moment(item.created_at).format('LLLL')}</Item.Meta>
<Item.Description className='news-text' style={{ fontSize: '1em' }}>
{this.renderMultiLine(item.text)}
</Item.Description>
</Container>
</Item.Content> </Item.Content>
</Item> </Item>
)); ));
......
...@@ -24,29 +24,31 @@ class Schedule extends Component { ...@@ -24,29 +24,31 @@ class Schedule extends Component {
const events = this.props.events; const events = this.props.events;
const panels = events.map(event => ( const panels = events.map(event => (
<> <div>
<Accordion.Title <Accordion.Title
active={activeIndex === event.id} active={activeIndex === event.id}
index={event.id} index={event.id}
onClick={this.handleClick} onClick={this.handleClick}
> >
<h2> <h3>
<Grid> <Grid>
<Grid.Column floated='left' width={5} textAlign='left'> <Grid.Column floated='left' width={5} textAlign='left'>
<Icon name='quidditch' color='blue' />{event.name} <Icon name='angle right' color='blue' />{event.name}
</Grid.Column> </Grid.Column>
<Grid.Column floated='right' width={8} textAlign='right'> <Grid.Column floated='right' width={8} textAlign='right'>
{moment(event.date).locale('hu').format('LLLL')} {moment(event.date).locale('hu').format('LLLL')}
</Grid.Column> </Grid.Column>
</Grid> </Grid>
</h2> </h3>
</Accordion.Title> </Accordion.Title>
<Accordion.Content active={activeIndex === event.id}> <Accordion.Content active={activeIndex === event.id}>
<Container text textAlign='left'>
<p> <p>
{event.description} {event.description}
</p> </p>
</Container>
</Accordion.Content> </Accordion.Content>
</> </div>
)); ));
return ( return (
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment