muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 04:46:40 +07:00
Code Packages Activity Actions

fixed some styles

Browse source
This commit is contained in:
muerwre 2019-08-01 18:44:11 +07:00
parent b5bc5d7c6c
commit 85ee879c2f
5 changed files with 113 additions and 90 deletions
Download patch file Download diff file Expand all files Collapse all files

125
src/containers/examples/ImageExample/index.tsx
View file

@ -1,88 +1,77 @@
import React, { FC } from 'react';
import React, { FC } from "react";
import { Card } from "~/components/containers/Card";
import * as styles from './styles.scss';
import * as styles from "./styles.scss";
import { Group } from "~/components/containers/Group";
import { Padder } from "~/components/containers/Padder";
import range from 'ramda/es/range';
import range from "ramda/es/range";
import { Comment } from "~/components/node/Comment";
import { NodePanel } from "~/components/node/NodePanel";
import { NodeRelated } from "~/components/node/NodeRelated";
import { Tags } from "~/components/node/Tags";
import { MenuButton } from "~/components/node/MenuButton";
import { NodeNoComments } from "~/components/node/NodeNoComments";
import { InputText } from "~/components/input/InputText";
interface IProps {}
const ImageExample: FC<IProps> = () => (
<Card className={styles.node} seamless>
<div
className={styles.image_container}
>
<img className={styles.image} src="http://37.192.131.144/full/attached/2017/11/f01fdaaea789915284757634baf7cd11.jpg" />
</div>
<Card className={styles.node} seamless>
<InputText />
<div className={styles.image_container}>
<img
className={styles.image}
src="http://37.192.131.144/full/attached/2017/11/f01fdaaea789915284757634baf7cd11.jpg"
/>
</div>
<NodePanel />
<NodePanel />
<Group>
<Padder>
<Group horizontal className={styles.content}>
<Group className={styles.comments}>
<NodeNoComments />
<Group>
<Padder>
<Group horizontal className={styles.content}>
<Group className={styles.comments}>
<NodeNoComments />
{
range(1,6).map(el => (
<Comment
key={el}
/>
))
}
</Group>
<div className={styles.panel}>
<Group style={{ flex: 1 }}>
<Padder className={styles.buttons}>
<Group>
<MenuButton
title="На главной"
description="плывет по течению"
icon="star"
/>
<MenuButton
title="Видно всем"
icon="star"
/>
<MenuButton
title="Редактировать"
icon="star"
/>
</Group>
</Padder>
<Tags
tags={[
{ title: 'Избранный', feature: 'red' },
{ title: 'Плейлист', feature: 'green' },
{ title: 'Просто' },
{ title: '+ фото', feature: 'black' },
{ title: '+ с музыкой', feature: 'black' },
]}
/>
<NodeRelated
title="First album"
/>
<NodeRelated
title="Second album"
/>
</Group>
</div>
{range(1, 6).map(el => (
<Comment key={el} />
))}
</Group>
</Padder>
</Group>
</Card>
<div className={styles.panel}>
<Group style={{ flex: 1 }}>
<Padder className={styles.buttons}>
<Group>
<MenuButton
title="На главной"
description="плывет по течению"
icon="star"
/>
<MenuButton title="Видно всем" icon="star" />
<MenuButton title="Редактировать" icon="star" />
</Group>
</Padder>
<Tags
tags={[
{ title: "Избранный", feature: "red" },
{ title: "Плейлист", feature: "green" },
{ title: "Просто" },
{ title: "+ фото", feature: "black" },
{ title: "+ с музыкой", feature: "black" }
]}
/>
<NodeRelated title="First album" />
<NodeRelated title="Second album" />
</Group>
</div>
</Group>
</Padder>
</Group>
</Card>
);
export { ImageExample };