templates/Theme/layoutbasehome.html.twig line 592

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta name="viewport" content="width=device-width, initial-scale=1">
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <meta name="keywords" content="Adelivery on-demand delivery african africa amoney myaconnect myaconect" />
  7. <!-- Favicons-->
  8. <link rel="icon" href="{{ asset('admintemplate/images/logo.png') }}" sizes="32x32"/>
  9. <!-- Favicons-->
  11. {% block meta %} {% endblock %}
  12.   <title>{% block title %}{{ site }}{% endblock %}</title>
  13. {% block stylesheets %}
  15.   <link href="{{ asset('templatecourse/css/bootstrap.min.css') }}" rel="stylesheet">
  16.   <link rel="stylesheet" href="{{ asset('templatecourse/css/select_option1.css') }}">
  17.   <link rel="stylesheet" href="{{ asset('templatecourse/css/font-awesome.min.css') }}">
  18.   <link rel="stylesheet" href="{{ asset('templatecourse/css/flexslider.css') }}" type="text/css" media="screen" />
  19.   <link rel="stylesheet" href="{{ asset('templatecourse/css/fullcalendar.min.css') }}">
  20.   <link rel="stylesheet" href="{{ asset('templatecourse/css/animate.css') }}">
  21.   <link rel="stylesheet" href="{{ asset('templatecourse/css/magnific-popup.css') }}">
  22.   <link rel="stylesheet" type="text/css" href="{{ asset('templatecourse/css/settings.css') }}" media="screen">
  23.   <link rel="stylesheet" type="text/css" href="{{ asset('templatecourse/css/owl.carousel.css') }}" media="screen">
  25.   <!-- GOOGLE FONT -->
  26.   <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600,600italic,400italic,700' rel='stylesheet' type='text/css'>
  27.   <link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,700' rel='stylesheet' type='text/css'>
  29.   <!-- CUSTOM CSS -->
  30.   <link rel="stylesheet" href="{{ asset('templatecourse/css/style.css') }}">
  31.   <link rel="stylesheet" href="{{ asset('templatecourse/css/default.css') }}" id="option_color">
  33.   <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  34.   <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  35.   <!--[if lt IE 9]>
  36.   <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  37.   <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  38.   <![endif]-->
  39.       <script src="{{ asset('templatecourse/js/jquery-1.11.1.min.js') }}"></script>
  40.     <link rel="stylesheet" href="{{ asset('template/notify/themes/alertify.core.css') }}"/>
  41.     <link rel="stylesheet" href="{{ asset('template/notify/themes/alertify.default.css') }}" id="toggleCSS"/>
  42.     <script src="{{ asset('template/notify/lib/alertify.min.js') }}"></script>
  43.     <script>
  44.         function resetNotif(){
  45.             $("#toggleCSS").attr("href", "{{ asset('template/notify/themes/alertify.default.css') }}");
  46.             alertify.set({
  47.                 labels : {
  48.                     ok     : "OK",
  49.                     cancel : "Cancel"
  50.                 },
  51.                 delay : 5000,
  52.                 buttonReverse : false,
  53.                 buttonFocus   : "ok"
  54.             });
  55.         }
  56.     </script>
  57. {% endblock %}
  59. <style>
  60.   aside{
  61.   position: fixed;
  62.   width: 100%;
  63.   top: 0;
  64.   left: 0;
  65.   background: #f4f4f4;
  66.   opacity: 0;
  67.   visibility: hidden;
  68.   transition: all .5s ease;
  69.   z-index: 90000!important;
  70.   height: 100vh;
  71. }
  72. .open {
  73.   opacity: 1;
  74.   visibility: visible;
  75. }
  77. .close-nav {
  78.   position: fixed;
  79.   top: 20px;
  80.   left: 15px;
  81.   color: white;
  82.   z-index: 3;
  83.   cursor: pointer;
  84.   font-family: sans-serif;
  85. }
  86. .close-nav:hover{
  87.     background: red!important;
  88.     color: #fff!important;
  89. }
  90. .hiden-scroll-bar-body{
  91.     height: 400px;
  92.     overflow-y: hidden;
  93. }
  94. .close-nav span,
  95. .close-nav span:before,
  96. .close-nav span:after {
  97.   border-radius: 4px;
  98.   height: 5px;
  99.   width: 35px;
  100.   background: white;
  101.   position: absolute;
  102.   display: block;
  103.   content: '';
  104. }
  105. .close-nav span {
  106.   background: transparent;
  107. }
  108. .close-nav span:before {
  109.   -webkit-transform: rotate(45deg);
  110.           transform: rotate(45deg);
  111. }
  112. .close-nav span:after {
  113.   -webkit-transform: rotate(-45deg);
  114.           transform: rotate(-45deg);
  115. }
  117. .outer-close {
  118.   position: absolute;
  119.   right: 0;
  120.   top: 0;
  121.   width: 85px;
  122.   height: 85px;
  123.   cursor: pointer;
  124. }
  127. .position-current-user, .position-current-user p{
  128.     background: #3565ae!important;
  129.     color: #fff!important;
  130. }
  131. .bg-struct{
  132.     background: #3565ae!important;
  133.     color: #fff!important;
  134. }
  138. .silly_scrollbar {
  139.     height: calc(100vh - 60px);
  140.     -webkit-box-shadow:0 0 3px #333;
  141.     -webkit-box-sizing: border-box;
  142.     padding:0 14px;
  143.     overflow:auto;
  144. }
  146. .silly_scrollbar::-webkit-scrollbar {
  147.     width: 12px;
  148. }
  149.  
  150. .silly_scrollbar::-webkit-scrollbar-track {
  151.     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
  152.     border-radius: 10px;
  153. }
  154.  
  155. .silly_scrollbar::-webkit-scrollbar-thumb {
  156.     border-radius: 10px;
  157.     -webkit-box-shadow: inset 0 0 6px red; 
  158. }
  160. .silly_scrollbar::-webkit-scrollbar-thumb:hover {
  161.     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.8);
  162. }
  165. .btn-home {
  166.   font-family: "Barlow", sans-serif;
  167.   font-weight: 700;
  168.   font-size: 18px;
  169.   padding: 15px 40px;
  170.   background: #fff;
  171.   border: none;
  172.   cursor: pointer;
  173.   transition: 0.4s all cubic-bezier(0.25, 0.46, 0.45, 0.94);
  174.   position: relative;
  175.   z-index: 2;
  176.   border-radius: 50px;
  177.   overflow: hidden;
  178. }
  179. .btn-home:after {
  180.   content: "";
  181.   position: absolute;
  182.   transition: 0.4s all cubic-bezier(0.25, 0.46, 0.45, 0.94);
  183. }
  185. .btn-4 {
  186.   color: #252D4A;
  187.   border: 2px solid currentColor;
  188. }
  189. .btn-4:after {
  190.   border: solid #5568AA;
  191.   border-width: 0 2px 2px 0;
  192.   display: inline-block;
  193.   padding: 4px;
  194.   transform: rotate(-45deg) translateY(-48%);
  195.   top: 48%;
  196.   right: 27%;
  197.   opacity: 0;
  198.   visibility: hidden;
  199.   z-index: -1;
  200. }
  201. .btn-4:hover, .btn-4:focus {
  202.   color: #5568AA;
  203.   border: 2px solid transparent;
  204.   padding: 15px 70px;
  205. }
  206. .btn-4:hover:after, .btn-4:focus:after {
  207.   opacity: 1;
  208.   visibility: visible;
  209.   right: 18%;
  210. }
  211. .btn-4:focus {
  212.   border-color: currentColor;
  213. }
  214. .btn-4:hover{
  215.   box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  216. }
  218. @media (max-width: 400px) {
  219.   .my-panel-souscription {
  220.     width: 100%!important;
  221.   }
  222. }
  224. @media (min-width: 400px){
  225.   .my-panel-souscription{
  226.     width: 400px!important;
  227.   }
  228. }
  231. .breadcrumbs {
  232.   list-style: none;
  233.   margin: 0px 0px 16px 0px;
  234.   padding: 0;
  235. }
  237. .breadcrumbs li {
  238.   list-style: none;
  239.   margin: 0;
  240.   padding: 0;
  241.   display: block;
  242.   float: left;
  243.   font-family: Montserrat,sans-serif;
  244.   text-transform: capitalize;
  245.   font-weight: 700;
  246.   letter-spacing: .05em;
  247.   line-height: 20px;
  248.   color: hsl(0, 0%, 30%);
  249. }
  251. .breadcrumbs li a {
  252.   display: block;
  253.   padding: 0 40px 0 0px;
  254.   color: hsl(0, 0%, 30%);
  255.   text-decoration: none;
  256.   height: 20px;
  257.   position: relative;
  258.   perspective: 700px;
  259. }
  261. .breadcrumbs li a:after {
  262.   content: '';
  263.   width: 20px;
  264.   height: 20px;
  265.   border-color: #333;
  266.   border-style: solid;
  267.   border-width: 1px 1px 0 0;
  268.   
  269.   -webkit-backface-visibility: hidden;
  270.   outline: 1px solid transparent;
  271.   
  272.   position: absolute;
  273.   right: 20px;
  274.   -webkit-transition: all .15s ease;
  275.      -moz-transition: all .15s ease;
  276.       -ms-transition: all .15s ease;
  277.           transition: all .15s ease;
  278.   -webkit-transform: rotateZ(45deg) skew(10deg, 10deg);
  279.      -moz-transform: rotateZ(45deg) skew(10deg, 10deg);
  280.       -ms-transform: rotateZ(45deg) skew(10deg, 10deg);
  281.           transform: rotateZ(45deg) skew(10deg, 10deg);
  282. }
  285. .breadcrumbs li a:hover:after {
  286.   right: 15px;
  287.   -webkit-transform: rotateZ(45deg) skew(-10deg, -10deg);
  288.      -moz-transform: rotateZ(45deg) skew(-10deg, -10deg);
  289.       -ms-transform: rotateZ(45deg) skew(-10deg, -10deg);
  290.           transform: rotateZ(45deg) skew(-10deg, -10deg);
  291. }
  293. .c-navigation-breadcrumbs__directory {
  294.   display: flex;
  295. }
  296. .c-navigation-breadcrumbs__link:link {
  297.   color: #007c89;
  298. }
  299. .c-navigation-breadcrumbs__link:link:hover {
  300.   background-image: linear-gradient(currentColor, currentColor);
  301.   background-size: auto 1px;
  302.   background-repeat: repeat-x;
  303.   background-position: 0 calc(50% + 1ex);
  304. }
  305. @media (max-width: 500px) {
  306.   .c-navigation-breadcrumbs__item:not(:nth-last-child(2)) {
  307.     display: none;
  308.   }
  309.   .c-navigation-breadcrumbs__link:before {
  310.     display: inline-block;
  311.     content: '\200b';
  312.     background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23007c89' stroke-width='2' stroke-linecap='round' stroke-linejoin='round%5C'%3E%3Cline x1='19' y1='12' x2='5' y2='12'%3E%3C/line%3E%3Cpolyline points='12 19 5 12 12 5'%3E%3C/polyline%3E%3C/svg%3E") center/16px 16px no-repeat;
  313.     width: 16px;
  314.   }
  315. }
  316. @media (min-width: 501px) {
  317.   .c-navigation-breadcrumbs__item:nth-last-child(n+2):after {
  318.     display: inline-block;
  319.     content: '\200b';
  320.     background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23767676' stroke-width='2' stroke-linecap='round' stroke-linejoin='round%5C'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E") center/16px 16px no-repeat;
  321.     width: 16px;
  322.     margin: 0 8px;
  323.   }
  324.   .c-navigation-breadcrumbs__link {
  325.     display: block;
  326.     float: left;
  327.   }
  328. }
  331. .pagination {
  332.     background: #fff;
  333.     padding: 20px;
  334.     margin-bottom: 20px;
  335.     display: block;
  336.     border-radius: 7px;
  337. }
  339. .page {
  340.     display: inline-block;
  341.     padding: 0px 9px;
  342.     margin-right: 4px;
  343.     border-radius: 3px;
  344.     border: solid 1px #c0c0c0;
  345.     background: #e9e9e9;
  346.     box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1);
  347.     font-size: .875em;
  348.     font-weight: bold;
  349.     text-decoration: none;
  350.     color: #717171;
  351.     text-shadow: 0px 1px 0px rgba(255,255,255, 1);
  352. }
  354. .page:hover, .page.gradient:hover {
  355.     background: #fefefe;
  356.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FEFEFE), to(#f0f0f0));
  357.     background: -moz-linear-gradient(0% 0% 270deg,#FEFEFE, #f0f0f0);
  358. }
  360. .page.active {
  361.     border: none;
  362.     background: #616161;
  363.     box-shadow: inset 0px 0px 8px rgba(0,0,0, .5), 0px 1px 0px rgba(255,255,255, .8);
  364.     color: #f0f0f0;
  365.     text-shadow: 0px 0px 3px rgba(0,0,0, .5);
  366. }
  368. .page.gradient {
  369.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f8f8f8), to(#e9e9e9));
  370.     background: -moz-linear-gradient(0% 0% 270deg,#f8f8f8, #e9e9e9);
  371. }
  373. .pagination.dark {
  374.     background: #414449;
  375.     color: #feffff;
  376. }
  378. .page.dark {
  379.     border: solid 1px #32373b;
  380.     background: #3e4347;
  381.     box-shadow: inset 0px 1px 1px rgba(255,255,255, .1), 0px 1px 3px rgba(0,0,0, .1);
  382.     color: #feffff;
  383.     text-shadow: 0px 1px 0px rgba(0,0,0, .5);
  384. }
  386. .page.dark:hover, .page.dark.gradient:hover {
  387.     background: #3d4f5d;
  388.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#547085), to(#3d4f5d));
  389.     background: -moz-linear-gradient(0% 0% 270deg,#547085, #3d4f5d);
  390. }
  392. .page.dark.active {
  393.     border: none;
  394.     background: #2f3237;
  395.     box-shadow: inset 0px 0px 8px rgba(0,0,0, .5), 0px 1px 0px rgba(255,255,255, .1);
  396. }
  398. .page.dark.gradient {
  399.     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#565b5f), to(#3e4347));
  400.     background: -moz-linear-gradient(0% 0% 270deg,#565b5f, #3e4347);
  401. }
  403. .my-div {
  404.     width: 100%;
  405.     margin-bottom: 10px;
  406.     padding: 10px;
  407.     background-color: #fff;
  408.     border-radius: 1em;
  409. }
  411. .banner{
  412.   background: transparent!important;
  413. }
  415. @media (max-width: 700px) {
  416.     .my-div {
  417.         width: auto;
  418.         margin: 0 auto;
  419.         border-radius: 0;
  420.         padding: 1em;
  421.     }
  422. }
  423. .list_block, .sidebar_item, .formArea{
  424.   border-top-color: #0060b1!important;
  425. }
  428. .border-secondary{
  429.   border: 1px solid #76b4e7!important;
  430. }
  431. .bg-primary{
  432.   background: #092759!important;
  433. }
  434. .bg-secondary{
  435.   background: #76b4e7!important;
  436. }
  437. .features li{
  438.   color: #092759;
  439. }
  440. .features li i{
  441.   color: #76b4e7!important;
  442. }
  443. .partnersLogo img{
  444.   height: 100px;
  445. }
  446. hr {
  447.     display: inline-block!important;
  448. }
  451. /*=============Begin tab pure css Accordio==========*/
  452. .section-left-filter{
  453.   min-height: 894px;
  454.   background: #FFFFFF;
  455.   border: 1px solid #e1e8ed; padding: 15px;
  456.   border-radius: 10px;
  457. }
  458. .section-left-filter-title{
  459.   font-family: 'MontserratAlternates-Regular';
  460.   font-style: normal;
  461.   font-weight: 700;
  462.   font-size: 16px;
  463.   line-height: 20px;
  464.   color: #000000;
  465. }
  467. .menu-aside input[type="checkbox"] {
  468.   position: absolute;
  469.   opacity: 0;
  470.   z-index: -1;
  471. }
  473. /* Accordion styles */
  474. .menu-aside .ads-tabs {
  475.   border-radius: 8px;
  476.   overflow: hidden;
  477. }
  479. .menu-aside .ads-tab {
  480.   width: 100%;
  481.   color: #333;
  482.   overflow: hidden;
  483. }
  484. .menu-aside .tab-label {
  485.   display: flex;
  486.   justify-content: space-between;
  487.   padding: 1em;
  488.   /*background: #2c3e50;*/
  489.   font-weight: bold;
  490.   cursor: pointer;
  491.   /* Icon */
  492. }
  493. .menu-aside .tab-label:hover {
  494.   /*background: #1a252f;*/
  495. }
  496. .menu-aside .tab-label::after {
  497.   content: "❯";
  498.   width: 1em;
  499.   height: 1em;
  500.   text-align: center;
  501.   transition: all 0.35s;
  502. }
  503. .menu-aside .tab-content1 {
  504.   max-height: 0;
  505.   padding: 0 1em;
  506.   color: #2c3e50;
  507.   background: white;
  508.   transition: all 0.35s;
  509. }
  510. .menu-aside .tab-close {
  511.   display: flex;
  512.   justify-content: flex-end;
  513.   padding: 1em;
  514.   font-size: 0.75em;
  515.   background: #2c3e50;
  516.   cursor: pointer;
  517. }
  518. .menu-aside .tab-close:hover {
  519.   background: #1a252f;
  520. }
  522. .menu-aside input:checked + .tab-label {
  523.   /*background: #1a252f;*/
  524. }
  525. .menu-aside input:checked + .tab-label::after {
  526.   transform: rotate(90deg);
  527. }
  528. .menu-aside input:checked ~ .tab-content1 {
  529.   max-height: 100vh;
  530.   padding: 1em;
  531. }
  532. /*=============End tab pure css Accordio==========*/
  535. .btn-effet {
  536.     position: relative;
  537.     display: inline-block;
  538.     margin: 5px;
  539.     padding: 5px 10px;
  540.     text-align: center;
  541.     font-size: 14px;
  542.     letter-spacing: 1px;
  543.     text-decoration: none;
  544.     color: #999999;
  545.     background: #ffffff;
  546.     border: 3px solid #999999;
  547.     border-radius: 7px;
  548.     cursor: pointer;
  549.     transition: ease-out 0.5s;
  550.     -webkit-transition: ease-out 0.5s;
  551.     -moz-transition: ease-out 0.5s;
  552. }
  554. .btn-effet.btn-border-3::after,
  555. .btn-effet.btn-border-3::before {
  556.     position: absolute;
  557.     content: "";
  558.     width: 0;
  559.     height: 0;
  560.     transition: .5s;
  561. }
  563. .btn-effet.btn-border-3::after {
  564.     top: -9px;
  565.     left: -9px;
  566.     border-top: 3px solid transparent;
  567.     border-left: 3px solid transparent;
  568. }
  570. .btn-effet.btn-border-3::before {
  571.     bottom: -9px;
  572.     right: -9px;
  573.     border-bottom: 3px solid transparent;
  574.     border-right: 3px solid transparent;
  575. }
  577. .btn-effet.btn-border-3:hover {
  578.     color: #222222;
  579. }
  581. .btn-effet.btn-border-3:hover::after,
  582. .btn-effet.btn-border-3:hover::before {
  583.     width: 30px;
  584.     height: 30px;
  585.     border-color: #222222;
  586. }
  587. </style>
  588. </head> 
  590. <body class="body-wrapper">
  591.   <div class="main_wrapper"> 
  592.     {{ render(controller("App\\Controller\\General\\Template\\MenuController:menubare", {'position': 'home'})) }}
  593.     {% block body %}
  594.       
  595.     {% endblock %}
  596.     {{ render(controller("App\\Controller\\General\\Template\\MenuController:footer", {'position': 'home', 'hideblock': hideblock|default(false)})) }}
  599.     <aside>
  600.       <div class="outer-close toggle-overlay">
  601.         <a class="close-nav text-center open-scroll-bar-body" style="background: #fff; color: #333; display: inline-block; height: 40px; width: 40px; border-radius: 20px; padding-top: 7px;"><i class="fa fa-arrow-left"></i></a> 
  602.         
  603.         <div style="position: fixed; z-index: 3; bottom: 0px; width: 100%; left: 0px; background: #fff; padding: 7px 10px; border-top: 1px solid #ddd;">
  604.           <div style="font-size: 12px;">© 2014 - {{ "now"|date('Y') }} - {{ site }}</div>
  605.         </div>
  606.       </div>
  607.       
  608.       <div class="content-article-tech">
  609.       
  610.       </div>
  611.     </aside>
  612.   </div>
  615. <script src="{{ asset('templatecourse/js/bootstrap.min.js') }}"></script>
  616. <script src="{{ asset('templatecourse/js/jquery.selectbox-0.1.3.min.js') }}"></script>
  617. <script src="{{ asset('templatecourse/js/jquery.magnific-popup.js') }}"></script>
  618. <script src="{{ asset('templatecourse/js/jquery.counterup.js') }}"></script>
  619. <script src="{{ asset('templatecourse/js/owl.carousel.js') }}"></script>
  623. <script src="{{ asset('templatecourse/js/jquery.flexslider.js') }}"></script>
  624. <script src="{{ asset('templatecourse/js/jquery.themepunch.tools.min.js') }}"></script>
  625. <script src="{{ asset('templatecourse/js/jquery.themepunch.revolution.min.js') }}"></script>
  627. <!-- script src="{{ asset('templatecourse/js/wow.min.js') }}"></script>
  628. <script src="{{ asset('templatecourse/js/moment.min.js') }}"></script>
  629. <script src="{{ asset('templatecourse/js/jquery.syotimer.js') }}"></script>
  630. <script src="{{ asset('templatecourse/js/SmoothScroll.js') }}"></script>
  631. <script src="{{ asset('templatecourse/js/waypoints.min.js') }}"></script -->
  634. <!-- link href="{{ asset('templatecourse/css/optionswitch.css') }}" rel="stylesheet" -->
  635. <!-- script src="{{ asset('templatecourse/js/optionswitcher.js') }}"></script -->
  637. {% block srcjavascript %}
  639. {% endblock %}
  641. <script type="text/javascript">
  642.   /*$window.load(
  643.     function(){
  644.       $('.flexslider').flexslider({animation:'slide',animationLoop:false,itemWidth:228,itemMargin:0,prevText:'',nextText:'',minItems:getGridSize(),maxItems:getGridSize()});
  645.     });*/
  646.     //$window.resize(function(){var gridSize=getGridSize();flexslider.vars.minItems=gridSize;flexslider.vars.maxItems=gridSize;});
  647.      
  648.     var owl=$('.owl-carousel.success-inner');
  649.     owl.owlCarousel(
  650.       {loop:true,margin:0,autoplay:true,autoplayTimeout:4000,autoplayHoverPause:true,nav:false,moveSlides:1,dots:true,smartSpeed:1000,responsive:{320:{items:1},768:{items:1},992:{items:1}}}
  651.     );
  652.     var owl=$('.owl-carousel.banner-slider');
  653.     owl.owlCarousel(
  654.       {loop:true,margin:0,autoplay:true,autoplayTimeout:2000,autoplayHoverPause:true,nav:false,moveSlides:1,dots:false,smartSpeed:1000,responsive:{320:{items:1},768:{items:1},992:{items:1}}}
  655.     );
  656.     var owl=$('.owl-carousel.bannerBottom-slider');
  657.     owl.owlCarousel(
  658.       {loop:true,margin:0,autoplay:false,nav:true,moveSlides:1,dots:false,smartSpeed:1000,responsive:{320:{items:1},768:{items:1},992:{items:1}}}
  659.     );
  660.     var owl=$('.owl-carousel.partnersLogoSlider');
  661.     owl.owlCarousel(
  662.       {loop:true,margin:28,autoplay:true,autoplayTimeout:2000,autoplayHoverPause:true,nav:true,dots:false,smartSpeed:500,responsive:{320:{slideBy:1,items:1},480:{slideBy:1,items:2},768:{slideBy:1,items:3},992:{slideBy:1,items:5}}}
  663.     );
  664.     
  665.     $(function(){
  666.         {% block javascript %}
  668.         {% endblock %}
  669.     });
  670. </script>    
  671.     
  672. <style>
  673.     .side-nav-dashboad {
  674.         position: fixed; background: #f0f3f5; padding: 10px 0px; width: 100%; z-index: 50000;
  675.     }
  677.     #style-4{
  678.         box-shadow: 0px -1px 10px rgba(50, 50, 50, 0.2);
  679.     }
  680. </style>
  682. <div class="content-alert-action-hosting-user" value="0" name="0" style="display: none;"></div>
  684. <div class="panel-result-action-hosting-user" style="display: none; position: fixed; z-index: 10000; width: 100%; text-align: center; top: 40%;">
  685.     <span style="display: inline-block; width: 80px; height: 80px; background: #fff; text-align: center; padding-top: 25px;">
  686.         <img src="{{ asset('template/images/loader.gif') }}" alt="Attente" style="height: 30px; width: 30px;"/>
  687.     </span>
  688. </div>
  690. {#
  691. <div id="style-4" class="text-center side-nav-dashboad" >
  692.     <div style="margin-top: -35px;">
  693.         <a href="#!" class="hide-nav-premuim text-center btn"style="opacity: 1!important; color: #fff; display: none; width: 50px; height: 50px; border-radius: 50%; background: #3565ae; padding-top: 15px; box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);"><span class="fa fa-chevron-down"></span></a>
  694.         
  695.         <a href="#!" class="show-nav-premuim text-center btn" style="opacity: 1!important;position: sticky; color: #fff; width: 50px; height: 50px; border-radius: 50%; background: #3565ae; padding-top: 8px; box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);">
  696.             <span class="fa fa-chevron-up"></span>
  697.             <strong id="DivClignotante" style="display: inline-block; background: red; padding: 2px 7px; height: 25px; width: 25px; border-radius: 50%; font-size: 14px; position: absolute; right: 10px; top: -15px;">0</strong>
  698.         </a>
  699.     </div>
  700.     
  701.     <div style="height: 100%; overflow: auto; position: sticky; position: -webkit-sticky; position: sticky;">
  702.     <div class="container">
  703.     <div class="row">
  704.         <div class="col-md-12">
  705.         <div class="card_content_update" style="margin-top: 7px;">
  706.             <div class="text-center" style="padding-top: 50px; min-height: 300px;">
  707.                 <h2>Inscription en cours</h2>
  708.                 
  709.                 <div>
  710.                     <span class="fa fa-info-circle"></span> Vérifiez votre commande et cliquez sur suivant pour poursuivre l'inscrption.
  711.                 </div>
  712.             </div>
  713.         </div>
  714.         </div>
  715.     </div>
  716.     </div>
  717.     </div>
  718. </div>
  719. #}
  721. <script type="text/javascript">
  723. var animtail = 0;
  724. if($(window).height() > 600)
  725. {
  726.     var panelheight = $(window).height() - 20;
  727.     if(panelheight > 800)
  728.     {
  729.         panelheight = 780;
  730.     }
  731. }else{
  732.     var panelheight = $(window).height() -20;
  733. }
  735. $(function(){
  737.   $('.video_btn').magnificPopup({
  738.       type: 'iframe'
  739.   });
  741.   $('.video_media').magnificPopup({
  742.       type: 'iframe'
  743.   });
  745. $(".dropdown").hover(function(){
  746.     var dropdownMenu = $(this).children(".dropdown-menu");
  747.     
  748.     dropdownMenu.parent().toggleClass("open");
  749.     if($(this).hasClass("open"))
  750.     {
  751.     $(this).find('span.item-caret').html('<span class="fa fa-angle-up"></span>');
  752.     }else{
  753.     $(this).find('span.item-caret').html('<span class="fa fa-angle-down"></span>');
  754.     }        
  755. });
  757. $("button.navbar-toggle").click(function(){
  758.     $("div.navbar-collapse").toggleClass("collapse");
  759. });
  760. /*
  761. $('#menu-drop-notif').bind('mouseleave.dragged',function(e){
  762.         menuDrop.dataset.drop = 'disabled';
  763.         menuDrop.classList.remove('active2');
  764.       });
  765. */
  766.     
  767. $('.side-nav-dashboad').css('height', panelheight+'px');
  768. $('.side-nav-dashboad').css('bottom', -panelheight+'px');
  770. $('.hide-nav-premuim').click(function(){
  771.   closeCardPanel();
  772. });
  774. $('.show-nav-premuim').click(function(){
  775.   rafraichissementpanier();
  776. });
  778. $("[data-toggle=popover]").each(function(i, obj){
  779.     $(this).popover({
  780.       html: true,
  781.       content: function() {
  782.         var id = $(this).attr('id')
  783.         return $('#popover-content-' + id).html();
  784.       }
  785.     });
  786. });
  788. $('.toggle-overlay-article').click(function(){
  789.   var id = $(this).attr('value');
  790.   openArticleOverlay(id);
  791. });
  793. $('.open-scroll-bar-body').click(function(){
  794.     $('aside').toggleClass('open');
  795.      $('.content-article-tech').html('');
  796. });
  798. $('.open-liste-formation').click(function(){
  799.     $('.list-group-flush').hide();
  800.     $('.item-formation-'+$(this).attr('value')).show();
  801. });
  803. });
  805. function openCardPanel()
  806. {
  807.     if(animtail == 0)
  808.     {
  809.       $('.content-alert-action-hosting-user').show();
  810.       $('.content-alert-action-hosting-user').html('<div style="position: fixed; top: 0px; margin-bottom: '+$(window).scrollTop()+'px; left: 0px; z-index: 9000; width: '+($(window).width() + 100)+'px; height: '+($(window).height() + $(window).scrollTop())+'px; background: rgba(0,0,0,0.5);"></div>');
  811.       
  812.       $( ".side-nav-dashboad" ).animate({ "bottom": "+="+panelheight+"px" }, "slow" );
  813.       $( ".hide-nav-premuim" ).show();
  814.       $( ".show-nav-premuim" ).hide();
  815.       animtail = panelheight;
  816.     }
  817. }
  819. function closeCardPanel()
  820. {
  821.     if(animtail == panelheight)
  822.     {
  823.       $( ".side-nav-dashboad" ).animate({ "bottom": "-="+panelheight+"px"}, "slow");
  824.       $( ".hide-nav-premuim" ).hide();
  825.       $( ".show-nav-premuim" ).show();
  826.       $('.content-alert-action-hosting-user').hide();
  827.       animtail = 0;
  828.     }
  829. }
  831. function rafraichissementpanier()
  832. {
  833.     openCardPanel();
  834.     
  835.     var hauteur = $('.card_content_update').height() + 2;
  836.     var largeur = $('.card_content_update').width() + 32;
  837.     var padding = Math.round(hauteur/2 - 50);
  838.     $('.card_content_update').before('<div class="attente-resultat col-md-12" style="padding-top: 250px; z-index: 10000; height: '+hauteur+'px; text-align: center; vertical-align: center; width: '+largeur+'px; position: absolute; background: rgba(221, 221, 221, 0.48);; margin-top: 15px;"><span><img src="{{ asset('template/images/loader.gif') }}" alt="..." style="width: 30px; height: 30px;" /></span></div>');
  840.     $.get('{{ path('produit_produit_reglement_commande_du_panier') }}',function(data){
  841.       if(data == 0)
  842.       {
  843.           resetNotif();
  844.           alertify.alert("Echec, Vous n'avez aucune formation valide pour cette section en cours.");
  845.           $('.card_content_update').html('<div class="text-center" style="height: 150px padding-top: 70px;"><main style="box-shadow:0px 0px 2px rgba(0,0,0,0.02); background: #fff; margin: 0px; padding: 7px; min-width: 100%; min-height: 250px;"> <h2>Votre panier est vide</h2><a href="{{ path('users_user_acces_plateforme') }}">Ciquez ici pour vous inscrire à une formation</a></main></div>');
  846.       }else if(data == 2){
  847.           resetNotif();
  848.           alertify.alert("Echec, Le panier en cours ne contient aucune formation.");
  849.           $('.card_content_update').html('<div class="text-center" style="height: 150px padding-top: 70px;"><main style="box-shadow:0px 0px 2px rgba(0,0,0,0.02); background: #fff; margin: 0px; padding: 7px; min-width: 100%; min-height: 250px;"> <h2>Votre panier est vide</h2><a href="{{ path('users_user_acces_plateforme') }}">Ciquez ici pour vous inscrire à une formation</a></main></div>');
  850.       }else{
  851.         $('.card_content_update').html(data);
  852.       }
  853.       $('.attente-resultat').hide();
  854.     });
  855. }
  857. function openArticleOverlay(id)
  858. {
  859.   var height = ($(window).height() + $(window).scrollTop());
  860.   var width = $(window).width() + 100;
  861.   var scrolltop = $(window).scrollTop();
  862.   $('.panel-result-action-hosting-user').show();
  863.   $('.content-alert-action-hosting-user').show();
  864.   $('.content-alert-action-hosting-user').html('<div style="position: fixed; top: 0px; margin-bottom: '+scrolltop+'px; left: 0px; z-index: 9000; width: '+width+'px; height: '+height+'px; background: rgba(0,0,0,0.5);"></div>');
  866.   $.post('{{ path('produit_service_detail_article_support') }}',{ id: id }, function(data){
  867.       if(data != 0)
  868.       {
  869.           $('.panel-result-action-hosting-user').hide();
  870.           $('.content-alert-action-hosting-user').hide();
  871.           
  872.           $('.content-article-tech').html(data);
  873.           $('aside').toggleClass('open');
  874.       }else{
  875.           resetNotif();
  876.           alertify.alert("Echec, Une erreur a été rencontrée lors de l\'enregistrement de la commande.");
  877.           $('.panel-result-action-hosting-user').hide();
  878.           $('.content-alert-action-hosting-user').hide();
  879.       }
  880.   });
  881. }
  883. $('.commande-offer-formation').click(function(){
  884.   var id = $(this).attr('value');
  885.   var type = $(this).attr('name');
  886.   var height = ($(window).height() + $(window).scrollTop());
  887.   var width = $(window).width() + 100;
  888.   var scrolltop = $(window).scrollTop();
  889.   $('.panel-result-action-hosting-user').show();
  890.   $('.content-alert-action-hosting-user').show();
  891.   $('.content-alert-action-hosting-user').html('<div style="position: fixed; top: 0px; margin-bottom: '+scrolltop+'px; left: 0px; z-index: 9000; width: '+width+'px; height: '+height+'px; background: rgba(0,0,0,0.5);"></div>');
  893.   $.post('{{ path('produit_produit_ajouter_product_panier') }}',{ id: id, type: type }, function(data){
  894.       if(data == 1)
  895.       {
  896.           $('.panel-result-action-hosting-user').hide();
  897.           $('.content-alert-action-hosting-user').hide();
  898.           rafraichissementpanier();
  899.       }else{
  900.           resetNotif();
  901.           alertify.alert("Echec, Une erreur a été rencontrée lors de l\'enregistrement de la commande.");
  902.           $('.panel-result-action-hosting-user').hide();
  903.           $('.content-alert-action-hosting-user').hide();
  904.       }
  905.   });
  906. });
  907. </script>
  908. </body>
  909. </html>