From 39fff07d07624884817ef1b2817c1b581a1c3545 Mon Sep 17 00:00:00 2001 From: Ash Monty Date: Sat, 30 Jul 2022 14:41:23 +0200 Subject: [PATCH] fix(miieditor): new mii above purple outline --- public/assets/css/miieditor.css | 18 +++++++++++++++--- public/assets/js/miieditor.js | 2 +- views/account/miieditor.handlebars | 14 ++++++++++---- 3 files changed, 26 insertions(+), 8 deletions(-) diff --git a/public/assets/css/miieditor.css b/public/assets/css/miieditor.css index 8e8b2db..aee5c1f 100644 --- a/public/assets/css/miieditor.css +++ b/public/assets/css/miieditor.css @@ -344,11 +344,23 @@ input[type="range"].invert { border-radius: 24px; } -.mii-comparison img.new-mii { +.mii-comparison .new-mii-wrapper { + position: relative; + transition: right 500ms, transform 500ms; + right: 0; +} +.mii-comparison .new-mii-wrapper::after { + position: absolute; + content: ""; + display: block; box-shadow: inset 0 0 0 8px var(--accent-shade-1); + border-radius: 24px; margin: 0; right: 0; - transition: right 500ms, transform 500ms; + top: 0; + width: 100%; + height: 100%; + z-index: 2; } .mii-comparison svg { @@ -365,7 +377,7 @@ input[type="range"].invert { .fade-out { animation: fadeOut 0.5s forwards; } -.mii-comparison img.new-mii.centered-mii-img { +.mii-comparison div.new-mii-wrapper.centered-mii-img { position: absolute; right: 50%; transform: translateX(50%); diff --git a/public/assets/js/miieditor.js b/public/assets/js/miieditor.js index 0f53f62..928510d 100644 --- a/public/assets/js/miieditor.js +++ b/public/assets/js/miieditor.js @@ -241,7 +241,7 @@ document.querySelector('#saveTab #saveButton').addEventListener('click', (e) => }, 1500); setTimeout(() => { - document.querySelector('.mii-comparison.confirmed .new-mii').classList.add('centered-mii-img'); + document.querySelector('.mii-comparison.confirmed .new-mii-wrapper').classList.add('centered-mii-img'); }, 2000); diff --git a/views/account/miieditor.handlebars b/views/account/miieditor.handlebars index a617b17..421d0f2 100644 --- a/views/account/miieditor.handlebars +++ b/views/account/miieditor.handlebars @@ -515,12 +515,18 @@

Save Mii? This will permanently overwrite your current Mii.

- - + + +
+ +
- - + + +
+ +