Skip to content

Instantly share code, notes, and snippets.

.content-box {
--content-box-border-color: #ccc;
border: 1px solid;
border-color: var(--content-box-border-color);
border-radius: .4rem;
}
.content-row-headline {
display: block;
padding: 1.5rem;
defp atomize_map(%{} = stringy_map) do
stringy_map
|> Map.new(fn {k, v} -> {String.to_atom(k), v} end)
end
defp atomize_map(_) do
%{}
end
@bultas
bultas / guard.js
Last active March 6, 2020 20:20
Design by contract
function warn(a, b) {
console.warn(a, b);
}
export default guard( [ a => true , b => false ], () => true )( warn );
@bultas
bultas / reducer.jsx
Last active January 22, 2020 19:49
react reducer/state reducer/state machine solution comparision
import React, { useReducer } from 'react';
const reducer = (state, action) => {
switch (action.type) {
case 'removeEntry': {
const newEntries = remove(action.payload, 1, state.entries);
return { ...state, entries: newEntries, editIndex: null };
}
case 'saveEntry': {
import React, { useReducer } from 'react';
import { Form } from 'components/form';
import { Button } from 'components/button/newButton';
import { dataMapToObj } from 'components/formHelpers';
import { addImport } from './importMergeHelpers';
import { update, isNil, remove } from 'ramda';
import './importMerge.css';
@bultas
bultas / base.css
Created September 19, 2019 09:47
CSS base framework
:root {
font-family: var(--default-font-family);
/* font-size: 1.125rem; */
font-size: calc(1rem + 0.333vw);
}
html, body {
height: 100%;
width: 100%;
}
@bultas
bultas / colors.css
Last active November 16, 2020 11:48
CSS Colors
:root {
--black: #000;
--white: #fff;
--rose-50: #fff1f2;
--rose-100: #ffe4e6;
--rose-200: #fecdd3;
--rose-300: #fda4af;
--rose-400: #fb7185;
--rose-500: #f43f5e;
@bultas
bultas / reducer.js
Last active June 26, 2019 19:04
Redux-Loop Reducer boilerplate
/// @ts-check
import { loop, Cmd } from 'redux-loop';
import { error } from 'lib/result';
import { fetchItem } from 'effects/itemEffects';
import { ITEM_LOCATION } from 'constants/routerConstants';
const initState = {
fetching: null,
/**
* @param {HTMLFunction} html
* @returns {(instance: Instance) => (number) => string}
*/
const template = html => instance => multiplier => html`
<h1>Hello ${instance.data.name}</h1>
<h2>count: ${2 * multiplier}</h2>
`;
/**
--icon-search: url('data:image/svg+xml,\
<svg viewBox="-24 -24 48 48" xmlns="http://www.w3.org/2000/svg">\
<title>Search</title>\
<g transform="translate(-4 -8)">\
<g transform="rotate(45)" fill="none" stroke="black">\
<circle r="14" stroke-width="3"/>\
<line x1="17" x2="30" stroke-width="6" stroke-linecap="round"/>\
</g>\
</g>\
</svg>');