diff --git a/static/root.css b/static/root.css index 6e4beff..1b21aee 100644 --- a/static/root.css +++ b/static/root.css @@ -3,6 +3,10 @@ intended for the main page of the site! */ +body { + animation: hideContent 0.75s; +} + .mainTitle { font-size: min(calc(2rem + 2vw), 3rem); display: block; @@ -34,7 +38,9 @@ .animatedMain { opacity: 1; - animation: fadeDelay 2s cubic-bezier(0.075, 0.82, 0.165, 1); + animation: fadeDelay 1s cubic-bezier(0.075, 0.82, 0.165, 1); + animation-delay: 1.25s; + animation-fill-mode: both; } .animatedTitle { @@ -82,6 +88,10 @@ img:not(.project-inner > div > img):not(.activity>img) { transition: all 2s cubic-bezier(0.075, 0.82, 0.165, 1); } +.statusColor { + transition: color 2s cubic-bezier(0.075, 0.82, 0.165, 1); +} + @keyframes spinny { 0% { rotate: 0deg; @@ -96,37 +106,27 @@ img:not(.project-inner > div > img):not(.activity>img) { 0% { transform: translateY(calc(50vh - 6rem)) scale(1.5); opacity: 0; - /* height: 4rem; */ } - /* 50% { + 50% { opacity: 1; transform: translateY(calc(50vh - 6rem)) scale(1.25); - } */ + } 100% { transform: translateY(0) scale(1); } } -.statusColor { - transition: color 2s cubic-bezier(0.075, 0.82, 0.165, 1); -} - @keyframes fadeDelay { - /* 0% { - opacity: 0; - transform: translateY(25vh); - display: none; - } */ - 0% { + display: none; opacity: 0; transform: translateY(25vh); - display: none; } 100% { + display: block; opacity: 1; transform: translateY(0); } @@ -138,7 +138,7 @@ img:not(.project-inner > div > img):not(.activity>img) { overflow-x: hidden; } - 30% { + 100% { overflow-y: hidden; overflow-x: hidden; } diff --git a/static/style.css b/static/style.css index 1ab2e23..b67d183 100644 --- a/static/style.css +++ b/static/style.css @@ -71,8 +71,6 @@ body { background: linear-gradient(rgb(30, 4, 75), black); background-attachment: local; - - animation: hideContent 2.5s; } body, html {