solidus_liquid 0.0.1.alpha

data/app/views/solidus_liquid/themes/skeleton-theme/config/settings.html

@@ -0,0 +1,217 @@
+<p>Theme settings allow designers to provide an easy way for any user to customize the look and feel of their shop without having to delve into HTML or CSS code. Please see our <a title="Open Theme Settings documentation in a new window" target="docs" href="http://docs.shopify.com/themes/theme-templates/settings">help page on theme settings</a> to learn more about how you can make your theme customizable.</p>
+
+<fieldset>
+  <legend>Colors</legend>
+  <h3>Background</h3>
+  <table>
+    <tr>
+      <th><label for="background_color">Background color</label></th>
+      <td><input id="background_color" name="background_color" type="text" class="color" /></td>
+    </tr>
+  </table>
+  <h3>Text</h3>
+  <table>
+    <tr>
+      <th><label for="text_color">Text color</label></th>
+      <td><input id="text_color" name="text_color" type="text" class="color" /></td>
+    </tr>
+    <tr>
+      <th><label for="link_color">Link color</label></th>
+      <td><input id="link_color" name="link_color" type="text" class="color" /></td>
+    </tr>
+  </table>
+</fieldset>
+
+<fieldset>
+  <legend>Typography</legend>
+  <table>
+    <tr>
+      <th><label for="base_font_family">Typeface</label></th>
+      <td>
+        <select id="base_font_family" name="base_font_family" class="font">
+          <optgroup label="Google Fonts">
+            <option value="'Source Sans Pro', sans-serif">Source Sans Pro</option>
+          </optgroup>
+        </select>
+      </td>
+    </tr>
+    <tr>
+      <th><label for="base_font_size">Base font size</label></th>
+      <td>
+        <select id="base_font_size" name="base_font_size">
+          <option value="13px">13px</option>
+          <option value="14px">14px</option>
+          <option value="15px">15px</option>
+          <option value="16px">16px</option>
+        </select>
+       </td>
+    </tr>
+  </table>
+</fieldset>
+
+<fieldset>
+  <legend>Header</legend>
+  <h3>Logo Options</h3>
+  <table>
+    <tr>
+      <td><label for="use_logo">Use Custom Logo?</label></td>
+      <td><input type="checkbox" id="use_logo" name="use_logo" /></td>
+    </tr>
+    <tr>
+      <td><label for="logo_image">Custom Logo</label></td>
+      <td><input type="file" name="logo.png" id="logo_image" data-max-width="1200" data-max-height="1200" /></td>
+    </tr>
+    <tr>
+      <td colspan="2"><small>Recommend the optimal width and height for your logo here.</small></td>
+    </tr>
+  </table>
+  <h3>Social links</h3>
+  <table>
+    <tr>
+      <td colspan="2"><small>All links, except the email one, must begin with <i>http://</i>, <i>https://</i> or <i>//</i>. The email must be your email address with no <i>mailto:</i> prefix. Leave the text box blank if you don't want to use the corresponding icon.</small></td>
+    </tr>
+    <tr>
+      <th><label for="facebook_url">Facebook URL</label></th>
+      <td><input type="text" id="facebook_url" name="facebook_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="twitter_url">Twitter URL</label></th>
+      <td><input type="text" id="twitter_url" name="twitter_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="pinterest_url">Pinterest URL</label></th>
+      <td><input type="text" id="pinterest_url" name="pinterest_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="googleplus_url">Google+ URL</label></th>
+      <td><input type="text" id="googleplus_url" name="googleplus_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="flickr_url">Flickr URL</label></th>
+      <td><input type="text" id="flickr_url" name="flickr_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="instagram_url">Instagram URL</label></th>
+      <td><input type="text" id="instagram_url" name="instagram_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="linkedin_url">Linkedin URL</label></th>
+      <td><input type="text" id="linkedin_url" name="linkedin_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="vimeo_url">Vimeo URL</label></th>
+      <td><input type="text" id="vimeo_url" name="vimeo_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="youtube_url">Youtube URL</label></th>
+      <td><input type="text" id="youtube_url" name="youtube_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="tumblr_url">Tumblr URL</label></th>
+      <td><input type="text" id="tumblr_url" name="tumblr_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="wordpress_url">Wordpress URL</label></th>
+      <td><input type="text" id="wordpress_url" name="wordpress_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="yelp_url">Yelp URL</label></th>
+      <td><input type="text" id="yelp_url" name="yelp_url" /></td>
+    </tr>
+    <tr>
+      <th><label for="contact_email">Email</label></th>
+      <td><input type="email" id="contact_email" name="contact_email" /></td>
+    </tr>
+    <tr>
+      <th><label for="featured_blog">Blog feed</label></th>
+      <td><select class="blog" id="featured_blog" name="featured_blog" value="news" /></td>
+    </tr>
+    <tr>
+      <th><label for="social_icons_style">Social icons style</label></th>
+      <td>
+        <select id="social_icons_style" name="social_icons_style">
+          <option value="">Silhouette</option>
+          <option value="-circle">Circle</option>
+          <option value="-rounded">Rounded corners</option>
+          <option value="-square">Square</option>      
+        </select>
+      </td>
+    </tr>
+  </table>
+</fieldset>
+
+<fieldset>
+  <legend>Footer</legend>
+  <table>
+  </table>
+</fieldset>
+
+<fieldset>
+  <legend>Homepage</legend>
+  <h3>Content</h3>
+  <table>
+    <tr>
+      <th><label for="homepage_page">Show content of this page</label></th>
+      <td><select id="homepage_page" class="page" name="homepage_page" value="frontpage" /></td>
+    </tr>
+  </table>
+  <h3>Featured collection</h3>
+  <table>
+    <tr>
+      <th><label for="homepage_collection">Feature products from this collection</label></th>
+      <td><select id="homepage_collection" class="collection" name="homepage_collection" value="frontpage" /></td>
+    </tr>
+  </table>
+</fieldset>
+
+<fieldset>
+  <legend>Product pages</legend>
+  <table>
+  </table>
+</fieldset>
+
+<fieldset>
+  <legend>Collection pages</legend>
+  <h3>Product Grid</h3>
+  <table>
+    <tr>
+      <th><label for="products_per_row">Number of products per row</label></th>
+      <td>
+        <select id="products_per_row" name="products_per_row">
+          <option value="2">2</option>
+          <option value="3">3</option>
+          <option value="4" selected="selected">4</option>
+          <option value="5">5</option>
+          <option value="6">6</option>
+        </select>
+      </td>
+    </tr>
+    <tr>
+      <th><label for="number_of_rows">Number of rows</label></th>
+      <td>
+        <select id="number_of_rows" name="number_of_rows">
+          <option value="1">1</option>
+          <option value="2">2</option>
+          <option value="3" selected="selected">3</option>
+          <option value="4">4</option>
+          <option value="5">5</option>
+          <option value="6">6</option>
+          <option value="7">7</option>
+          <option value="8">8</option>
+        </select>
+      </td>
+    </tr>
+  </table>
+</fieldset>
+
+<fieldset>
+  <legend>Blog pages</legend>
+  <table>
+  </table>
+</fieldset>
+
+<fieldset>
+  <legend>Cart page</legend>
+  <table>
+  </table>
+</fieldset>

data/app/views/solidus_liquid/themes/skeleton-theme/config/settings_data.json

@@ -0,0 +1,26 @@
+{
+  "current": "Slate",
+  "presets": {
+    "Slate": {
+      "customer_layout": "theme",
+      "background_color": "#e6ebeb",
+      "text_color": "#555555",
+      "link_color": "#b5792b",
+      "facebook_url": "https://www.facebook.com/shopify",
+      "twitter_url": "https://twitter.com/shopify",
+      "pinterest_url": "http://pinterest.com/shopify/",
+      "instagram_url": "http://instagram.com/shopify",
+      "vimeo_url": "http://vimeo.com/shopify",
+      "youtube_url": "https://www.youtube.com/user/shopify",
+      "social_icons_style": "",
+      "use_logo": false,
+      "base_font_size": "16px",
+      "base_font_family": "'Source Sans Pro', sans-serif",
+      "featured_blog": "news",
+      "homepage_page": "frontpage",
+      "homepage_collection": "frontpage",
+      "products_per_row": "3",
+      "number_of_rows": "4"
+    }
+  }
+}

data/app/views/solidus_liquid/themes/skeleton-theme/layout/theme.liquid

@@ -0,0 +1,181 @@
+<!doctype html>
+<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
+<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
+<!--[if IE 8]><html class="no-js lt-ie9" lang="en"> <![endif]-->
+<!--[if IE 9 ]><html class="ie9 no-js"> <![endif]-->
+<!--[if (gt IE 9)|!(IE)]><!--> <html class="no-js"> <!--<![endif]-->
+<head>
+  <meta charset="utf-8" />
+  <!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1' /><![endif]-->
+
+  <title>
+  {{ page_title }}{% if current_tags %} &ndash; tagged "{{ current_tags | join: ', ' }}"{% endif %}{% if current_page != 1 %} &ndash; Page {{ current_page }}{% endif %}{% unless page_title contains shop.name %} &ndash; {{ shop.name }}{% endunless %}
+  </title>
+
+  {% if page_description %}
+  <meta name="description" content="{{ page_description | escape }}" />
+  {% endif %}
+
+  <link rel="canonical" href="{{ canonical_url }}" />
+
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+  {% include 'open-graph-tags' %}
+  {% include 'twitter-card' %}
+
+  {{ content_for_header }}
+
+  {{ 'style.scss.css' | asset_url | stylesheet_tag }}
+  {{ 'social/social-icons.css' | global_asset_url | stylesheet_tag }}
+  {{ '//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.0.3/css/font-awesome.css' | stylesheet_tag }}
+
+  {{ '//fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700,400italic,600italic,700italic' | stylesheet_tag }}
+
+  <!--[if lt IE 9]>
+  {{ '//html5shiv.googlecode.com/svn/trunk/html5.js' | script_tag }}
+  <![endif]-->
+
+  {{ 'shopify_common.js' | shopify_asset_url | script_tag }}
+  {% if template contains 'customers' %}
+  {{ 'customer_area.js'  | shopify_asset_url | script_tag }}
+  {% endif %}
+
+  <!-- Additional Shopify helpers that will likely be added to the global shopify_common.js some day soon. -->
+  {{ 'shopify_common.js'  | asset_url | script_tag }}
+
+  {{ 'option_selection.js' | shopify_asset_url | script_tag }}
+
+  {{ '//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js' | script_tag }}
+  <script>jQuery('html').removeClass('no-js').addClass('js');</script>
+
+</head>
+
+<body id="{{ page_title | handle }}" class="{% if customer %}customer-logged-in {% endif %}template-{{ template | replace: '.', ' ' | truncatewords: 1, '' | handle }}" >
+
+  <div class="container">
+
+    <header class="row">
+
+      <div class="social-links half column left-aligned">
+      {% include 'social-links' %}
+      </div>
+
+      {% comment %}
+        Note on checkout link: it is a good idea to avoid linking to /checkout directly because shops that use
+        Paypal Express Checkout and/or Google Checkout have special checkout buttons on the /cart page. Also,
+        special instructions for the seller are entered on the /cart page. Finally, the universal tracking code
+        of Google Analytics may not work if linking directly to the /checkout page.
+      {% endcomment %}
+
+      <div class="half column right-aligned">
+
+        <div class="cart-link">
+          <a href="/cart"><img src="{{ 'cart.svg' | asset_url }}" /> {{ cart.item_count }} {{ cart.item_count | pluralize: 'item', 'items' }} ({{ cart.total_price | money }})</a>
+        </div>
+
+        {% if shop.customer_accounts_enabled %}
+        <div class="customer-links">
+          {% if customer %}
+            Logged in as <a href="/account">{{ customer.first_name }}</a> · {{ 'Log out' | customer_logout_link }}
+          {% else %}
+            {{ 'Log in' | customer_login_link }}
+            {% if shop.customer_accounts_optional %}
+            or {{ 'Create an account' | customer_register_link }}
+            {% endif %}
+          {% endif %}
+        </div>
+        {% endif %}
+
+      </div>
+
+      {% comment %}
+        It would be nice if the logo was a shop setting, rather than a theme setting.
+        But for now, it is a theme setting. The shop logo is uploaded on the theme settings page.
+        Link to the theme settings page of currently published theme will always be:
+        http://www.shopify.com/admin/themes/current/settings.
+        To add theme settings to a theme, see this: http://docs.shopify.com/themes/theme-templates/settings
+        Theme settings are added to http://www.shopify.com/admin/themes/current#config/settings.html
+      {% endcomment %}
+
+      <div class="masthead full column clear centered" role="banner">
+        {% if settings.use_logo %}
+        <a id="logo" href="/">
+          {{ 'logo.png' | asset_url | img_tag: shop.name }}
+        </a>
+        {% else %}
+        <a id="site-title" href="/">
+          {{ shop.name }}
+        </a>
+        {% endif %}
+        {% if template == 'index' %}
+        {% comment %}
+          Many SEO audit tools look for a h1 tag on the home page. Let's give 'em one.
+          Other pages should use the resource name as h1 tag. For example, on the product
+          page, the product title will use a h1 tag.
+        {% endcomment %}
+        <h1 class="hidden">{{ shop.name }}</h1>
+        {% endif %}
+      </div>
+
+      <div class="clear full column">
+
+        {% comment %}
+          Main Navigation
+        {% endcomment %}
+        {% include 'site-nav' %}
+
+        {% comment %}
+          IE8 and IE9 don't support the HTML5 placeholder attribute, so it's a good idea to use JavaScript
+          to show and hide the placeholder text.
+          Have a look in assets/shop.js.liquid to see sample JavaScript for this.
+        {% endcomment %}
+        <form action="/search" method="get" class="search-form right" role="search">
+          <input name="q" type="search" id="search-field" placeholder="Search store..." value="{{ search.terms | escape }}" />
+          <input type="submit" id="search-submit" value="Search" />
+        </form>
+
+      </div>
+
+    </header>
+
+    <div id="main" role="main">
+      {% comment %}}
+        We have a template file to render.
+        That's what content_for_layout is for.
+      {% endcomment %}
+      {{ content_for_layout }}
+    </div>
+
+    <footer>
+
+      {% if linklists.footer.links.size > 0 %}
+      <p role="navigation">
+      {% for link in linklists.footer.links %}
+        <a href="{{ link.url }}" title="{{ link.title }}"{% if link.active %} class="active"{% endif %}>{{ link.title }}</a>
+      {% endfor %}
+      </p>
+      {% endif %}
+
+      {% unless shop.enabled_payment_types == empty %}
+	  <div class="payment-types">
+        {% for type in shop.enabled_payment_types %}
+        <img width="40" src="{{ type | payment_type_img_url }}" />
+        {% endfor %}
+      </div>
+      {% endunless %}
+
+      <p role="contentinfo" class="small-print">Copyright &copy; {{ "now" | date: "%Y" }} {{ shop.name }}. {{ powered_by_link }}.</p>
+
+    </footer>
+
+    {% comment %}Shopify does not support Internet Explorer 6 nor 7. It does encourage themes to support IE8 until the end of 2014.{% endcomment %}
+    <!--[if lt IE 8]>
+    <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
+    <![endif]-->
+
+  </div><!-- end of #container -->
+
+  {{ 'shop.js'  | asset_url | script_tag }}
+
+</body>
+</html>

data/app/views/solidus_liquid/themes/skeleton-theme/snippets/article-grid-item.liquid

@@ -0,0 +1,73 @@
+{% comment %}If no value is passed to the snippet, we will set the snippet variable to a sensible default.{% endcomment %}
+{% if article-grid-item == '' %}{% assign article-grid-item = 'three-per-row' %}{% endif %}
+
+{% assign article_has_image = false %}
+{% assign img_tag = '<' | append: 'img' %}
+{% if article.excerpt_or_content contains img_tag %}
+  {% assign src = article.excerpt_or_content | split: 'src="' %}
+  {% assign src = src[1] | split: '"' | first %}
+  {% if src %}
+    {% assign article_has_image = true %}
+    {% assign image_src = src | replace: '_small', '' | replace: '_compact', '' | replace: '_medium', '' | replace: '_large', '' | replace: '_grande', '' %}
+  {% endif %}
+{% endif %}
+
+<li class="{{ article-grid-item }}">
+  
+  {% if article.tags.size > 0 %}
+  <h4><a href="/blogs/{{ blog.handle }}/tagged/{{ tag | handle }}">{{ article.tags.first }}</a></h4>
+  {% endif %}
+
+  {% if article_has_image %}
+  <div class="article-image-wrap">  
+    <a href="{{ article.url }}">
+      <img src="{{ image_src }}" alt="{{ article.title | escape }}" />
+    </a>
+  </div><!-- .prod-image-wrap -->
+  {% endif %}
+  
+  <div class="article-caption">
+      <h3>
+        <a href="{{ article.url }}">
+        {{ article.title }}
+        </a>
+      </h3>
+      <p class="article-summary">
+        {% if article.excerpt.size > 0 %}
+        {{ article.excerpt | strip_html }}
+        {% else %}
+        {{ article.content | strip_html | truncatewords: 50 }}
+        {% endif %}
+      </p>
+  </div><!-- .prod-caption -->
+  
+  <p class="date left left-aligned">
+    <time pubdate datetime="{{ article.published_at | date: '%Y-%m-%d' }}">{{ article.published_at | date: '%b %d, %Y' }}</time>
+  </p>
+   
+  <p class="right right-aligned">
+    <a href="{{ article.url }}">Read more &#8594;</a>
+  </p>
+  
+</li>
+
+{% comment %}
+You don't need to use a clearing div. Use whatever it is you use to clear
+floated elements. The code that follows just just shows you how to use a cycle element.
+Notice that we named it ( 'clear' ). We need to name it because there's another cycle
+element in this file ( we called that other one 'last' ). If you have more than one
+cycle element in a rendered view, you'll need to name all of them.
+The cycle element is documented here: http://docs.shopify.com/themes/liquid-basics/logic#cycle
+{% endcomment %}
+
+{% if article-grid-item == 'six-per-row' %}
+{% cycle 'clear': '', '', '', '', '', '<div style="clear:both"></div>' %}
+{% elsif article-grid-item == 'five-per-row' %}
+{% cycle 'clear': '', '', '', '', '<div style="clear:both"></div>' %}
+{% elsif article-grid-item == 'four-per-row' %}
+{% cycle 'clear': '', '', '', '<div style="clear:both"></div>' %}
+{% elsif article-grid-item == 'three-per-row' %}
+{% cycle 'clear': '', '', '<div style="clear:both"></div>' %}
+{% elsif article-grid-item == 'two-per-row' %}
+{% cycle 'clear': '', '<div style="clear:both"></div>' %}
+{% endif %}