diff --git a/README.md b/README.md index e602b0f..f478271 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,7 @@ # ac-nh-turnip-prices +[![discord](https://img.shields.io/badge/discord-join-7289DA.svg?logo=discord&longCache=true&style=flat)](https://discord.gg/bRh74X8) + Price calculator/predictor for Turnip prices - ## Scope This tool is: diff --git a/css/styles.css b/css/styles.css index a969a2d..57932e0 100644 --- a/css/styles.css +++ b/css/styles.css @@ -513,39 +513,21 @@ input[type=number] { to {bottom: 0; opacity: 0;} } -/* Animation */ -.parallax>use { - animation: move-forever 25s cubic-bezier(.55, .5, .45, .5) infinite; -} - +/* Cloud SVG placement */ .parallax>use:nth-child(1) { - animation-delay: -2s; - animation-duration: 7s; + transform: translate3d(-30px, 0, 0); } .parallax>use:nth-child(2) { - animation-delay: -3s; - animation-duration: 10s; + transform: translate3d(-90px, 0, 0); } .parallax>use:nth-child(3) { - animation-delay: -4s; - animation-duration: 13s; + transform: translate3d(45px, 0, 0); } .parallax>use:nth-child(4) { - animation-delay: -5s; - animation-duration: 20s; -} - -@keyframes move-forever { - 0% { - transform: translate3d(-90px, 0, 0); - } - - 100% { - transform: translate3d(85px, 0, 0); - } + transform: translate3d(20px, 0, 0); } /*Shrinking for mobile*/ @@ -555,3 +537,76 @@ input[type=number] { min-height: 40px; } } + +/*Darkmodjs*/ +.darkmode-layer, .darkmode-toggle { + z-index: 1; +} + +.darkmode-toggle { + opacity: 0.7; + transition: opacity 0.15s; +} +.darkmode-toggle:hover { + opacity: 0.9; +} + +.darkmode-toggle:active { + transition: opacity 0s; + opacity: 1; +} + +.darkmode-toggle:focus { + outline: none; +} + +div.darkmode-background{ + background: #fef0e3; + background-image: + radial-gradient(#fff 20%, transparent 0), + radial-gradient(#fff 20%, transparent 0); + position: inherit; +} + +body.darkmode--activated{ + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-family: 'Varela Round', sans-serif; + width: 100%; + margin: 0 0 0 0; + position: absolute +} + +body.darkmode--activated div[class^="dialog-box"], +body.darkmode--activated div[class^="nook-phone"], +body.darkmode--activated form[class^="input__form"], +{ + background: #fee0c4; + color: #010F1D; +} + +body.darkmode--activated svg[class^="waves"]{ + background: #fef0e3; +} + +body.darkmode--activated a, +body.darkmode--activated b, +body.darkmode--activated input[type=number]:not(:placeholder-shown){ + color: #586472; + +} + +body.darkmode--activated input[type="radio"]+label, +body.darkmode--activated input[type=number]:placeholder-shown{ + background: #bda284; +} + +body.darkmode--activated input[type="radio"]:checked+label{ + background: #7b6955; +} + +body.darkmode--activated i{ + color: #7b6955; +} diff --git a/index.html b/index.html index 2b93582..6ddf79f 100644 --- a/index.html +++ b/index.html @@ -313,6 +313,8 @@ + +