Fixed transition error with login arrow button.

This commit is contained in:
Daniel Scalzi 2018-01-23 15:41:01 -05:00
parent e236a38757
commit 45997c17f5
2 changed files with 12 additions and 4 deletions

View File

@ -237,7 +237,7 @@ p {
cursor: pointer; cursor: pointer;
position: relative; position: relative;
right: -20px; right: -20px;
transition: 0.5s ease;2 transition: 0.5s ease;
} }
#loginButton:hover { #loginButton:hover {
text-shadow: 0px 0px 20px #fff; text-shadow: 0px 0px 20px #fff;
@ -245,12 +245,15 @@ p {
#loginButton:focus { #loginButton:focus {
outline: none; outline: none;
} }
#loginButton img { #loginSVG {
overflow: visible;
transform: rotate(90deg); transform: rotate(90deg);
margin-left: 20px; margin-left: 20px;
transition: 0.25s ease; transition: 0.25s ease;
width: 20px;
height: 20px;
} }
#loginButton:hover img { #loginButton:hover #loginSVG {
-webkit-filter: drop-shadow(0px 0px 2px #fff); -webkit-filter: drop-shadow(0px 0px 2px #fff);
} }

View File

@ -28,7 +28,12 @@
<button id="loginButton" type="submit"> <button id="loginButton" type="submit">
<div id="loginButtonContent"> <div id="loginButtonContent">
LOGIN LOGIN
<img src="assets/images/icons/arrow.svg" id="menu_img"/> <svg id="loginSVG" viewBox="0 0 24.87 13.97">
<defs>
<style>.cls-1{fill:none;stroke:#FFF;stroke-width:2px;}</style>
</defs>
<polyline class="cls-1" points="0.71 13.26 12.56 1.41 24.16 13.02"/>
</svg>
</div> </div>
</button> </button>
<div id="loginDisclaimer"> <div id="loginDisclaimer">