kenakingkong

/* https://medium.com/@makenakong/how-to-add-and-customize-the-trix-editor-for-your-ruby-on-rails-application-c0a5d3082254 */

.trix-button--icon-strike,
.trix-button--icon-link,
.trix-button-group--block-tools,
.trix-button-group--file-tools,
.trix-button-group--history-tools {
  display: none;
}

kenakingkong

import os
from PIL import Image
from optparse import OptionParser

"""
  Convert to webp

  This script convert image(s) to webp format
  - Accepts png, jpg, jpeg formats
  - Given an image, converts image to webp

kenakingkong

import type { AppProps } from 'next/app'
import Script from 'next/script'
import * as snippet from '@segment/snippet'

function App({ Component, pageProps }: AppProps) {
  const loadSegment = () => {
    const options = {
      apiKey: process.env.NEXT_PUBLIC_SEGMENT_WRITE_KEY
    }
    if (process.env.NEXT_PUBLIC_NODE_ENV) {

kenakingkong

// excerpt from src/scss/text.scss 

...
.text {
 &-purple { color: $purple } 
 &-regular { 
  font-family: $font-bowlby; 
  font-size: calc(18px + (26–14) * ((100vw - 300px) / (1600–300))); 
  padding: 0 1rem; 
  margin: 0; 

kenakingkong

// excerpt from src/components/mycard.js
...
<p 
 className="card-content" 
 dangerouslySetInnerHTML={{ 
   __html: poem.content.replace(/<figure.+figure>/g,"") 
 }} 
/>
...

kenakingkong

//excerpt from gatsby-config.js
...
plugins: [   
{      
  resolve: 'gatsby-plugin-web-font-loader',     
  options: {        
   google: {          
    families: ['Bowlby One', 'Noto Serif']        
   }      
  }    

kenakingkong

//excerpt from gatsby-config.js
...
plugins = [
 {      
  resolve: 'gatsby-medium-rss-feed',      
  options: {        
   nodeType: 'sourceNodes',        
   name: 'MediumFeed',        
   userName: 'ThomKaar'      
  }    

kenakingkong

//excerpt from gatsby-config.js
...
plugins = [
 {      
  resolve: `gatsby-plugin-s3`,      
  options: {          
   bucketName: '<bucket-name>',          
   region: '<bucket-region>'     
  },  
 }

kenakingkong

import * as React from "react"
import { MediaContextProvider } from "./src/media" 

export const wrapRootElement = ({ element }) => (
 <MediaContextProvider>{element}</MediaContextProvider>
)

kenakingkong

//  src/media.js

import { createMedia } from "@artsy/fresnel"

const QueryBreakpoints = createMedia({
  breakpoints: {
    xs: 0,
    sm: 768,
    md: 1000,
    lg: 1200,