Dylan Hassinger dylanized

CSS is a declarative stylesheet language, this means you describe the result you want to see rather than the steps the browser would need to take to arrive at that result. You can write CSS selectors that target tags matching a certain description in a certain state, and then you declare the values that different styling properties should have at that time.

There are a few aspects of structured programming living within CSS too. Animations that define sequences of keyframes, media queries, and feature queries are all examples of structured programming inside the declarative language of CSS.

Custom properties (commonly called “CSS variables”) expand CSS to include reactive programming as well. Any time a CSS variable is changed, the new values are updated live in your styles everywhere they have been used. So it's possible for CSS to declare a value that represents a stream of data.

Have you ever felt like CSS was too low-level to provide the abstractions for you to describe what you wanted the result to be

Vue: Pass Slots through from Parent to Child Components

The Situation

We've got some components A, B and C which provide different slots.

const A = {
  template: `<div><slot name="a">Default A Content</slot></div>`
}

const B = {

In tests that use a database, it's necessary to clean out the tables before each run (we don't use after so we can debug a failed test's db).

Sometimes we forget the syntax though so here's what we do:

before(function truncateDatabase (done) {
  // http://docs.sequelizejs.com/en/v3/docs/raw-queries/
  // https://www.postgresql.org/docs/9.3/static/sql-truncate.html
  // DEV: PostgreSQL doesn't support truncating all tables via a `*`
 // DEV: Our query is vulnerable to SQL injection but we can't use bind and trust our table names more/less

Use of each:

notepad | screenshot : is a bit tweaked console-color notepad available in browser via bookmark
offline markdown editor and preview with horizontal-split | screenshot : markdown editor and preview panel with horizontal split
offline markdown editor and preview with vertical-split | screenshot : will give a pure offline live-preview markdown editor, this has vertical split between editor and preview panel

The

	import { columns, display, gridSpans, margin } from './css-modules-styles'

	const COLUMNS = 12

	const toArray = arrayLike => Array.prototype.slice.call(arrayLike)

	const placeItemsOnGrid = grid => {
	const withGutters = grid.classList.contains(columns.withGutters)
	let currentColumnSpansInRow = 0
	let currentRow = 1

	<?
	//
	// [ BUY BTC & ETH DAILY ON BITSTAMP ]
	// by @levelsio
	//
	// 2017-08-23
	//
	// 1) buy $40/day BTC
	// 2) buy $10/day ETH
	//

	$conf['cache'] = 0; // Page cache
	$conf['page_cache_maximum_age'] = 0; // External cache TTL
	$conf['preprocess_css'] = FALSE; // Optimize css
	$conf['preprocess_js'] = FALSE; // Optimize javascript
	$conf['views_skip_cache'] = TRUE; // Views caching

	* {
	font-size: 12pt;
	font-family: monospace;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	color: black;
	cursor: default;
	}

	#!/bin/sh

	# PATH TO YOUR HOSTS FILE
	ETC_HOSTS=/etc/hosts

	# DEFAULT IP FOR HOSTNAME
	IP="127.0.0.1"

	# Hostname to add/remove.
	HOSTNAME=$1

	/* app/controllers/index.js */

	module.exports.index = function(req, res) {
	res.render('index.html');
	};