mirror of
https://github.com/cupcakearmy/old.nicco.io.git
synced 2024-11-01 00:24:16 +01:00
100vh screen size fix for ios mobile, now dynamic
This commit is contained in:
parent
78ccbfa591
commit
7151deb316
@ -4,9 +4,13 @@ import AnimatedBackground from '../Components/AnimatedBackground'
|
|||||||
import Cursor from '../Components/Cursor'
|
import Cursor from '../Components/Cursor'
|
||||||
import Parallax from '../Components/Parallax'
|
import Parallax from '../Components/Parallax'
|
||||||
import Letters from '../Screens/Letters'
|
import Letters from '../Screens/Letters'
|
||||||
|
import { useInnerWindowSize } from '../util'
|
||||||
|
|
||||||
const Home: React.FC = () => {
|
const Home: React.FC = () => {
|
||||||
return <div id="home">
|
|
||||||
|
const {height, width} = useInnerWindowSize()
|
||||||
|
|
||||||
|
return <div id="home" style={{width: width + 'px', height: height + 'px'}}>
|
||||||
<Parallax>
|
<Parallax>
|
||||||
<section id={'letters-container'}>
|
<section id={'letters-container'}>
|
||||||
<h1>
|
<h1>
|
||||||
|
17
src/util.ts
17
src/util.ts
@ -1,5 +1,22 @@
|
|||||||
import { useEffect, useState } from 'react'
|
import { useEffect, useState } from 'react'
|
||||||
|
|
||||||
|
type Size = { width: number, height: number }
|
||||||
|
export const useInnerWindowSize = (): Size => {
|
||||||
|
const getCurrentSize = (): Size => ({
|
||||||
|
height: window.innerHeight,
|
||||||
|
width: window.innerWidth,
|
||||||
|
})
|
||||||
|
|
||||||
|
let [size, setSize] = useState<Size>(getCurrentSize)
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const handle = () => setSize(getCurrentSize())
|
||||||
|
window.addEventListener('resize', handle)
|
||||||
|
return () => window.removeEventListener('resize', handle)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return size
|
||||||
|
}
|
||||||
|
|
||||||
export const useIsMousePresent = () => {
|
export const useIsMousePresent = () => {
|
||||||
let [present, setPresent] = useState<boolean>(false)
|
let [present, setPresent] = useState<boolean>(false)
|
||||||
|
Loading…
Reference in New Issue
Block a user