Skip to content
Snippets Groups Projects
Commit b0425cd8 authored by Rafael László's avatar Rafael László :speech_balloon:
Browse files

cleanup

parent ffcb8694
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
src/components/Header.js
+ 67
− 56
View file @ b0425cd8
......@@ -6,15 +6,16 @@ import {
Button,
Segment,
Image,
Grid,
Popup,
Icon,
Responsive,
} from 'semantic-ui-react';
import { connect } from 'react-redux';
import { getUserData } from '../actions';
import KSZKlogo from './images/kszk_logo.svg';
// Objects that will be converted to menu items in the render method
const menuItems = [
{
text: 'Főoldal',
......@@ -67,46 +68,51 @@ class Header extends Component {
isOpen: false,
};
}
// Fetch the userData-s
componentWillMount() {
this.props.getUserData();
}
// Hide the menu after clicking an item on mobile
handleOpen = () => {
this.setState({ isOpen: true });
}
handleClose = () => {
this.setState({ isOpen: false });
}
render() {
const { visible } = this.state;
return (
<div>
{/* Tablet, Computer, ... view */}
<Responsive minWidth={600} >
<Segment inverted textAlign='center' vertical>
<Container>
<Menu inverted secondary size='large'>
{/* Menu items */}
{menuItems.map((item, i) =>
(item.permissionLevel === 0 ?
<Menu.Item key={i} as={Link} to={item.to}>{item.prefix}{item.text}</Menu.Item>
<Menu.Item key={i} as={Link} to={item.to}>
{item.prefix}{item.text}
</Menu.Item>
: null
))
}
{/* Arrow menu */}
{ this.props.user.id ?
<Popup trigger={
<Popup flowing hoverable inverted
trigger={
<Menu.Item>
<Icon name='angle down' size='large' />
</Menu.Item>
}
position='center'
flowing hoverable inverted>
>
<Menu inverted secondary size='large'>
{menuItems.map((item, i) =>
(this.props.user.permission >= item.permissionLevel
&& item.permissionLevel > 0 ?
<Menu.Item
key={i} as={Link} to={item.to}>
<Menu.Item key={i} as={Link} to={item.to}>
{item.prefix}{item.text}
</Menu.Item>
: null
......@@ -116,9 +122,9 @@ class Header extends Component {
</Popup>
: null
}
<Menu.Item position='right' width={5}>
{
this.props.user.id ?
{/* Login Button */}
<Menu.Item position='right'>
{this.props.user.id ?
<Button.Group>
<Button inverted as={Link} to='/profile'>Profilom</Button>
<Button as='a' href='/api/v1/logout/' icon='sign out' />
......@@ -131,25 +137,31 @@ class Header extends Component {
</Container>
</Segment>
</Responsive>
{/* Mobile view */}
<Responsive maxWidth={599}>
<Segment inverted textAlign='center' vertical>
<Container>
<Menu inverted secondary size='normal'>
<Menu.Item as={Link} to={menuItems[0].to}>{menuItems[0].prefix}{menuItems[0].text}</Menu.Item>
<Popup trigger={
<Menu inverted secondary size='big'>
{/* kszk logo + home link */}
<Menu.Item as={Link} to={menuItems[0].to}>
{menuItems[0].prefix}{menuItems[0].text}
</Menu.Item>
{/* Sandwich menu */}
<Popup flowing hoverable inverted trigger={
<Menu.Item onClick={this.handleClose}
position='right'>
<Icon name='bars' size='large' />
</Menu.Item>
}
position='center'
flowing hoverable inverted
open={this.state.isOpen}
onOpen={this.handleOpen}>
<Menu vertical inverted secondary size='normal'>
onOpen={this.handleOpen}
size='huge'
>
<Menu vertical inverted secondary size='big'>
{menuItems.map((item, i) =>
( (this.props.user.permission >= item.permissionLevel ||
item.permissionLevel === 0) && i>0?
((this.props.user.permission >= item.permissionLevel
||item.permissionLevel === 0) && i>0?
<Menu.Item onClick={this.handleClose}
key={i} as={Link} to={item.to}>
{item.prefix}{item.text}
......@@ -158,8 +170,7 @@ class Header extends Component {
))
}
<Menu.Item>
{
this.props.user.id ?
{this.props.user.id ?
<Button.Group>
<Button onClick={this.handleClose} inverted as={Link} to='/profile'>Profilom</Button>
<Button onClick={this.handleClose} as='a' href='/api/v1/logout/' icon='sign out' />
......
src/components/pages/News.js
+ 1
− 1
View file @ b0425cd8
......@@ -76,7 +76,7 @@ class News extends Component {
render() {
return (
<div>
<Segment style={{ padding: '3em 3em' }} vertical>
<Segment vertical>
{/* { this.props.user.is_superuser ? <AddNewsForm /> : ''} */}
<Container text textAlign='center'>
{this.props.user.role === 'Staff' ?
......
src/components/pages/Schedule.js
+ 33
− 20
View file @ b0425cd8
import React, { Component } from 'react';
import { Container, Accordion, Icon, Grid } from 'semantic-ui-react';
import { Container, Accordion, Icon, Grid, Header } from 'semantic-ui-react';
import { connect } from 'react-redux';
import moment from 'moment';
import 'moment/locale/hu';
......@@ -25,7 +25,7 @@ class Schedule extends Component {
const events = this.props.events;
const panels = events.map(event => (
<>
<Accordion>
<Accordion.Title
active={activeIndex === event.id}
index={event.id}
......@@ -47,27 +47,40 @@ class Schedule extends Component {
{event.description}
</p>
</Accordion.Content>
</>
</Accordion>
));
return (
<Container
textAlign='center'
<div>
<Container textAlign='center'>
<Header
as='h1'
content='Képzés alkalmak'
style={{
padding: '60px'
fontSize: '2em',
fontWeight: 'bold',
marginBottom: '0.5em',
marginTop: '0.5em',
}}
>
<h2>Képzés alkalmak:</h2>
<Accordion
fluid
styled
/>
<Accordion fluid styled
defaultActiveIndex={-1}
panels={panels}
>
{panels}
</Accordion>
<h2>Tábor:</h2>
<Header
as='h1'
content='Tábor'
style={{
fontSize: '2em',
fontWeight: 'bold',
marginBottom: '0.5em',
marginTop: '1.5em',
}}
/>
</Container>
</div>
);
}
}
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment

Hosted with :heart: by KSZK