Design de la page d'accueil, pour afficher le logo au centre, la recherche à gauche et le reste à droite
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -348,3 +348,39 @@ span.product-categorie {
|
|||||||
.table-steps .description {
|
.table-steps .description {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Mise en page de la page d'accueil */
|
||||||
|
div.header__main {
|
||||||
|
display: inline-grid !important;
|
||||||
|
align-items: center;
|
||||||
|
margin: auto;
|
||||||
|
grid-template-columns: 2fr 200px 1fr 1fr;
|
||||||
|
grid-template-rows: 150px;
|
||||||
|
}
|
||||||
|
div.custom-grid-one {
|
||||||
|
margin: auto;
|
||||||
|
grid-column: 1;
|
||||||
|
grid-row: 1;
|
||||||
|
}
|
||||||
|
div.custom-grid-two {
|
||||||
|
margin: auto;
|
||||||
|
grid-column: 2;
|
||||||
|
grid-row: 1;
|
||||||
|
}
|
||||||
|
div.custom-grid-three {
|
||||||
|
margin: 0 25px 0 auto;
|
||||||
|
grid-column: 3;
|
||||||
|
grid-row: 1;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
div.custom-grid-four {
|
||||||
|
margin-right: auto;
|
||||||
|
grid-column: 4;
|
||||||
|
grid-row: 1;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
.header__secondary {
|
||||||
|
width: 90%;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|||||||
@@ -126,16 +126,21 @@ GNU General Public License : http://www.gnu.org/licenses/
|
|||||||
|
|
||||||
<div class="header__content">
|
<div class="header__content">
|
||||||
<div class="header__main">
|
<div class="header__main">
|
||||||
<h1 class="logo hidden-xs">
|
<div class="custom-grid-two">
|
||||||
<a href="{navigate to="index"}" title="{$store_name}">
|
<h1 class="logo hidden-xs">
|
||||||
{local_media type="logo"}
|
<a href="{navigate to="index"}" title="{$store_name}">
|
||||||
<img src="{$MEDIA_URL}" alt="{$store_name}" class="logo-boutique">
|
{local_media type="logo"}
|
||||||
{/local_media}
|
<img src="{$MEDIA_URL}" alt="{$store_name}" class="logo-boutique">
|
||||||
</a>
|
{/local_media}
|
||||||
</h1>
|
</a>
|
||||||
{hook name="main.navbar-primary"}
|
</h1>
|
||||||
|
</div>
|
||||||
|
{hook name="main.navbar-secondary"}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="header__bottom">
|
||||||
<div class="header__secondary">
|
<div class="header__secondary">
|
||||||
{hook name="main.navbar-secondary"}
|
{hook name="main.navbar-primary"}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -0,0 +1,5 @@
|
|||||||
|
<div class="custom-grid-four">
|
||||||
|
<ul class="nav navbar-nav navbar-cart navbar-right">
|
||||||
|
{hook name="mini-cart"}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
@@ -1,43 +1,45 @@
|
|||||||
<ul class="nav navbar-nav navbar-customer navbar-right">
|
<div class="custom-grid-three">
|
||||||
{loop type="auth" name="customer_info_block" role="CUSTOMER"}
|
<ul class="nav navbar-nav navbar-customer navbar-right">
|
||||||
<li><a href="{url path="/logout"}" class="logout">{intl l="Log out!" d="hookcustomer.fo.default"}</a></li>
|
{loop type="auth" name="customer_info_block" role="CUSTOMER"}
|
||||||
<li><a href="{url path="/account"}" class="account">{intl l="My Account" d="hookcustomer.fo.default"}</a></li>
|
<li><a href="{url path="/logout"}" class="logout">{intl l="Log out!" d="hookcustomer.fo.default"}</a></li>
|
||||||
{/loop}
|
<li><a href="{url path="/account"}" class="account">{intl l="My Account" d="hookcustomer.fo.default"}</a></li>
|
||||||
{elseloop rel="customer_info_block"}
|
{/loop}
|
||||||
<!-- <li><a href="{url path="/register"}" class="register">{intl l="Register!" d="hookcustomer.fo.default"}</a></li>-->
|
{elseloop rel="customer_info_block"}
|
||||||
<li class="dropdown">
|
<!-- <li><a href="{url path="/register"}" class="register">{intl l="Register!" d="hookcustomer.fo.default"}</a></li>-->
|
||||||
<a href="{url path="/login"}" class="login dropdown-toggle">{* {intl l="Log In!" d="hookcustomer.fo.default"} *}<i class="fa fa-user"></i></a>
|
<li class="dropdown">
|
||||||
<div class="dropdown-menu">
|
<a href="{url path="/login"}" class="login dropdown-toggle">{* {intl l="Log In!" d="hookcustomer.fo.default"} *}<i class="fa fa-user"></i></a>
|
||||||
{form name="thelia.front.customer.login"}
|
<div class="dropdown-menu">
|
||||||
<form id="form-login-mini" action="{url path="/login"}" method="post" {form_enctype}>
|
{form name="thelia.front.customer.login"}
|
||||||
{form_hidden_fields}
|
<form id="form-login-mini" action="{url path="/login"}" method="post" {form_enctype}>
|
||||||
{form_field field="success_url"}
|
{form_hidden_fields}
|
||||||
<input type="hidden" name="{$name}" value="{navigate to="current"}">
|
{form_field field="success_url"}
|
||||||
{/form_field}
|
<input type="hidden" name="{$name}" value="{navigate to="current"}">
|
||||||
{form_field field="email"}
|
{/form_field}
|
||||||
<div class="form-group group-email">
|
{form_field field="email"}
|
||||||
<label for="{$label_attr.for}-mini">{intl l="Email address" d="hookcustomer.fo.default"}</label>
|
<div class="form-group group-email">
|
||||||
<input type="email" name="{$name}" id="{$label_attr.for}-mini" class="form-control input-sm" maxlength="255" aria-required="true" required>
|
<label for="{$label_attr.for}-mini">{intl l="Email address" d="hookcustomer.fo.default"}</label>
|
||||||
</div>
|
<input type="email" name="{$name}" id="{$label_attr.for}-mini" class="form-control input-sm" maxlength="255" aria-required="true" required>
|
||||||
{/form_field}
|
</div>
|
||||||
{form_field field="password"}
|
{/form_field}
|
||||||
<div class="form-group group-password">
|
{form_field field="password"}
|
||||||
<label for="{$label_attr.for}-mini">{intl l="Password" d="hookcustomer.fo.default"}</label>
|
<div class="form-group group-password">
|
||||||
<input type="password" name="{$name}" id="{$label_attr.for}-mini" class="form-control input-sm" maxlength="255" aria-required="true" required>
|
<label for="{$label_attr.for}-mini">{intl l="Password" d="hookcustomer.fo.default"}</label>
|
||||||
</div>
|
<input type="password" name="{$name}" id="{$label_attr.for}-mini" class="form-control input-sm" maxlength="255" aria-required="true" required>
|
||||||
{/form_field}
|
</div>
|
||||||
{form_field field="account"}
|
{/form_field}
|
||||||
<input type="hidden" name="{$name}" value="1">
|
{form_field field="account"}
|
||||||
{/form_field}
|
<input type="hidden" name="{$name}" value="1">
|
||||||
<div class="form-group group-btn">
|
{/form_field}
|
||||||
<button type="submit" class="btn btn-login-mini btn-sm btn-primary"><i class="fa fa-sign-in"></i> {intl l="Sign In" d="hookcustomer.fo.default"}</button>
|
<div class="form-group group-btn">
|
||||||
<a href="{url path="/register"}" class="btn btn-register-mini btn-default btn-sm"><i class="fa fa-user-plus"></i> {intl l="Register" d="hookcustomer.fo.default"}</a>
|
<button type="submit" class="btn btn-login-mini btn-sm btn-primary"><i class="fa fa-sign-in"></i> {intl l="Sign In" d="hookcustomer.fo.default"}</button>
|
||||||
</div>
|
<a href="{url path="/register"}" class="btn btn-register-mini btn-default btn-sm"><i class="fa fa-user-plus"></i> {intl l="Register" d="hookcustomer.fo.default"}</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
<a href="{url path="/password"}" class="mini-forgot-password">{intl l="Forgot your Password?" d="hookcustomer.fo.default"}</a>
|
<a href="{url path="/password"}" class="mini-forgot-password">{intl l="Forgot your Password?" d="hookcustomer.fo.default"}</a>
|
||||||
</form>
|
</form>
|
||||||
{/form}
|
{/form}
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
{/elseloop}
|
{/elseloop}
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
@@ -7,7 +7,7 @@
|
|||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
</button>
|
</button>
|
||||||
<a class="navbar-brand visible-xs-block visible-sm-block" href="{navigate to="index"}">{intl l="Categories" d="hooknavigation.fo.default"}</a>
|
<a class="navbar-brand visible-sm-block" href="{navigate to="index"}">{intl l="Categories" d="hooknavigation.fo.default"}</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="collapse navbar-collapse" id="navbar-primary">
|
<div class="collapse navbar-collapse" id="navbar-primary">
|
||||||
<ul class="nav navbar-nav navbar-categories">
|
<ul class="nav navbar-nav navbar-categories">
|
||||||
|
|||||||
@@ -1,9 +1,11 @@
|
|||||||
<div class="search-container navbar-form navbar-left">
|
<div class="custom-grid-one">
|
||||||
<form id="form-search" action="{url path="/search"}" method="get" role="search" aria-labelledby="search-label">
|
<div class="search-container navbar-form navbar-left">
|
||||||
<label id="search-label" class="sr-only" for="q">{intl l="Search a product" d="hooksearch.fo.default"}</label>
|
<form id="form-search" action="{url path="/search"}" method="get" role="search" aria-labelledby="search-label">
|
||||||
<i class="glyphicon glyphicon-search" id="search-button">
|
<label id="search-label" class="sr-only" for="q">{intl l="Search a product" d="hooksearch.fo.default"}</label>
|
||||||
<input type="search" name="q" id="q" placeholder="{intl l="Search..." d="hooksearch.fo.default"}" class="form-control" autocomplete="off" aria-required="true" required pattern=".{ldelim}2,{rdelim}" title="{intl l="Minimum 2 characters." d="hooksearch.fo.default"}">
|
<i class="glyphicon glyphicon-search" id="search-button-">
|
||||||
</i>
|
<input type="search" name="q" id="q" placeholder="{intl l="Search..." d="hooksearch.fo.default"}" class="form-control" autocomplete="off" aria-required="true" required pattern=".{ldelim}2,{rdelim}" title="{intl l="Minimum 2 characters." d="hooksearch.fo.default"}">
|
||||||
{* <button type="submit" class="btn btn-search"><i class="fa fa-search"></i> <span class="sr-only">{intl l="Search" d="hooksearch.fo.default"}</span></button> *}
|
</i>
|
||||||
</form>
|
<!-- <button type="submit" class="btn btn-search"><i class="fa fa-search"></i> <span class="sr-only">{intl l="Search" d="hooksearch.fo.default"}</span></button>-->
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
Reference in New Issue
Block a user