Skip to content

Instantly share code, notes, and snippets.

@bogdansoare
bogdansoare / machine.js
Created March 16, 2021 12:16
Generated by XState Viz: https://xstate.js.org/viz
const authMachine = Machine({
id: 'auth',
initial: 'idle',
context: {},
states: {
idle: {
},
}
});
/** @jsx jsx */
import {jsx} from '@emotion/core'
import styled from '@emotion/styled'
import React from 'react'
import Logo from './components/logo'
import VisuallyHidden from '@reach/visually-hidden'
import {Dialog} from '@reach/dialog'
import {
CircleButton,
export const required = value =>
value !== undefined && value !== null ? undefined : 'Required';
export const requiredArray = value =>
value && value.length > 0 ? undefined : 'Required';
export const requiredRichText = value =>
!required(value) &&
value !== '<p></p>' &&
value !== '<h1></h1>' &&
@bogdansoare
bogdansoare / s.js
Last active September 17, 2018 07:14
var S={};(window.S=S).M=function(t){S.BM(this,["gRaf","loop","updSvg","updLine","updProp"]),this.v=this.varsInit(t)},S.M.prototype={varsInit:function(t){var l={el:S.Select.el(t.el),e:{value:t.e||"linear"},d:{origin:t.d||0,curr:0},delay:t.delay||0,cb:t.cb||!1,cbDelay:t.cbDelay||0,reverse:t.reverse||!1,round:t.round,progress:0,time:{elapsed:0}};l.elL=l.el.length,S.Has(t,"update")?l.update=function(){t.update(l)}:S.Has(t,"svg")?l.update=this.updSvg:S.Has(t,"line")?l.update=this.updLine:l.update=this.updProp;var i=t.p||!1,e=t.svg||!1,s=t.line||!1;if(i){l.prop={},l.propPos=[];var r=Object.keys(i);l.propL=r.length;for(var n=0;n<l.propL;n++){var o=r[n];l.prop[n]={name:o,origin:{start:i[o][0],end:i[o][1]},curr:i[o][0],start:i[o][0],end:i[o][1],unit:i[o][2]||"%"},l.propPos[o.charAt(0)]=n}}else if(e)l.svg={type:e.type,attr:"polygon"===e.type?"points":"d",end:e.end,originArr:{},arr:{},val:[]},l.svg.start=e.start||l.el[0].getAttribute(l.svg.attr),l.svg.curr=l.svg.start,l.svg.originArr.start=this.svgSplit(l.svg.start),l.s
const StatelessToggler = (props) => (
<div onClick={props.onToggle}>
<div>{props.label}</div>
{props.isOpen && props.children}
</div>
)
const Toggler = React.createClass({
getInitialState() {
@bogdansoare
bogdansoare / gulpfile.js
Created August 9, 2014 15:40
Web Starter Kit gulpfile
/**
*
* Web Starter Kit
* Copyright 2014 Google Inc. All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
/*!
* Grunt
* $ npm install grunt-contrib-uglify grunt-autoprefixer grunt-contrib-cssmin grunt-contrib-imagemin grunt-contrib-sass grunt-contrib-watch grunt-contrib-concat grunt-contrib-clean grunt-contrib-jshint grunt-notify --save-dev
*/
module.exports = function(grunt) {
grunt.initConfig({
// Sass
@mixin breakpoint($min: 0, $max: 0) {
$type: type-of($min);
@if $type == string {
@if $min == xs {
@media (max-width: 767px) { @content; } // Mobile Devices
}
@else if $min == sm {
@media (min-width: 768px) { @content; } // Tablet Devices
@bogdansoare
bogdansoare / box_sizing.css
Created July 19, 2014 13:28
Better version for box-sizing border-box
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
@bogdansoare
bogdansoare / bem_example.scss
Created July 19, 2014 12:09
Sass BEM-Selector
.nav {
background: white;
// element .nav__link
&__link {
font-size: 1.2em;
color: red;
padding: 0.2em 0.5em;
// modifier .nav__link--twitter