app/template/default/index.twig line 1

Open in your IDE?
  1. {#
  2. This file is part of EC-CUBE
  4. Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.
  6. http://www.ec-cube.co.jp/
  8. For the full copyright and license information, please view the LICENSE
  9. file that was distributed with this source code.
  10. #}
  11. {% extends 'default_frame.twig' %}
  13. {% set body_class = 'front_page' %}
  15. {% block stylesheet %}
  16.     <style>
  17.         .slick-slider {
  18.             margin-bottom: 30px;
  19.         }
  21.         .slick-dots {
  22.             position: absolute;
  23.             bottom: -45px;
  24.             display: block;
  25.             width: 100%;
  26.             padding: 0;
  27.             list-style: none;
  28.             text-align: center;
  29.         }
  31.         .slick-dots li {
  32.             position: relative;
  33.             display: inline-block;
  34.             width: 20px;
  35.             height: 20px;
  36.             margin: 0 5px;
  37.             padding: 0;
  39.             cursor: pointer;
  40.         }
  42.         .slick-dots li button {
  43.             font-size: 0;
  44.             line-height: 0;
  45.             display: block;
  46.             width: 20px;
  47.             height: 20px;
  48.             padding: 5px;
  49.             cursor: pointer;
  50.             color: transparent;
  51.             border: 0;
  52.             outline: none;
  53.             background: transparent;
  54.         }
  56.         .slick-dots li button:hover,
  57.         .slick-dots li button:focus {
  58.             outline: none;
  59.         }
  61.         .slick-dots li button:hover:before,
  62.         .slick-dots li button:focus:before {
  63.             opacity: 1;
  64.         }
  66.         .slick-dots li button:before {
  67.             content: " ";
  68.             line-height: 20px;
  69.             position: absolute;
  70.             top: 0;
  71.             left: 0;
  72.             width: 12px;
  73.             height: 12px;
  74.             text-align: center;
  75.             opacity: .25;
  76.             background-color: black;
  77.             border-radius: 50%;
  79.         }
  81.         .slick-dots li.slick-active button:before {
  82.             opacity: .75;
  83.             background-color: black;
  84.         }
  86.         .slick-dots li button.thumbnail img {
  87.             width: 0;
  88.             height: 0;
  89.         }
  90.     </style>
  91. {% endblock %}
  93. {% block javascript %}
  94.     <script>
  95.         $(function() {
  96.             $('.main_visual').slick({
  97.                 dots: true,
  98.                 arrows: false,
  99.                 autoplay: true,
  100.                 speed: 300
  101.             });
  102.         });
  103.     </script>
  104. {% endblock javascript %}
  106. {% block main %}
  111. <!-- ▼main ================================================== -->
  112. <main id="content">
  115.     <div id="keyvisual">
  116.         <p class="home-keyvisual01">
  117.             <img src="assets/img/home/keyvisual_01_01_s.jpg" alt="小ロット生産 実験用生産 タブレットを1錠から打錠。" class="visible-ss">
  118.             <img src="assets/img/home/keyvisual_01_m.jpg" alt="小ロット生産 実験用生産 タブレットを1錠から打錠。" class="hidden-ss uk-hidden-large">
  119.             <img src="assets/img/home/keyvisual_01.jpg" alt="小ロット生産 実験用生産 タブレットを1錠から打錠。" class="uk-visible-large">
  120.         </p>
  121.         <p class="home-keyvisual02 visible-ss"><img src="assets/img/home/keyvisual_01_02_s.png" alt="小ロット生産 実験用生産 タブレットを1錠から打錠。"></p>
  122.     </div><!-- /#keyvisual -->
  124.     <section id="home-01">
  125.         <h1 class="page-tit-01">オンラインショップをご利用のお客様へ<small class="note">ATTENTION</small></h1>
  126.         <div class="uk-container uk-text-center">
  127.             <p>打錠機用の打錠金型杵・臼をご購入頂く場合、会員登録をしていただく必要がございます。<br class="uk-hidden-small">会員登録がお済みのお客様はログイン後に商品の選択・ご購入が可能です。</p>
  128.         </div>
  129.     </section><!-- /#home-01 -->
  131.     <section class="login-page-01">
  132.         <h1 class="page-tit-01">ログイン<small class="note">LOGIN</small></h1>
  133.         <div class="uk-container">
  134.             <div class="com-sec-01">
  135.                 <div class="uk-grid com-grid-40 uk-grid-width-large-1-2 data-uk-grid-match" data-uk-grid-margin="" data-uk-grid-match="{target:'.js-height'}">
  137.                     <div id="login-page-01" class="mb40">
  138.                         <h2 class="contact-tit-01 js-height uk-flex uk-flex-middle uk-flex-center">会員登録がお済みの方</h2>
  139.                         <p class="mb15">会員の方は、登録時に入力されたメールアドレスとパスワードでログインしてください。</p>
  141.             <form name="login_mypage" id="login_mypage" method="post" action="{{ url('mypage_login') }}">
  142.                         <div class="contact-panel-01 mb20 pt40">
  144.                             <dl class="login-panel-01">
  145.                                 <dt class="catch">メールアドレス</dt>
  146.                                 <dd class="more">
  147.                 <input type="email" id="login_email" name="login_email" required="required" maxlength="255" style="ime-mode: disabled;" placeholder="メールアドレス" class="form-control"></dd>
  148.                             </dl>
  151.                             <dl class="login-panel-01">
  152.                                 <dt class="catch">パスワード</dt>
  153.                                 <dd class="more"><input type="password" id="login_pass" name="login_pass" required="required" maxlength="255" placeholder="パスワード" class="form-control"></dd>
  154.                             </dl>
  156.               <button type="submit" class="form-btn-02 submit button-01 mt25">{{ 'ログイン'|trans }}</button>
  157.                         </div>
  158.             <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
  159.             </form>
  161.                         <p>※パスワードを忘れた方は<a class="ec-link" href="{{ url('forgot') }}"><span class="color-red">こちら</span></a>からパスワードの再発行を行ってください。<br>
  162.             ※メールアドレスを忘れた方は、お手数ですが、<a class="ec-link" href="{{ url('contact') }}"><span class="color-red">お問い合わせページ</span></a>からお問い合わせください。</p>
  163.                     </div><!-- /#contact-02 -->
  165.                     <div id="login-page-02" class="contact-blu mt0 mb40">
  166.                         <h2 class="contact-tit-01 js-height uk-flex uk-flex-middle uk-flex-center" >新規会員登録</h2>
  167.                         <p class="mb15 pl15">会員登録をすると便利なMyページをご利用いただけます。２</p>
  168.                         <div class="contact-panel-01 mb20 pt40">
  169.                             <a href="{{ url('entry') }}" class="form-btn-02 submit button-02">{{ '新規会員登録'|trans }}</a>
  170.                         </div>
  171.                         <p>※お見積り・ご注文等のご利用は会員登録が必要となります。</p>
  172.                     </div><!-- /#contact-03 -->
  174.                 </div><!-- /.uk-grid -->
  175.             </div>
  176.         </div>
  177.     </section>
  179. </main><!-- /#main -->
  181. {% endblock %}