form + filter

user/pages/01.home/01.contact/item.md

@@ -2,6 +2,8 @@
 title: contact
 ---
 
-Faux-texte: a pour fonction de faire office de texte de substitution ou d'outil permettant la comparaison et l'appréciation de différentes polices.
-
-On appelle Lipsum un texte qui, en l'absence du texte définitif, sert de substitut aux futurs contenus lors de la production de maquettes pour les publications ou sites Web. Le terme Lipsum est issu de la contraction du plus connu de ce type de texte "Lorem ipsum". Ils sont également connus sous les noms de texte blanc, faux-texte, bolo bolo, pseudo texte, texte factice, vrai faux texte, faux contenu, texte de remplissage, de remplacement, ou d'attente. Outre son usage dans les milieux de l'imprimerie et du graphisme, certains chansonniers en font l'utilisation lors de la composition de mélodies, chantant ces textes en amont de l'écriture de leur textes. L'utilisation de faux-textes aurait déjà été une pratique courante depuis le 16ème siècle dans les milieux de l'imprimerie et de la composition.
+adresse
+adresse
+téléphone
+mail
+horaires

user/pages/01.home/default.md

@@ -10,7 +10,7 @@ content:
 texte de présentation du campus texte de présentation du campus texte de présentation du campus texte de présentation du campus texte de présentation du campus texte de présentation du campus 
 texte de présentation du campus.texte de présentation du campus texte de présentation du campus texte de présentation du campus texte de présentation du campus texte de présentation du campus 
 texte de présentation du campus texte de présentation du campus. texte de présentation du campus texte de présentation du campus texte de présentation du campus texte de présentation du campus
-[tout savoir sur le campus](/lecampus)
+[tout savoir sur le campus](/qui-sommes-nous/le-campus)
 
 ![](imgtest.jpg)**Le Campus, au coeur du Val de Drôme, un site tout équipé pour vos événements.**
 5 salles à louer :

user/pages/05.demande-de-devis/form.md

@@ -1,5 +1,7 @@
 ---
 title: 'Demande de devis'
+published: true
+visible: false
 form:
     name: ajax-test-form
     fields:
@@ -11,7 +13,6 @@ form:
             type: select
             size: long
             classes: fancy
-            help: PLUGIN_ADMIN.DEFAULT_ORDERING_HELP
             options:
                 reunion: Réunion
                 seminaire: Séminaire
@@ -23,26 +24,89 @@ form:
                 evenement_culturel: 'Evènement culturel'
                 autre: Autres
         -
-            name: 'Quelle sera l''envergure de votre évènement ?'
-            type: radio
-            default: markdown
+            name: '2 Quelle sera l''envergure de votre évènement ?'
+            placeholder: 'Nombre de personnes'
+            autofocus: 'on'
+            autocomplete: 'on'
+            type: select
+            size: long
+            classes: fancy
             options:
-                -25: '<= 25 personnes'
-                -50: '<= 50 personnes'
-                -100: '<= 100 personnes'
+                25: '<= 25 personnes'
+                50: '<= 50 personnes'
+                100: '<= 100 personnes'
                 150: 'Plus de 150 personnes'
+        -
+            name: '3 Quand se déroulera votre évènement ?'
+            placeholder: 'Choisissez vos date ?'
+            autofocus: 'on'
+            autocomplete: 'on'
+            type: select
+            size: long
+            classes: fancy
+            options:
+                1/2j: '1/2 journée'
+                1j: '1 jour'
+                1s: '1 soirée'
+                2j: '2 jours'
+                3j: '3 jours'
+                +3j: 'Plus de 3 jours'
+        -
+            name: Prenom
+            placeholder: prenom
+            type: text
+            size: long
+            classes: fancy
+        -
+            name: Nom
+            placeholder: nom
+            type: text
+            size: long
+            classes: fancy
+        -
+            name: Email
+            placeholder: Email
+            type: email
+            size: long
+            classes: fancy
+        -
+            name: phone
+            placeholder: Télphone
+            type: text
+            size: long
+            classes: fancy
+        -
+            name: fonction
+            placeholder: fonction
+            type: text
+            size: long
+            classes: fancy
+        -
+            name: société
+            placeholder: Société
+            type: text
+            size: long
+            classes: fancy
+        -
+            name: 'Votre profil'
+            placeholder: 'quel est votre profil'
+            autofocus: 'on'
+            autocomplete: 'on'
+            type: select
+            size: long
+            classes: fancy
+            options:
+                Agence_evenementielle: 'Agence évènementielle'
+                associations: 'Associations (sociétés savantes, fédérations, syndicats) '
+                societes_entreprises: 'Sociétés / Entreprises'
+                Organismes_professionnels: 'Orgaismes Professionnels'
     buttons:
         -
             type: submit
-            value: Submit
-        -
-            type: reset
-            value: Reset
+            value: Envoyer
     process:
         -
             message: 'Thank you for your feedback!'
-        -
-            display: /demande-de-devis/thankyou
         -
             email:
                 from: kvntssr@gmail.com

user/themes/lecampus/blueprints/archive.yaml

@@ -0,0 +1,92 @@
+extends@: default
+child_type: item
+
+rules:
+  slug:
+    pattern: "[a-z][a-z0-9_\-]+"
+    min: 2
+    max: 80
+
+form:
+  fields:
+    tabs:
+      type: tabs
+      active: 1
+
+      fields:
+        advanced:
+          fields:
+            overrides:
+              fields:
+                header.child_type:
+                  default: item
+        blog:
+          type: tab
+          title: Blog Config
+
+          fields:
+
+            content_title:
+              type: spacer
+              title: Content Definition
+
+            header.content.items:
+              type: textarea
+              yaml: true
+              label: Items
+              default: '@self.children'
+              validate:
+                type: yaml
+
+            header.content.limit:
+              type: text
+              label: Max Item Count
+              default: 5
+              validate:
+                required: true
+                type: int
+                min: 1
+
+            header.content.order.by:
+              type: select
+              label: Order By
+              default: date
+              options:
+                folder: Folder
+                title: Title
+                date: Date
+                default: Default
+
+            header.content.order.dir:
+              type: select
+              label: Order
+              default: desc
+              options:
+                asc: Ascending
+                desc: Descending
+
+            header.content.pagination:
+              type: toggle
+              label: Pagination
+              highlight: 1
+              default: 1
+              options:
+                1: PLUGIN_ADMIN.ENABLED
+                0: PLUGIN_ADMIN.DISABLED
+              validate:
+                type: bool
+
+            header.content.url_taxonomy_filters:
+              type: toggle
+              label: URL Taxonomy Filters
+              highlight: 1
+              default: 1
+              options:
+                1: PLUGIN_ADMIN.ENABLED
+                0: PLUGIN_ADMIN.DISABLED
+              validate:
+                type: bool
+
+          import@:
+            type: partials/blog-bits
+            context: blueprints://pages

user/themes/lecampus/js/site.js

@@ -1,32 +1,14 @@
 function map() {
 
-  var mymap = L.map('map').setView([51.505, -0.09], 13);
+  var mymap = L.map('carte').setView([44.7365818, 4.9776488], 13);
 
 	L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
 		maxZoom: 18,
-		attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
-			'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
-			'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
 		id: 'mapbox.streets'
 	}).addTo(mymap);
 
-	L.marker([51.5, -0.09]).addTo(mymap)
-		.bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup();
-
-	L.circle([51.508, -0.11], 500, {
-		color: 'red',
-		fillColor: '#f03',
-		fillOpacity: 0.5
-	}).addTo(mymap).bindPopup("I am a circle.");
-
-	L.polygon([
-		[51.509, -0.08],
-		[51.503, -0.06],
-		[51.51, -0.047]
-	]).addTo(mymap).bindPopup("I am a polygon.");
-
-
-	var popup = L.popup();
+	L.marker([44.7365818, 4.9776488]).addTo(mymap)
+		.bindPopup("<b>Hello world!</b><br />I am le campus.").openPopup();
 
 	function onMapClick(e) {
 		popup
@@ -44,28 +26,21 @@ function filteritem() {
   var $cat = $('.cat a');
   var $img = $('#item .img');
 
-  var $grid = $card.masonry({
+  var $grid = $('#archive #item, #calendrier #item').masonry({
+    // columnWidth: 200,
     itemSelector: '.card',
-    columnWidth: '.card',
-    percentPosition: true,
     gutter: 10,
     transitionDuration: '0.2s'
   });
 
-  // $card.masonry({
-  //   itemSelector: '.grid-item',
-  //   columnWidth: '.grid-sizer',
-  //   percentPosition: true
-  // })
-
   $grid.imagesLoaded().progress(function() {
       $grid.masonry();
   });
 
-//   $card.multipleFilterMasonry({
-//       itemSelector: '.card',
-//       filtersGroupSelector: '.tags'
-//   });
+  $grid.multipleFilterMasonry({
+    itemSelector: '.card',
+    filtersGroupSelector:'.filters'
+  });
 }
 
 function slide() {
@@ -76,11 +51,26 @@ function slide() {
       active: false
     }
   });
+}
+
+function links() {
+  href="/organisez-vos-evenements"
+  var $a = $('li a[href="/organisez-vos-evenements"]');
+  var $map = $('a#carte');
+  $a.on('click', function(e) {
+    e.preventDefault();
+  })
+
+  $map.on('click', function(e) {
+    e.preventDefault();
+  })
+
 
 }
 
 jQuery(document).ready(function($){
+  links();
   slide();
+  filteritem();
   map();
-  // filteritem();
 });

user/themes/lecampus/scss/configurations/_reset.scss

@@ -50,7 +50,7 @@ main {
  */
 
 h1 {
-  font-size: 2rem; 
+  font-size: 2rem;
   margin:0;
 }
 

user/themes/lecampus/scss/theme/_blog.scss

@@ -1,5 +1,4 @@
 // home
-
 .gal{
   width: 100%;
   height:400px;
@@ -41,38 +40,71 @@
 
 .cat{
   height: 50px;
-  a{
+  z-index: 999;
+  margin: 20px 0;
+  .tags{
+    @include inlineflex();
+    margin-left: 15px;
+  }
+  .filters{
     padding: 10px;
     border: 1px solid black;
+    margin-right: 20px;
   }
 }
 
-#item{
-  @include inlineflex();
-  width: 100%;
-  .card{
-    width: calc( (100% / 4) - 45px);
-    min-width: 250px;
-    margin: 0 15px 30px 15px;
-    position: relative;
-    border: 1px solid black;
-    .card-header{
-      width: auto;
-      position: absolute;
-      right: 0;
-      text-align: right;
-      .publics{
-        padding: 10px;
-        background: grey;
-        a{
-          color: white;
+.start:not(#form){
+  #item{
+    @include inlineflex();
+    width: 100%;
+    .card{
+      width: calc( (100% / 4) - 45px);
+      min-width: 250px;
+      margin: 0 15px 30px 15px;
+      border: 1px solid black;
+      .card-header{
+        position: absolute;
+        width: auto;
+        right: 0;
+        text-align: right;
+        .publics{
+          padding: 10px;
+          background: grey;
+          a{
+            color: white;
+          }
+        }
+      }
+      .card-body{
+        padding: 15px;
+        .card-title{
+          margin-bottom: 10px;
         }
       }
     }
-    .card-body{
-      padding: 15px;
-      .card-title{
-        margin-bottom: 10px;
+  }
+}
+
+.start#form{
+  #item{
+    width: calc( (100% / 2));
+    min-width: 250px;
+    margin: 100px auto;
+    form{
+      @include inlineflex();
+      margin-top: 20px;
+      & > div{
+        margin: 20px 0;
+        width: 50%;
+        &:nth-of-type(3){
+          width: 100%;
+        }
+        input{
+          width: 90%;
+        }
+        &:nth-of-type(10){
+          width: 100%;
+        }
       }
     }
   }
@@ -132,12 +164,46 @@
   }
 }
 
-.sub-content{
-  border-top: 1px solid black;
-  margin-bottom: 20px;
-  margin-top: 20px;
-  h3{
+#item{
+  .sub-content{
+    border-top: 1px solid black;
+    margin-bottom: 20px;
     margin-top: 20px;
+    h3{
+      margin-top: 20px;
+    }
+  }
+}
+
+
+#event{
+  .content{
+    margin-top: 50px;
+    h2{
+      float: left;
+      margin-right: 20px;
+    }
+    .reso{
+      @include inlineflex;
+      flex-wrap: nowrap;
+      width: 50px;
+      height: 25px;
+    }
+  }
+  .sidebar{
+    margin-top: 50px;
+  }
+}
+
+#footer{
+  @include inlineflex;
+  .sub-content{
+    width: calc((100% / 3) - 40px);
+    border-top: 1px solid black;
+    margin: 20px;
+    h3{
+      margin-top: 20px;
+    }
   }
 }
 
@@ -168,11 +234,3 @@
 #footer{
   margin-top: 20px;
 }
-
-
-// .card{
-//   height: 100px;
-//   .card-image{
-//     height: 100px;
-//   }
-// }

user/themes/lecampus/scss/theme/_footer.scss

@@ -7,8 +7,8 @@
   }
 }
 
-a#map{
+a#carte{
     display: block;
-  height: 300px;
-  width: 300px;
+  height: 500px;
+  width: 100%;
 }

user/themes/lecampus/scss/theme/_header.scss

@@ -3,9 +3,9 @@
   position: relative;
   nav{
     @include inlineflex();
-    justify-content: space-between;
+    justify-content: space-around;
     height: 100px;
-    width: auto;
+    width: 100%;
     a{
       padding: 10px;
     }
@@ -17,7 +17,7 @@
         & > ul{
           display: none;
         }
-        &:nth-last-child(-n+2){
+        &:nth-last-child(-n+1){
           & > a{
             display: block;
             height: 100px;
@@ -48,6 +48,7 @@
     }
     .desktop-menu{
       @include inlineflex;
+      flex-wrap: nowrap;
     }
   }
 }

user/themes/lecampus/scss/theme/_typography.scss

@@ -10,6 +10,11 @@ h2{
   font-size: 2rem;
 }
 
+h4{
+  font-weight: normal;
+  font-size: 2rem;
+}
+
 h5{
   font-weight: normal;
   font-size: 1.2rem;

user/themes/lecampus/templates/archive.html.twig

@@ -0,0 +1,39 @@
+{% extends 'partials/base.html.twig' %}
+{% set blog_image = page.media.images[page.header.hero_image] ?: page.media.images|first %}
+{% set collection = page.collection() %}
+{% set blog = page.find(header_var('blog_url')|defined(theme_var('blog-page'))) %}
+{% set show_breadcrumbs = header_var('show_breadcrumbs', [page, blog])|defined(true) %}
+{% set show_sidebar = header_var('show_sidebar', [page, blog])|defined(true)  %}
+{% set show_pagination = header_var('show_pagination', [page, blog])|defined(true) %}
+
+{% block hero %}
+    {% include 'partials/hero.html.twig' with {id: 'blog-hero', content: page.content, hero_image: blog_image} %}
+{% endblock %}
+
+{% block body %}
+  <section id="body-wrapper" class="section blog-listing">
+      <section class="container {{ grid_size }}">
+        <div class="cat">
+          {% include 'partials/taxonomylist.html.twig' with {base_url: my_url, taxonomy: 'tag'} %}
+        </div>
+      {% if show_breadcrumbs and config.plugins.breadcrumbs.enabled %}
+          {% include 'partials/breadcrumbs.html.twig' %}
+      {% endif %}
+
+      {% embed 'partials/layout.html.twig' with {blog: page} %}
+
+          {% block item %}
+            {% for child in page.find('/agenda').children %}
+
+              {% if child.header.date_end|date("d/m/y") <= "now"|date("d/m/y") %}
+              {{child.title}}
+                {% include 'partials/cal-list-event.html.twig' with {blog: page, page: child} %}
+              {% endif %}
+
+            {% endfor %}
+          {% endblock %}
+      {% endembed %}
+      </section>
+  </section>
+
+{% endblock %}

user/themes/lecampus/templates/blog.html.twig

@@ -21,13 +21,9 @@
         {% endfor %}
       </div>
 
-      {% if show_sidebar %}
         {% block sidebar %}
           {% include 'partials/sidebar.html.twig' %}
-        {% endblock %}
-      {% endif %}
-
-
-  </section>
+        {% endblock %}  
+      </section>
 
 {% endblock %}

user/themes/lecampus/templates/calendrier.html.twig

@@ -11,9 +11,12 @@
 {% endblock %}
 
 {% block body %}
+
   <section id="body-wrapper" class="section blog-listing">
       <section class="container {{ grid_size }}">
-
+        <div class="cat">
+          {% include 'partials/taxonomylist.html.twig' with {base_url: my_url, taxonomy: 'tag'} %}
+        </div>
       {% if show_breadcrumbs and config.plugins.breadcrumbs.enabled %}
           {% include 'partials/breadcrumbs.html.twig' %}
       {% endif %}
@@ -21,15 +24,16 @@
       {% embed 'partials/layout.html.twig' with {blog: page} %}
 
           {% block item %}
-          <div class="cat">
-            {% include 'partials/taxonomylist.html.twig' with {base_url: my_url, taxonomy: 'tag'} %}
-          </div>
-          {% for child in collection %}
-              {% include 'partials/cal-list-event.html.twig' with {blog: page, page: child} %}
-          {% endfor %}
+            {% for child in collection %}
+              {% if child.header.date_end|date("d/m/y") >= "now"|date("d/m/y") %}
+                {% include 'partials/cal-list-event.html.twig' with {blog: page, page: child} %}
+              {% endif %}
 
+            {% endfor %}
           {% endblock %}
+
       {% endembed %}
+
       </section>
   </section>
 

user/themes/lecampus/templates/event.html.twig

@@ -28,7 +28,7 @@
 
         {% embed 'partials/layout.html.twig' %}
           {% block item %}
-            {% include 'partials/blog-item.html.twig' %}
+            {% include 'partials/cal-event.html.twig' %}
           {% endblock %}
         {% endembed %}
     </section>

user/themes/lecampus/templates/footer.html.twig

@@ -10,7 +10,9 @@
     {% endif %}
 
     {% for item in collection %}
+    <div class="sub-content">
       <h3>{{item.title}}</h3>
       {{item.content}}
+    </div>
     {% endfor %}
   </section>

user/themes/lecampus/templates/item.html.twig

@@ -20,8 +20,6 @@
 {% endblock %}
 
 {% block body %}
-<section id="body-wrapper" class="section blog-listing">
-    <section class="container {{ grid_size }}">
       {% if show_breadcrumbs and config.plugins.breadcrumbs.enabled %}
           {% include 'partials/breadcrumbs.html.twig' %}
       {% endif %}
@@ -35,6 +33,5 @@
       {% for child in page.collection %}
         {{child.content}}
       {% endfor %}
-    </section>
-</section>
+
 {% endblock %}

user/themes/lecampus/templates/partials/base.html.twig

@@ -24,11 +24,11 @@
     {% block javascripts %}
 
         {% do assets.addJs('jquery', 101) %}
+        {% do assets.addJs('theme://js/leaflet.js', {group:'bottom'}) %}
         {% do assets.addJs('theme://js/masonry.pkgd.min.js', {group:'bottom'}) %}
-        {% do assets.addJs('theme://js/imagesloaded.pkgd.min.js', {group:'bottom'}) %}
         {% do assets.addJs('theme://js/multipleFilterMasonry.js', {group:'bottom'}) %}
+        {% do assets.addJs('theme://js/imagesloaded.pkgd.min.js', {group:'bottom'}) %}
         {% do assets.addJs('theme://js/jquery.slides.min.js', {group:'bottom'}) %}
-        {% do assets.addJs('theme://js/leaflet.js', {group:'bottom'}) %}
         {% do assets.addJs('theme://js/site.js', {group:'bottom'}) %}
 
     {% endblock %}
@@ -47,22 +47,20 @@
                   <a href="/"><h1>{{site.title}}</h1></a>
                 </section>
                 <section class="desktop-menu">
-
-                    <nav class="dropmenu animated">
-                    {% block header_navigation %}
-                        {% include 'partials/navigation.html.twig' %}
-                    {% endblock %}
-
-                    </nav>
-
-                    {% if config.plugins.login.enabled and grav.user.username %}
-                        <span class="login-status-wrapper"><i class="fa fa-user"></i> {% include 'partials/login-status.html.twig' %}</span>
-                    {% endif %}
-
-                    <div class="reso">
-                      <img src="/user/themes/lecampus/images/fb.svg" alt="">
-                      <img src="/user/themes/lecampus/images/yt.svg" alt="">
-                    </div>
+                  <nav class="dropmenu animated">
+                  {% block header_navigation %}
+                      {% include 'partials/navigation.html.twig' %}
+                  {% endblock %}
+                  </nav>
+
+                  {% if config.plugins.login.enabled and grav.user.username %}
+                    <span class="login-status-wrapper"><i class="fa fa-user"></i> {% include 'partials/login-status.html.twig' %}</span>
+                  {% endif %}
+
+                  <div class="reso">
+                    <img src="/user/themes/lecampus/images/fb.svg" alt="">
+                    <img src="/user/themes/lecampus/images/yt.svg" alt="">
+                  </div>
                 </section>
             </nav>
         </section>

user/themes/lecampus/templates/partials/blog/title.html.twig

@@ -7,5 +7,5 @@
         <a href="{{ page.header.link }}" class="u-url">{{ page.title }}</a>
     </{{ title_level }}>
 {% else %}
-    <{{ title_level }} class="p-name mt-1"><a href="{{ page.url }}" class="u-url">{{ page.title }}</a></{{ title_level }}>
+    <{{ title_level }}>{{ page.title }}</{{ title_level }}>
 {% endif %}

user/themes/lecampus/templates/partials/cal-event.html.twig

@@ -1,23 +1,14 @@
 {% set image = page.media.images|first %}
 
-<div class="content-item h-entry">
-{% if not hero_image_name %}
-  <div class="content-title text-center">
-    {% include 'partials/blog/title.html.twig' with {title_level: 'h2'} %}
-    {% if page.header.subtitle %}
-    <h3 >{{ page.header.subtitle }}</h3>
-    {% endif %}
-    {% include 'partials/blog/public.html.twig' %}
-    {% include 'partials/blog/date.html.twig' %}
-    {% include 'partials/blog/reseaux_sociaux.html.twig' %}
-  </div>
-{% endif %}
-
-    <div class="e-content">
-        {% if image %}
-          {{ image.html }}
-        {% endif %}
-        {{ page.content|raw }}
+  {% if not hero_image_name %}
+    <div class="content">
+      {% include 'partials/blog/title.html.twig' with {title_level: 'h2'} %}
+      <div class="reso">
+        <img src="/user/themes/lecampus/images/fb.svg" alt="">
+      </div>
+      {% if page.header.subtitle %}
+      <h3 >{{ page.header.subtitle }}</h3>
+      {% endif %}
+      {{ page.content|raw }}
     </div>
-
-</div>
+  {% endif %}

user/themes/lecampus/templates/partials/cal-list-event.html.twig

@@ -1,4 +1,6 @@
-<div class="card">
+  {% for tag in page.taxonomy.tag %}
+  <div class="card {{tag}} Tous">
+  {% endfor %}
     <div class="card-header">
       {% include 'partials/blog/public.html.twig' %}
     </div>
@@ -14,11 +16,13 @@
         {% include 'partials/blog/date.html.twig' %}
     </div>
     <div class="card-summary">
+      <a href="{{ page.url }}">
       {% if page.summary != page.content %}
           {{ page.summary|raw }}
       {% else %}
           {{ page.content|raw }}
       {% endif %}
+      </a>
     </div>
   </div>
 </div>

user/themes/lecampus/templates/partials/footer.html.twig

@@ -3,7 +3,9 @@
 
 <section id="footer" class="section blog-listing">
   {% for p in page.find('/home').children if p != page %}
-    <h1>{{p.title}}</h1>
-    {{p.content}}
+    <div class="sub-content">
+      <h2>{{p.title}}</h2>
+      {{p.content}}
+    </div>
   {% endfor %}
 </section>

user/themes/lecampus/templates/partials/layout.html.twig

@@ -3,9 +3,11 @@
 
 <div id="item">
     {% block item %}{% endblock %}
+
     {% if show_sidebar %}
       {% block sidebar %}
         {% include 'partials/sidebar.html.twig' %}
       {% endblock %}
     {% endif %}
+    
 </div>

user/themes/lecampus/templates/partials/taxonomylist.html.twig

@@ -1,12 +1,32 @@
 {% set taxlist = children_only is defined ? taxonomylist.getChildPagesTags() : taxonomylist.get() %}
 
 {% if taxlist %}
-<span class="tags">
-  <a class="" href="#">Tous</a>
+<div class="tags">
+  <div class="btn-toolbar filters">
+    <div data-toggle="buttons" class="btn-group">
+      <label class="btn btn-default">
+        <input type="checkbox" value=Tous >
+        Tous
+      </label>
+    </div>
+  </div>
     {% for tax,value in taxlist[taxonomy] %}
         {% set label_class = uri.param(taxonomy) == tax ? 'label-primary' : 'label-secondary' %}
-        <a class="label label-rounded {{ label_class }}" href="{{ base_url }}/{{ taxonomy }}{{ config.system.param_sep }}{{ tax }}">{{ tax }}</a>
+        <div class="btn-toolbar filters">
+          <div data-toggle="buttons" class="btn-group">
+            <label class="btn btn-default">
+              <input type="checkbox" value={{tax}} >
+              {{tax}}
+            </label>
+          </div>
+        </div>
     {% endfor %}
-    <a class="" href="#">Achives</a>
-</span>
+    <div class="btn-toolbar filters">
+      <div data-toggle="buttons" class="btn-group">
+        <label class="btn btn-default">
+          <a href="/archive">archive</a>
+        </label>
+      </div>
+    </div>
+</div>
 {% endif %}