This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
// Source: https://github.com/emotion-js/emotion/blob/master/packages/styled-base/types/helper.d.ts | |
type PropsOf< | |
// eslint-disable-next-line @typescript-eslint/no-explicit-any | |
E extends keyof JSX.IntrinsicElements | React.JSXElementConstructor<any> | |
> = JSX.LibraryManagedAttributes<E, React.ComponentPropsWithRef<E>>; | |
export interface BoxOwnProps<E extends React.ElementType = React.ElementType> { | |
as?: E; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export const useFocus = () => { | |
const htmlElRef = useRef<HTMLElement>() | |
const setFocus = () => { | |
const currentEl = htmlElRef.current | |
currentEl && currentEl.focus() | |
} | |
return [setFocus, htmlElRef] as const | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/// Helper for EQCSS Element Queries `@element` | |
/// | |
/// @author Jason Featheringham | |
/// @link https://gist.github.com/thejase/d2107285b6e10315dd6bc055115647fe Code source | |
/// @link http://elementqueries.com/ Plugin to parse EQCSS | |
/// @link https://gist.github.com/tomhodgins/6237039fa07c2e4b7acd1c8b0f9549a9 EQCSS syntax | |
/// | |
/// @param {String} $scope (&) - Optional scope. Defaults to current context | |
/// @param {List} $conditions (()) - 1+ of Maps of EQCSS conditions | |
/// @content rules to enclose in element query |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Promise.race([ | |
fetch('/foo'), | |
new Promise((_, reject) => | |
setTimeout(() => reject(new Error('Timeout')), 7000) | |
) | |
]); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* HOC fundamentally is just a function that accepts a Component and returns a Component: | |
(component) => {return componentOnSteroids; } or just component => componentOnSteroids; | |
Let's assume we want to wrap our components in another component that is used for debugging purposes, | |
it just wraps them in a DIV with "debug class on it". | |
Below ComponentToDebug is a React component. | |
*/ | |
//HOC using Class | |
//it's a function that accepts ComponentToDebug and implicitly returns a Class | |
let DebugComponent = ComponentToDebug => class extends Component { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$base-font-size: 16px; | |
$base-line-height: 1.5; | |
// this value may vary for each font | |
// unitless value relative to 1em | |
$cap-height: 0.68; | |
@mixin baseline($font-size, $scale: 2) { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
cd $HOME | |
ln -s `which php54` ~/bin/php | |
export PATH=$HOME/bin:$PATH | |
curl -sS https://getcomposer.org/installer | php54 | |
echo -e "\n# Composer\nalias composer=\"php54 \$HOME/composer.phar\"" >> $HOME/.bash_profile | |
source $HOME/.bash_profile |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@mixin background-rgba($r,$g,$b,$a) { | |
// To mimic this in Internet Explorer, you can use the proprietary filter | |
// property to create a gradient with the same start and end color, along | |
// with an alpha transparency value. | |
@if experimental-support-for-microsoft { | |
$color: ie_hex($r,$g,$b,$a); | |
$value: unquote("progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=##{$color},endColorstr=##{$color})"); | |
background-color: transparent\9; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
* Review this article and add new steps as needed: http://blog.therubymug.com/blog/2010/05/20/the-install-osx.html |