Potherca

The standard button

Although the technology and philosophy behind the 'Deploy to Heroku' Button are quite awesome, the default look may not what you want. For one thing there is a distinct difference between the PNG and SVG versions Heroku has on offer.

Description	Image	URL
PNG format	![heroku deploy button png]	https://www.herokucdn.com/deploy/button.png
SVG format	![heroku deploy button svg]	https://www.herokucdn.com/deploy/button.svg

Potherca

/**
 * Various options for "Deploy to Heroku" Badges
 */
 
 @import url(http://fonts.googleapis.com/css?family=Droid+Sans|Droid+Sans+Mono);
body {
	font-family:'Droid Sans', Arial, sans-serif;
}

dt {text-align: right;}

Potherca

/**
 * Zurb Foundation -- Button Variations
 */
@import url('//cdnjs.cloudflare.com/ajax/libs/foundation/5.3.3/css/foundation.min.css');

.wrapper {
	text-align: center;
	position: relative;
	top: 50%;
	transform: translateY(-50%);	

Potherca

/**
 * Button Group with Zurb Foundation
 *
 * This component offers a way of give a user the option to choose 
 * where to go after submitting a form by offering a group of buttons 
 * to choose from. Starting out, only the "default" choice is visible.
 * Once the user hovers over the "default" choice other options become
 * visible.
 *
 * Extra styles are provided to right-align the buttons in the group,

Potherca

This gist displays a map of the 12 provinces the country of the Netherlands contains.

The path in the SVG have province names as class names, making it very easy to style them from a separate CSS file.

This work is based on an original SVG from the Wikipedia

Could be improved upon further by grouping separate path in `` blocks like upload.wikimedia.org/wikipedia/commons/d/d5/Provinces_of_the_Netherlands.svg has.

Potherca

Example of how to create a pie chart with d3.js

Viewable on bl.ocks.net and jsfiddle

Next step is to use NVD3 (first rough draft on jsfiddle).

@TODO: Split index.html into separate files (js, css, json) to make clear how much work goes into which layer (definition, styling, logic).

Potherca

<?php

namespace PhpHooligans;

/**
 * 
 * @param \Closure $callable
 *
 * @return bool
 */

Potherca

/**
 * ASCII Art version of the Potherca Cartoon Avatar
 */
 
 .background {
 	color: red;
 }
 
 .hair {
 	color: darkbrown;

Potherca

To reload a Dashing dashboard:

curl -i -d '{"auth_token": "MY_AUTH_TOKEN", "event": "reload"}' http://dashing:3030/dashboards/mydashboard

Potherca

/**
 * Quick mockup for movie night CSS
 * See the full effect at http://result.dabblet.com/gist/1bb4d6520814a8d96793/
 */

@import url(http://fonts.googleapis.com/css?family=Codystar);
@import url(http://fonts.googleapis.com/css?family=Ewert);
@import url(http://fonts.googleapis.com/css?family=Monoton);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:700);