Intial general structure of source code and page.

This commit is contained in:
codevictory
2021-11-11 21:03:23 +02:00
parent 2581adce4d
commit e0d29f173d
19 changed files with 249 additions and 13 deletions

View File

@@ -1,4 +1,4 @@
import "./../styles/header.css"
import "./styles/header.css"
export const Header = () => {
return (

56
src/components/Menu.tsx Normal file
View File

@@ -0,0 +1,56 @@
import "./styles/menu.css";
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>
)
}

View File

@@ -0,0 +1,10 @@
import "./styles/notFound.css";
export const NotFound = () => {
return (
<article>
<h1>Page not found</h1>
<p>Check the link address...</p>
</article>
)
}

View File

@@ -0,0 +1,57 @@
import { Link } from 'react-router-dom';
import "./styles/program.css";
export const Program = () => {
return (
<article>
<h1>Program</h1>
<table>
<tr>
<th></th>
<th>12:00</th>
<th></th>
</tr>
<tr>
<td>Speech</td>
<td>Boring BS. Lorem ipsum dolor sit amet.</td>
<td>Veikko</td>
</tr>
<tr>
<td>Lunch</td>
<td>Eating yummy yum.</td>
<td><Link to="/menu" >To menu</Link></td>
</tr>
<tr>
<th></th>
<th>14:00</th>
<th></th>
</tr>
<tr>
<td>Games</td>
<td>Activity lol.</td>
<td>Be active.</td>
</tr>
<tr>
<td>More something</td>
<td>Lorem ipsum dolor sit amet.</td>
<td>More more more</td>
</tr>
<tr>
<th></th>
<th>23:00</th>
<th></th>
</tr>
<tr>
<td>More something</td>
<td>Lorem ipsum dolor sit amet.</td>
<td>More more more</td>
</tr>
<tr>
<td>More something</td>
<td>Lorem ipsum dolor sit amet.</td>
<td>More more more</td>
</tr>
</table>
</article>
)
}

View File

@@ -1,8 +1,8 @@
import { Button, Checkbox, Col, Form, Input, Row, Select, Space } from 'antd';
import { Button, Checkbox, Col, Form, Input, Row, Select } from 'antd';
import { useParams } from 'react-router';
import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
import "./../styles/registration.css"
import "./styles/regForm.css";
import { addVisitor } from '../api';
import { arrayToString, capFirstLetter } from './utils';
import { Visitor } from '../model/visitor';
@@ -49,7 +49,7 @@ export const RegForm = () => {
<>
{
fields.map(field => (
<div className="visitorContainer" key={field.key}>
<div className="visitors" key={field.key}>
<div className="nameBar">
<Form.Item
label="Name"

View File

@@ -0,0 +1,13 @@
import "./styles/sideNav.css";
import { Link } from 'react-router-dom';
export const SideNav = () => {
return (
<aside className="SideNav">
<ul>
<li><Link to="/menu">Menu</Link></li>
<li><Link to="/program">Program</Link></li>
</ul>
</aside>
)
}

View File

@@ -0,0 +1,13 @@
.App-header {
background-color: #282c34;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.App-header h1 {
color: white;
}

View File

@@ -0,0 +1,21 @@
table {
width: 100%;
}
table,
td,
th {
border-bottom: 1px solid black;
}
th {
height: 10vh;
}
tr {
line-break: auto;
}
th,
td {
width: 33%;
}

View File

View File

@@ -0,0 +1,21 @@
table {
width: 100%;
}
table,
td,
th {
border-bottom: 1px solid black;
}
th {
height: 10vh;
}
tr {
line-break: auto;
}
th,
td {
width: 33%;
}

View File

@@ -0,0 +1,18 @@
form#registration {
max-width: 24.5em;
padding: 1em;
}
.nameBar {
display: flex;
justify-content: space-between;
align-items: baseline;
}
.visitors {
margin-top: 1em;
margin-bottom: 1em;
padding: 1em;
border-radius: 5px;
background-color: rgb(235, 235, 235);
}

View File

@@ -0,0 +1,3 @@
.SideNav {
width: 333px;
}