FEATURE Handling reset button behaviour
This commit is contained in:
parent
8cd9e60ec0
commit
25865b08bf
|
|
@ -22,18 +22,36 @@
|
|||
&:after {
|
||||
@apply absolute top-1/2 -translate-y-1/2;
|
||||
content: '';
|
||||
right: 10px;
|
||||
right: 14px;
|
||||
display: flex;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
background-image: url('../resources/img/icons/carhop-rechercher-green-circle.svg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
/* Masquer la loupe si le champ n'est pas vide */
|
||||
&:has(input:not(:placeholder-shown))::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
input:not(:placeholder-shown) ~ #reset-search {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#reset-search {
|
||||
@apply absolute top-1/2 -translate-y-1/2;
|
||||
right: 14px;
|
||||
display: none;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
input {
|
||||
@apply w-full !py-4 px-4 border border-primary rounded-full text-base;
|
||||
padding-right: 33px;
|
||||
@apply w-full !py-4 px-5 border border-primary rounded-full text-base;
|
||||
padding-right: 36px;
|
||||
line-height: 1.5;
|
||||
height: auto;
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user