A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.
One-line version to paste in your DevTools
Use $$
if your browser aliases it:
~ 108 byte version
const differenceInDays = require('date-fns/differenceInDays') | |
const parseISO = require('date-fns/parseISO') | |
const sanity = require('@sanity/client') | |
const exportDataset = require('@sanity/export') | |
const { google } = require('googleapis') | |
const fetch = require('node-fetch') | |
const path = require('path') | |
const fs = require('fs') | |
const FOLDER_ID = process.env.FOLDER_ID |
const isDraft = id => id.includes('drafts') | |
export default function resolveProductionUrl(document) { | |
if (!isDraft(document._id)) return undefined | |
const url = 'https://your-website.com' | |
if (document._type === 'recipe') { | |
return `${url}/rezepte/preview/?preview_id=${document._id}` | |
} |
<template> | |
<component :is="currentComponent" | |
v-if="draft" | |
:person="draft" | |
:page="draft" /> | |
<p v-else>{{ msg }}</p> | |
</template> |
import React from 'react' | |
import TextInput from 'part:@sanity/components/textinputs/default' | |
import FormField from 'part:@sanity/components/formfields/default' | |
import Button from 'part:@sanity/components/buttons/default' | |
import PropTypes from 'prop-types' | |
import ky from './ky' | |
const Furigana = require('gem-furigana').Furigana | |
import { |
<template> | |
<figure> | |
<v-lazy-image :src="img" | |
:src-placeholder="lqip" | |
class="w-full object-cover" | |
:alt="alt" /> | |
<figcaption class="mt-3 max-w-sm"> | |
<span class="block font-bold text-2xl leading-tight">{{ title }}</span> | |
<span class="block text-base tracking-wide">{{ subtitle }}</span> | |
</figcaption> |
const {google} = require('googleapis'); | |
const path = require('path'); | |
const fs = require('fs'); | |
function getCredentials() { | |
const filePath = path.join(__dirname, 'keys.json'); | |
if (fs.existsSync(filePath)) { | |
return require(filePath); | |
} | |
if (process.env.CREDENTIALS) { |
const sanity = require('@sanity/client') | |
const fs = require('fs') | |
const EOL = require('os').EOL | |
const flatMap = require('lodash.flatmap') | |
const { subDays, isBefore } = require('date-fns') | |
const sanityExport = require('@sanity/export') | |
/** | |
* @param context {WebtaskContext} | |
*/ |
import Vue from 'vue' | |
import imageUrlBuilder from '@sanity/image-url' | |
import sanityClient from '@sanity/client' | |
function setUpSanity(isDraft = false) { | |
return sanityClient({ | |
// Find your project ID and dataset in `sanity.json` in your studio project | |
projectId: process.env.SANITY_PROJECT_ID, | |
dataset: 'production', |
function alphabetPosition(text) { | |
const arrayOfLetters = text.toLowerCase().split('') | |
return arrayOfLetters.map(letter => { | |
const code = letter.charCodeAt() | |
if(code < 97 || code > 122) return null | |
return code - 96 | |