mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-28 05:00:22 +08:00
43 lines
906 B
HTML
43 lines
906 B
HTML
<button> Enter Room
|
|
<svg viewBox="0 0 16 16" class="bi bi-arrow-right" fill="currentColor" height="20" width="20" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z" fill-rule="evenodd"></path>
|
|
</svg>
|
|
</button>
|
|
<style>
|
|
/* From Uiverse.io by CodeGame2010 - Tags: button */
|
|
button {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 200px;
|
|
height: 50px;
|
|
border-radius: 50px;
|
|
border: 0;
|
|
outline: 0;
|
|
font-size: 18px;
|
|
background: #08f;
|
|
color: #fff;
|
|
}
|
|
|
|
svg {
|
|
margin: 0 0 0 10px;
|
|
}
|
|
|
|
button:hover svg {
|
|
margin: 0 0 0 25px;
|
|
transition: 0.3s;
|
|
}
|
|
|
|
button:not(:hover) svg {
|
|
transition: 0.3s;
|
|
}
|
|
|
|
button:active {
|
|
transform: scale(0.9, 0.9);
|
|
transition: 200ms;
|
|
}
|
|
|
|
button:not(:active) {
|
|
transition: 200ms;
|
|
}
|
|
</style>
|