reginpv

# My usecase would be deploying static site generated by Next.js into a shared hosting where generated files are in /out dir

RewriteEngine On
RewriteCond %{REQUEST_URI} /+[^\.]+$
RewriteRule ^(.+[^/])$ %{REQUEST_URI}/ [R=301,L]

reginpv

// Originally by: https://gist.github.com/SleepWalker/da5636b1abcbaff48c4d

let touchstartX = 0;
let touchstartY = 0;
let touchendX = 0;
let touchendY = 0;

const gestureZone = document.getElementById('gestureZone');

gestureZone.addEventListener('touchstart', function(event) {

reginpv

import Head from 'next/head';

const defaults = {
  title: ``,
  description: ``,
  image: ``,
  url: ``
}

export default (props)=>(

reginpv

isInViewport(el) {
  const scroll = window.scrollY || window.pageYOffset
  const boundsTop = el.getBoundingClientRect().top + scroll
  const viewport = {
    top: scroll,
    bottom: scroll + window.innerHeight,
  }
    const bounds = {
    top: boundsTop,
    bottom: boundsTop + el.clientHeight,

reginpv

Tip 1: Multi-step forms
Any forms longer than a few questions are broken up into separate steps so you don’t deter contacts from filling them out.

Tip 2: Only ask for the essentials
Your forms don’t include any fields that you don’t need.

Tip 3: Single file questions
There are no questions side-by-side.

Tip 4: Keep it simple

reginpv

RewriteEngine On

# Force ssl
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

# Point everything to /build - e.g. if you want to serve React's build in the root
RewriteRule ^$ /build/ [L]

# Map http://www.site.com/x to /build/x unless there is a x in the web root.

reginpv

<div class="element">
  Target Element to 100VH
</div>

reginpv

/**
* Detecting mobile landscape orientation / screen
* 812 iphone x height/width
*/
@media screen and (max-width: 812px) and (orientation:landscape) {
  // css rules here
}

reginpv

/**
* When you want a class or element to be 100vh or 100% but needs to scroll when needed
* Works ok on Chrome but on iOS Safari returns undesired result of scrolling / slow and not smooth
*/
.element {
  overflow-y: scroll; /* has to be scroll, not auto */
  -webkit-overflow-scrolling: touch;
}

reginpv

{% if template == 'index' %}
  {% comment %}
    Is HOME PAGE
  {% endcomment %}
{% endif %}