<?php
use Twig\Environment;
use Twig\Error\LoaderError;
use Twig\Error\RuntimeError;
use Twig\Extension\SandboxExtension;
use Twig\Markup;
use Twig\Sandbox\SecurityError;
use Twig\Sandbox\SecurityNotAllowedTagError;
use Twig\Sandbox\SecurityNotAllowedFilterError;
use Twig\Sandbox\SecurityNotAllowedFunctionError;
use Twig\Source;
use Twig\Template;
/* Block/header.twig */
class __TwigTemplate_c45911b33fdd98256b0f8be8deda470fa2720c2a65cb1fe97333196a9be2789b extends \Eccube\Twig\Template
{
private $source;
private $macros = [];
public function __construct(Environment $env)
{
parent::__construct($env);
$this->source = $this->getSourceContext();
$this->parent = false;
$this->blocks = [
'stylesheet' => [$this, 'block_stylesheet'],
'javascript' => [$this, 'block_javascript'],
];
}
protected function doDisplay(array $context, array $blocks = [])
{
$macros = $this->macros;
$__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
$__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->enter($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "Block/header.twig"));
$__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02 = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
$__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->enter($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "Block/header.twig"));
// line 1
echo "<header class=\"l-header\">
<div class=\"l-header__conteiner\">
<h1 class=\"l-header__logo\">
<a href=\"https://xb579178.xbiz.jp/test-ec-05/\"><img src=\"";
// line 4
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-05/html/user_data/assets/img/common/moo-side-log.svg"), "html", null, true);
echo "\" alt=\"肉の再生工房〜moo side〜\"></a>
</h1>
";
// line 8
echo " ";
// line 9
echo " ";
// line 10
echo " ";
// line 11
echo "
<!-- ハンバーガーメニュー -->
<div class=\"l-header__search__image\" id=\"searchopen2\">
<img src=\"";
// line 14
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-05/html/user_data/assets/img/common/glass_wh.webp"), "html", null, true);
echo "\" alt=\"\">
</div>
<div class=\"form__area2\" id=\"attrin2\">
";
// line 17
echo $this->env->getRuntime('Symfony\Bridge\Twig\Extension\HttpKernelRuntime')->renderFragment($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("block_search_product"));
echo "
</div>
<div id=\"hamburger\" class=\"l-header__hamburger\">
<span class=\"l-header__hamburger__line\" id=\"top\"></span>
<span class=\"l-header__hamburger__line\" id=\"center\"></span>
<span class=\"l-header__hamburger__line\" id=\"bottom\"></span>
</div>
<nav class=\"l-header__top__hamburger__nav\" id=\"nav\">
<h3 class=\"l-header__top__hamburger__nav__title\">会員メニュー</h3>
<ul class=\"l-header__top__hamburger__nav__lists\">
";
// line 29
if ($this->extensions['Symfony\Bridge\Twig\Extension\SecurityExtension']->isGranted("ROLE_USER")) {
// line 30
echo " <li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"";
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("mypage");
echo "\"><p class=\"l-header__top__nav__lists__item__undertext\">マイページ</p></a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"";
// line 31
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("logout");
echo "\"><p class=\"l-header__top__nav__lists__item__undertext\">ログアウト</p></a></li>
";
} else {
// line 33
echo " <li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"";
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("entry");
echo "\"><p class=\"l-header__top__nav__lists__item__undertext\">新規登録</p></a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"";
// line 34
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("mypage_login");
echo "\"><p class=\"l-header__top__nav__lists__item__undertext\">ログイン</p></a></li>
";
}
// line 36
echo " <li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"";
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("cart");
echo "\">カート</a></li>
</ul>
<h3 class=\"l-header__top__hamburger__nav__title\">メニュー</h3>
<ul class=\"l-header__top__hamburger__nav__lists\">
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"";
// line 41
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("homepage");
echo "\">TOP</a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"";
// line 42
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("homepage");
echo "#recommend\">おすすめ商品</a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"";
// line 43
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("homepage");
echo "#popular\">人気商品</a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"";
// line 44
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("product_list");
echo "\">商品一覧</a></li>
</ul>
</nav>
<nav class=\"l-header__top__nav\">
<ul class=\"l-header__top__nav__lists\">
<li id=\"searchopen\" class=\"l-header__top__nav__lists__item\"><a class=\"nolink1\"><img src=\"";
// line 51
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-04/html/user_data/assets/img/common/glass.webp"), "html", null, true);
echo "\" height=\"40\" width=\"45\" alt=\"検索\"><p class=\"l-header__top__nav__lists__item__undertext\">検索</p></a></li>
<div class=\"form__area\" id=\"attrin\">
";
// line 53
echo $this->env->getRuntime('Symfony\Bridge\Twig\Extension\HttpKernelRuntime')->renderFragment($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("block_search_product"));
echo "
<img id=\"closebtn\" class=\"closebtn\" src=\"";
// line 54
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-04/html/user_data/assets/img/common/x.webp"), "html", null, true);
echo "\">
</div>
<li class=\"l-header__top__nav__lists__item\"><a href=\"";
// line 56
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("mypage_favorite");
echo "\"><img src=\"";
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-04/html/user_data/assets/img/common/ha-to.webp"), "html", null, true);
echo "\" height=\"40\" width=\"45\" alt=\"お気に入り\"><p class=\"l-header__top__nav__lists__item__undertext\">お気に入り</p></a></li>
";
// line 57
if ($this->extensions['Symfony\Bridge\Twig\Extension\SecurityExtension']->isGranted("ROLE_USER")) {
// line 58
echo " <li class=\"l-header__top__nav__lists__item\"><a href=\"";
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("mypage");
echo "\"><img src=\"";
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-05/html/user_data/assets/img/common/cow.webp"), "html", null, true);
echo "\" height=\"30\" width=\"60\" alt=\"マイページ\"><p class=\"l-header__top__nav__lists__item__undertext\">マイページ</p></a></li>
<li class=\"l-header__top__nav__lists__item\"><a href=\"";
// line 59
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("logout");
echo "\"><img src=\"";
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-05/html/user_data/assets/img/common/cow.webp"), "html", null, true);
echo "\" height=\"30\" width=\"60\" alt=\"ログアウト\"><p class=\"l-header__top__nav__lists__item__undertext\">ログアウト</p></a></li>
";
} else {
// line 61
echo " <li class=\"l-header__top__nav__lists__item\"><a href=\"";
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("entry");
echo "\"><img src=\"";
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-05/html/user_data/assets/img/common/cow.webp"), "html", null, true);
echo "\" height=\"30\" width=\"60\" alt=\"新規登録\"><p class=\"l-header__top__nav__lists__item__undertext\">新規登録</p></a></li>
<li class=\"l-header__top__nav__lists__item\"><a href=\"";
// line 62
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("mypage_login");
echo "\"><img src=\"";
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-05/html/user_data/assets/img/common/cow.webp"), "html", null, true);
echo "\" height=\"30\" width=\"60\" alt=\"ログイン\"><p class=\"l-header__top__nav__lists__item__undertext\">ログイン</p></a></li>
";
}
// line 64
echo " <li class=\"l-header__top__nav__lists__item\"><a href=\"";
echo $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getUrl("cart");
echo "\"><img src=\"";
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-05/html/user_data/assets/img/common/cart.webp"), "html", null, true);
echo "\" height=\"60\" width=\"50\" alt=\"カート\"><p class=\"l-header__top__nav__lists__item__undertext\">カート</p></a></li>
</ul>
</nav>
</div>
</header>
<div class=\"l-header__logo display\">
<a href=\"https://xb579178.xbiz.jp/test-ec-05/\"><img src=\"";
// line 71
echo twig_escape_filter($this->env, $this->extensions['Symfony\Bridge\Twig\Extension\AssetExtension']->getAssetUrl("/test-ec-05/html/user_data/assets/img/common/moo-side-log.svg"), "html", null, true);
echo "\" alt=\"肉の再生工房〜moo side〜\"></a>
</div>
";
// line 74
$this->displayBlock('stylesheet', $context, $blocks);
// line 261
echo "
";
// line 262
$this->displayBlock('javascript', $context, $blocks);
$__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->leave($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof);
$__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->leave($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof);
}
// line 74
public function block_stylesheet($context, array $blocks = [])
{
$macros = $this->macros;
$__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
$__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->enter($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "stylesheet"));
$__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02 = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
$__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->enter($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "stylesheet"));
// line 75
echo " <style>
html {
overflow-x: hidden;
}
.l-header {
height: 105px;
}
.l-header__search {
display: none;
}
.l-header__logo.display {
display: none;
}
@media screen and (max-width: 1024px) {
.l-header {
background-color: rgba(0, 0 , 0, 0);
}
.l-header__logo {
display: none;
}
.l-header__logo.display {
display: block;
position: absolute;
top: 10px;
left: 15px;
}
.l-header__search {
display: block;
}
.l-header__search__image {
width: 60px;
background-color: #B72C11;
padding: 14px 10px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 17px;
right: 90px;
}
.l-header__search__image img {
width: 30px;
}
.l-header__search__area {
position: absolute;
top: 75px;
left: 50%;
transform: translateX(-50%);
height: 60px;
width: max(100vw, 500px);
background-color: #333;
}
}
.l-header__search {
display: block;
}
.l-header__search__image {
display: none;
}
.l-header__search__image img {
width: 30px;
}
.l-header__search__area {
position: absolute;
top: -100%;
left: 50%;
transform: translateX(-50%);
height: 60px;
width: max(100vw, 500px);
background-color: #333;
transition: top 0.5s;
}
.l-header__search__area.in {
top: 75px;
}
.form__area {
position: fixed;
top: -100%;
left: 0;
height: 100vh;
width: 100vw;
display: flex;
justify-content: space-evenly;
align-items: flex-start;
background-color: rgba(0, 0, 0, 0.5);
z-index: 999;
transition: top 0.5s;
}
.form__area .form__area__searchform {
display: flex;
align-items: center;
margin-top: 20px;
}
.form__area .form__category select{
padding: 5px;
width: 30vw;
height: 60px;
background-color: #eacac4;
outline: none;
}
.form__area .form__keyword {
display: flex;
}
.form__area .form__keyword input {
width: 30vw;
height: 60px;
outline: none;
}
.form__area .form__keyword__btn {
background-color: #eacac4;
}
.form__area .form__keyword__btn__img img {
width: 35px;
}
.form__area .closebtn {
width: 50px;
height: 50px;
margin-top: 25px;
}
.form__area.in {
top: 0;
}
.form__area2 {
position: fixed;
top: 75px;
left: 100%;
height: 45px;
width: 100vw;
display: flex;
justify-content: space-evenly;
align-items: flex-start;
background-color: rgba(0, 0, 0, 0.5);
z-index: 999;
transition: left 0.5s;
}
.form__area2 .form__area__searchform {
display: flex;
align-items: center;
}
.form__area2 .form__category select{
padding: 5px;
width: 34.5vw;
height: 45px;
background-color: #eacac4;
border: none;
}
.form__area2 .form__keyword {
display: flex;
}
.form__area2 .form__keyword input {
width: 54.5vw;
height: 45px;
border: none;
}
.form__area2 .form__keyword__btn {
background-color: #eacac4;
width: 11vw;
border: none;
}
.form__area2 .form__keyword__btn__img img {
width: 30px;
}
.form__area2.in {
transform: unset;
left: 0;
}
@media screen and (max-width:1024px) {
.l-header__search__image {
width: 60px;
background-color: #B72C11;
padding: 14px 10px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 17px;
right: 90px;
z-index: 999;
}
}
</style>
";
$__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->leave($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof);
$__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->leave($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof);
}
// line 262
public function block_javascript($context, array $blocks = [])
{
$macros = $this->macros;
$__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
$__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->enter($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "javascript"));
$__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02 = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
$__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->enter($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "javascript"));
// line 263
echo "<script>
// PC用ヘッダーの検索機能実装
const open = document.getElementById('searchopen');
const close = document.getElementById('closebtn');
const attrin = document.getElementById('attrin');
// 虫眼鏡をクリックで表示
open.addEventListener('click', function(){
attrin.classList.add('in');
});
// ×をクリックで非表示
close.addEventListener('click', function(){
attrin.classList.remove('in');
});
// 要素外をクリックで非表示
addEventListener('click', outsideClose);
function outsideClose(e) {
if (e.target == attrin) {
attrin.classList.remove('in');
}
}
// SP、TB用ヘッダーの検索機能実装
const open2 = document.getElementById('searchopen2');
// 虫眼鏡をクリックで表示,非表示切替
open2.addEventListener('click', function(){
attrin2.classList.toggle('in');
});
</script>
";
$__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02->leave($__internal_319393461309892924ff6e74d6d6e64287df64b63545b994e100d4ab223aed02_prof);
$__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e->leave($__internal_085b0142806202599c7fe3b329164a92397d8978207a37e79d70b8c52599e33e_prof);
}
public function getTemplateName()
{
return "Block/header.twig";
}
public function isTraitable()
{
return false;
}
public function getDebugInfo()
{
return array ( 440 => 263, 430 => 262, 235 => 75, 225 => 74, 215 => 262, 212 => 261, 210 => 74, 204 => 71, 191 => 64, 184 => 62, 177 => 61, 170 => 59, 163 => 58, 161 => 57, 155 => 56, 150 => 54, 146 => 53, 141 => 51, 131 => 44, 127 => 43, 123 => 42, 119 => 41, 110 => 36, 105 => 34, 100 => 33, 95 => 31, 90 => 30, 88 => 29, 73 => 17, 67 => 14, 62 => 11, 60 => 10, 58 => 9, 56 => 8, 50 => 4, 45 => 1,);
}
public function getSourceContext()
{
return new Source("<header class=\"l-header\">
<div class=\"l-header__conteiner\">
<h1 class=\"l-header__logo\">
<a href=\"https://xb579178.xbiz.jp/test-ec-05/\"><img src=\"{{asset ('/test-ec-05/html/user_data/assets/img/common/moo-side-log.svg')}}\" alt=\"肉の再生工房〜moo side〜\"></a>
</h1>
{#<div class=\"l-header__tel\">#}
{# <p class=\"l-header__tel__text\">お電話でのお問い合わせはこちらから</p>#}
{# <a class=\"l-header__tel__number\" href=\"tel:0312345678\">TEL:0120-123-4567</a>#}
{#</div>#}
<!-- ハンバーガーメニュー -->
<div class=\"l-header__search__image\" id=\"searchopen2\">
<img src=\"{{asset ('/test-ec-05/html/user_data/assets/img/common/glass_wh.webp')}}\" alt=\"\">
</div>
<div class=\"form__area2\" id=\"attrin2\">
{{ render(path('block_search_product')) }}
</div>
<div id=\"hamburger\" class=\"l-header__hamburger\">
<span class=\"l-header__hamburger__line\" id=\"top\"></span>
<span class=\"l-header__hamburger__line\" id=\"center\"></span>
<span class=\"l-header__hamburger__line\" id=\"bottom\"></span>
</div>
<nav class=\"l-header__top__hamburger__nav\" id=\"nav\">
<h3 class=\"l-header__top__hamburger__nav__title\">会員メニュー</h3>
<ul class=\"l-header__top__hamburger__nav__lists\">
{% if is_granted('ROLE_USER') %}
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"{{url('mypage')}}\"><p class=\"l-header__top__nav__lists__item__undertext\">マイページ</p></a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"{{url('logout')}}\"><p class=\"l-header__top__nav__lists__item__undertext\">ログアウト</p></a></li>
{% else %}
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"{{url('entry')}}\"><p class=\"l-header__top__nav__lists__item__undertext\">新規登録</p></a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"{{url('mypage_login')}}\"><p class=\"l-header__top__nav__lists__item__undertext\">ログイン</p></a></li>
{% endif %}
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"{{url('cart')}}\">カート</a></li>
</ul>
<h3 class=\"l-header__top__hamburger__nav__title\">メニュー</h3>
<ul class=\"l-header__top__hamburger__nav__lists\">
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"{{ url('homepage') }}\">TOP</a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"{{ url('homepage') }}#recommend\">おすすめ商品</a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"{{ url('homepage') }}#popular\">人気商品</a></li>
<li class=\"l-header__top__hamburger__nav__lists__item\"><a href=\"{{ url('product_list') }}\">商品一覧</a></li>
</ul>
</nav>
<nav class=\"l-header__top__nav\">
<ul class=\"l-header__top__nav__lists\">
<li id=\"searchopen\" class=\"l-header__top__nav__lists__item\"><a class=\"nolink1\"><img src=\"{{asset ('/test-ec-04/html/user_data/assets/img/common/glass.webp')}}\" height=\"40\" width=\"45\" alt=\"検索\"><p class=\"l-header__top__nav__lists__item__undertext\">検索</p></a></li>
<div class=\"form__area\" id=\"attrin\">
{{ render(path('block_search_product')) }}
<img id=\"closebtn\" class=\"closebtn\" src=\"{{ asset('/test-ec-04/html/user_data/assets/img/common/x.webp') }}\">
</div>
<li class=\"l-header__top__nav__lists__item\"><a href=\"{{ url('mypage_favorite') }}\"><img src=\"{{asset ('/test-ec-04/html/user_data/assets/img/common/ha-to.webp')}}\" height=\"40\" width=\"45\" alt=\"お気に入り\"><p class=\"l-header__top__nav__lists__item__undertext\">お気に入り</p></a></li>
{% if is_granted('ROLE_USER') %}
<li class=\"l-header__top__nav__lists__item\"><a href=\"{{url('mypage')}}\"><img src=\"{{asset ('/test-ec-05/html/user_data/assets/img/common/cow.webp')}}\" height=\"30\" width=\"60\" alt=\"マイページ\"><p class=\"l-header__top__nav__lists__item__undertext\">マイページ</p></a></li>
<li class=\"l-header__top__nav__lists__item\"><a href=\"{{url('logout')}}\"><img src=\"{{asset ('/test-ec-05/html/user_data/assets/img/common/cow.webp')}}\" height=\"30\" width=\"60\" alt=\"ログアウト\"><p class=\"l-header__top__nav__lists__item__undertext\">ログアウト</p></a></li>
{% else %}
<li class=\"l-header__top__nav__lists__item\"><a href=\"{{url('entry')}}\"><img src=\"{{asset ('/test-ec-05/html/user_data/assets/img/common/cow.webp')}}\" height=\"30\" width=\"60\" alt=\"新規登録\"><p class=\"l-header__top__nav__lists__item__undertext\">新規登録</p></a></li>
<li class=\"l-header__top__nav__lists__item\"><a href=\"{{url('mypage_login')}}\"><img src=\"{{asset ('/test-ec-05/html/user_data/assets/img/common/cow.webp')}}\" height=\"30\" width=\"60\" alt=\"ログイン\"><p class=\"l-header__top__nav__lists__item__undertext\">ログイン</p></a></li>
{% endif %}
<li class=\"l-header__top__nav__lists__item\"><a href=\"{{url('cart')}}\"><img src=\"{{asset ('/test-ec-05/html/user_data/assets/img/common/cart.webp')}}\" height=\"60\" width=\"50\" alt=\"カート\"><p class=\"l-header__top__nav__lists__item__undertext\">カート</p></a></li>
</ul>
</nav>
</div>
</header>
<div class=\"l-header__logo display\">
<a href=\"https://xb579178.xbiz.jp/test-ec-05/\"><img src=\"{{asset ('/test-ec-05/html/user_data/assets/img/common/moo-side-log.svg')}}\" alt=\"肉の再生工房〜moo side〜\"></a>
</div>
{% block stylesheet %}
<style>
html {
overflow-x: hidden;
}
.l-header {
height: 105px;
}
.l-header__search {
display: none;
}
.l-header__logo.display {
display: none;
}
@media screen and (max-width: 1024px) {
.l-header {
background-color: rgba(0, 0 , 0, 0);
}
.l-header__logo {
display: none;
}
.l-header__logo.display {
display: block;
position: absolute;
top: 10px;
left: 15px;
}
.l-header__search {
display: block;
}
.l-header__search__image {
width: 60px;
background-color: #B72C11;
padding: 14px 10px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 17px;
right: 90px;
}
.l-header__search__image img {
width: 30px;
}
.l-header__search__area {
position: absolute;
top: 75px;
left: 50%;
transform: translateX(-50%);
height: 60px;
width: max(100vw, 500px);
background-color: #333;
}
}
.l-header__search {
display: block;
}
.l-header__search__image {
display: none;
}
.l-header__search__image img {
width: 30px;
}
.l-header__search__area {
position: absolute;
top: -100%;
left: 50%;
transform: translateX(-50%);
height: 60px;
width: max(100vw, 500px);
background-color: #333;
transition: top 0.5s;
}
.l-header__search__area.in {
top: 75px;
}
.form__area {
position: fixed;
top: -100%;
left: 0;
height: 100vh;
width: 100vw;
display: flex;
justify-content: space-evenly;
align-items: flex-start;
background-color: rgba(0, 0, 0, 0.5);
z-index: 999;
transition: top 0.5s;
}
.form__area .form__area__searchform {
display: flex;
align-items: center;
margin-top: 20px;
}
.form__area .form__category select{
padding: 5px;
width: 30vw;
height: 60px;
background-color: #eacac4;
outline: none;
}
.form__area .form__keyword {
display: flex;
}
.form__area .form__keyword input {
width: 30vw;
height: 60px;
outline: none;
}
.form__area .form__keyword__btn {
background-color: #eacac4;
}
.form__area .form__keyword__btn__img img {
width: 35px;
}
.form__area .closebtn {
width: 50px;
height: 50px;
margin-top: 25px;
}
.form__area.in {
top: 0;
}
.form__area2 {
position: fixed;
top: 75px;
left: 100%;
height: 45px;
width: 100vw;
display: flex;
justify-content: space-evenly;
align-items: flex-start;
background-color: rgba(0, 0, 0, 0.5);
z-index: 999;
transition: left 0.5s;
}
.form__area2 .form__area__searchform {
display: flex;
align-items: center;
}
.form__area2 .form__category select{
padding: 5px;
width: 34.5vw;
height: 45px;
background-color: #eacac4;
border: none;
}
.form__area2 .form__keyword {
display: flex;
}
.form__area2 .form__keyword input {
width: 54.5vw;
height: 45px;
border: none;
}
.form__area2 .form__keyword__btn {
background-color: #eacac4;
width: 11vw;
border: none;
}
.form__area2 .form__keyword__btn__img img {
width: 30px;
}
.form__area2.in {
transform: unset;
left: 0;
}
@media screen and (max-width:1024px) {
.l-header__search__image {
width: 60px;
background-color: #B72C11;
padding: 14px 10px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 17px;
right: 90px;
z-index: 999;
}
}
</style>
{% endblock %}
{% block javascript %}
<script>
// PC用ヘッダーの検索機能実装
const open = document.getElementById('searchopen');
const close = document.getElementById('closebtn');
const attrin = document.getElementById('attrin');
// 虫眼鏡をクリックで表示
open.addEventListener('click', function(){
attrin.classList.add('in');
});
// ×をクリックで非表示
close.addEventListener('click', function(){
attrin.classList.remove('in');
});
// 要素外をクリックで非表示
addEventListener('click', outsideClose);
function outsideClose(e) {
if (e.target == attrin) {
attrin.classList.remove('in');
}
}
// SP、TB用ヘッダーの検索機能実装
const open2 = document.getElementById('searchopen2');
// 虫眼鏡をクリックで表示,非表示切替
open2.addEventListener('click', function(){
attrin2.classList.toggle('in');
});
</script>
{% endblock %}", "Block/header.twig", "/home/xb579178/xb579178.xbiz.jp/public_html/test-ec-05/app/template/default/Block/header.twig");
}
}