Login Button
CODE
×
HTML
<button class='submit login'><span style="margin-right:10px">Anmelden</span> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="25" height="25" viewBox="0 0 20 14" style="enable-background:new 0 0 20 14;" xml:space="preserve" class="first"> <style type="text/css"> .st0{fill:#fff;} </style> <g transform="translate(10 -38.25)"> <g transform="translate(-10 38.25)"> <path class="st0" d="M10.5,10.1c-0.2,0.2-0.2,0.5,0,0.7c0.2,0.2,0.5,0.2,0.7,0l3.4-3.4c0.2-0.2,0.2-0.5,0-0.8l-3.4-3.4 c-0.2-0.2-0.5-0.2-0.7,0c-0.2,0.2-0.2,0.5,0,0.7l2.6,2.6H2.4C2.1,6.5,1.9,6.7,1.9,7s0.2,0.5,0.5,0.5h10.8L10.5,10.1z M16.1,0H8.3 c-1.1,0-2,0.9-2,2v2h1V2c0-0.6,0.4-1,1-1h7.8c0.6,0,1,0.4,1,1v10c0,0.6-0.4,1-1,1H8.3c-0.6,0-1-0.4-1-1v-2h-1v2c0,1.1,0.9,2,2,2 h7.8c1.1,0,2-0.9,2-2V2C18.1,0.9,17.2,0,16.1,0z"/> </g> </g> </svg></button>
CSS
button.submit.login { overflow:hidden; text-align:center; font-family: 'Roboto'; font-style: normal; font-weight: 500; font-size: 16px; line-height: 26px; line-height: 24px; background-color: rgba(78,78,78,1); color: var(--white); display: inline-block; height: 49px; border-radius: 49px; border: none; padding: 0px 34px 0px 36px; vertical-align: middle; margin: 40px 30px 40px -1px; transition: all 250ms ease-in-out; cursor:pointer; } button.submit.login:hover, button.submit.login:focus { -webkit-transform: scale(1.07); -ms-transform: scale(1.07); transform: scale(1.07); } @media screen and (max-width: 767px) { button.submit.login { margin-top: 20px; margin-right: 0; margin-bottom: 20px; margin-left: 0; } } button.submit { overflow:hidden; text-align:center; font-size: 16px; line-height: 26px; font-family: 'Roboto'; font-style: normal; font-weight: 500; line-height: 24px; background-color: rgba(78,78,78,1); color: var(--white); display: inline-block; height: 49px; border-radius: 49px; border: none; padding: 0px 34px 0px 36px; vertical-align: middle; margin: 40px 30px 40px -1px; transition: all 250ms ease-in-out; cursor:pointer; } button.submit:hover, button.submit:focus { -webkit-transform: scale(1.07); -ms-transform: scale(1.07); transform: scale(1.07); } @media screen and (max-width: 767px) { button.submit { margin-top: 20px; margin-right: 0; margin-bottom: 20px; margin-left: 0; } }
JS
Login Button
barrierefrei
Erstellt: 12.09.2024 - 13:47 Uhr
Letzte Änderung: 12.09.2024 - 14:54 Uhr
×
Anmelden