nicooprat

/**
 * Prefetch pages to make navigation faster (from route to route)
 * Monkey patch router-link to trigger async import when the link is in the viewport
 * Use a queue & requestIdleCallback to prevent browser from freezing
 * Install in Vue 3 with `import prefetch from './prefetch` then `app.use(prefetch)`
 * */

import { watchPausable } from '@vueuse/core';
import { ref } from 'vue';
import { RouterLink, useRouter } from 'vue-router';

nicooprat

// Internally, do something like this

Promise
  .all([
    this.loadNewContent,
    this.transitionOut({
      fromRoute,
      event,
      oldContainer,
      promise

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

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

# BEGIN W3TC Browser Cache
<IfModule mod_mime.c>
    AddType text/css .css
    AddType text/x-component .htc
    AddType application/x-javascript .js
    AddType application/javascript .js2
    AddType text/javascript .js3
    AddType text/x-js .js4
    AddType text/html .html .htm
    AddType text/richtext .rtf .rtx

nicooprat

// --------------
// Needs LESS compiler >= 1.7.0
// Docs : http://lesscss.org/features/#detached-rulesets-feature
// --------------

// 1. Define the mixin for cross browser keyframes

.keyframes(@name,@rules) {

    @-webkit-keyframes @name {

nicooprat

const mailjet = nodeMailjet.connect(process.env.MAILJET_PUBLIC, process.env.MAILJET_PRIVATE)

// Send through Mailjet
mailjet.post('send', { version: 'v3.1' }).request({
  Messages: [{
    From: {
      Email: sender.email,
      Name: sender.name,
    },
    Subject: i18n.t('emails.a1.subject', { app: config.app }),

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)

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

<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>