hamburger

This commit is contained in:
Kyle
2020-12-16 17:48:59 -08:00
parent 45e362931b
commit d29fd729dc
2 changed files with 10 additions and 10 deletions

View File

@@ -203,8 +203,8 @@ a:hover {
/*Hamburger*/
.hamburger {
position: fixed;
right: 2rem;
top: 2rem;
right: 0rem;
top: 0rem;
width: 4rem;
height: 4rem;
fill-rule: evenodd;
@@ -214,7 +214,7 @@ a:hover {
cursor: pointer;
z-index: 100;
background: #35603E;
border-radius: 0.5rem;
border-radius: 0 0 0 0.5rem;
}
.hamburger > path {
fill: none;
@@ -241,8 +241,8 @@ a:hover {
.circle {
z-index: 5;
position: fixed;
right: 4rem;
top: 4rem;
right: 2rem;
top: 2rem;
padding: 0;
background: #35603E;
border-radius: 100%;
@@ -250,13 +250,13 @@ a:hover {
}
.hamburger:hover + .circle {
padding: 3rem;
right: 1rem;
top: 1rem;
right: -1rem;
top: -1rem;
}
.hamburger.opened + .circle {
padding: var(--window-diagonal-size);
right: calc(4rem - var(--window-diagonal-size));
top: calc(4rem - var(--window-diagonal-size));
right: calc(2rem - var(--window-diagonal-size));
top: calc(2rem - var(--window-diagonal-size));
transition: 0.75s cubic-bezier(.53,.47,.76,-0.52);
}
/*Menus*/

View File

@@ -15,7 +15,7 @@
<header>
<h1 class='title center'>CARD CONJURER</h1>
</header>
<div html-include='/globalHTML/menu.html'>
<div>
<svg width="100%" height="100%" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" class='hamburger' onclick='toggleMenu()'>
<path class='line1' d="M10,18L90,18L10,82" />
<path class='line3' d="M10,82L90,82L10,18" />