veikko/lintujamaslo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Translations and styling improved on main page.

Browse Source
This commit is contained in:
codevictory
2021-12-23 00:51:02 +02:00
parent 65a810211a
commit 25f87eaa01
14 changed files with 118 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/Info.scss Normal file
View File

@@ -0,0 +1,14 @@
@import '../colors.scss';
.Info {
h1 {
font-size: 4rem;
}
h2 {
font-size: 2rem;
color: $green-text;
margin-left: 3rem;
margin-right: 3rem;
}
}

15
src/components/Info.tsx Normal file
View File

@@ -0,0 +1,15 @@
import { FormattedMessage } from 'react-intl';
import './Info.scss';
export const Info = () => {
return (
<section className='Info'>
<h1>
<FormattedMessage id='main.info' />
</h1>
<h2>
<FormattedMessage id='main.toBeDecided' />
</h2>
</section>
);
};

29
src/components/Menu.scss
View File

@@ -1,21 +1,14 @@
table {
width: 100%;
}
@import '../colors.scss';
table,
td,
th {
border-bottom: 1px solid black;
}
.Menu {
h1 {
font-size: 4rem;
}
th {
height: 10vh;
}
tr {
line-break: auto;
}
th,
td {
width: 33%;
h2 {
font-size: 2rem;
color: $green-text;
margin-left: 3rem;
margin-right: 3rem;
}
}

43
src/components/Menu.tsx
View File

@@ -1,42 +1,15 @@
import { FormattedMessage } from 'react-intl';
import './Menu.scss';
export const Menu = () => {
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 className='Menu'>
<h1>
<FormattedMessage id='main.menu' />
</h1>
<h2>
<FormattedMessage id='main.toBeDecided' />
</h2>
</section>
);
};

1
src/components/NavBar.scss
View File

@@ -8,5 +8,6 @@
.Diamond {
margin-right: 1rem;
margin-left: 1rem;
margin-bottom: 0;
}
}

15
src/components/NavBar.tsx
View File

@@ -1,17 +1,22 @@
import './NavBar.scss';
import { Link } from 'react-router-dom';
import { LanguagePicker } from './LanguagePicker';
import { Button, Menu } from 'antd';
import { Diamond } from './Diamond';
import { FormattedMessage } from 'react-intl';
export const NavBar = () => {
return (
<div className='NavBar'>
<Link to='/menu'>Menu</Link>
<Link to='/menu'>
<FormattedMessage id='main.menu' />
</Link>
<Diamond />
<Link to='/program'>Program</Link>
<Link to='/program'>
<FormattedMessage id='main.program' />
</Link>
<Diamond />
<Link to='/program'>Info</Link>
<Link to='/info'>
<FormattedMessage id='main.info' />
</Link>
</div>
);
};

29
src/components/Program.scss
View File

@@ -1,21 +1,14 @@
table {
width: 100%;
}
@import '../colors.scss';
table,
td,
th {
border-bottom: 1px solid black;
}
.Program {
h1 {
font-size: 4rem;
}
th {
height: 10vh;
}
tr {
line-break: auto;
}
th,
td {
width: 33%;
h2 {
font-size: 2rem;
color: $green-text;
margin-left: 3rem;
margin-right: 3rem;
}
}

46
src/components/Program.tsx
View File

@@ -1,40 +1,16 @@
import { FormattedMessage } from 'react-intl';
import { Link } from 'react-router-dom';
import './Program.scss';
export const Program = () => {
return (
<section>
<h1>Program</h1>
<article>
<h2>12:00</h2>
<h3>Speech</h3>
<p>Boring BS. Lorem ipsum dolor sit amet.</p>
<h3>Lunch</h3>
<p>
Eating yummy yum.
<i>
<Link to='/menu'>To menu</Link>
</i>
</p>
</article>
<article>
<h2>14:00</h2>
<h3>Games</h3>
<p>Activity lol.</p>
<p>Be active.</p>
<h3>More something</h3>
<p>Lorem ipsum dolor sit amet.</p>
<h3>More more more</h3>
</article>
<article>
<h2>23:00</h2>
<h3>More something</h3>
<p>Lorem ipsum dolor sit amet.</p>
<h3>More more more</h3>
<h3>More something</h3>
<p>Lorem ipsum dolor sit amet.</p>
<h3>More more more</h3>
</article>
</section>
);
return (
<section className='Program'>
<h1>
<FormattedMessage id='main.program' />
</h1>
<h2>
<FormattedMessage id='main.toBeDecided' />
</h2>
</section>
);
};