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

comment form

Browse source
This commit is contained in:
muerwre 2019-08-26 13:17:55 +07:00
parent 96bdbb0e04
commit c541278686
15 changed files with 357 additions and 89 deletions
Download patch file Download diff file Expand all files Collapse all files

30
src/components/node/Comment/index.tsx
View file

@ -1,31 +1,17 @@
import React, { FC, HTMLAttributes } from 'react';
import { Card } from '~/components/containers/Card';
import * as styles from './styles.scss';
import classNames = require('classnames');
import { CommentWrapper } from '~/components/containers/CommentWrapper';
type IProps = HTMLAttributes<HTMLDivElement> & {
is_empty?: boolean;
is_loading?: boolean;
}
photo?: string;
comment?: any;
};
const Comment: FC<IProps> = ({
is_empty,
is_loading,
className,
...props
}) => (
<Card
className={classNames(styles.wrap, className, { is_empty, is_loading })}
seamless
{...props}
>
<div className={styles.thumb}>
<div className={styles.thumb_image} />
</div>
<div className={styles.text} />
</Card>
const Comment: FC<IProps> = ({ comment, is_empty, is_loading, className, photo, ...props }) => (
<CommentWrapper is_empty={is_empty} is_loading={is_loading} photo={photo} {...props}>
<div>Something!</div>
</CommentWrapper>
);
export { Comment };

27
src/components/node/Comment/styles.scss
View file

@ -1,27 +0,0 @@
.wrap {
background: $comment_bg;
min-height: 64px;
display: flex;
box-shadow: $comment_shadow;
&:global(.is_empty) {
opacity: 0.5;
}
}
.text {
padding: $gap;
flex: 1;
}
.thumb {
flex: 0 0 64px;
background: transparentize(black, 0.9);
border-radius: $panel_radius 0 0 $panel_radius;
}
.thumb_image {
height: 64px;
background: transparentize(white, 0.97);
border-radius: $panel_radius 0 0 $panel_radius;
}