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

comment appearance

Browse source
This commit is contained in:
Fedor Katurov 2019-10-12 10:13:09 +07:00
parent ee61080f18
commit 1d89029848
4 changed files with 13 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/components/containers/CommentWrapper/styles.scss
View file

@ -1,6 +1,6 @@
.wrap { .wrap {
background: $comment_bg; background: $comment_bg;
min-height: 64px; min-height: $comment_height;
display: flex; display: flex;
box-shadow: $comment_shadow; box-shadow: $comment_shadow;
@ -14,13 +14,13 @@
} }
.thumb { .thumb {
flex: 0 0 64px; flex: 0 0 $comment_height;
background: transparentize(black, 0.9); background: transparentize(black, 0.9);
border-radius: $panel_radius 0 0 $panel_radius; border-radius: $panel_radius 0 0 $panel_radius;
} }
.thumb_image { .thumb_image {
height: 64px; height: $comment_height;
background: transparentize(white, 0.97); background: transparentize(white, 0.97);
border-radius: $panel_radius 0 0 $panel_radius; border-radius: $panel_radius 0 0 $panel_radius;
} }

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

@ -4,8 +4,6 @@ import { IComment, IFile } from '~/redux/types';
import * as styles from './styles.scss'; import * as styles from './styles.scss';
import { formatCommentText, getURL } from '~/utils/dom'; import { formatCommentText, getURL } from '~/utils/dom';
import { Group } from '~/components/containers/Group'; import { Group } from '~/components/containers/Group';
import { ImageUpload } from '~/components/upload/ImageUpload';
import { getFileType } from '~/utils/uploader';
import assocPath from 'ramda/es/assocPath'; import assocPath from 'ramda/es/assocPath';
import append from 'ramda/es/append'; import append from 'ramda/es/append';
import reduce from 'ramda/es/reduce'; import reduce from 'ramda/es/reduce';

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

@ -1,9 +1,13 @@
@import 'flexbin/flexbin.scss'; @import 'flexbin/flexbin.scss';
.text { .text {
padding: $gap / 2; @include outer_shadow();
padding: $gap;
font-weight: 300; font-weight: 300;
font: $font_16_regular; font: $font_16_regular;
min-height: $comment_height;
box-sizing: border-box;
b { b {
font-weight: 600; font-weight: 600;
@ -11,9 +15,7 @@
} }
.images { .images {
// padding: $gap; @include flexbin(240px, 5px);
@include flexbin(240px, 10px);
img { img {
border-radius: $radius; border-radius: $radius;
@ -21,12 +23,11 @@
} }
.audios { .audios {
// padding: $gap;
& > div { & > div {
height: 64px; @include outer_shadow();
height: $comment_height;
border-radius: $radius; border-radius: $radius;
background: lighten($color: $comment_bg, $amount: 5%);
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;

1
src/styles/variables.scss
View file

@ -5,6 +5,7 @@ $grid_line: 4px;
$content_width: $cell * 4 + $grid_line * 3; $content_width: $cell * 4 + $grid_line * 3;
$gap: 10px; $gap: 10px;
$spc: $gap * 2; $spc: $gap * 2;
$comment_height: 72px;
$radius: 6px; $radius: 6px;
$cell_radius: 6px; $cell_radius: 6px;