From c243612c1a282706e76315406033520b47fbabf4 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Sun, 14 Mar 2021 14:43:27 +0300 Subject: feat: add illustrations to HomePage --- src/assets/contractors.svg | 1 + src/assets/product.svg | 1 + src/assets/waybill.svg | 1 + src/components/Paper.tsx | 13 +++++++++++-- src/containers/Home.tsx | 45 +++++++++++++++++++++++++++++++++++++++------ 5 files changed, 53 insertions(+), 8 deletions(-) create mode 100644 src/assets/contractors.svg create mode 100644 src/assets/product.svg create mode 100644 src/assets/waybill.svg diff --git a/src/assets/contractors.svg b/src/assets/contractors.svg new file mode 100644 index 0000000..73fc562 --- /dev/null +++ b/src/assets/contractors.svg @@ -0,0 +1 @@ +Connecting Teams \ No newline at end of file diff --git a/src/assets/product.svg b/src/assets/product.svg new file mode 100644 index 0000000..97a0061 --- /dev/null +++ b/src/assets/product.svg @@ -0,0 +1 @@ +logistics \ No newline at end of file diff --git a/src/assets/waybill.svg b/src/assets/waybill.svg new file mode 100644 index 0000000..897c40b --- /dev/null +++ b/src/assets/waybill.svg @@ -0,0 +1 @@ +printing invoices \ No newline at end of file diff --git a/src/components/Paper.tsx b/src/components/Paper.tsx index 0bbd88c..b0e5bc4 100644 --- a/src/components/Paper.tsx +++ b/src/components/Paper.tsx @@ -1,8 +1,17 @@ import React from 'react'; -const Paper: React.FC = ({ children }) => { +interface Props { + variant: 'elevation' | 'outlined' +} + +const style = { + elevation: 'shadow', + outlined: 'border-black border-2', +}; + +const Paper: React.FC = ({ variant = 'elevation', children }) => { return ( -
+
{children}
); diff --git a/src/containers/Home.tsx b/src/containers/Home.tsx index 0deefd1..82fbf25 100644 --- a/src/containers/Home.tsx +++ b/src/containers/Home.tsx @@ -1,14 +1,47 @@ import React from 'react'; import Page from './Page'; import Button from '../components/Button'; +import Paper from '../components/Paper'; +import waybill from '../assets/waybill.svg'; +import product from '../assets/product.svg'; +import contractors from '../assets/contractors.svg'; + +const cards = [ + { + name: 'Товары', + route: '/products', + src: product, + text: 'Веди учёт товаров для бухгалтерии и интернет-магазина в одном месте', + }, + { + name: 'Контрагенты', + route: '/contractors', + src: contractors, + text: 'Сохраняй историю платежей и переводов от своих партнёров', + }, + { + name: 'Накладные', + route: '/waybills', + src: waybill, + text: 'Проводи накладные в один клик и формируй отчёты', + }, +]; const Home: React.FC = () => ( - -

- Привет, мир! - - -

+ +
+ {cards.map(card => ( + +
+ Накладная +
+

{card.text}

+ +
+
+ + ))} +
); -- cgit v1.2.3