Skip to content

Instantly share code, notes, and snippets.

View shrwnsan's full-sized avatar
🏠
Working from home

shrwnsan

🏠
Working from home
26 followers · 20 following
View GitHub Profile
@shrwnsan
shrwnsan / jquery.js
Created January 9, 2013 17:16
IE8 tweaks/workarounds
// lack of support for CSS :first-child and :last-child
if ($.browser.msie && parseInt($.browser.version, 10) === 8) {
$('ul li:first').addClass('first');
$('ul li:last').addClass('last');
}
@shrwnsan
shrwnsan / online-offline-demo.html
Created March 4, 2013 01:34
Treehouse Web Standard Technology Quick Tip: Online / Offline Demo As seen at: http://www.youtube.com/watch?v=8y7O-5TnCUg
<!doctype html>
<html>
<head>
<title>Online / offline Demo<title>
<style>
body { background: #6c6; }
body.offline { background: #ccc; }
.container {
width: 500px;
background: #fff;
@shrwnsan
shrwnsan / best-available-ampersand.js
Created March 12, 2013 18:34
Based on Dan Cederholm's http://simplebits.com/notebook/2008/08/14/ampersands-2/ Crafted this years back to take care of rogue's that the WordPress plugin WP-Typography couldn't take care of, e.g. ampersands, due to priority parsing of the markup.
jQuery(document).ready(function() {
jQuery('#content div.entry div.info h2 a').each(function() {
var new_text = jQuery(this).html().replace(/&amp;/g, '<span class="amp">&amp;</span>');
jQuery(this).html(new_text);
});
});
@shrwnsan
shrwnsan / index.html
Created March 14, 2013 07:53 — forked from anonymous/index.html
<h1 class="parallax">The &lsquo;root element&rsquo; parallax technique</h1>
<img src="http://distilleryimage4.s3.amazonaws.com/631dac84d67611e1a7d81231381b5136_7.jpg" class="parallax skyline">
<img src="http://distilleryimage4.s3.amazonaws.com/16fe826ee3b511e1a47b22000a1cf766_7.jpg" class="parallax blimp">
<img src="http://distilleryimage11.s3.amazonaws.com/07354ffe2f3011e2a23c22000a1f9d66_7.jpg" class="parallax gherkin">
<img src="http://distilleryimage4.s3.amazonaws.com/059c1a748e6311e1b10e123138105d6b_7.jpg" class="parallax dino">
<img src="http://distilleryimage10.s3.amazonaws.com/7ec10646ab5d11e1af7612313813f8e8_7.jpg" class="parallax bull">
<div class="parallax box">
<p>By combining the power of <code>`rem`</code> and a small JavaScript function to manipulate the <code>`font-size`</code> of the <code>`html`</code> element, we can achieve simple but effective parallaxing.</p>
@shrwnsan
shrwnsan / index.html
Created March 28, 2013 14:49 — forked from anonymous/index.html
A CodePen by Aaron Gustafson. Simple pull quote - This builds on the work of Maykel Loomans: http://miekd.com/articles/pull-quotes-with-html5-and-css/ and makes it a little less repetitious and brings JavaScript in to make it an enhancement. The API is simple: your data attribute simple provides a selector to identify the item to use as the pull…
<p>A pull quote is a typographical technique in which an excerpt or quote from an article is duplicated within the article using a different formatting style so that it jumps out at the reader.</p>
<p data-pullquote="b">Blatantly copying the excerpt of the pull quote into it’s own element is not the way to go. <b>A pull quote is a purely visual technique, and therefore should not change the structure of the body.</b> Next to that, a structural representation of the excerpt would be seen twice by people using feed readers or services like <a href="http://www.instapaper.com/">Instapaper</a>, as well as be re-read for people who use screen readers. So how can we best author this into our mark-up?</p>
<h3>Our good friend, the data attribute</h3>
<p><span class="caps">HTML5 </span>introduced the ability for authors to create custom non-visible data-attributes. These attributes can contain data that will not affect layout or presentation.</p>
<blockquote><p>Custom data attributes are intended to store custom da
@shrwnsan
shrwnsan / fontawesome-ie7.scss
Last active December 16, 2015 00:09
Font Awesome: For those looking to add support for IE7, and using SASS: 1. Copy-paste https://github.com/FortAwesome/Font-Awesome/blob/master/less/font-awesome-ie7.less 2. Rename to "font-awesome-ie7.scss" 3. Move to your relative /scss folder 4. Find and replace the corresponding snippets between your LESS and SCSS file. Use the included gist a…
@mixin ie7icon($arguments...) {
*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = #{$arguments});
}
.icon-music { @include ie7icon('&#xf021;'); }
.icon-search { @include ie7icon('&#xf022;'); }
.icon-envelope { @include ie7icon('&#xf023;'); }
// and so on...
@shrwnsan
shrwnsan / twitter.css
Last active December 16, 2015 02:29
Stylebot Chrome-extension CSS. http://stylebot.me/styles/4752
#profile_popup .modal, .profile-card.profile-header, #activity-popup-dialog .modal {
width: 600px;
}
.account-summary .avatar {
top: 0.5em;
}
.activity-popup-users .avatar {
top: 0.9em;
@shrwnsan
shrwnsan / functions.php
Created April 13, 2013 04:23
WordPress: exclude custom post-types from search query results. Note: 'video-camera', 'software-solution','post' are the post types which you want to search replace with you own. Source: http://wordpress.org/support/topic/exclude-custom-post-types-from-search-query-results?replies=6#post-3249786
// search filter
function fb_search_filter($query) {
if ( !$query->is_admin && $query->is_search) {
$query->set('post_type', array('video-camera', 'software-solution','post') ); // id of page or post
}
return $query;
}
add_filter( 'pre_get_posts', 'fb_search_filter' );
@shrwnsan
shrwnsan / .bash_aliases
Last active December 16, 2015 10:09
"Ultimate GIT PS1 Bash Prompt" via http://mediadoneright.com/content/ultimate-git-ps1-bash-prompt
# Customize BASH PS1 prompt to show current GIT repository and branch.
# by Mike Stewart - http://MediaDoneRight.com
# SETUP CONSTANTS
# Bunch-o-predefined colors. Makes reading code easier than escape sequences.
# I don't remember where I found this. o_O
# Reset
Color_Off="\[\033[0m\]" # Text Reset
@shrwnsan
shrwnsan / httpd-vhosts.conf
Created April 23, 2013 15:30
Proper DOCUMENT_ROOT when using mod_vhost_alias. Source http://jbenner.net/blog/quick-tip-get-proper-document-root-when-using-mod-vhost-alias
// Note: httpd-vhosts.conf filename just used as an example.
// Add the following line to your apache configuration inside the VirtualDocumentRoot vhost definition
// E.g.
// <VirtualHost *:80>
// ...
// {paste here}
// </VirtualHost>
php_admin_value auto_prepend_file "/Users/USERNAME/Sites/setdocroot.php"