{% extends "Theme/Users/User/layoutoffert.html.twig" %}
{% block meta %}
{{ parent() }}
<meta name="keywords" content="{{ site }}, {{ keywords }}"/>
<meta name="author" content="Noel Kenfack"/>
<meta name="description" content="{{ site }} - {{ article.nom }}"/>
{% endblock %}
{% block title %}
{{ parent() }} - {{ article.breve }}
{% endblock %}
{% block stylesheets %}
{{ parent() }}
{% endblock %}
{% block userblog_body %}
<div style="background: #90acd1;">
<div class="container" style="overflow: hidden;">
<div class="row" style="margin: 15px 0px;">
<div class="col-md-12">
{% if is_mobile() %}
<ol class="c-navigation-breadcrumbs__directory">
<!-- Duplicating the "Home" link in both the global navigation and the breadcrumb trail is not recommended. -->
<li class="c-navigation-breadcrumbs__item" property="itemListElement" typeof="ListItem">
<a class="c-navigation-breadcrumbs__link" href="" property="item" typeof="WebPage">
<span class="u-visually-hidden" property="name"><span class="fa fa-home"> </span> Accueil</span>
</a>
<meta property="position" content="1">
</li>
<li class="c-navigation-breadcrumbs__item" property="itemListElement" typeof="ListItem">
<a class="c-navigation-breadcrumbs__link" href="" property="item" typeof="WebPage">
<span property="name"> L'entreprise</span>
</a>
<meta property="position" content="2">
</li>
<li class="c-navigation-breadcrumbs__item" property="itemListElement" typeof="ListItem">
<a class="c-navigation-breadcrumbs__link" href="#!" property="item" aria-current="location">
<span property="name">À propos de nous </span>
</a>
<meta property="position" content="3">
</li>
</ol>
{% else %}
<div style="padding: 20px 0px;">
<ul class="breadcrumbs">
<li><a href="{{ path('users_user_acces_plateforme') }}"><span class="fa fa-home"></span> Accueil</a></li>
<li><a > L'entreprise</a></li>
<li>À propos de nous</li>
</ul>
</div>
{% endif %}
</div>
</div>
</div>
</div>
<div style="background-image: linear-gradient(-1deg, #F6FCFF 0%, #EAF7FF 98%);">
<div class="container" style="height: 20px;">
</div>
</div>
<div class="container" style="min-height: 500px;">
<div class="row">
<div class="col-md-12">
<div class="animecourant-panel" style="display: block;">
</div>
</div>
</div>
<div class="row" style="margin-top: 7px;">
<div class="col-md-8">
<h3 class="breadcrumbs-title" style="margin-bottom: 15px;">
<a href="{{ path('produit_service_afh_sps',{'position': 'blogads'}) }}" class="btn btn-default btn-lg border">
<span class="bi bi-arrow-left-short"></span> Précédent
</a>
{{ article.breve }}
</h3>
</div>
<div class="col-md-4">
<div class="dropdowncarte">
<button></button>
<div class="options">
{% for type in type_blog %}
<input id="target_item_{{ type.id }}" type="radio" name="region" value="africa" checked="">
<label style="--index: {{ loop.index }}" for="target_item_{{ type.id }}">
<span class="fa fa-list-alt"></span>
{{ type.nom }}
</label>
{% endfor %}
</div>
<svg viewBox="0 0 24 24">
<path d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"></path>
</svg>
</div>
</div>
</div>
<div class="row" style="margin-bottom: 15px;">
<div class="col-md-4">
<div class="toutleblock">
<nav class="navigation" id="mainNav" style="margin-top: 0px;">
<a class="navigation__link" href="#0">
<span class="fa fa-info-circle"></span> À propos
</a>
{% for partie in article.getPartiearticles %}
<a class="navigation__link" href="#{{ partie.id }}">{{ partie.nom }}</a>
{% endfor %}
</nav>
<div class="shadow2 mt-3" style="padding: 15px; background: #fff;">
<h5>Articles de formation récents</h5>
{% for course in liste_article %}
<div class="mb-3">
<a href="{{ path('produit_service_detail_article_central', {'id': course.id }) }}">{{ course.nom }}</a>
</div>
{% endfor %}
</div>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 stop-courant-panel">
</div>
</div>
</div>
</div>
<div class="col-md-8">
<div class="page-section2 card mb-3" id="0">
<div class="card-header">
<h5>{{ article.nom }}</h5>
</div>
<div class="card-body">
<div class="demo-images-annonces">
<a href="{% if article.imgservice != null %}{{ asset(article.imgservice.getwebpath) }}{% else %}{{ asset('template/images/boost2.png') }}{% endif %}" title="{{ article.nom }}" class="thumbnail-popup">
<img alt="Image {{ article.nom }}" src="{% if article.imgservice != null %}{{ asset(article.imgservice.getwebpath) }}{% else %}{{ asset('template/images/boost2.png') }}{% endif %}" class="img-fluid"/>
</a>
{% for imgpartie in images_partie %}
<a href="{% if imgpartie.imgevenement != null %}{{ asset(imgpartie.imgevenement.getwebpath) }}{% else %}{{ asset('template/images/boost2.png') }}{% endif %}" title="{{ imgpartie.nom }}" class="thumbnail-popup">
<img alt="Image {{ imgpartie.nom }}" src="{% if imgpartie.imgevenement != null %}{{ asset(imgpartie.imgevenement.getwebpath) }}{% else %}{{ asset('template/images/boost2.png') }}{% endif %}" class="img-fluid"/>
</a>
{% endfor %}
</div>
<div style="font-size: 16px;">
{{ article.description|raw }}
</div>
</div>
<div class="card-footer">
<a href="#!" style="display: inline-block; margin-right: 20px;">
12 <span class="fa fa-circle" style="font-size: 9px;"></span> <span class="bi bi-hand-thumbs-up"></span> J'aime
</a>
<a href="#!">
1 <span class="fa fa-circle" style="font-size: 9px;"></span> <span class="bi bi-hand-thumbs-down"></span> J'aime pas
</a>
</div>
</div>
{% for partie in article.getPartiearticles %}
<div class="page-section2 card mb-3" id="{{ partie.id }}">
<div class="card-header">
<h5>{{ partie.nom }}</h5>
</div>
<div class="card-body">
{% if partie.imgevenement != null %}
<div class="demo-images-annonces">
<a href="{% if partie.imgevenement != null %}{{ asset(partie.imgevenement.getwebpath) }}{% else %}{{ asset('template/images/boost2.png') }}{% endif %}" title="{{ partie.nom }}" class="thumbnail-popup">
<img alt="Image {{ partie.nom }}" src="{% if partie.imgevenement != null %}{{ asset(partie.imgevenement.getwebpath) }}{% else %}{{ asset('template/images/boost2.png') }}{% endif %}" class="img-fluid"/>
</a>
</div>
{% endif %}
{{ partie.description|raw }}
</div>
<div class="card-footer">
<a href="#!" style="display: inline-block; margin-right: 20px;">
12 <span class="fa fa-circle" style="font-size: 9px;"></span> <span class="fa fa-thumbs-o-up"></span> J'aime
</a>
<a href="#!">
1 <span class="fa fa-circle" style="font-size: 9px;"></span> <span class="fa fa-thumbs-o-down"></span> J'aime pas
</a>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
{% endblock %}
{% block srcjavascripttemplate %}
<script src="{{ asset('template/js/onvisible.js') }}" type="text/javascript"></script>
{% endblock %}
{% block javascripttemplate %}
$(".demo-images-annonces").justifiedGallery({rowHeight: 100});
$('.thumbnail-popup').viewbox();
$(document).ready(function(){
$('a[href*=#]').bind('click', function(e) {
e.preventDefault(); // prevent hard jump, the default behavior
var target = $(this).attr("href"); // Set the target as variable
// perform animated scrolling by getting top-position of target-element and set it as scroll target
$('html, body').stop().animate({
scrollTop: $(target).offset().top
}, 600, function() {
location.hash = target; //attach the hash (#jumptarget) to the pageurl
});
return false;
});
});
$(window).scroll(function(){
var scrollDistance = $(window).scrollTop();
// Show/hide menu on scroll
//if (scrollDistance >= 850) {
// $('nav').fadeIn("fast");
//} else {
// $('nav').fadeOut("fast");
//}
// Assign active class to nav links while scolling
$('.page-section2').each(function(i) {
if ($(this).position().top <= scrollDistance) {
$('.navigation a.active').removeClass('active');
$('.navigation a').eq(i).addClass('active');
}
});
}).scroll();
var bouge = 1;
var dimension = 200;
function activateelement()
{
var visibility = visibleElement('.animecourant-panel');
if(visibility && bouge == 0){
bouge = 1;
$('.toutleblock').css('position','relative');
$('.toutleblock').css('bottom','0px');
$('.toutleblock').css('margin-bottom','200px');
}
}
function stopelement()
{
var visibility = visibleElement('.stop-courant-panel');
if(visibility && bouge == 1){
if(visibleElement('.animecourant-panel') && visibleElement('.stop-courant-panel'))
{
}else{
bouge = 0;
$('.toutleblock').css('position','fixed');
$('.toutleblock').css('width',dimension+'px');
$('.toutleblock').css('bottom','7px');
$('.toutleblock').css('margin-bottom','200px');
}
}
}
function controlScroll()
{
var largeur = ($(window).width());
dimension = $('.toutleblock').width();
if (largeur >= 768)
{
if(visibleElement('.animecourant-panel') && visibleElement('.stop-courant-panel'))
{
$('.toutleblock').css('position','fixed');
$('.toutleblock').css('width',dimension+'px');
}else{
window.setInterval(function() { stopelement(); }, 100);
window.setInterval(function() { activateelement(); }, 100);
}
}
}
controlScroll();
$('#target-menu-blog-{{ article.type.id }}').addClass('position-current-user');
$('a').tooltip();
{% endblock %}