Skip to content

Instantly share code, notes, and snippets.

Avatar
🤘

Stewart Knapman stewartknapman

🤘
View GitHub Profile
@stewartknapman
stewartknapman / number_to_letter.rb
Last active Dec 16, 2015
Turn a number into a letter. Useful for formatting the numbering for alpha lists. Uses Words notation so when it reaches z it will continue aa, bb, cc, etc.
View number_to_letter.rb
def number_to_letter(n=1)
nums = *'a'..'z'
nums[(n % 26) - 1] * ((n-1) / 26 + 1)
end
# Smart ass one line edition by @krolaw
# Doesn't use an array
def number_to_letter_revised(n=1)
('a'.ord+((n-1) % 26)).chr * ((n-1) / 26 + 1)
end
@stewartknapman
stewartknapman / PMCollapse.js
Last active Dec 22, 2015
jQuery plugin for expanding and collapsing an element
View PMCollapse.js
/*
PM Collapse
Expand and collapse a target element but still show the first line of elements child content when its collapsed.
basic example:
<div class="example1">
<a href="#" data-collapse="example-1-target" class="collapse-action">Expand / Collapse</a>
<div id="example-1-target">
@stewartknapman
stewartknapman / jQuery.wordSearch.js
Last active Dec 23, 2015
jQuery plugin that searches for a given word or phrase inside a container element and wraps it in some markup.
View jQuery.wordSearch.js
(function($){
$.fn.textNodes = function(){
return this.find(":not(iframe)").addBack().contents().filter(function(){
return this.nodeType === 3;
});
};
/* wordSearch jQuery plugin */
$.fn.wordSearch = function(searchTerm, options){
@stewartknapman
stewartknapman / _end_row.liquid
Created Nov 21, 2013
Shopify Liquid template that wraps looped items in a row on every third or fourth iteration.
View _end_row.liquid
{% assign thumbs_per_row = settings.thumbnails-per-row | times:1 %}
{% if forloop.length > thumbs_per_row %}
{% assign mod = forloop.index | modulo:thumbs_per_row %}
{% if mod == 0 %}</div><div class="row">{% endif %}
{% endif %}
@stewartknapman
stewartknapman / shopify_checkout_reset.css
Last active Jun 6, 2017
A reset of the Shopify checkout stylesheet.
View shopify_checkout_reset.css
/*
* Shopify checkout reset
*/
/* Reset base elements */
body, h1, h2, h3, h4, h5, h6, p, h1 span.subtitle, h3.divider, #welcome, #container, #container.slim, #main, #container.slim #main, #content, #header, #container.slim #header, #header h1,
#info-bar, #footer, .footer p, #container.slim #footer, #overview, #overview h2, #overview a, #products, #done, #wallet, div.wallet-highlight, #cost, #order-num, #success, #steps, #thumbs,
#thumbs div, #thumbs td, .slim #thumbs td, #thumbs h3, #thumbs h3 span, #thumbs span, #overview .hint, #payment-type, #payment-type li, #payment-type li:hover, li.text-payment, .center,
#addresses, #email, #email label, #email input, #shipping-same label, .address-notification, #gateway-logos, #gateway-logos img, #pay-with, #pay-with h3, #payment, #or, #payment-methods li,
#payment-methods input, #credit-card-valid, img.credit-card, .field-with-errors, .field-with-errors input, .field-with-errors .error-message, .severe-error, .gleft, .gright, label,
@stewartknapman
stewartknapman / style.liquid.scss
Last active Dec 2, 2020
Compile sass into liquid
View style.liquid.scss
// Escape Liquid in scss.
//
// Expected output:
// a{
// color: {{ settings.link-color }};
// }
a{
color: #{'{{ settings.link-color }}'};
}
@stewartknapman
stewartknapman / checkout.scss
Last active Jan 4, 2016
Pull web fonts into Shopify's checkout from the theme settings, through a sass file located outside the theme directory. Why? ... because its cool.
View checkout.scss
/*
* Checkout.scss sits outside the Shopify theme folder so that we can pull in Boostrap and our checkout reset via scss imports.
* This will be compiled into checkout.css.liquid and saved in our theme assets folder.
* As this will be compiled into liquid we need to escape our liquid tags to prevent our compiler having a meltdown.
*
* You need to do this across two files otherwise you'll end up with an empty import rule at the top of your checkout.css.liquid
*/
// import the compiled font_import.css.liquid from our assets folder.
// note the escaped liquid.
View browserify_uglifyify_gulp.js
gulp.task('browserify', function () {
return browserify('./src/js/app.js', {
debug: true, // with source maps
transform: ['brfs', 'uglifyify'] // include file system and uglify before bundle
})
.bundle()
.pipe(source('app.js')) // Pass desired output filename to vinyl-source-stream
.pipe(gulp.dest('./assets/js/')); // Start piping stream to tasks!
});
View shut_it_down.liquid
{% comment note:
We do not want certain products to be available as a standard product with the standard template so SHUT IT DOWN!
http://media1.giphy.com/media/bMza4SFYBEb8k/giphy.gif
If the product has been given the 'bundle-only' template as its default then find its appropriate (or first) bundle collection
and redirect the user to go to there.
%}{% endcomment %}
{% assign redirect_url = false %}
{% assign bundle_templates = 'sixpack,bundles,planbuilder' | split: ',' %}
View page_url.liquid
{% capture function %}
{% comment note:
Shopify, crazily enough, does not have a global object that returns the current url like it does for the page_title.
So lets fake one.
It will take into account filtered collections.
It will not take into account url params and hash anchors, because reasons.
page_url_with_shop_domain gives you the page_url with the shop.url prepended.
%}{% endcomment %}
{% if template contains '404' %}