From 09cfd8b4c695606b132aeea1710b7c34527b9834 Mon Sep 17 00:00:00 2001 From: Matthieu Bessat Date: Mon, 10 Apr 2023 19:26:18 +0200 Subject: [PATCH] refactor: remove previous attempt at animating a burger menu --- assets/sass/button.scss | 119 ---------------------------------------- layouts/index.html | 17 ------ 2 files changed, 136 deletions(-) diff --git a/assets/sass/button.scss b/assets/sass/button.scss index 8036b4c..9a627ec 100644 --- a/assets/sass/button.scss +++ b/assets/sass/button.scss @@ -8,122 +8,3 @@ border-radius: 2px; } - -@keyframes topbar_left { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(45deg) scaleX(1.6); - } -} -@keyframes topbar_right { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(-45deg) scaleX(1.6); - } -} - - -@keyframes middlebar { - 0% { - width: 100%; - } - 100% { - width: 0%; - } -} - -@keyframes bottombar_left { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(-45deg) scaleX(1.6); - } -} -@keyframes bottombar_right { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(45deg) scaleX(1.6); - } -} -@keyframes topbottom { - 0% { - transform: scaleX(2); - } - 100% { - transform: scaleX(2); - } -} - - -$dur: 1s; - -// .burger { -// width: 100px; -// height: 100px; -// border: 1px solid red; -// display: flex; -// justify-content: space-between; -// flex-direction: column; -// overflow: hidden; -// .bar { -// position: relative; -// animation-fill-mode: forwards !important; -// } -// .bar div { -// position: absolute; -// width: 100%; -// height: 1em; -// background: rgba(149, 165, 166, 1); -// border-radius: 1em; -// } -// .bar-group { -// height: 15px; -// display: flex; -// justify-content: center; -// } -// .bar1, .bar2 { -// } -// .bar1 { -// .bar { -// width: 100%; -// top: -50%; -// } -// .bar:nth-of-type(1) { -// animation: topbar_left $dur ease-in-out; -// transform-origin: top left; -// } -// .bar:nth-of-type(2) { -// animation: topbar_right $dur ease-in-out; -// transform-origin: top right; -// } -// } -// .bar2 { -// // middle bar -// display: flex; -// justify-content: center; -// .bar { -// animation: middlebar $dur ease-in-out; -// } -// } -// .bar3 { -// .bar { -// width: 100%; -// top: 50%; -// } -// .bar:nth-of-type(1) { -// animation: bottombar_left $dur ease-in-out; -// transform-origin: bottom left; -// } -// .bar:nth-of-type(2) { -// animation: bottombar_right $dur ease-in-out; -// transform-origin: bottom right; -// } -// } -// } diff --git a/layouts/index.html b/layouts/index.html index 63ab451..e511f06 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -21,23 +21,6 @@
- - - - - - - - - - - - - - - - -