davidl’s gists

davidl / Character Count

Last active April 23, 2021 12:38

Simple HTML document with minimal CSS and JavaScript to count the characters in a textarea with a configurable target length.

View in browser: https://bl.ocks.org/davidl/raw/b8d4fda8abd91b19edf819ff2ac2e86b/?raw=true

davidl / source-colors.less

Last active December 16, 2015 01:19

Use your devtools-theme colors for source views

	// XML source viewer:
	#webkit-xml-viewer-source-xml + .header,
	#webkit-xml-viewer-source-xml + div + #tree {
	background-color: @background !important;
	color: @foreground !important;
	}

	#webkit-xml-viewer-source-xml + .header {
	border-bottom: 1px solid @html-comment !important;
	color: @html-comment !important;

davidl / codemirror.less

Created April 5, 2013 15:30

Initial styles for CodeMirror in the Chrome DevTools

	#-webkit-web-inspector .CodeMirror {
	background-color: @background !important;
	color: @foreground !important;

	.CodeMirror-selected { background-color: @selection !important; }

	.CodeMirror-gutters {
	background-color: @current-line !important;
	border-right: 1px solid @foreground !important;
	}

davidl / status-rappers.less

Last active December 15, 2015 12:48

Generate CSS to add HTTP status rappers to your Chrome Dev Tools Network panel

	// Mixin to generate URLs, e.g.: .rapStatus('200')
	@rapPath: 'http://www.httpstatusrappers.com/images/';
	.rapStatus(@statusImg: '') {
	background-image: e(%('url(%s%s.png)', @rapPath, @statusImg)) !important;
	}

	#-webkit-web-inspector {
	.status-column {
	overflow: visible !important;

davidl / status-cats.css

Last active December 15, 2015 11:39

Add some HTTP status cats to your Chrome Dev Tools Network panel by adding these lines to your Custom.css file. Check out https://github.com/bentruyman/devtools-themes for more.

	#-webkit-web-inspector .status-column {
	overflow: visible !important;
	}
	#-webkit-web-inspector .status-column [title] {
	overflow: visible !important;
	position: relative !important;
	}
	#-webkit-web-inspector .status-column [title]::before {
	border-color: transparent transparent #000 transparent !important;
	border-style: solid !important;

davidl / status-rappers.css

Last active December 15, 2015 11:09

Chrome DevTools Status Rappers - illustrate your Network panel

	#-webkit-web-inspector .status-column {
	overflow: visible !important;
	}
	#-webkit-web-inspector .status-column [title] {
	overflow: visible !important;
	position: relative !important;
	}
	#-webkit-web-inspector .status-column [title]::before {
	border-color: transparent transparent #000 transparent !important;
	border-style: solid !important;

davidl / dabblet.css

Created November 30, 2012 15:36

Demo for Prism.js pull request 61 re: empty CDATA sections

/* Demo for Prism.js pull request 61 re: empty CDATA sections */

davidl / plist-colors.xslt

Created August 15, 2012 16:19

XSLT to transform a PLIST file to HTML with illustrated color information

	<?xml version="1.0" encoding="UTF-8"?>
	<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">

	<xsl:output method="html" omit-xml-declaration="yes" indent="yes"/>

	<!--
	This file is intended to transform a ".plist" file into a HTML
	document that highlights color information by illustrating it
	and making the color values (hexadecimal and RGB/RGBa) easier to
	select and copy.

davidl / Custom.css

Last active September 30, 2015 19:07 — forked from star-szr/Custom.css

My Custom.css for Chrome Dev Tools. Built using https://github.com/bentruyman/devtools-themes (IR_Black) with personalizations.

	@-webkit-keyframes webkit-inspector-error{0%{color:#ff6c60} 50%{color:#f91300} 100%{color:#ff6c60}}@-webkit-keyframes webkit-inspector-fadeout{from{background-color:#c5c8c6} to{background-color:#1d1f21}}#-webkit-web-inspector{background-color:#1d1f21}#-webkit-web-inspector .monospace,#-webkit-web-inspector .source-code{font-family:'DroidSansMono',Menlo,monospace !important}
	#-webkit-web-inspector ::selection{background:rgba(197,200,198,0.25) !important;opacity:1}
	#-webkit-web-inspector #toolbar{background-image:-webkit-linear-gradient(#444, #333) !important;border-bottom:1px solid #444 !important;border-top:1px solid #000 !important}
	#-webkit-web-inspector #toolbar .toolbar-label{color:#c5c8c6 !important}
	#-webkit-web-inspector #toolbar .toggled-on .toolbar-label{color:#f9faf9 !important}
	#-webkit-web-inspector #toolbar .toolbar-item.toggleable.toggled-on{background-image:-webkit-linear-gradient(#333, #444) !important}
	#-webkit-web-inspector #search-results-matches{color:#f9faf9 !important;text-shadow:none !i

David Lantner davidl