Skip to content

Instantly share code, notes, and snippets.

<!-- Open graph -->
@php
$form = $page['props']['form'];
$backgroundColor = urlencode($form->branding->primary_color); // $form->branding->primary_color is a hex string e.g '#333333'
$title = urlencode($form->name);
if (!is_null($form->branding->logo)) {
$image = urlencode($form->branding->logo);
$ogImage = "https://api.placid.app/u/xcqiqw9tj?Background[background_color]={$backgroundColor}&FormName[text]={$title}&Logo[image]={$image}";
} else {
$ogImage = "https://api.placid.app/u/3uugfu8j8?Background[background_color]={$backgroundColor}&FormName[text]={$title}";
@BjornDCode
BjornDCode / machine.js
Last active October 5, 2021 16:19
Generated by XState Viz: https://xstate.js.org/viz
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
@BjornDCode
BjornDCode / index.js
Created September 28, 2021 09:44
Reform in NextJS
import { useEffect } from 'react'
import Script from 'next/script'
export default function Home() {
useEffect(() => {
window.Reform=window.Reform||function(){(Reform.q=Reform.q||[]).push(arguments)};
window.Reform('init', {
url: '', // Form URL
@BjornDCode
BjornDCode / index.js
Last active August 13, 2021 07:37
Embed form in Next.js
import Head from 'next/head'
export default function Home() {
return (
<div>
<Head>
<script type="text/javascript">
{`
window.Reform=window.Reform||function(){(Reform.q=Reform.q||[]).push(arguments)}
`}
@BjornDCode
BjornDCode / index.js
Last active August 10, 2021 09:31
Embed Reform in Gatsby JSX
// Install and setup gatsby-plugin-react-helmet plugin (https://www.gatsbyjs.com/plugins/gatsby-plugin-react-helmet/)
import * as React from 'react'
import { Helmet } from 'react-helmet'
const IndexPage = () => {
return (
<main>
<Helmet>
<script type="text/javascript">
@BjornDCode
BjornDCode / gist:5cb836a6b23638d6d02f5cb6ed59a04a
Created February 3, 2020 11:58
Tailwind - Fixed sidebar, scrollable content
// Source: https://twitter.com/calebporzio/status/1151876736931549185
<div class="flex">
<aside class="h-screen sticky top-0">
// Fixed Sidebar
</aside>
<main>
// Content
</main>