Skip to content

Instantly share code, notes, and snippets.

View Chrisedmo's full-sized avatar

Chris Mousdale Chrisedmo

20 followers · 37 following
View GitHub Profile
@Chrisedmo
Chrisedmo / nav-dropdown.liquid
Created July 31, 2012 11:19
Shopify: 2 Level Dropdown Menu
<ul>
{% for link in linklists.main-menu.links %}
<li class="{% if forloop.first %}first{% elsif forloop.last %}last{%endif%}">
{% assign child_list_handle = link.title | handle %}
{% if linklists[child_list_handle].links != blank %}
<div class="has-dropdown">
<a href="{{ link.url }}" class="clearfix">
<span class="nav-label">{{ link.title }}</span>
<span class="nav-arrow"></span>
</a>
@Chrisedmo
Chrisedmo / filter-vendor.liquid
Created July 31, 2012 11:14
Shopify: Filter by Vendor
<!-- add the vendor as product tag to product then use this code in collection.liquid -->
<!-- if we are on a collection page that is either custom or smart -->
{% if collection.url != blank %}
<h4>Shop by vendor:</h4>
<ul>
{% for product_vendor in collection.all_vendors %}
<li>
{% if current_tags contains product_vendor %}
<a class="active" href="{{ collection.url }}">{{ product_vendor }}</a>
{% else %}
@Chrisedmo
Chrisedmo / Mountain Lion tweaks
Created July 30, 2012 14:30
Mountain Lion tweaks (under the hood)
# ~/.osx — http://mths.be/osx
###############################################################################
# General UI/UX #
###############################################################################
# Set computer name (as done via System Preferences → Sharing)
scutil --set ComputerName "MathBook Pro"
scutil --set HostName "MathBook Pro"
scutil --set LocalHostName "MathBook-Pro"
@Chrisedmo
Chrisedmo / mobile-search-style.css
Created July 30, 2012 13:06
Expanding Mobile Search fields
/* reset webkit search input browser style */
input {
outline: none;
}
input[type=search] {
-webkit-appearance: textfield;
-webkit-box-sizing: content-box;
font-family: inherit;
font-size: 100%;
}
@Chrisedmo
Chrisedmo / index.html
Created June 12, 2012 20:21
Flexbox - box-ordinal-group JS fallback
<!DOCTYPE html>
<html>
<head>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<meta charset=utf-8>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>JS Bin</title>
<style>
body {
@Chrisedmo
Chrisedmo / dabblet.css
Created June 7, 2012 14:33
webkit filter on text!?
/**
* webkit filter on text!?
*/
body {
padding: 50px;
font-family: 'Helvetica Neue', helvetica, arial;
}
h1 {
font-size: 55px;
@Chrisedmo
Chrisedmo / dabblet.css
Created May 31, 2012 23:47
Circle Hover / expand boxes
/**
* Circle Hover / expand boxes
*/
ul {list-style: none; margin:50px; padding: 0;}
li {height: 200px; display: block; width: 200px; float: left; text-align: center;
background-color: #eee; margin-left: -20px;
border-radius: 50%}
li:nth-child(1) {background-color: #ddd;}
@Chrisedmo
Chrisedmo / CSS3 Media Query reporter
Created April 18, 2012 10:50
CSS3 Media Query reporter - add to CSS.
body:after {
content: "less than 320px";
font-size: 300%;
font-weight: bold;
position: fixed;
bottom: 60px;
width: 100%;
text-align: center;
background-color: hsla(1,60%,40%,0.7);
color: #fff;
@Chrisedmo
Chrisedmo / LESS Placeholder Image Fetcher variable
Created April 18, 2012 10:48
Placeholder Image Fetcher Function by: Anders Schmidt Hansen
.placeholder-500 {
display: block;
.placeholdit(500,300); // Magic!
.size(500,300);
}
// Call a Placehold.it image
.placeholdit(@width: 300, @height: 210) {
@placeholdIt: ~`"http://placehold.it/@{width}x@{height}"`;
background: url(@placeholdIt) no-repeat;
@Chrisedmo
Chrisedmo / dabblet.css
Created January 12, 2012 17:34 — forked from desandro/dabblet.css
Nice way to scale and show predefined images / ads etc
/**
* Nice way to scale and show predefined images / ads etc
*/
ul {
border: 3px dotted;
list-style: none;
margin: 0;
padding: 0;
display: -webkit-box;