1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 04:46:40 +07:00

image layout

This commit is contained in:
muerwre 2019-07-26 20:02:23 +07:00
parent 7cbfbc98bd
commit 163a46ace2
13 changed files with 237 additions and 28 deletions

View file

@ -3,22 +3,20 @@ import * as styles from './styles.scss';
import classNames from 'classnames';
interface IProps {
container: React.RefObject<HTMLDivElement>;
}
export const SidePane: FC<IProps> = ({
container,
}) => {
const content_width = 1100;
const [left, setLeft] = useState(0);
const moveThis = useCallback(() => {
const shift = window.innerWidth > (1024 + 64 + 20)
? ((window.innerWidth - 1024 - 64 - 20) / 2) - 54 - 10 + 64
const shift = window.innerWidth > (content_width + 64 + 20)
? ((window.innerWidth - content_width - 64 - 20) / 2) - 54 - 10 + 64
: 10;
setLeft(shift);
console.log({ shift });
}, [setLeft, container]);
}, [setLeft]);
useEffect(() => {
moveThis();
@ -29,7 +27,7 @@ export const SidePane: FC<IProps> = ({
window.removeEventListener('resize', moveThis);
document.removeEventListener('DOMContentLoaded', moveThis);
}
}, [container]);
}, []);
return (
<div className={styles.pane} style={{ transform: `translate(${left}px, 0px)` }}>