templates/Main/index.html.twig line 1

Open in your IDE?
  1.  {% extends 'base.html.twig' %}
  2.  {% set page = "index" %}
  3.  {% block stylesheets %}
  4.      {{ parent() }}
  5.      <style>
  6.          .iconactive{
  7.              color:#007176;
  8.          }
  9.          .iconInline{
  10.              display:inline-block;
  11.          }
  12.          .kode_top_logo_wrap{
  13.             background-image:url("{{asset('images/top_bg.png')|imagine_filter('sharer')}}");
  14.             background-position:center;
  15.             background-repeat:no-repeat;
  16.             background-size:cover;
  17.             padding:25px 0px;
  18.         }
  19.         .kode_pillars_wrap{
  20.     background-image:url("{{asset('images/piller.webp')|imagine_filter('sharer')}}");
  21.     background-position:center;
  22.     background-repeat:no-repeat;
  23.     background-size:cover;
  24.     padding:80px 0px 0px 0px;
  25. }
  26.      </style>
  27.      <link href="{{asset('css/sidebar-widget.css')}}" rel="stylesheet">
  28.  {% endblock %}
  29.  {% block headplus %}
  30.      <!-- Open Graph / Facebook -->
  31.     <meta property="og:type" content="website">
  32.     <meta property="og:url" content="https://sharjah-masjids.com/{{app.request.locale}}/">
  33.     <meta property="og:title" content="As salam aleykum! ">
  34.     <meta property="og:description" content="{{'presentationText'|trans}}">
  35.     <meta property="og:image" content="https://sharjah-masjids.com/uploads/masjids/20210424_235022.webp">
  37.     <!-- Twitter -->
  38.     <meta property="twitter:card" content="summary_large_image">
  39.     <meta property="twitter:url" content="https://sharjah-masjids.com/{{app.request.locale}}/">
  40.     <meta property="twitter:title" content="As salam aleykum!">
  41.     <meta property="twitter:description" content="{{'presentationText'|trans}}">
  42.     <meta property="twitter:image" content="https://sharjah-masjids.com/uploads/masjids/20210424_235022.webp">
  44. {% endblock %}
  45.  {% block body %}
  46.     <!--KODE BANNER WRAP START-->
  47.     <div class="kode_banner_wrap">
  48.         <ul class="bxslider">
  50.             <li>
  51.                 <figure class="them_overlay">
  52.                     <img src="{{asset ('uploads/masjids/20210424_235022.webp')|imagine_filter("sharer") }}"  width="1730px" height="719px" alt="masjid noor Sharjah">
  53.                     <div class="kode_banner_text">
  54.                         <div class="large_text">{{'main.slide.title'|trans}}</div>
  55.                         <div class="mediume_text"><span>{{'main.slide.slogan'|trans}}</span></div>
  56.                         <!--<div class="small_text">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words...</div>
  57.                         <div class="koed_banner_btn">
  58.                             <a class="medium_btn border margin-right-1 btn_hover" href="{{ path('masjid_index') }}">{{ 'about.masjid.readmore'|trans }}</a>
  59.                             <a class="medium_btn border btn_hover" href="{{ path('app_main_contact') }}">{{'contact.title'|trans }}</a>
  60.                         </div>-->
  61.                     </div>
  62.                 </figure>
  63.             </li>
  65.         </ul>
  66.         <!--        <div id="bx-pager" class="pager_link">
  67.             <a data-slide-index="0" href=""><img src="{{ asset('extra-images/banner.jpg') }}" alt="banner" /></a>
  68.             <a data-slide-index="1" href=""><img src="{{ asset('extra-images/banner1.jpg') }}" alt="banner" /></a>
  69.             <a data-slide-index="2" href=""><img src="{{ asset('extra-images/banner2.jpg') }}" alt="banner" /></a>
  70.         </div>-->
  71.     </div>
  72.     <!--KODE BANNER WRAP END-->
  73.     <!--KODE MOSQUES WRAP STRAT-->
  74.     <div class="kode_mosques_wrap">
  75.         <!--CONTAINER STRAT-->
  76.         <div class="container">
  77.             <!--ROW STRAT-->
  78.             <div class="row">
  79.                 {{ render(controller("App\\Controller\\Front\\MainController::aboutFragment") )}}
  80.             </div>
  81.             <!--ROW END-->
  82.         </div>
  83.         <!--CONTAINER END-->
  84.     </div>
  85.     <!--KODE MOSQUES WRAP END-->
  86.     <!--KODE PILLARS WRAP START-->
  87.     <div class="kode_pillars_wrap them_overlay">
  88.         <!--CONTAINER START-->
  89.         <div class="container">
  90.             <!--SECTION HDG START-->
  91.             <div class="section_hdg hdg_2">
  92.                 <a href="#"><img src="{{asset ('images/hdg-img-2.png')}}" alt="hdg"></a>
  93.                 <h3>{{ 'masjid.show.info'|trans }}</h3>
  94.                 <span><i class="fa icon-art"></i></span>
  95.             </div>
  96.             <!--SECTION HDG END-->
  97.             <div class="kode_pillars_row">
  98.                 <div class="panel panel-default">
  99.                     <div class="panel-heading">
  100.                         <ul class="nav nav-tabs kode_pillars_item">
  101.                             <li><a class="left_bottom hvr-ripple-out" href="#tab" data-toggle="tab"><span><i class="fa fa-female"></i></span><h6>{{ 'main.infos.lady'|trans }}</h6></a></li>
  102.                             <li><a class="left_center hvr-ripple-out" href="#tab1" data-toggle="tab"><span><i class="fa fa-map-marker"></i></span><h6>{{ 'main.infos.community'|trans }}</h6></a></li>
  103.                             <li><a class="center hvr-ripple-out" href="#tab2" data-toggle="tab"><span><i class="fa icon-art"></i></span><h6>{{ 'main.infos.jumu3a'|trans }}</h6></a></li>
  104.                             <li><a class="right_center hvr-ripple-out" href="#tab3" data-toggle="tab"><span><i class="fa icon-buildings"></i></span><h6>{{ 'main.infos.style'|trans }}</h6></a></li>
  105.                             <li><a class="right_bottom hvr-ripple-out" href="#tab4" data-toggle="tab"><span><i class="fa fa-language"></i></span><h6>{{ 'main.infos.english'|trans }}</h6></a></li>
  106.                         </ul>
  107.                     </div>
  108.                     <div class="panel-body">
  109.                         <div class="tab-content">
  110.                             <div class="tab-pane fade in active" id="tab">
  111.                                 <div class="kode_pillars_text">
  112.                                     <span><i class="fa fa-female"></i></span>
  113.                                     <h4>{{ 'main.infos.lady'|trans }}</h4>
  114.                                     <p>{{ 'main.infos.ladyText'|trans }}</p>
  115.                                 </div>
  116.                             </div>
  117.                             <div class="tab-pane fade in" id="tab1">
  118.                                 <div class="kode_pillars_text">
  119.                                     <span><i class="fa fa-map-marker"></i></span>
  120.                                     <h4>{{ 'main.infos.community'|trans }}</h4>
  121.                                     <p>{{ 'main.infos.communityText'|trans }}</p>
  122.                                 </div>
  123.                             </div>
  124.                             <div class="tab-pane fade in" id="tab2">
  125.                                 <div class="kode_pillars_text">
  126.                                     <span><i class="fa icon-art"></i></span>
  127.                                     <h4>{{ 'main.infos.jumu3a'|trans }}</h4>
  128.                                     <p>{{ 'main.infos.jumu3aText'|trans }}</p>
  129.                                 </div>
  130.                             </div>
  131.                             <div class="tab-pane fade in" id="tab3">
  132.                                 <div class="kode_pillars_text">
  133.                                     <span><i class="fa icon-buildings"></i></span>
  134.                                     <h4>{{ 'main.infos.style'|trans }}</h4>
  135.                                     <p>{{ 'main.infos.styleText'|trans }}</p>
  136.                                 </div>
  137.                             </div>
  138.                             <div class="tab-pane fade in" id="tab4">
  139.                                 <div class="kode_pillars_text">
  140.                                     <span><i class="fa fa-language"></i></span>
  141.                                     <h4>{{ 'main.infos.english'|trans }}</h4>
  142.                                     <p>{{ 'main.infos.englishText'|trans }}</p>
  143.                                 </div>
  144.                             </div>
  145.                         </div>
  146.                     </div>
  147.                 </div>
  148.             </div>
  149.         </div>
  150.         <!--CONTAINER END-->
  151.     </div>
  152.     <!--KODE PILLARS WRAP END-->
  153.     <!--KODE PRAY WRAP START-->
  154.     <div class="kode_pray_wrap them_overlay">
  155.         <!--CONTAINER START-->
  156.         <div class="container">
  157.             <div class="row">
  158.                 <div class="col-md-7">
  159.                     <div class="kode_pray_text">
  160.                         <h2>{{ 'sidebar.community.browse'|trans }}</h2>
  161.                         <h5>{{ 'main.community.slogan'|trans }}</h5>
  162.                         <p></p>
  163.                         <div class="kode_pray_btn">
  164.                             <a class="small_btn background-bg-dark margin-right btn_hover" href="{{ path('community_index') }}">{{ 'about.masjid.readmore'|trans }}</a>
  165.                             <a class="small_btn background-bg-dark margin-right btn_hover" href="{{ path('app_main_contact') }}">{{ 'contact.title'|trans }}</a>
  166.                         </div>
  167.                     </div>
  168.                 </div>
  169.                 <div class="col-md-5">
  170.                     <div class="kode_pray_fig">
  171.                         <figure>
  173.                         </figure>
  174.                     </div>
  175.                 </div>
  176.             </div>
  177.         </div>
  178.         <!--CONTAINER END-->
  179.     </div>
  180.     <!--KODE PRAY WRAP END-->
  181.     <!--KODE CAUSE WRAP START-->
  184.     </div>
  185.     <!--KODE CAUSE WRAP END-->
  187.     <!--KODE BLOG WRAP START
  188.     <div class="kode_blog_wrap">
  190.         <div class="container">
  191.             <div class="row">
  192.                 <div class="col-md-8">
  193.                     <div class="kode_blog_row">
  194.                         <div class="section_hdg">
  195.                             <a href="#"><img src="{{ asset('mages/hdg-img.png') }}" alt="hdg"></a>
  196.                             <h3>Our BLog</h3>
  197.                             <span><i class="fa icon-art"></i></span>
  198.                         </div>
  199.                         <div class="kode_blog_list">
  200.                             <ul>
  201.                                 <li>
  202.                                     <div class="kode_blog_fig">
  203.                                         <figure class="them_overlay">
  204.                                             <img src="{{ asset('extra-images/blog.jpg') }}" alt="blog">
  205.                                             <a class="plus_icon hvr-ripple-out" data-rel="prettyPhoto" href="{{asset ('extra-images/blog.jpg') }}"><i class="fa fa-plus"></i></a>
  206.                                         </figure>
  207.                                         <div class="kode_blog_text">
  208.                                             <ul class="kode_meta">
  209.                                                 <li><a href="#"><i class="fa fa-calendar"></i>05 April , 2017</a></li>
  210.                                                 <li><a href="#"><i class="fa fa-user"></i>By Admin</a></li>
  211.                                             </ul>
  212.                                             <h5>Protest Against New Hijab law is Announced </h5>
  213.                                             <ul class="kode_meta meta_2">
  214.                                                 <li><a href="#"><i class="fa fa-comments"></i>23 Comments</a></li>
  215.                                                 <li><a href="#"><i class="fa fa-heart"></i>654 Likes</a></li>
  216.                                             </ul>
  217.                                         </div>
  218.                                     </div>
  219.                                 </li>
  220.                                 <li>
  221.                                     <div class="kode_blog_fig">
  222.                                         <figure class="them_overlay">
  223.                                             <img src="{{ asset('extra-images/blog1.jpg') }}" alt="blog">
  224.                                             <a class="plus_icon hvr-ripple-out" data-rel="prettyPhoto" href="{{ asset('extra-images/blog1.jpg') }}"><i class="fa fa-plus"></i></a>
  225.                                         </figure>
  226.                                         <div class="kode_blog_text">
  227.                                             <ul class="kode_meta">
  228.                                                 <li><a href="#"><i class="fa fa-calendar"></i>05 April , 2017</a></li>
  229.                                                 <li><a href="#"><i class="fa fa-user"></i>By Admin</a></li>
  230.                                             </ul>
  231.                                             <h5>Protest Against New Hijab law is Announced </h5>
  232.                                             <ul class="kode_meta meta_2">
  233.                                                 <li><a href="#"><i class="fa fa-comments"></i>23 Comments</a></li>
  234.                                                 <li><a href="#"><i class="fa fa-heart"></i>654 Likes</a></li>
  235.                                             </ul>
  236.                                         </div>
  237.                                     </div>
  238.                                 </li>
  239.                                 <li>
  240.                                     <div class="kode_blog_fig">
  241.                                         <figure class="them_overlay">
  242.                                             <img src="{{ asset('extra-images/blog2.jpg') }}" alt="blog">
  243.                                             <a class="plus_icon hvr-ripple-out" data-rel="prettyPhoto" href="{{ asset('extra-images/blog2.jpg') }}"><i class="fa fa-plus"></i></a>
  244.                                         </figure>
  245.                                         <div class="kode_blog_text">
  246.                                             <ul class="kode_meta">
  247.                                                 <li><a href="#"><i class="fa fa-calendar"></i>05 April , 2017</a></li>
  248.                                                 <li><a href="#"><i class="fa fa-user"></i>By Admin</a></li>
  249.                                             </ul>
  250.                                             <h5>Protest Against New Hijab law is Announced </h5>
  251.                                             <ul class="kode_meta meta_2">
  252.                                                 <li><a href="#"><i class="fa fa-comments"></i>23 Comments</a></li>
  253.                                                 <li><a href="#"><i class="fa fa-heart"></i>654 Likes</a></li>
  254.                                             </ul>
  255.                                         </div>
  256.                                     </div>
  257.                                 </li>
  258.                             </ul>
  259.                         </div>
  260.                     </div>
  261.                 </div>
  262.                 <div class="col-md-4">
  263.                     <div class="kode_event_row">
  264.                         <div class="section_hdg">
  265.                             <a href="#"><img src="{{ asset('images/hdg-img.png') }}" alt="hdg"></a>
  266.                             <h3>Our Events</h3>
  267.                             <span><i class="fa icon-art"></i></span>
  268.                         </div>
  269.                         <div class="kode_event_des">
  270.                             <div class="koed_event_timer">
  271.                                 <figure class="them_overlay">
  272.                                     <img src="{{ asset('extra-images/timer.jpg') }}" alt="timer">
  273.                                     <figcaption>
  274.                                         <h5>NExt Event In :</h5>
  275.                                         <ul class="countdown">
  276.                                             <li>
  277.                                                 <span class="days">52</span>
  278.                                                 <p class="">Days</p>
  279.                                             </li>
  280.                                             <li>
  281.                                                 <span class="hours">19</span>
  282.                                                 <p class="">HRS</p>
  283.                                             </li>
  284.                                             <li>
  285.                                                 <span class="minutes">85</span>
  286.                                                 <p class="">Mins</p>
  287.                                             </li>
  288.                                             <li>
  289.                                                 <span class="seconds">96</span>
  290.                                                 <p class="">Secs</p>
  291.                                             </li>
  292.                                         </ul>
  293.                                     </figcaption>
  294.                                 </figure>
  295.                             </div>
  296.                             <ul class="kode_calender_detail">
  297.                                 <li>
  298.                                     <div class="kode_calender_list">
  299.                                         <span>23 <i>April</i></span>
  300.                                         <div class="kode_event_text">
  301.                                             <h6><a href="#">Awarness Of Islam EventAt Monday</a></h6>
  302.                                             <p>Sunday <span>09 : 45 a.m</span> to <span>9:30 p.m</span></p>
  303.                                         </div>
  304.                                     </div>
  305.                                 </li>
  306.                                 <li>
  307.                                     <div class="kode_calender_list">
  308.                                         <span>23 <i>April</i></span>
  309.                                         <div class="kode_event_text">
  310.                                             <h6><a href="#">Awarness Of Islam EventAt Monday</a></h6>
  311.                                             <p>Sunday <span>09 : 45 a.m</span> to <span>9:30 p.m</span></p>
  312.                                         </div>
  313.                                     </div>
  314.                                 </li>
  315.                                 <li>
  316.                                     <div class="kode_calender_list">
  317.                                         <span>23 <i>April</i></span>
  318.                                         <div class="kode_event_text">
  319.                                             <h6><a href="#">Awarness Of Islam EventAt Monday</a></h6>
  320.                                             <p>Sunday <span>09 : 45 a.m</span> to <span>9:30 p.m</span></p>
  321.                                         </div>
  322.                                     </div>
  323.                                 </li>
  324.                             </ul>
  325.                         </div>
  326.                     </div>
  327.                 </div>
  328.             </div>
  329.         </div>
  330.     </div>
  331.     <!--KODE BLOG WRAP END-->
  333. {% endblock %}
  334. {% block javascripts  %}
  335.     {{ parent() }}
  336.     <!--js/jquery.downCount.js start-->
  337.     <script src="{{ asset('js/jquery.dlmenu.js') }}"></script>
  338.     <!--Map-->
  340.     <!--CUSTOM JavaScript-->
  341.     <!--BOOTSTRAP JavaScript-->
  343. {% endblock %}