Skip to content

Instantly share code, notes, and snippets.

View blivesta's full-sized avatar

Yasuyuki Enomoto blivesta

382 followers · 0 following
View GitHub Profile
@blivesta
blivesta / wp-contact-form-7.tsx
Last active February 18, 2024 23:05
Use contact-form-7 API with React
import * as React from 'react';
import * as Yup from 'yup';
import axios from 'axios';
import { Formik } from 'formik';
const URL = process.env.WP_REST_API_BASE_URL;
const USER = process.env.WP_USER;
const PASSWORD = process.env.WP_APPLICATION_PASSWORD;
const TOKEN = typeof window !== 'undefined' && window.btoa(`${USER}:${PASSWORD}`); // Convert Base64
const CF7_ID = process.env.WP_CF7_ID;
@blivesta
blivesta / dom.js
Last active October 11, 2017 13:38
selectors
/**
* canUseDOM
* @return {Boolean}
*/
export const canUseDOM = !!(
typeof window !== 'undefined' && window.document && window.document.createElement
)
/**
* win
@blivesta
blivesta / FulidPlyr.js
Created August 24, 2017 08:55
const FulidPlyr = (parentSelector) => {
if (parentSelector === undefined) {
parentSelector = '.FulidPlyr'
}
let element = document.querySelector(parentSelector)
let ratio = 16 / 9
let height = window.innerHeight
let width = window.innerWidth
let windowRatio = width / height
@blivesta
blivesta / check-direction.js
Created July 7, 2017 08:03
import checkPls from 'check-pls'
import ImagesLoaded from 'imagesLoaded'
/*
@parentSelectors = []
@selector = ''
@className = ''
*/
const checkDirection = (parentSelectors, selector, className) => {
@blivesta
blivesta / getElements.js
Created July 6, 2017 05:10
export function getElements (class) {
return Array.prototype.slice.call(document.querySelectorAll('.' + class));
}
@blivesta
blivesta / sircus-gutter-system.html
Last active April 30, 2017 14:18
Sircus Gutter System
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<title>Gutter Control</title>
<style type="text/css">
/* debug */
* {
background-color: rgba(0, 230, 200, .2);
}
@blivesta
blivesta / doorman-options.html
Last active September 1, 2017 04:47
<div
data-doorman-direction="lr"
data-doorman-bgColor="rgb(000, 000, 000)"
data-doorman-duration="300"
data-doorman-delay="150"
data-doorman-easing="cubic-bezier(0.860, 0.000, 0.070, 1.000)"
data-doorman-reverse="false"
>
Content...
</div>
@blivesta
blivesta / doorman-options.js
Last active January 28, 2017 13:39
{
direction: 'lr',
// lr (left to right) || rl (right to left) || tb (top to bottom) || bt (bottom to top).
bgColor: 'rgb(000, 000, 000)',
duration: '300', // ms
delay: '0', // ms
easing: 'cubic-bezier(0.860, 0.000, 0.070, 1.000)', // easeInOutQuint
reverse: false,
begin: function(element) { },
complete: function(element) { }
@blivesta
blivesta / doorman-with-scrollmonitor.html
Last active February 8, 2017 15:47
<style>
.section {
height: 100vh;
}
[data-doorman] {
display: inline-block;
visibility: hidden;
}
</style>
@blivesta
blivesta / doorman-multiple.js
Created January 28, 2017 13:18
const elements = document.querySelectorAll('[data-doorman]');
Array.prototype.forEach.call(elements, function (el) {
const doorman = new Doorman(el, { /* options */ });
doorman.start();
});