Jump to content

Edit History

gouna

gouna

Bonjour,

J'ai un petit soucis, je ne parviens pas à effectuer une petite modification sur ma barre de recherche.

Le but : afficher uniquement l'icone de recherche, et afficher le champs de recherche uniquement lors du click.

(L'idéal aurait été de faire poper le champs de recherche mais cela me dépasse surement)

Voici les modifications apportées (en local) :

CSS:

input.form-control.search-widget__input-right {
	border-radius: 20px;
	width: 0;
    min-width: inherit;
    padding: 10px 10px 10px 20px;
    border: none;
    background: none;
    float: right;
    transition: width .4s ease-in-out;
    -webkit-transition: width .4s ease-in-out;
}
input.form-control.search-widget__input-right:focus {
    width: 100%;
    border: 1px solid #f0eeef;
    border-radius: 40px;
    font-size: 14px;
    height: 34px;
    color: #535252;
    background: #f0eeef; 
}

ps_searchbarjqauto .tpl (thème BLCK - presta rocket):

413927150_Sanstitre.thumb.png.4dcca3d63b95e6ac3faba84603f4c386.png

Lors du click, le formulaire s'affiche bien mais la recherche s'exécute en même temps.

gouna

gouna

Bonjour,

J'ai un petit soucis, je ne parviens pas à effectuer une petite modification sur ma barre de recherche.

Le but : afficher uniquement l'icone de recherche, et afficher le champs de recherche uniquement lors du click.

(L'idéal aurait été de faire poper le champs de recherche mais cela me dépasse surement)

Voici les modifications apportées (en local) :

CSS:

input.form-control.search-widget__input-right {
	border-radius: 20px;
	width: 0;
    min-width: inherit;
    padding: 10px 10px 10px 20px;
    border: none;
    background: none;
    float: right;
    transition: width .4s ease-in-out;
    -webkit-transition: width .4s ease-in-out;
}
input.form-control.search-widget__input-right:focus {
    width: 100%;
    border: 1px solid #f0eeef;
    border-radius: 40px;
    font-size: 14px;
    height: 34px;
    color: #535252;
    background: #f0eeef; 
}

ps_searchbarjqauto .tpl (thème BLCK - presta rocket):

 

 

Lors du click, le formulaire s'affiche bien mais la recherche s'exécute en même temps.

×
×
  • Create New...