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

popover menu

parent 61097e67
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
public/index.html
+ 1
− 1
View file @ 50ffeb8c
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<!-- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> --> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000"> <meta name="theme-color" content="#000000">
<!-- <!--
manifest.json provides metadata used when your web app is added to the manifest.json provides metadata used when your web app is added to the
......
src/components/App.js
+ 1
− 0
View file @ 50ffeb8c
...@@ -3,6 +3,7 @@ import Header from './Header'; ...@@ -3,6 +3,7 @@ import Header from './Header';
import Main from './Main'; import Main from './Main';
import Footer from './Footer'; import Footer from './Footer';
const App = () => ( const App = () => (
<div style={{ minHeight: '100%', position: 'relative' }}> <div style={{ minHeight: '100%', position: 'relative' }}>
<header id='header' > <header id='header' >
......
src/components/Header.js
+ 49
− 23
View file @ 50ffeb8c
...@@ -7,6 +7,9 @@ import { ...@@ -7,6 +7,9 @@ import {
Segment, Segment,
Visibility, Visibility,
Image, Image,
Grid,
Popup,
Icon,
} from 'semantic-ui-react'; } from 'semantic-ui-react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { getUserData } from '../actions'; import { getUserData } from '../actions';
...@@ -58,7 +61,7 @@ const menuItems = [ ...@@ -58,7 +61,7 @@ const menuItems = [
]; ];
const FixedMenu = ({ user }) => ( const FixedMenu = ({ user }) => (
<Menu fixed='top' size='large' pointing> <Menu vertical fixed='top' size='medium' pointing>
<Container> <Container>
{menuItems.map((item, i) => {menuItems.map((item, i) =>
(user.permission >= item.permissionLevel || (user.permission >= item.permissionLevel ||
...@@ -107,8 +110,7 @@ class Header extends Component { ...@@ -107,8 +110,7 @@ class Header extends Component {
render() { render() {
const { visible } = this.state; const { visible } = this.state;
return (
return (
<div> <div>
{visible ? <FixedMenu user={this.props.user} /> : null} {visible ? <FixedMenu user={this.props.user} /> : null}
<Visibility <Visibility
...@@ -117,30 +119,54 @@ class Header extends Component { ...@@ -117,30 +119,54 @@ class Header extends Component {
once={false} once={false}
> >
<Segment inverted textAlign='center' vertical> <Segment inverted textAlign='center' vertical>
<Container> <Grid verticalAlign='middle' columns={5} centered>
<Grid.Row>
<Menu inverted secondary size='large'> <Menu inverted secondary size='large'>
{menuItems.map((item, i) => {menuItems.map((item, i) =>
(this.props.user.permission >= item.permissionLevel || (item.permissionLevel === 0 ?
(item.permissionLevel === 0) ? <Grid.Column>
<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>
: </Grid.Column>
null))} : null
))
<Menu.Item position='right'> }
{ <Popup trigger={
this.props.user.id ? <Menu.Item>
<Button.Group> <Icon name='angle down' size='large' />
<Button inverted as={Link} to='/profile'>Profilom</Button> </Menu.Item>
<Button as='a' href='/api/v1/logout/' icon='sign out' />
</Button.Group>
:
<Button as='a' href='/api/v1/login/authsch/' inverted>Bejelentkezés</Button>
} }
</Menu.Item> position='center'
flowing hoverable inverted>
<Menu inverted secondary size='large'>
<Grid.Row>
{menuItems.map((item, i) =>
(this.props.user.permission >= item.permissionLevel
&& item.permissionLevel > 0?
<Grid.Column>
<Menu.Item key={i} as={Link} to={item.to}>{item.prefix}{item.text}</Menu.Item>
</Grid.Column>
: null
))
}
</Grid.Row>
</Menu>
</Popup>
<Grid.Column>
<Menu.Item floated='right' width={5}>
{
this.props.user.id ?
<Button.Group>
<Button inverted as={Link} to='/profile'>Profilom</Button>
<Button as='a' href='/api/v1/logout/' icon='sign out' />
</Button.Group>
:
<Button as='a' href='/api/v1/login/authsch/' inverted>Bejelentkezés</Button>
}
</Menu.Item>
</Grid.Column>
</Menu> </Menu>
</Container> </Grid.Row>
</Grid>
</Segment> </Segment>
</Visibility> </Visibility>
</div> </div>
......
src/components/pages/Home.js
+ 2
− 1
View file @ 50ffeb8c
...@@ -39,6 +39,7 @@ const range = (count) => { ...@@ -39,6 +39,7 @@ const range = (count) => {
class Home extends Component { class Home extends Component {
render() { render() {
const kszk_age = new Date().getFullYear() - 1976
return ( return (
<div> <div>
<div className='car-image-kszk'> <div className='car-image-kszk'>
...@@ -146,7 +147,7 @@ class Home extends Component { ...@@ -146,7 +147,7 @@ class Home extends Component {
<p style={{ fontSize: '1.33em', fontFamily: 'Arial' }}> <p style={{ fontSize: '1.33em', fontFamily: 'Arial' }}>
A Kollégiumi Számítástechnikai Kör az Egyetem legrégebben működő A Kollégiumi Számítástechnikai Kör az Egyetem legrégebben működő
és legnagyobb aktív, informatikával foglalkozó öntevékeny és legnagyobb aktív, informatikával foglalkozó öntevékeny
csoportosulása, idén ünnepeljük 42. születésnapunkat. A patinás csoportosulása, idén ünnepeljük {kszk_age}. születésnapunkat. A patinás
név mögött vidám hangulatú, alkotó kedvű csapat rejlik, mely a Kar név mögött vidám hangulatú, alkotó kedvű csapat rejlik, mely a Kar
jó szakmai képességű, számítástechnika iránt kiemelten érdeklődő jó szakmai képességű, számítástechnika iránt kiemelten érdeklődő
tagjaiból verbuválódott, és bővül évente új tehetségekkel, lelkes tagjaiból verbuválódott, és bővül évente új tehetségekkel, lelkes
......
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

Hosted with :heart: by KSZK