nicooprat

{{--
  Title: Témoignage
  Description: test
  Category: formatting
  Icon: admin-comments
  Keywords: testimonial quote
--}}

<blockquote data-{{$block['id']}} class="{{$block['classes']}}">
    <p>{{the_field('testimonial')}}</p>

nicooprat

function my_acf_block_render_callback( $block ) {
  $slug = str_replace('acf/', '', $block['name']);
  $block['slug'] = $slug;
  $block['classes'] = implode(' ', [$block['slug'], $block['className'], $block['align']]);
  echo \App\template("blocks/${slug}", ['block' => $block]);
}

add_action('acf/init', function() {
  if( function_exists('acf_register_block') ) {
    // Look into views/blocks

nicooprat

<?php
  /*
  Title: Témoignage
  Description: test
  Category: formatting
  Icon: admin-comments
  Keywords: testimonial quote
  */
?>

nicooprat

function my_acf_block_render_callback( $block ) {
  $slug = str_replace('acf/', '', $block['name']);
  $block['slug'] = $slug;
  $block['classes'] = implode(' ', [$block['slug'], $block['className'], $block['align']]);
  echo \App\template("blocks/${slug}", ['block' => $block]);
}

nicooprat

const { BugsnagBuildReporterPlugin, BugsnagSourceMapUploaderPlugin } = require('webpack-bugsnag-plugins')

module.exports = {
  ...
  build: {
    extend (config, { isDev, isClient }) {
      if (!isDev && isClient) {
        config.devtool = '#source-map'
        config.plugins.push(
          new BugsnagBuildReporterPlugin({

nicooprat

// Setting variables like this wouldn't be possible because SASS would 
// get through this file before Tailwind does (because it's PostCSS)

$--color-primary: theme('colors.blue');
$--font-serif: theme('fontFamily.serif');
  
body {
  color: rgba($--color-primary, .5);
  font-family: $font-serif;
}

nicooprat

const serverRenderer = require('vue-server-renderer')
const fs = require('fs')
const path = require('path')

// Don't need to create Vue components for MJML ones
Vue.config.ignoredElements = ['mjml', /^mj-/]

// Create a Vue instance
const app = new Vue({
  template: fs.readFileSync(path.resolve('./mjml.vue'), 'utf8'),

nicooprat

<mjml>
  <mj-body>
    <mj-section>
      <mj-column>
        <mj-image v-if="image" width="100px" :src="image"></mj-image>
        <mj-divider border-color="#F45E43"></mj-divider>
        <mj-text :font-size="large ? '20px' : '16px'" color="#F45E43" font-family="helvetica">{{ text }}</mj-text>
        <mj-button v-for="action in actions" :key="i" :href="action.href">
          {{ action.label }}
        </mj-button>

nicooprat

<template>
  <router-link v-for="(action, i) in actions" :key="i" :to="action.href" v-slot="{ href }">
    <mj-button :href="getAbsoluteURL(href)" font-family="Roboto, sans-serif" font-size="14px" :font-weight="action.type === 'primary' ? 'bold' : 'normal'" :background-color="action.type === 'primary' ? '#0072f0' : '#ffffff'" :color="action.type === 'primary' ? '#ffffff' : '#36404d'" padding-bottom="15px">
      {{ action.label }}
    </mj-button>
  </router-link>
</template>

<script>
  const app = new Vue({

nicooprat

const mjml2html = require('mjml')

renderer.renderToString(app, (err, mjml) => {
  if (err) throw err

  // Remove illegal MJML attribute added by Vue to avoid warnings
  mjml = mjml.replace('data-server-rendered="true"', '')

  // Compile MJML to raw HTML
  const { html, errors } = mjml2html(mjml)