mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-28 05:00:22 +08:00
31 lines
688 B
HTML
31 lines
688 B
HTML
<input type="text" name="search" placeholder="Search For AnyThink.." class="input">
|
|
|
|
<style>
|
|
/* From Uiverse.io by Bodyhc - Tags: hover, hover effect, input effect */
|
|
.input[type=text] {
|
|
max-width: 180px;
|
|
height: 20px;
|
|
background-color: #fff;
|
|
color: #242424;
|
|
padding: .15rem .5rem;
|
|
min-height: 40px;
|
|
border-radius: 4px;
|
|
outline: none;
|
|
border: none;
|
|
box-shadow: 0px 10px 20px -18px blue;
|
|
border-bottom: 3px solid #0d14e9;
|
|
transition: .10s ease;
|
|
}
|
|
|
|
.input[type=text]:hover {
|
|
outline: 2px solid #0d14e9;
|
|
max-width: 200px;
|
|
}
|
|
|
|
.input[type=text]:focus {
|
|
border-bottom: 3px solid #0d14e9;
|
|
border-radius: 5px 5px 2px 2px;
|
|
transform: scale(1.1);
|
|
}
|
|
|
|
</style>
|