Skip to content

Instantly share code, notes, and snippets.

View shaundon's full-sized avatar

Shaun Donnelly shaundon

44 followers · 30 following
View GitHub Profile
@shaundon
shaundon / basic-spans.html
Created September 18, 2012 19:12
Three basic spans
<span class="button_toggle left">Left<span>
<span class="button_toggle">Middle</span>
<span class="button_toggle right">Right</span>
@shaundon
shaundon / button_toggle.css
Created September 18, 2012 19:40
The CSS for button_toggle
.button_toggle {
/* Light grey border. */
border: 1px solid #ccc;
/* Slightly darker bottom border. */
border-bottom-color:#aaa;
/* Padding. */
padding:4px 6px;
@shaundon
shaundon / button_toggle_hover.css
Created September 18, 2012 20:00
Button Toggle Hover State
.button_toggle:hover {
color:#333;
}
.button_toggle:active {
background-color:#dcdcdc;
color:#555;
background-image:-webkit-gradient(linear,left top,left bottom,from(#dcdcdc),to(#e6e6e6));
background-image:-webkit-linear-gradient(top,#e6e6e6,#dcdcdc);
background-image:-moz-linear-gradient(top,#e6e6e6,#dcdcdc);
@shaundon
shaundon / button_toggle_left_right.css
Created September 18, 2012 20:18
Button toggle left and right states
.button_toggle.left {
border-radius: 2px 0px 0px 2px;
}
.button_toggle.right {
border-radius: 0px 2px 2px 0px;
}
@shaundon
shaundon / button_toggle_left_right_margin.css
Created September 18, 2012 20:34
Button toggle left and right states with margin
.button_toggle.left {
border-radius: 2px 0px 0px 2px;
margin-right:-5px;
}
.button_toggle.right {
border-radius: 0px 2px 2px 0px;
margin-left:-5px;
}
@shaundon
shaundon / search_box.html
Created September 19, 2012 18:18
Search Box
<input type="search" id="search" style="width:90px;" placeholder="Click Me!" />
@shaundon
shaundon / search_box_jquery.cs
Created September 19, 2012 18:23
jQuery code to bind to a search box
$(document).ready(function(){
$("#search").bind({
focus: function() {
$(this).animate({ width:200 }, 300);
},
blur: function() {
$(this).animate({ width:90 }, 300);
}
});
});
@shaundon
shaundon / firehose.rb
Created September 20, 2012 08:19
A simple Ruby script to connect to Twitter's streaming API and return tweets matching a search term in real time.
# Tweet Stream. Uses the 'tweetstream' gem.
# Asks for a keyword, and monitors tweet for that keyword.
require 'tweetstream'
# Ask for keyword.
print "Keyword: "
keyword = gets.chomp()
TweetStream.configure do |config|
@shaundon
shaundon / gist:4984247
Last active December 13, 2015 22:28
Function for searching the text of some elements and hiding elements that don't match the search terms. Prerequisites: jQuery, and a CSS class 'visible' that allows your elements to display (this is then toggled on/off)
function FilterResults(query) {
// Remove whitespace.
query = $.trim(query);
// Add an 'OR' for regex syntax.
query = query.replace(/ /gi '|');
$('selector for each element to search').each(function () {
@shaundon
shaundon / skeleton.html
Last active December 23, 2015 06:09
A skeleton HTML page, with spaces for adding custom CSS and JavaScript, and a number of external JavaScript, stylesheets and fonts added but commented out, allowing you to choose which ones you require. This is mainly for building quick demos of things.
<!doctype html>
<!--
Shaun Donnelly (hello@sdonnelly.co.uk)
This is a skeleton HTML page.
Copy it, then use it to make HTML demos and other things.
In the <head>, there are a number of commented out