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

highlight and scroll to new comments if authorized (#76)

Browse source 
* added new drone file

* commented-out unnecessary build stages

* commented-out unnecessary build stages

* added dynamic repo

* added dynamic repo

* added registry global env

* added registry global env

* added registry global env

* added template

* added template

* added template

* added template

* added branches to template

* added branches to template

* made build based on template

* made build based on template

* changed env file

* added .env.development file to repo

* fixed branch to develop

* added variables for develop and master

* added variables for develop and master

* added env variables to builder

* added env variables to builder

* added env variables to builder

* changed drone.yml

* added highlight for new comments

* fixed dependencies for useScrollToTop

* added smooth scrolling for comments

* fixed new comments highlight for same user
This commit is contained in:
muerwre 2021-10-06 12:48:26 +07:00 • committed by GitHub
parent a7e8e19b06
commit e071409241
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 172 additions and 108 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/containers/CommentWrapper/index.tsx
View file

@ -11,8 +11,8 @@ type IProps = DivProps & {
user: IUser;
isEmpty?: boolean;
isLoading?: boolean;
isSame?: boolean;
isForm?: boolean;
isNew?: boolean;
};
const CommentWrapper: FC<IProps> = ({
@ -20,16 +20,16 @@ const CommentWrapper: FC<IProps> = ({
className,
isEmpty,
isLoading,
isSame,
isForm,
children,
isNew,
...props
}) => (
<div
className={classNames(styles.wrap, className, {
is_empty: isEmpty,
is_loading: isLoading,
is_same: isSame,
[styles.is_empty]: isEmpty,
[styles.is_loading]: isLoading,
[styles.is_new]: isNew,
})}
{...props}
>

24
src/components/containers/CommentWrapper/styles.module.scss
View file

@ -1,5 +1,13 @@
@import "src/styles/variables";
@keyframes highlight {
0% { opacity: 0.75; }
25% { opacity: 0.5; }
50% { opacity: 0.75; }
75% { opacity: 0; }
100% { opacity: 0; }
}
.wrap {
@include outer_shadow;
@ -10,15 +18,27 @@
min-width: 0;
border-radius: $radius;
&:global(.is_empty) {
&.is_empty {
opacity: 0.5;
}
&:global(.is_same) {
&.is_same {
margin: 0 !important;
border-radius: 0;
}
&.is_new::after {
content: ' ';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
animation: highlight 1s 0.5s forwards;
background: transparentize($wisegreen, 0.7);
border-radius: $radius;
}
@include tablet {
flex-direction: column;
}