Skip to content

Instantly share code, notes, and snippets.

Avatar
🏠

Davo Galavotti davo

🏠
View GitHub Profile
@davo
davo / Reset Touchbar.md
Last active Jul 18, 2019
Reset Touch or MacOS Mojave
View Reset Touchbar.md

pkill "Touch Bar agent";

killall "ControlStrip";

@davo
davo / Data.tsx
Created Jun 14, 2019
Framer X - Type Stack - Data Example
View Data.tsx
import * as React from 'react'
import styled from '@emotion/styled'
import { css } from '@emotion/core'
import { addPropertyControls, ControlType } from 'framer'
type DataTypes = {
format: 'data40' | 'data30' | 'data20' | 'data10'
}
interface IDataTextProps {
View MacOS-Tricks.md

Recursively Remove .DS_Store

find . -name '.DS_Store' -type f -delete

View beach-house-tour.md
  • JUNE 14
    MANCHESTER, TN
  • AUG 1
    BURLINGTON, VT
  • AUG 3
    MONTREAL, CA
  • AUG 4
    NORTHAMPTON, MA
  • AUG 6
    CLEVELAND, OH
View SvgComponent.tsx
import * as React from "react"
import { Frame, addPropertyControls, ControlType } from "framer"
type Props = {
width: number | string
height: number | string
color: string
}
export const SvgComponent = (props: Props) => {
@davo
davo / Colors.tsx
Created May 21, 2019
Reusing Framer X Shared Colors on a Function Component
View Colors.tsx
import * as React from 'react'
import { Stack, Frame } from 'framer'
import { colors } from './canvas'
export function Colors() {
const [colorsTokens] = React.useState(() => {
return Object.keys(colors).map(key => colors[key])
})
return (
@davo
davo / observable.tsx
Created May 20, 2019
Observable book on Framer X
View observable.tsx
import * as React from 'react'
import { useState, useEffect, useRef } from 'react'
import { Frame, addPropertyControls, ControlType } from 'framer'
import { Runtime, Inspector } from '@observablehq/runtime'
import notebook from '@davo/bar-chart-race'
export function Observable({ tick }) {
const [tickDuration, setTickDuration] = useState(tick)
const animationRef = useRef()
@davo
davo / WindowResizeListener.tsx
Created May 17, 2019
Framer X WindowResizeListener
View WindowResizeListener.tsx
// https://framer.slack.com/archives/CB74N2FDY/p1557954143213500?thread_ts=1557952502.211200&cid=CB74N2FDY
import { Override, Data } from "framer"
import * as React from "react"
const initialSize = document.body.getBoundingClientRect()
const preview = Data({ width: initialSize.width, height: initialSize.height })
@davo
davo / regexs.md
Created May 14, 2019
Handy Regular Expressions
View regexs.md

Capturing a class from a HTML / SVG element.

(class="([^"]*)")
@davo
davo / ComponentHoverStyledComponents.tsx
Created May 6, 2019
Component with Hover via StyledComponents
View ComponentHoverStyledComponents.tsx
import * as React from 'react'
import { useState, useEffect } from 'react'
import { Frame, addPropertyControls, ControlType } from 'framer'
import styled, { css } from 'styled-components'
interface Props {
padding?: number
paddingLeft?: number
color?: string
listBackgroundColor?: string