John Fawcett jrf0110

## makeFetcher.ts
/**
 * Overwrite certain keys with new types.
 *
 * @example
 * type A = {a: string, b?: string}
 * type result = Overwrite<A, {b: string}> = {a: string, b: string}
 * (Note that b is no longer optional)
 */
type Overwrite<T1, T2> = { [P in Exclude<keyof T1, keyof T2>]: T1[P] } & T2

## makeFetcher.ts
/**
 * Overwrite certain keys with new types.
 *
 * @example
 * type A = {a: string, b?: string}
 * type result = Overwrite<A, {b: string}> = {a: string, b: string}
 * (Note that b is no longer optional)
 */
type Overwrite<T1, T2> = { [P in Exclude<keyof T1, keyof T2>]: T1[P] } & T2

## todohack.js
class AppState {
  constructor(attrs) {
    this.attrs = attrs || {
      todos: []
    }
  }

  clone() {
    const attrs = Object.assign({}, this.attrs)
    attrs.todos = attrs.todos.map(todo => Object.assign({}, todo))

## get-line-no.js
/**
 * Gets the line number of an element in an HTML element
 * @return number -1 if not found
 * @example
 *   getLineNo(document.body)
 * @caveat
 *  This function assumes that <html>, </html>, and the DOCTYPE
 *  declaration are all on their own lines. If this isn't the case,
 *  you can adjust options.numLinesForHTMLElement. ALSO, I didn't
 *  make any concessions for browser support, but the general technique

## theming-in-less.md

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              1 star
            
          
                jrf0110
                / theming-in-less.md
            
            
              Last active
              April 23, 2021 09:05
            
          
    Theming in LESS

Following up to my "no global variables" in LESS post, here I describe how theming (or rather, micro-theming) can work.
All too often, I see developers attempt to fit an entire site design into a single theme (a set of variables that control the color scheme of the entire site). This results in a ton of non-semantic variables. Instead, we should build small themes (micro-themes), that expose a common interface to all consumers. Micro-themes are composed to create your application.
What constitutes a micro-theme?

Consider the new restaurant menu design:

  
## pw-commands-palette.js
module.exports.name = 'palette';

module.exports.children = {
  open: function(){
    return {
      isOpen: true
    }
  },
  close: function(){
    return {

## component-sub-component.jsx
export default class SomeComponent {
  static SubComponent( props ){
    return (
      <span className="some-component-sub">{props.value}</span>
    );
  }

  render(){
    return (
      <div className="some-component">

## fish_prompt.fish
# name: Agnoster
# agnoster's Theme - https://gist.github.com/3712874
# A Powerline-inspired theme for FISH
#
# # README
#
# In order for this theme to render correctly, you will need a
# [Powerline-patched font](https://gist.github.com/1595572).

## Set this options in your config.fish (if you want to :])

## create-tables.js
dirac.createTables = function(callback){
  // Determine order that tables need to be created
  var ordered = [], column;

  // Represent the references as a directed acyclic graph
  var graph = {};

  for (var table in dirac.dals){
    if (table in dirac.views) continue;
    graph[table] = {

## interview-warmup.html
<html>
  <head>
    <style>
      /* Write the CSS */
    </style>
  </head>
  <body>
    <div class="container">
      <div class="col">50%</div>
      <div class="col">50%</div>
	/**
	* Overwrite certain keys with new types.
	*
	* @example
	* type A = {a: string, b?: string}
	* type result = Overwrite<A, {b: string}> = {a: string, b: string}
	* (Note that b is no longer optional)
	*/
	type Overwrite<T1, T2> = { [P in Exclude<keyof T1, keyof T2>]: T1[P] } & T2
	class AppState {
	constructor(attrs) {
	this.attrs = attrs \|\| {
	todos: []
	}
	}

	clone() {
	const attrs = Object.assign({}, this.attrs)
	attrs.todos = attrs.todos.map(todo => Object.assign({}, todo))
	/**
	* Gets the line number of an element in an HTML element
	* @return number -1 if not found
	* @example
	* getLineNo(document.body)
	* @caveat
	* This function assumes that <html>, </html>, and the DOCTYPE
	* declaration are all on their own lines. If this isn't the case,
	* you can adjust options.numLinesForHTMLElement. ALSO, I didn't
	* make any concessions for browser support, but the general technique
	module.exports.name = 'palette';

	module.exports.children = {
	open: function(){
	return {
	isOpen: true
	}
	},
	close: function(){
	return {
	export default class SomeComponent {
	static SubComponent( props ){
	return (
	<span className="some-component-sub">{props.value}</span>
	);
	}

	render(){
	return (
	<div className="some-component">
	# name: Agnoster
	# agnoster's Theme - https://gist.github.com/3712874
	# A Powerline-inspired theme for FISH
	#
	# # README
	#
	# In order for this theme to render correctly, you will need a
	# [Powerline-patched font](https://gist.github.com/1595572).

	## Set this options in your config.fish (if you want to :])
	dirac.createTables = function(callback){
	// Determine order that tables need to be created
	var ordered = [], column;

	// Represent the references as a directed acyclic graph
	var graph = {};

	for (var table in dirac.dals){
	if (table in dirac.views) continue;
	graph[table] = {
	<html>
	<head>
	<style>
	/* Write the CSS */
	</style>
	</head>
	<body>
	<div class="container">
	<div class="col">50%</div>
	<div class="col">50%</div>