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

refined horizontal editor

Browse source
This commit is contained in:
muerwre 2019-08-02 04:30:08 +07:00
parent 4c20da6151
commit 819e988a2e
3 changed files with 29 additions and 101 deletions
Download patch file Download diff file Expand all files Collapse all files

67
src/containers/examples/HorizontalExample/index.tsx
View file

@ -1,66 +1,29 @@
import React, { FC } from "react";
import { Card } from "~/components/containers/Card";
import * as styles from "./styles.scss";
import { Group } from "~/components/containers/Group";
import { Padder } from "~/components/containers/Padder";
import { CellGrid } from "~/components/containers/CellGrid";
import { Panel } from "~/components/containers/Panel";
import classNames = require("classnames");
import { Scroll } from "~/components/containers/Scroll";
import { Tags } from "~/components/node/Tags";
import { Button } from "~/components/input/Button";
import { InputText } from "~/components/input/InputText";
import { Grid } from "~/components/containers/Grid";
import {Padder} from "~/components/containers/Padder";
import {Group} from "~/components/containers/Group";
import {InputText} from "~/components/input/InputText";
import {Button} from "~/components/input/Button";
interface IProps {}
const HorizontalExample: FC<IProps> = () => (
<Card className={styles.wrap} seamless>
<Group className={styles.group} seamless>
<div className={styles.wrap}>
<Card seamless className={styles.card}>
<div className={styles.editor}>
<Scroll>
<Padder>
<CellGrid className={styles.editor_image_container} size={200}>
<div className={styles.editor_image} />
<div className={styles.editor_image} />
<div className={styles.editor_image} />
<div className={styles.editor_image} />
<div className={styles.editor_image} />
<div className={styles.editor_image} />
<div className={styles.editor_image} />
<div className={styles.editor_image} />
</CellGrid>
</Padder>
</Scroll>
</div>
<div className={styles.panel}>
<Padder>
<Grid columns="2fr 1fr 1fr">
<div>
<Group>
<InputText title="Название" />
<Padder className={styles.panel}>
<Group horizontal>
<InputText title="Название" />
<Tags
tags={[
{ title: "Избранный", feature: "red" },
{ title: "Плейлист", feature: "green" },
{ title: "Просто" },
{ title: "+ фото", feature: "black" },
{ title: "+ с музыкой", feature: "black" }
]}
/>
</Group>
</div>
<div />
<div />
</Grid>
</Padder>
</div>
</Group>
</Card>
<Button title="Сохранить" iconRight="play" />
</Group>
</Padder>
</Card>
</div>
);
export { HorizontalExample };