var Phenix = function () {

Troll du Web depuis 1996

Un fichier sourcemap SASS pour Foundation

Un de mes collègues a trouvé une solution pour avoir un fichier source map quand on compile Foundation.

Son fichier fait d’autres trucs, je n’ai extrait que la partie source map.

On commence par installer gulp-sourcemap :

  1. npm install gulp-sourcemaps --save-dev

Ensuite on adapte le fichier gulpfile.js pour qu’il génère le sourcemap :

  1. var gulp = require('gulp');
  2. var $ = require('gulp-load-plugins')();
  3.  
  4. var sassPaths = [
  5. 'bower_components/foundation-sites/scss',
  6. 'bower_components/motion-ui/src'
  7. ];
  8.  
  9. gulp.task('sass', function() {
  10. return gulp.src('scss/app.scss')
  11. .pipe($.sourcemaps.init())
  12. .pipe($.sass({
  13. includePaths: sassPaths,
  14. outputStyle: 'compressed' // if css compressed **file size**
  15. }).on('error', $.sass.logError))
  16. .pipe($.autoprefixer({
  17. browsers: ['last 2 versions', 'ie >= 9']
  18. }))
  19. .pipe($.sourcemaps.write('../css'))
  20. .pipe(gulp.dest('css'));
  21. });
  22.  
  23. gulp.task('default', ['sass'], function() {
  24. gulp.watch(['scss/**/*.scss'], ['sass']);
  25. });

Menu responsive avec foundation

Depuis la version 6 du framework SASS/CSS Foundation, le composant qui sert à créer le menu principal du site, à savoir la « top bar » n’est plus un menu responsif « out of the box ».

C’est a vous d’en construire un avec les composants, comme l’explique la documentation.

Voici une structure html qui devrait couvrir la majorité des besoins. N’ont pas que c’est bien compliqué à réaliser, mais j’en ai marre de la refaire encore et toujours.

  1. <div class="title-bar" data-responsive-toggle="main-menu" data-hide-for="medium">
  2. <button class="menu-icon" type="button" data-toggle></button>
  3. <div class="title-bar-title">Menu</div>
  4. </div>
  5. <div class="top-bar" id="main-menu">
  6. <div class="top-bar-left">
  7. <ul class="vertical medium-horizontal menu dropdown" data-responsive-menu="drilldown medium-dropdown" data-parent-link="true">
  8. <li>
  9. <a href="#">Lien</a>
  10. <ul class="menu vertical">
  11. <li>
  12. <a href="">Lien</a>
  13. <ul class="menu vertical">
  14. <li>
  15. <a href="">Lien</a>
  16. </li>
  17. <li>
  18. <a href="">Lien</a>
  19. </li>
  20. <li>
  21. <a href="">Lien</a>
  22. </li>
  23. </ul>
  24. </li>
  25. <li>
  26. <a href="">Lien</a>
  27. </li>
  28. <li>
  29. <a href="">Lien</a>
  30. </li>
  31. </ul>
  32. </li>
  33. <li><a href="#">Lien</a></li>
  34. <li><a href="#">Lien</a></li>
  35. <li><a href="#">Lien</a></li>
  36. <li><a href="#">Lien</a></li>
  37. <li><a href="#">Lien</a></li>
  38. </ul>
  39. </div>
  40. </div>

Trier par date dans les métas

Voici un exemple de $args qui permet d’ordonner une liste de post selon une date stocker dans les métas de Wordpress (table wp_postmeta). C’est pratique pour tout un tas de plus de calendrier !

  1. <?php
  2. // Agenda
  3. $args = array(
  4. 'post_type' => 'events',
  5. 'meta_query' => array(
  6. // Exclure les éléments du passé
  7. 'key' => '_EventStartDate',
  8. 'value' => current_time( 'Y-m-d h:m:s' ),
  9. 'compare' => '>',
  10. ),
  11. ),
  12. 'orderby' => '_EventStartDate',
  13. 'posts_per_page' => 3,
  14. );
Voir en ligne : Ordering custom posts by meta field date


Formidablement illisible...

J’ai trouvé ce bout de code dans le plugin formidable de SPIP, je cherchais un moyen d’exporter les réponses d’un formulaire.

Franchement comment savoir ce que contient $exporter ? Ça pourrait être n’importe quoi...
Je suis pas toujours super chaud pour mettre des fonctions dans des variables. S’il est possible de faire une structure de if ... else, je pense que c’est plus souhaitable. Bien sur, il y a beaucoup de cas ou c’est très pratique, mais ici, j’ai comme un doute.

  1. <?php
  2. if ($id_formulaire > 0
  3. and $type_export
  4. and $types_echange = echanges_formulaire_lister_disponibles()
  5. and $exporter = $types_echange['exporter'][$type_export]
  6. ){
  7. $exporter($id_formulaire);
  8. }