37 lines
696 B
CSS
37 lines
696 B
CSS
.input,
|
|
.input * {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.input {
|
|
position: relative;
|
|
overflow: visible;
|
|
width: 250px;
|
|
}
|
|
|
|
.input input {
|
|
width: 100%;
|
|
height: 50px;
|
|
border: 1px solid var(--textbox-75);
|
|
border-radius: 16px;
|
|
padding: 10px 20px;
|
|
background-color: var(--textbox-50);
|
|
color: var(--foreground);
|
|
font-size: 16px;
|
|
transition:
|
|
background-color 0.2s ease,
|
|
border-color 0.2s ease,
|
|
box-shadow 0.2s ease;
|
|
}
|
|
|
|
.input input:hover {
|
|
background-color: var(--textbox-75);
|
|
border-color: var(--textbox-100);
|
|
}
|
|
|
|
.input input:focus {
|
|
outline: none;
|
|
background-color: var(--textbox-100);
|
|
border-color: var(--primary-100);
|
|
box-shadow: 0 0 0 2px var(--primary-50);
|
|
}
|