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

fixed switcher appearance

Browse source
This commit is contained in:
Fedor Katurov 2020-04-23 14:12:43 +07:00
parent b385df297a
commit 511a8b5768
3 changed files with 9 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/components/node/ImageSwitcher/styles.scss
View file

@ -7,14 +7,15 @@
.switcher {
position: absolute;
background: darken($content_bg, 2%);
// background: darken($content_bg, 2%);
background: url('../../../../src/sprites/noise.png') $main_bg_color;
display: flex;
left: 50%;
transform: translate(-50%, 0);
top: 0;
top: -5px;
border-radius: 24px;
padding: 0 13px;
flex-wrap: wrap;
padding: 0 3px;
// flex-wrap: wrap;
transition: background-color 0.5s;
& > div {

4
src/components/node/NodeImageBlock/index.tsx
View file

@ -20,7 +20,7 @@ interface IProps {
const NodeImageBlock: FC<IProps> = ({ node, is_loading, updateLayout, modalShowPhotoswipe }) => {
const [is_animated, setIsAnimated] = useState(false);
const [current, setCurrent] = useState(0);
const [height, setHeight] = useState(window.innerHeight - 140);
const [height, setHeight] = useState(window.innerHeight - 150);
const [loaded, setLoaded] = useState<Record<number, boolean>>({});
const refs = useRef<Record<number, HTMLDivElement>>({});
@ -41,7 +41,7 @@ const NodeImageBlock: FC<IProps> = ({ node, is_loading, updateLayout, modalShowP
useEffect(() => {
if (!refs || !refs.current[current] || !loaded[current])
return setHeight(window.innerHeight - 140);
return setHeight(window.innerHeight - 150);
const el = refs.current[current];
const element_height = el.getBoundingClientRect && el.getBoundingClientRect().height;

4
src/components/node/NodeImageBlock/styles.scss
View file

@ -23,7 +23,7 @@
user-select: none;
.image {
max-height: calc(100vh - 140px);
max-height: calc(100vh - 150px);
max-width: 100%;
opacity: 1;
border-radius: $radius;
@ -52,7 +52,7 @@
.placeholder {
width: 100%;
height: calc(100vh - 140px);
height: calc(100vh - 130px);
border-radius: $radius;
display: flex;
align-items: center;