diff --git a/proj/y2t/assets/css/style.css b/proj/y2t/assets/css/style.css index b624b19..9f19865 100644 --- a/proj/y2t/assets/css/style.css +++ b/proj/y2t/assets/css/style.css @@ -50,4 +50,49 @@ form section.input { section.input select, section.input input[type=text] { flex-grow: 1; -} \ No newline at end of file +} + + + +/* Loading screen */ + +div.loading { + position: fixed; + background-color: var(--black); + color: var(--white); + width: 100vw; + height: 100vh; + display: flex; + align-items: center; + justify-content: center; + font-size: 3rem; +} + +div.loading span { + width: 2rem; + height: 2rem; + margin: 0 5px; + background-color: var(--white); + border-radius: 50%; + display: inline-block; + animation-name: dots; + animation-duration: 2s; + animation-iteration-count: infinite; + animation-timing-function: ease-in-out; +} + +div.loading span:nth-child(2){ + animation-delay: 0.4s; +} + +div.loading span:nth-child(3){ + animation-delay: 0.8s; +} + +@keyframes dots{ + 50%{ + opacity: 0; + transform: scale(0.7) translate(10px); + } +} +