mirror of
https://github.com/muerwre/vault-frontend.git
synced 2025-04-28 14:16:41 +07:00
refactored flow cells, added colors for lab (#78)
* made better flow cells * made cubical desaturation * made colorfull lab nodes * colorful lab nodes for all text ones * all lab nodes are colorful * disabled lazy loading on heroes * fixed color calculation hook * fixed lab color gradients calculation * fixed cell text on flow
This commit is contained in:
parent
7d6f35b0af
commit
94c656fe0f
29 changed files with 345 additions and 63 deletions
18
src/components/flow/FlowCellImage/index.tsx
Normal file
18
src/components/flow/FlowCellImage/index.tsx
Normal file
|
@ -0,0 +1,18 @@
|
|||
import React, { FC } from 'react';
|
||||
import LazyLoad from 'react-lazyload';
|
||||
import { IMGProps } from '~/utils/types';
|
||||
import styles from './styles.module.scss';
|
||||
import classNames from 'classnames';
|
||||
|
||||
interface Props extends IMGProps {
|
||||
height?: number;
|
||||
}
|
||||
|
||||
const FlowCellImage: FC<Props> = ({ className, children, ...rest }) => (
|
||||
<LazyLoad once className={classNames(styles.wrapper, className)}>
|
||||
<img {...rest} src={rest.src} alt="" />
|
||||
{children}
|
||||
</LazyLoad>
|
||||
);
|
||||
|
||||
export { FlowCellImage };
|
15
src/components/flow/FlowCellImage/styles.module.scss
Normal file
15
src/components/flow/FlowCellImage/styles.module.scss
Normal file
|
@ -0,0 +1,15 @@
|
|||
.wrapper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
transform: translate(-50%, -50%);
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue