Improving main page.

This commit is contained in:
codevictory
2021-12-19 21:12:54 +02:00
parent ad913d951e
commit 25b1699991
9 changed files with 198 additions and 137 deletions

View File

@@ -1,56 +1,42 @@
import "./Menu.scss";
import './Menu.scss';
export const Menu = () => {
return (
<article>
<h1>Menu</h1>
<table>
<tr>
<th></th>
<th>Starters</th>
<th></th>
</tr>
<tr>
<td>Chrumky</td>
<td>Very good yummy yummy. Lorem ipsum dolor sit amet.</td>
<td>Nuts</td>
</tr>
<tr>
<td>Halusky</td>
<td>Fatty fat stuff.</td>
<td>Meat, fat</td>
</tr>
<tr>
<th></th>
<th>Main dish</th>
<th></th>
</tr>
<tr>
<td>Chrumky</td>
<td>Very good yummy yummy. Lorem ipsum dolor sit amet.</td>
<td>Nuts</td>
</tr>
<tr>
<td>Halusky</td>
<td>Fatty fat stuff.</td>
<td>Meat, fat</td>
</tr>
<tr>
<th></th>
<th>Dessert</th>
<th></th>
</tr>
<tr>
<td>Chrumky</td>
<td>Very good yummy yummy. Lorem ipsum dolor sit amet.</td>
<td>Nuts</td>
</tr>
<tr>
<td>Halusky</td>
<td>Fatty fat stuff.</td>
<td>Meat, fat</td>
</tr>
</table>
</article>
)
}
return (
<section>
<h1>Menu</h1>
<article>
<h2>Starters</h2>
<h3>Chrumky</h3>
<p>Very good yummy yummy. Lorem ipsum dolor sit amet.</p>
<p>Nuts</p>
<h3>Halusky</h3>
<p>Fatty fat stuff.</p>
<p>Meat, fat</p>
</article>
<article>
<h2>Main dish</h2>
<h3>Chrumky</h3>
<p>Very good yummy yummy. Lorem ipsum dolor sit amet.</p>
<p>Nuts</p>
<h3>Halusky</h3>
<p>Fatty fat stuff.</p>
<p>Meat, fat</p>
</article>
<article>
<h2>Dessert</h2>
<h3>Chrumky</h3>
<p>Very good yummy yummy. Lorem ipsum dolor sit amet.</p>
<p>Nuts</p>
<h3>Halusky</h3>
<p>Fatty fat stuff.</p>
<p>Meat, fat</p>
</article>
</section>
);
};

View File

@@ -1,5 +1,12 @@
.NavBar {
display: flex;
justify-content: space-around;
align-items: center;
margin-bottom: 1em;
font-size: 2rem;
.Diamond {
margin-right: 1rem;
margin-left: 1rem;
}
}

View File

@@ -1,18 +1,17 @@
import "./NavBar.scss";
import './NavBar.scss';
import { Link } from 'react-router-dom';
import { LanguagePicker } from './LanguagePicker';
import { Button, Menu } from 'antd';
import { Diamond } from './Diamond';
export const NavBar = () => {
return (
<Menu className="NavBar" mode="horizontal">
<Menu.Item><Link to="/menu">Menu</Link></Menu.Item>
<Menu.Item><Link to="/program">Program</Link></Menu.Item>
<Menu.Item><Link to="/program">Info</Link></Menu.Item>
<Menu.Item><Button type="primary">asd</Button></Menu.Item>
<Menu.Item>
<LanguagePicker />
</Menu.Item>
</Menu>
)
}
return (
<div className='NavBar'>
<Link to='/menu'>Menu</Link>
<Diamond />
<Link to='/program'>Program</Link>
<Diamond />
<Link to='/program'>Info</Link>
</div>
);
};