Merge pull request Shopify#100 from Shopify/update-comment-styles

Updated comment styles for easier reaading and scanning
cimocimocimo · Jun 11, 2014 · 02bf546 · 02bf546
2 parents d6a0a7a + 0b1b5e0
commit 02bf546
Show file tree

Hide file tree

Showing 3 changed files with 250 additions and 273 deletions.
diff --git a/assets/ajaxify.js b/assets/ajaxify.js
@@ -1,32 +1,29 @@
-// (c) Copyright 2014 Shopify Inc. Author: Carson Shold (@cshold). All Rights Reserved.
-
-/*
- * Ajaxify the add to cart experience and flip the button for inline confirmation,
- * show the cart in a modal, or a 3D drawer.
- *
- * This file includes:
- *    - Basic Shopify Ajax API calls
- *    - Ajaxify plugin
- *
- * This requires:
- *    - jQuery 1.8+
- *    - handlebars.min.js (for cart template)
- *    - modernizer.min.js
- *    - snippet/ajax-cart-template.liquid
-*/
-
-/*
- * Plugin Documentation - http://shopify.github.io/Timber/#ajax-cart
-*/
-
-// JQUERY API (c) Copyright 2009-2014 Shopify Inc. Author: Caroline Schnapp. All Rights Reserved.
-// Includes slight modifications to addItemFromForm.
+/*============================================================================
+  (c) Copyright 2014 Shopify Inc. Author: Carson Shold (@cshold). All Rights Reserved.
 
+  Plugin Documentation - http://shopify.github.io/Timber/#ajax-cart
+
+  Ajaxify the add to cart experience and flip the button for inline confirmation,
+  show the cart in a modal, or a 3D drawer.
+
+  This file includes:
+    - Basic Shopify Ajax API calls
+    - Ajaxify plugin
+
+  This requires:
+    - jQuery 1.8+
+    - handlebars.min.js (for cart template)
+    - modernizer.min.js
+    - snippet/ajax-cart-template.liquid
+
+  JQUERY API (c) Copyright 2009-2014 Shopify Inc. Author: Caroline Schnapp. All Rights Reserved.
+  Includes slight modifications to addItemFromForm.
+==============================================================================*/
 if ((typeof Shopify) === 'undefined') { Shopify = {}; }
 
-// -------------------------------------------------------------------------------------
-// API Helper Functions
-// -------------------------------------------------------------------------------------
+/*============================================================================
+  API Helper Functions
+==============================================================================*/
 function floatToString(numeric, decimals) {
   var amount = numeric.toFixed(decimals).toString();
   if(amount.match(/^\.\d+/)) {return "0"+amount; }
@@ -61,9 +58,9 @@ function getCookie(c_name) {
   return c_value;
 }
 
-// -------------------------------------------------------------------------------------
-// API Functions
-// -------------------------------------------------------------------------------------
+/*============================================================================
+  API Functions
+==============================================================================*/
 Shopify.formatMoney = function(cents, format) {
 
   if (typeof cents == 'string') cents = cents.replace('.','');
@@ -130,7 +127,9 @@ Shopify.onError = function(XMLHttpRequest, textStatus) {
   }
 };
 
-// POST to cart/add.js returns the JSON of the line item associated with the added item
+/*============================================================================
+  POST to cart/add.js returns the JSON of the line item associated with the added item
+==============================================================================*/
 Shopify.addItem = function(variant_id, quantity, callback) {
   var quantity = quantity || 1;
   var params = {
@@ -153,9 +152,11 @@ Shopify.addItem = function(variant_id, quantity, callback) {
   jQuery.ajax(params);
 };
 
-// POST to cart/add.js returns the JSON of the line item
-//   - Allow use of form element instead of id
-//   - Allow custom error callback
+/*============================================================================
+  POST to cart/add.js returns the JSON of the line item
+    - Allow use of form element instead of id
+    - Allow custom error callback
+==============================================================================*/
 Shopify.addItemFromForm = function(form, callback, errorCallback) {
   var params = {
     type: 'POST',
@@ -228,10 +229,9 @@ Shopify.changeItem = function(variant_id, quantity, callback) {
   jQuery.ajax(params);
 };
 
-// -------------------------------------------------------------------------------------
-// Ajaxify Shopify Add To Cart
-// -------------------------------------------------------------------------------------
-
+/*============================================================================
+  Ajaxify Shopify Add To Cart
+==============================================================================*/
 var ajaxifyShopify = (function(module, $) {
 
   'use strict';
@@ -248,9 +248,9 @@ var ajaxifyShopify = (function(module, $) {
   // Private functions
   var updateCountPrice, flipSetup, revertFlipButton, modalSetup, showModal, sizeModal, hideModal, drawerSetup, showDrawer, hideDrawer, sizeDrawer, loadCartImages, formOverride, itemAddedCallback, itemErrorCallback, cartUpdateCallback, setToggleButtons, flipCartUpdateCallback, buildCart, cartTemplate, adjustCart, adjustCartCallback, createQtySelectors, qtySelectors, scrollTop;
 
-  /**
-   * Initialise the plugin and define global options
-   */
+  /*============================================================================
+    Initialise the plugin and define global options
+  ==============================================================================*/
   init = function (options) {
 
     // Default settings

diff --git a/assets/ajaxify.scss.liquid b/assets/ajaxify.scss.liquid
@@ -1,25 +1,25 @@
-/*
-* Shopify Ajax Cart
-* Copyright 2014 Shopify Inc.
-* Author Carson Shold @cshold
-* Built with Sass - http://sass-lang.com/
+/*============================================================================
+  Shopify Ajax Cart
+  Copyright 2014 Shopify Inc.
+  Author Carson Shold @cshold
+  Built with Sass - http://sass-lang.com/
 
-* Some things to know about this file:
+  Some things to know about this file:
     - This file uses the same grid as timber.scss.liquid.
       - If you want to use this separately, please include the following sections from timber.scss.liquid:
         * #Breakpoint and Grid Variables
         * #Grid Setup
       - You may need to massage the code so it doesn't reference any non-existent mixins.
-*
-* This file includes
-*    - Sass helpers
-*    - Colour variables to customize
-*    - Styles for cart drawer, modal, and the flipped add to cart button
-*/
-
-// ==============================================================================
-// #Breakpoint and Grid Variables (from timber.scss.liquid)
-// ==============================================================================
+
+  This file includes
+    - Sass helpers
+    - Colour variables to customize
+    - Styles for cart drawer, modal, and the flipped add to cart button
+==============================================================================*/
+
+/*============================================================================
+  #Breakpoint and Grid Variables (from timber.scss.liquid)
+==============================================================================*/
 $viewportIncrement: 1px;
 
 $small: 480px;
@@ -32,10 +32,10 @@ $preLarge: $large - $viewportIncrement;
 
 $gutter: 24px;
 
-// ==============================================================================
-// Dependency-free breakpoint mixin
+/*============================================================================
+  Dependency-free breakpoint mixin
 // http://blog.grayghostvisuals.com/sass/sass-media-query-mixin/
-// ==============================================================================
+==============================================================================*/
 $min: min-width;
 $max: max-width;
 @mixin at-query ($constraint, $viewport1, $viewport2:null) {
@@ -54,9 +54,9 @@ $max: max-width;
   }
 }
 
-// ==============================================================================
-// Sass Helpers
-// ==============================================================================
+/*============================================================================
+  Sass Helpers
+==============================================================================*/
 @mixin border-box($type: border-box) {
   -webkit-box-sizing: $type;
   -moz-box-sizing: $type;
@@ -145,9 +145,9 @@ $max: max-width;
   }
 }
 
-// ==============================================================================
-// Ajaxify Colours
-// ==============================================================================
+/*============================================================================
+  Ajaxify Colours
+==============================================================================*/
 $ajaxifyGrey: #444;
 $ajaxifyGreyDark: #454545;
 
@@ -164,16 +164,16 @@ $modalBorderColor: $borderColor;
   color: $ajaxifyGrey;
 }
 
-// ==============================================================================
-// Ajaxify Helpers
-// ==============================================================================
+/*============================================================================
+  Ajaxify Helpers
+==============================================================================*/
 body.ajaxify-lock {
   overflow: hidden;
 }
 
-// ==============================================================================
-// Ajaxify Loader
-// ==============================================================================
+/*============================================================================
+  Ajaxify Loader
+==============================================================================*/
 .ajaxifyCart-loader {
   display: none;
   opacity: 0;
@@ -195,9 +195,9 @@ body.ajaxify-lock {
   }
 }
 
-// ==============================================================================
-// Ajaxify Flip
-// ==============================================================================
+/*============================================================================
+  Ajaxify Flip
+==============================================================================*/
 form[action="/cart/add"],
 form[action^="/cart/add"] {
   @include clearfix;
@@ -295,9 +295,9 @@ form[action^="/cart/add"] {
 }
 
 
-// ==============================================================================
-// Ajaxify Cart - General
-// ==============================================================================
+/*============================================================================
+  Ajaxify Cart - General
+==============================================================================*/
 .ajaxifyCart--content {
   position: relative;
   @include perspective(1000px);
@@ -371,9 +371,9 @@ form[action^="/cart/add"] {
 }
 
 
-// ==============================================================================
-// #Quantity Selectors
-// ==============================================================================
+/*============================================================================
+  #Quantity Selectors
+==============================================================================*/
 .js-qty {
   position: relative;
   margin-bottom: 1em;
@@ -427,9 +427,9 @@ form[action^="/cart/add"] {
   border-right: 1px solid $borderColor;
 }
 
-// ==============================================================================
-// #Quantity Selectors in the Ajax Cart
-// ==============================================================================
+/*============================================================================
+  #Quantity Selectors in the Ajax Cart
+==============================================================================*/
 .ajaxifyCart--qty {
   @extend .js-qty;
   top: -5px;
@@ -483,9 +483,9 @@ form[action^="/cart/add"] {
 }
 
 
-// ==============================================================================
-// Ajaxify Modal
-// ==============================================================================
+/*============================================================================
+  Ajaxify Modal
+==============================================================================*/
 #ajaxifyModal {
   position: fixed;
   top: 50%;
@@ -653,9 +653,9 @@ form[action^="/cart/add"] {
   }
 }
 
-// ==============================================================================
-// Ajaxify Drawer
-// ==============================================================================
+/*============================================================================
+  Ajaxify Drawer
+==============================================================================*/
 #ajaxifyDrawer {
   background-color: $drawerBackgroundColor;
   height: 0px;
@@ -773,10 +773,10 @@ form[action^="/cart/add"] {
 
 
 
-// ==============================================================================
-// Sprites
+/*============================================================================
+  Sprites
 //   - using data URIs to prevent any additional http requests
-// ==============================================================================
+==============================================================================*/
 .sprite {
   display: block;
   text-indent: -9999px;