diff --git a/.gitignore b/.gitignore index 5396b67f..4ccf6fec 100644 --- a/.gitignore +++ b/.gitignore @@ -5,22 +5,13 @@ *.tmproj tmtags -## EMACS -*~ -\#* -.\#* - ## VIM *.swp ## PROJECT::GENERAL .sass-cache -coverage -rdoc -pkg ## PROJECT::SPECIFIC -*.gem -.rvmrc .bundle -tmp/* +tmp/ +bin/ diff --git a/.rspec b/.rspec new file mode 100644 index 00000000..83e16f80 --- /dev/null +++ b/.rspec @@ -0,0 +1,2 @@ +--color +--require spec_helper diff --git a/Gemfile b/Gemfile index 5f7fa106..88e8c381 100644 --- a/Gemfile +++ b/Gemfile @@ -1,24 +1,30 @@ source 'https://rubygems.org' -gem "serve", "~> 1.5.1" +gem "serve" #, github: "danielstutzman/serve", require: false # Use the edge instead: # gem "serve", :git => "git://github.com/jlong/serve.git" -gem "sinatra" -gem "sinatra-contrib" + +gem "sinatra", require: false +gem "sinatra-contrib", require: false, github: "ocapi/sinatra-contrib" +gem "activesupport", require: false # # Use Compass and Sass -gem "coffee-script" -gem "sinatra-asset-pipeline" -gem "bourbon" -gem "hashie" +gem "coffee-script", require: false +gem "sinatra-asset-pipeline", require: false +gem "bourbon", require: false +gem "hashie", require: false +gem "mime-types", require: false # gem "actionpack", "~> 3.2" # # gem "railties", "~> 3.2" -gem "nokogiri" -# + + # # Markdown and Textile -gem "mustache" -gem "rdiscount" # Markdown +gem "nokogiri", require: false +gem "mustache", require: false +gem "rdiscount", require: false +gem "fastimage", require: false +# Markdown # gem "RedCloth" # Textile # # Other templating languages @@ -29,9 +35,12 @@ gem "rdiscount" # Markdown # gem "less" # group :development, :test do - - gem "guard-jasmine" - gem "guard-pow" + gem "rspec", require: false + gem "guard-jasmine", require: false + gem "guard-pow", require: false + gem "awesome_print", require: false + gem 'rspec-html-matchers', require: false # gem "jasminerice", github: "bradphelan/jasminerice" # gem "jquery-rails" end + diff --git a/Gemfile.lock b/Gemfile.lock index fb37946f..74bf9b7c 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,62 +1,106 @@ +GIT + remote: git://github.com/ocapi/sinatra-contrib.git + revision: 840eb8a3e7c9826f29be070307ca818a74d84f08 + specs: + sinatra-contrib (1.4.2) + multi_json + rack-protection + rack-test + sinatra (~> 1.4.0) + tilt (~> 1.3) + GEM remote: https://rubygems.org/ specs: - activesupport (3.2.6) - i18n (~> 0.6) + activesupport (3.2.21) + i18n (~> 0.6, >= 0.6.4) multi_json (~> 1.0) - backports (3.3.5) + addressable (2.3.8) + awesome_print (1.2.0) bourbon (3.1.8) sass (>= 3.2.0) thor - childprocess (0.3.9) + celluloid (0.15.2) + timers (~> 1.1.0) + childprocess (0.4.0) ffi (~> 1.0, >= 1.0.11) - coderay (1.0.9) + coderay (1.1.0) coffee-script (2.2.0) coffee-script-source execjs - coffee-script-source (1.6.3) + coffee-script-source (1.7.0) + diff-lcs (1.2.5) execjs (2.0.2) - ffi (1.4.0) - guard (1.6.2) - listen (>= 0.6.0) - lumberjack (>= 1.0.2) - pry (>= 0.9.10) - terminal-table (>= 1.4.3) - thor (>= 0.14.6) - guard-jasmine (1.5.0) + fastimage (1.6.8) + addressable (~> 2.3, >= 2.3.5) + ffi (1.9.3) + formatador (0.2.4) + guard (2.3.0) + formatador (>= 0.2.4) + listen (~> 2.1) + lumberjack (~> 1.0) + pry (>= 0.9.12) + thor (>= 0.18.1) + guard-jasmine (1.19.0) childprocess - guard (>= 1.1.0) + guard (>= 2.0.0) multi_json thor - guard-pow (1.0.0) - guard (>= 1.1) - hashie (1.2.0) + tilt + guard-pow (2.0.0) + guard (~> 2.0) + hashie (2.0.5) hike (1.2.3) - i18n (0.6.5) - listen (0.7.3) - lumberjack (1.0.2) - method_source (0.8.1) - multi_json (1.8.2) + i18n (0.7.0) + listen (2.4.0) + celluloid (>= 0.15.2) + rb-fsevent (>= 0.9.3) + rb-inotify (>= 0.9) + lumberjack (1.0.4) + method_source (0.8.2) + mime-types (2.1) + mini_portile (0.5.2) + multi_json (1.11.0) mustache (0.99.5) - nokogiri (1.5.10) - pry (0.9.12) - coderay (~> 1.0.5) + nokogiri (1.6.1) + mini_portile (~> 0.5.0) + pry (0.9.12.6) + coderay (~> 1.0) method_source (~> 0.8) slop (~> 3.4) rack (1.5.2) - rack-protection (1.5.1) + rack-protection (1.5.2) rack - rack-test (0.6.1) + rack-test (0.6.2) rack (>= 1.0) - rake (0.9.2.2) + rake (10.1.1) + rb-fsevent (0.9.4) + rb-inotify (0.9.3) + ffi (>= 0.5.0) rdiscount (2.1.7) - sass (3.2.9) - serve (1.5.1) - activesupport (~> 3.0) + rspec (3.2.0) + rspec-core (~> 3.2.0) + rspec-expectations (~> 3.2.0) + rspec-mocks (~> 3.2.0) + rspec-core (3.2.0) + rspec-support (~> 3.2.0) + rspec-expectations (3.2.0) + diff-lcs (>= 1.2.0, < 2.0) + rspec-support (~> 3.2.0) + rspec-html-matchers (0.7.0) + nokogiri (~> 1) + rspec (~> 3) + rspec-mocks (3.2.0) + diff-lcs (>= 1.2.0, < 2.0) + rspec-support (~> 3.2.0) + rspec-support (3.2.1) + sass (3.2.14) + serve (1.5.2) + activesupport (~> 3.2.12) i18n - rack (~> 1.2) - rack-test (~> 0.5) - tilt (~> 1.3) + rack (~> 1.5.2) + rack-test (~> 0.6.2) + tilt (~> 1.3.3) tzinfo sinatra (1.4.4) rack (~> 1.4) @@ -70,15 +114,8 @@ GEM sprockets sprockets-helpers sprockets-sass - sinatra-contrib (1.4.2) - backports (>= 2.0) - multi_json - rack-protection - rack-test - sinatra (~> 1.4.0) - tilt (~> 1.3) - slop (3.4.3) - sprockets (2.10.0) + slop (3.4.7) + sprockets (2.10.1) hike (~> 1.2) multi_json (~> 1.0) rack (~> 1.0) @@ -88,24 +125,32 @@ GEM sprockets-sass (1.0.2) sprockets (~> 2.0) tilt (~> 1.1) - terminal-table (1.4.5) thor (0.18.1) - tilt (1.4.1) - tzinfo (0.3.38) + thread_safe (0.3.5) + tilt (1.3.7) + timers (1.1.0) + tzinfo (1.2.2) + thread_safe (~> 0.1) PLATFORMS ruby DEPENDENCIES + activesupport + awesome_print bourbon coffee-script + fastimage guard-jasmine guard-pow hashie + mime-types mustache nokogiri rdiscount - serve (~> 1.5.1) + rspec + rspec-html-matchers + serve sinatra sinatra-asset-pipeline - sinatra-contrib + sinatra-contrib! diff --git a/assets/images/embed-subscribe-50px b/assets/images/embed-subscribe-50px new file mode 100644 index 00000000..d24f8221 Binary files /dev/null and b/assets/images/embed-subscribe-50px differ diff --git a/assets/images/logo-round-white.svg b/assets/images/global/logo-round-white.svg similarity index 100% rename from assets/images/logo-round-white.svg rename to assets/images/global/logo-round-white.svg diff --git a/assets/javascripts/app/analytics.coffee b/assets/javascripts/app/analytics.coffee index 7cd4f500..e33d10cf 100644 --- a/assets/javascripts/app/analytics.coffee +++ b/assets/javascripts/app/analytics.coffee @@ -1,46 +1,46 @@ # build data user -unless window.client_geo_data - $.getJSON "http://smart-ip.net/geoip-json?callback=?", (data) -> - window.client_geo_data = data - -if not window.issue_uid or document.cookie.match("issue_uid") - window.issue_uid = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15) - document.cookie = "issue_uid=" + issue_uid + "; expires=Fri, 31 Dec " + ((new Date()).getFullYear() + 99) + " 23:59:59 GMT; path=/" - -# build environment -tracking_env = (action, title, env) -> - env or env = {} - client_geo_data = window.client_geo_data or {} - user = window.App and App.user and App.user.toJSON() - $.extend - action: action - page: env["page"] or $("link[rel=canonical]").attr("href") or window.location.toString() - - # Title: explicity set or default to document.title - title: title or document.title - - # Magazine: magazine handle - magazine: null - - # Issue: issue handle (short name) - issue: null - - # Content page id - page_id: $("[data-page-id]").attr("data-page-id") - - # Author - author: null - - # User - user: user - - # client device - url: window.location.toString() - uid: issue_uid - referer: document.referrer - agent: navigator.userAgent - , env, client_geo_data - -App.on "track", (action, title, data) -> - track_url = "//127.0.0.1:9200/analytics/events" - $.post track_url, JSON.stringify(tracking_env(action, title, data)) +#unless window.client_geo_data +# $.getJSON "http://smart-ip.net/geoip-json?callback=?", (data) -> +# window.client_geo_data = data +# +#if not window.issue_uid or document.cookie.match("issue_uid") +# window.issue_uid = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15) +# document.cookie = "issue_uid=" + issue_uid + "; expires=Fri, 31 Dec " + ((new Date()).getFullYear() + 99) + " 23:59:59 GMT; path=/" +# +## build environment +#tracking_env = (action, title, env) -> +# env or env = {} +# client_geo_data = window.client_geo_data or {} +# user = window.App and App.user and App.user.toJSON() +# $.extend +# action: action +# page: env["page"] or $("link[rel=canonical]").attr("href") or window.location.toString() +# +# # Title: explicity set or default to document.title +# title: title or document.title +# +# # Magazine: magazine handle +# magazine: null +# +# # Issue: issue handle (short name) +# issue: null +# +# # Content page id +# page_id: $("[data-page-id]").attr("data-page-id") +# +# # Author +# author: null +# +# # User +# user: user +# +# # client device +# url: window.location.toString() +# uid: issue_uid +# referer: document.referrer +# agent: navigator.userAgent +# , env, client_geo_data +# +#App.on "track", (action, title, data) -> +# track_url = "//127.0.0.1:9200/analytics/events" +# $.post track_url, JSON.stringify(tracking_env(action, title, data)) diff --git a/assets/javascripts/app/core.coffee b/assets/javascripts/app/core.coffee index f14a70fe..e2977e21 100644 --- a/assets/javascripts/app/core.coffee +++ b/assets/javascripts/app/core.coffee @@ -23,6 +23,7 @@ this.refresh() this.bindObservers() + this.updateLayout() this.trigger("loaded", document.title, url: window.location.toString()) @@ -79,6 +80,8 @@ Core = { # Support & feature detection support: { + embed: !!document.location.href.match(/\/embed\/|embed=1/) + standalone: !!window.navigator.standalone touch: document.documentElement.hasOwnProperty("ontouchstart") diff --git a/assets/javascripts/app/hotspot.coffee b/assets/javascripts/app/hotspot.coffee index c9008596..1e50c2b4 100644 --- a/assets/javascripts/app/hotspot.coffee +++ b/assets/javascripts/app/hotspot.coffee @@ -12,19 +12,85 @@ class Hotspot extends Backbone.View el: ".hotspot" - events: - "click": "show" + spacing: 18 + arrowSpacing: 60 + + template: _.template(""" +
+
+
+ + <% if (image_url) { %> + + <% } %> + +

<%= title %>

+

+ + <% if (typeof subtitle != "undefined" ) { %> + <%= subtitle %> + <% } %> + + <% if (typeof price != "undefined") { %> + <%= price %> <%= currency %> + <% } %> + +

+ + <% if (summary) { %> +
<%= summary %>
+ <% } %> + +
+ + <% if (action && link) { %> + + <% } %> +
+ """) initialize: (data)-> - @page = data.page || App.page + @model = data.model || App.currentPage.model + @target = $(@el) + + this.lookup(@el) + + visit: (e)-> + link = e.currentTarget + + # google analytics custom campaign tracking params + issue = $('[data-issue]').data('issue') + ga_params = "utm_source=issue.by&utm_campain=#{issue}&utm_content=#{encodeURI(App.currentPage.model.title)}" + link.href += if link.href.match(/\?/) then '&' else '?' + link.href += ga_params - $('body').on 'click', this.hide + if App.support.webview + App.trigger "open", link.href, linkTrackingAttributes(link) + + false # Lookup data and dimension of hotspot target lookup: (hotspot)-> # Look up hotspot attributes or page object - lookupKey = $(hotspot).attr('href') + lookupKey = $(hotspot).data('url') || $(hotspot).attr('href') isProduct = $(hotspot).is('.product') defaultData = { @@ -35,152 +101,151 @@ class Hotspot extends Backbone.View } # Use element attributes title, subtitle, summary - if App.page + if @model if isProduct - data = _(@page.products).find (p)-> lookupKey == p.url - data.action = "shop" if data + data = _(@model.products).find (p)-> lookupKey == ( p.link || p.url ) + + if typeof data == "undefined" + console.log "Hotspot#lookup #{lookupKey} hotspot data" + return + + data.action = "shop" if !data.action && data.action != false + + data.currency = null unless data.currency? else - data = _(@page.links).find (p)-> lookupKey == p.url + data = _(@model.links).find (p)-> lookupKey == ( p.link || p.url ) data ||= { - title: $(hotspot).attr('title'), - subtitle: $(hotspot).data('subtitle'), - image_url: $(hotspot).data('image'), + title: $(hotspot).attr('title'), + subtitle: $(hotspot).data('subtitle'), action: $(hotspot).data('action'), - description: $(hotspot).data('description'), - url: $(hotspot).attr('href').replace("#", ''), + summary: $(hotspot).data('description'), + link: $(hotspot).attr('href').replace("#", '') } - data = _.extend(defaultData, data) - - if data && data.title - return data - - # Show popover dialog - show: (e)=> - hotspot = $(e.currentTarget || @$el[0]) - - if @hotspot == hotspot - return - else - @hotspot = hotspot - - data = this.lookup(@hotspot) - - console.log(data, @hotspot) - - this.render(data) if data + data.image_url = $(hotspot).data('image') + data.summary = $("
").html(data.summary).text() - false + # Backport summary and link + console.log("Lookup hotspot:", lookupKey, data) - hide: (e)=> + @data = _.extend(defaultData, data) - if $(e.target).parents('.product-popover').length > 0 - console.log("ignore") - return + render: (position)-> + return unless @data - if @popover && @popover.hasClass('show') - @popover.remove() + this.track() - $('body').removeClass('stop-scrolling') - $('article.page .content').removeClass('stop-scrolling') + $('.page-overlay').show() if App.viewport.width < 768 - render: (data)-> - return data unless data + $('.popover').remove() + # @popover.remove() if @popover - spacing = 18 - arrowSpacing = 60 + console.log("render hotspot dialog", @data) - dimension = @hotspot[0].getBoundingClientRect() - center_pos = { - x: dimension.left + dimension.width / 2, - y: dimension.top + dimension.height / 2 - } - - template = """ -
-
-
- - <% if (image_url) { %> - - <% } %> + @popover = $( this.template(@data) ) + @popover.find('a').on "click", this.visit -

<%= title %>

-

- - <% if (typeof subtitle != "undefined" ) { %> - <%= subtitle %> - <% } %> - - <% if (typeof price != "undefined" ) { %> - <%= price %> - <% } %> - -

+ $('body').append(@popover) - <% if (description) { %> -
<%= description %>
- <% } %> + this.reposition(position) -
+ # $('body').addClass('stop-scrolling') + # $('article.page .content').addClass('stop-scrolling') - <% if (url) { %> -
- <% if (action == "shop") { %> - Shop now - <% } else { %> - View more - <% } %> + # Reposition popover to target element + # TODO: calculate scroll offset + reposition: (position)-> + console.log("reposition:", @target, position) -
- <% } %> -
- """ + # Dimension of target + if @target.length > 0 + dimension = @target[0].getBoundingClientRect() + else + dimension = { height: 25, width: 0 } - @popover.remove() if @popover + # Find center position of target or use supplied position + position ||= {} - @popover = $(_.template(template, data)) - $('body').append(@popover) + unless position.x + position = _.extend({ + x: dimension.left + dimension.width / 2, + y: (dimension.top + $(window).scrollTop()) + dimension.height / 2 + }, position) popStyle = @popover[0].getBoundingClientRect() arrow = @popover.find('.arrow') # Position popover/arrow - if App.viewport.width > 480 + if App.viewport.width >= 768 || App.isAdmin + arrow.removeClass("up down left right") - if document.body.offsetHeight - center_pos.y - dimension.height / 2 < popStyle.height + if document.body.offsetHeight - position.y - dimension.height / 2 < popStyle.height arrowPosition = 'down' targetSpacing = dimension.height / 2 - if targetSpacing < spacing - targetSpacing = spacing * 2 + if targetSpacing < @spacing + targetSpacing = @spacing * 2 - @popover.css('top', center_pos.y - targetSpacing - popStyle.height) + @popover.css('top', position.y - targetSpacing - popStyle.height) # arrow point up else arrowPosition = "up" - @popover.css "top", center_pos.y + dimension.height / 2 + spacing + @popover.css "top", position.y + dimension.height / 2 + @spacing + + # Middle arrow + + if position.align == "middle" + @popover.css "left", position.x - popStyle.width / 2 # arrow position left - if center_pos.x < popStyle.width - arrowSpacing + else if position.align == "left" || position.x < popStyle.width - @arrowSpacing arrowPosition += " left" - @popover.css "left", center_pos.x - arrowSpacing + @popover.css "left", position.x - @arrowSpacing # arrow position right else arrowPosition += " right" - @popover.css "left", center_pos.x - popStyle.width + arrowSpacing + @popover.css "left", position.x - popStyle.width + @arrowSpacing + @popover.find(".arrow").addClass arrowPosition # show popover - @popover.removeClass("hide").addClass("show") - $('body').addClass('stop-scrolling') - $('article.page .content').addClass('stop-scrolling') + @popover.removeClass('show').addClass("show") + + + track: => + title = this.$el.attr('title') || this.$el.attr('data-title') + data = { + url: this.$el.data("url") || this.el.href + price: this.$el.attr("data-price") + currency: this.$el.attr("data-currency") + magazine: this.$el.parents("[data-magazine]").attr("data-magazine") + issue: this.$el.attr("data-issue") || this.$el.parents("[data-issue]").attr("data-issue") + page_id: this.$el.parents("[data-page-id]").attr("data-page-id") + } + + App.trigger('track', 'hotspot:click', title , data) + + hide: (e)=> + $('.overlay').hide() + + if $('.popover').length > 0 + return + + if @popover && @popover.hasClass('show') + @popover.hide() + + setTimeout => + @popover.remove() + , 100 + + $('body').removeClass('stop-scrolling') + $('article.page .content').removeClass('stop-scrolling') # Export to global namespace (window or global) this.Hotspot = Hotspot diff --git a/assets/javascripts/app/layout.coffee b/assets/javascripts/app/layout.coffee index 1928ccfd..fc63f063 100644 --- a/assets/javascripts/app/layout.coffee +++ b/assets/javascripts/app/layout.coffee @@ -43,8 +43,12 @@ Layout = { width: page.width() } + # Magazine slides resize + if @magazine && @magazine.slides + @magazine.slides.__resize() + # Update content UI # - this.updateContentWidth() + # this.updateContentWidth() # Trigger layout refresh event with previous dimension App.trigger("layout:refresh", previous: previous) @@ -71,8 +75,25 @@ Layout = { # set @viewport height & width # hide tablet & mobile safari address bar detectLayout: -> - container = $('[role=main]') + # Initial env detection (no-touch, embed, resolution) + # + unless @detected + # flag embed + document.documentElement.className += " embed" if @support.embed + + # detect touch event + document.documentElement.className += " no-touch" unless @support.touch + # Set screen resolution cookie + document.cookie='resolution='+Math.max(screen.width,screen.height)+'; path=/' + + @detected = true + + # Mobile Safari: Hide address bar + # window.scrollTo(0, 1) if @support.swipe && !@support.webview + + # Orientation detection + # if navigator.userAgent.match(/(iPhone|iPod)/) # NOTE: Temporary fix to support app.io ipad detection @support.swipe = if window.screen.height > 568 then "horizontal" else "vertical" @@ -80,13 +101,11 @@ Layout = { else if !!navigator.userAgent.match(/iPad/) @support.swipe = "horizontal" - window.scrollTo(0, 1) if @support.swipe && !@support.webview - # Support horizontal swipe - if @support.swipe == "horizontal" || window.innerHeight < window.innerWidth - container.removeClass("portrait").addClass("landscape") - else - container.removeClass("landscape").addClass("portrait") + viewable = { + height: window.innerHeight, + width: window.innerWidth + } if window.orientation @orientation = if window.orientation % 180 == 0 then 'portrait' else 'landscape' @@ -96,67 +115,75 @@ Layout = { @landscape = @orientation == "landscape" @portraite = @orientation == "portrait" - # Refresh view port + # Refresh view port calculation + # if @support.swipe - @viewport.width = Math.max(320, window.innerWidth) - @viewport.height = window.innerHeight #- $('header.toolbar').height() + @viewport.width = Math.max(320, viewable.width) + @viewport.height = viewable.height #- $('header.toolbar').height() else - @viewport.width = if @viewport.maxWidth then Math.min(@viewport.maxWidth, window.innerWidth) else window.innerWidth - @viewport.height = if @viewport.maxHeight then Math.min(@viewport.maxHeight, window.innerHeight) else window.innerHeight + if @viewport.maxWidth + @viewport.width = Math.min(@viewport.maxWidth, viewable.width) + else + @viewport.width = viewable.width - this.menuWidth() + + @viewport.height = if @viewport.maxHeight then Math.min(@viewport.maxHeight, viewable.height) else viewable.height # Notify layout detected and propagate layout object # - App.trigger("layout:detect", { orientation: @orientation, height: @viewport.height, width: @viewport.width }) + App.trigger("layout:detect", { orientation: @orientation, height: @viewport.height, width: @viewport.width }) - # Calcualte page layout + # Calculate page layout updateLayout: -> - - if @support.swipe - css = " + # return if @viewport.width < 480 + css = " @media only screen and (min-width: 768px) {\n #sections { max-width: #{@viewport.width}px }\n - article.paginate .content { width: #{@viewport.width}px }\n + article.paginate .content { width: #{@viewport.width}px !important }\n article.two-column .cover-area { width: #{@viewport.width / 2}px }\n article.three-column .cover-area { width: #{@viewport.width * 2 / 3}px }\n - article.two-column.cover-right .cover-area { left: #{@viewport.width / 2}px }\n - article.three-column.cover-right .cover-area { left: #{@viewport.width / 3}px }\n + article.two-column.image-cover.cover-right .cover-area { left: #{@viewport.width / 2}px }\n + article.three-column.image-cover.cover-right .cover-area { left: #{@viewport.width / 3}px }\n }\n - @media only screen and (min-width: 768px) and (orientation: landscape) {\n - article.two-column.no-image.has-product.cover-left .content { margin-left: #{@viewport.width / 2}px }\n + @media only screen and (min-width: 768px) {\n + article.two-column.has-product.no-image.cover-left .content { margin-left: #{@viewport.width / 2}px }\n + article.three-column.has-product.no-image.cover-left .content { margin-left: #{@viewport.width / 3 * 2}px }\n }\n - [role=main] .page {\n + .webview [role=main] article.page {\n width: #{@viewport.width}px; - height: #{@viewport.height}px; }\n - " - else - css = " - @media only screen and (min-width: 768px) {\n - #sections { max-width: #{@viewport.width}px }\n - article.paginate .content { width: #{@viewport.width}px }\n + [role=main] article.page {\n + width: #{@viewport.width}px;\n + height: #{@viewport.height}px; + }\n + " - article.two-column .cover-area { width: #{@viewport.width / 2}px }\n - article.three-column .cover-area { width: #{@viewport.width * 2 / 3}px }\n + # Prepend default css rules before admin/embed + unless @support.swipe + css = " + #{css} \n - article.two-column.cover-right .cover-area { left: #{@viewport.width / 2}px }\n - article.three-column.cover-right .cover-area { left: #{@viewport.width / 3}px }\n + body.admin [role=main] {\n + width: #{@viewport.width}px; }\n - @media only screen and (min-width: 768px) and (orientation: landscape) {\n - article.two-column.no-image.has-product.cover-left .content { margin-left: #{@viewport.width / 2}px }\n + body.admin #issue-menu {\n + width: #{@viewport.width}px; }\n - [role=main] .page {\n - width: #{@viewport.width}px; - height: #{@viewport.height}px; + .embed-issue [role=main] article.page {\n + width: #{App.viewport.width}px;\n + height: #{App.viewport.height - 60}px; }\n " + + App.trigger("layout:update", @viewport) + style = document.createElement('style') style.type = 'text/css' style.id = "touch-layout" @@ -170,6 +197,15 @@ Layout = { $('#touch-layout').remove() $(document.head).append(style) + # Set Orientation on main container + container = $('[role=main]') + + if @support.swipe == "horizontal" || window.innerHeight < window.innerWidth + container.removeClass("portrait").addClass("landscape") + else + container.removeClass("landscape").addClass("portrait") + + # console.log("[Layout] Set layout size") # Change Orientation @@ -245,6 +281,39 @@ Layout = { # console.log('[issue.coffee] image sizes detected:', @imageSizes) + # Lock body scroll + # toggle can be true, false + lockScroll: (mode)-> + $(document.body).toggleClass("locked", mode) + + # show overlay in app context + overlay: (mode)-> + unless mode? + mode = $('.overlay').css('display') == "none" + + # lock body/content scroll mode overlay is active + this.lockScroll(mode) + + $('.overlay').toggle(mode) + + # Overlay inside a page + pageOverlay: (toggle)-> + if toggle == false + $('.page-overlay').hide() + this.lockScroll(false) + else + $('.page-overlay').show() + this.lockScroll(true) + + # Detect app menu width + menuWidth: -> + + if $('#menu').is(':visible') + $('#menu').width() + else + 0 + + # TODO: Paginate is now in page view # Update content width for 2-col layout updateContentWidth: -> paginate_page = $('.page.paginate').removeClass('paginate') @@ -260,7 +329,7 @@ Layout = { setTimeout => width = Math.ceil( paginate_page[0].scrollWidth / App.viewport.width ) * App.viewport.width paginate_page.width(width) - , 200 + , 300 # Layout related scrollTop: (element, duration = 200)-> @@ -283,13 +352,6 @@ Layout = { element.scrollTop = 0 )() - overlay: (toggle)-> - if toggle == false - $('.overlay').false() - $(document.body).toggleClass('locked', false) - else - $('.overlay').show() - $(document.body).toggleClass('locked', true) } App.extend Layout diff --git a/assets/javascripts/app/log.coffee b/assets/javascripts/app/log.coffee index 4c0f7ced..b16b1a55 100644 --- a/assets/javascripts/app/log.coffee +++ b/assets/javascripts/app/log.coffee @@ -1,48 +1,48 @@ # build data user -window.client_geo_data = JSON.parse(localStorage && localStorage.getItem('client_geo_data')) -unless client_geo_data - $.getJSON "http://smart-ip.net/geoip-json?callback=?", (data) -> - localStorage.setItem('client_geo_data', JSON.stringify(data)) - window.client_geo_data = data - -if not window.issue_uid or document.cookie.match("issue_uid") - window.issue_uid = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15) - document.cookie = "issue_uid=" + issue_uid + "; expires=Fri, 31 Dec " + ((new Date()).getFullYear() + 99) + " 23:59:59 GMT; path=/" - -# build environment -tracking_env = (action, title, env) -> - env or env = {} - client_geo_data = window.client_geo_data or {} - user = window.App and App.user and App.user.toJSON() - $.extend - action: action - page: env["page"] or $("link[rel=canonical]").attr("href") or window.location.toString() - - # Title: explicity set or default to document.title - title: title or document.title - - # Magazine: magazine handle - magazine: null - - # Issue: issue handle (short name) - issue: null - - # Content page id - page_id: $("[data-page-id]").attr("data-page-id") - - # Author - author: null - - # User - user: user - - # client device - url: window.location.toString() - uid: issue_uid - referer: document.referrer - agent: navigator.userAgent - , env, client_geo_data - -App.on "track", (action, title, data) -> - track_url = "//127.0.0.1:9200/analytics/events" - $.post track_url, JSON.stringify(tracking_env(action, title, data)) +#window.client_geo_data = JSON.parse(localStorage && localStorage.getItem('client_geo_data')) +#unless client_geo_data +# $.getJSON "http://smart-ip.net/geoip-json?callback=?", (data) -> +# localStorage.setItem('client_geo_data', JSON.stringify(data)) +# window.client_geo_data = data +# +#if not window.issue_uid or document.cookie.match("issue_uid") +# window.issue_uid = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15) +# document.cookie = "issue_uid=" + issue_uid + "; expires=Fri, 31 Dec " + ((new Date()).getFullYear() + 99) + " 23:59:59 GMT; path=/" +# +## build environment +#tracking_env = (action, title, env) -> +# env or env = {} +# client_geo_data = window.client_geo_data or {} +# user = window.App and App.user and App.user.toJSON() +# $.extend +# action: action +# page: env["page"] or $("link[rel=canonical]").attr("href") or window.location.toString() +# +# # Title: explicity set or default to document.title +# title: title or document.title +# +# # Magazine: magazine handle +# magazine: null +# +# # Issue: issue handle (short name) +# issue: null +# +# # Content page id +# page_id: $("[data-page-id]").attr("data-page-id") +# +# # Author +# author: null +# +# # User +# user: user +# +# # client device +# url: window.location.toString() +# uid: issue_uid +# referer: document.referrer +# agent: navigator.userAgent +# , env, client_geo_data +# +#App.on "track", (action, title, data) -> +# track_url = "//127.0.0.1:9200/analytics/events" +# $.post track_url, JSON.stringify(tracking_env(action, title, data)) diff --git a/assets/javascripts/app/map_view.coffee b/assets/javascripts/app/map_view.coffee new file mode 100644 index 00000000..05c584fc --- /dev/null +++ b/assets/javascripts/app/map_view.coffee @@ -0,0 +1,85 @@ + +class MapView extends Backbone.View + className: "map-container" + + events: { + "click .close-map": "close" + } + + # Location object + location: { name: "Sydney australia", longitude: 0, latitude: 0 } + + target: null + + # Pass location object and target element + initialize: (data)-> + + # Rendering target, defaults to window + @target = data.target || window + @location = data.location + @zoom = 7 + @closeBtn = $('') + @closeBtn.addClass('pull-left') if @target.find('.show-map').hasClass('pull-left') + + render: -> + console.log("Render map view for", @location, this.$el.html()) + + @el.id = this.cid + + # Setup google map + unless @map + this.buildMap(@location) + this.$el.append(@closeBtn) + else + App.loading(false) + + # Renders map elements + this.$el.css( + position: "absolute" + zIndex: 1 + top: 0, + left: 0, + right: 0, + bottom: 0 + ) + + this.$el.show() + @closeBtn.show() + + console.log("view element", @el) + if @target == window + document.body.appendChild(@el) + else + $(@target).append(@el) + + # Force google map to resize, it needs to be inserted to dom to have layout + google.maps.event.trigger(@map, "resize"); + + # Build instance of google map + buildMap: (location)-> + console.log("Build map for", location.latitude, location.longitude) + + place = new google.maps.LatLng(parseFloat(location.latitude), parseFloat(location.longitude)) + @map = new google.maps.Map(@el, zoom: 7, center: place) + marker = new google.maps.Marker( + position: place + animation: google.maps.Animation.DROP + map: @map + ) + + if location.name + info = new google.maps.InfoWindow(content: location.name) + info.open @map, marker + + google.maps.event.addListener marker, 'click', => info.open(@map, marker) + google.maps.event.addListener @map, "tilesloaded", => App.loading(false) + @map + + # close map view + close: -> + @closeBtn.hide() + this.$el.hide() + false + +@MapView = MapView + diff --git a/assets/javascripts/app/notification.coffee b/assets/javascripts/app/notification.coffee index f8f4c9c0..58fb89f6 100644 --- a/assets/javascripts/app/notification.coffee +++ b/assets/javascripts/app/notification.coffee @@ -75,10 +75,23 @@ $(document).on "click", "[data-track]", (e)-> page view ### -$ -> +$(document).on "page:change", -> App.trigger("track", "view", null, magazine: $("[data-magazine]").data("magazine"), issue: $("[data-issue]").data("issue"), page_id: $("[data-page-id]").data("page-id"), author: $("[data-author]").data("author") ) + + +### + + Ajax start/stop loading indicators + +### + +$(document).on "ajaxStart", -> + App.trigger("loading:start") + +$(document).on "ajaxStop", -> + App.trigger("loading:stop") \ No newline at end of file diff --git a/assets/javascripts/app/page.coffee b/assets/javascripts/app/page.coffee index 176609e5..068be951 100644 --- a/assets/javascripts/app/page.coffee +++ b/assets/javascripts/app/page.coffee @@ -1,44 +1,474 @@ class PageView extends Backbone.View - el: 'article.page' - - initialize: -> + + # scroller + number: 1 + width: 0 + offset: 0 + clientX: 0 + clientY: 0 + + events: + "click .video": "playVideo" + "click .hotspot": "showHotspot" + "click a[data-app-view=layer]" : "openLayer" + + "click a[href^='geo:']" : 'showMap' + "click a.audio": "toggleAudio" + "click a[href]:not(.hotspot)" : "visit" + + initialize: (data)-> + @url = data.url + @path = data.path + @viewport = App.viewport + + @width = @viewport.width @container = $(window) - - @hotspot = new Hotspot(el: ".hotspot") - App.updateContentWidth() - + + theme = this.$el.data('theme') + theme = 'black' if this.$el.hasClass('cover') # || typeof theme == "undefined" + + opts = { path: @path, theme: theme } + opts['pageSnap'] = true if this.$el.hasClass('page-snap') + + App.trigger('page:loaded', @path, opts) + + # @hotspot = new Hotspot(el: "##{@el.id} .hotspot") if @el && @el.parentNode + + # Scroller code + onTouch: (e) -> + e = e.touches[0] if e.touches + + return if e.button == 2 + + @touched = true + + @clientX = e.clientX + @clientY = e.clientY + + $(@el).removeClass('animate').addClass('swiping') + + onMove: (e)-> + return unless @touched + + e = e.touches[0] if e.touches + deltaX = e.clientX - @clientX + + # console.log("Move/scroll", @width, @offset, deltaX, e) + $('.popover.page-hotspot').remove() if $('.popover.page-hotspot').length > 0 + + if this.isPaginated() + # left edge + return if @offset == 0 && deltaX > 0 + + # right edge + return if Math.abs(@offset) == (@width - @viewport.width) && deltaX < 0 + + this.updatePos(@offset + deltaX) + + false + + onTouchEnd: (e) -> + @touched = false + + return unless this.isPaginated() + e = e.changedTouches[0] if e.changedTouches + + deltaX = e.clientX - @clientX + + # Stop swiping and animate the left go. + $(@el).addClass('animate').removeClass('swiping') + + # Snap to the left + if @offset == 0 && deltaX > 0 + return this.updatePos(0) + + # Snap to right edge + if Math.abs(@offset) == (@width - @viewport.width) && deltaX < 0 + return this.updatePos(@offset) + + # Ingore small movement + if Math.abs(deltaX) < 50 + return this.updatePos(@offset) + + # go next + if deltaX < 50 + this.next() + else + this.prev() + + loadPage: (element)-> + # @hotspot.undelegateEvents() if @hotspot + # + # @hotspot = new Hotspot(el: "##{@el.id} .hotspot") if @el + + this.setElement(element) + + updatePos: (offset)-> + has3D = 'WebKitCSSMatrix' of window && 'm11' of new WebKitCSSMatrix() + if has3D + @el.style.webkitTransform = 'translate3d(' + offset + 'px, 0, 0)' + else + this.$el.css('transform', 'translate3d(' + offset + 'px, 0, 0)') + # @el.style.webkitTransform = 'translate3d(' + offset + 'px, 0, 0)' + + showMap: (e)-> + e.preventDefault() + e.stopImmediatePropagation() + + target = $(e.currentTarget).parent() + geo = e.currentTarget.href.match(/(-?\d+.?\d*),(-?\d+.?\d*)/) + latitude = geo[1] + longitude = geo[2] + + if !latitude or !longitude + throw 'Latitude and/or longitude not found' + + label = e.currentTarget.href.match(/label=([^&;]+)/) + if label + label = decodeURIComponent(label[1]) + + zoom = e.currentTarget.href.match(/zoom=([^&;])/) + if zoom + zoom = zoom[1] + + location = { latitude: latitude, longitude: longitude, name: label } + + if App.support.webview + App.trigger('open', 'geo', location) + else + mapView = target.data('map-view') + App.loading(true) + + unless mapView + mapView = new MapView(location: location, target: target) + target.data('map-view', mapView) + + mapView.render() + @mapView = mapView + + visit: (e)-> + link = e.currentTarget + $link = $(link) + + return if $link.attr('href')[0] == "#" + + e.preventDefault() + + # Tracking + track_click = ! $link.data("track") && ! $link.hasClass("browse") + if track_click + App.trigger("track", "click", link.href, linkTrackingAttributes(link)) + + # google analytics custom campaign tracking params + issue = $('[data-issue]').data('issue') + ga_params = "utm_source=issue.by&utm_campain=#{issue}&utm_content=#{encodeURI(App.currentPage.model.title)}" + link.href += if link.href.match(/\?/) then '&' else '?' + link.href += ga_params + + if App.support.webview && !$link.data('app-view') + App.trigger "open", link.href, linkTrackingAttributes(link) + + # external page + else if link.href.match(/https?:\/\//) + win = window.open(link.href, '_blank') + win.focus() + + # Internal page is handling by magazine view + else + null + + true + render: -> + console.log("page:render", @path) + + if this.isPaginated() + requestAnimationFrame => this.paginate() + # this.updatePos(@offset) if @el + + # Disable video autoplay for small screen + if window.screen.width <= 480 + this.$('video').each -> this.removeAttribute("autoplay") + # console.log("video object", this) + + # Override + # Display: none by magazine/cover, visiblity by swipeview.js + @el.style.display = '' if @el.style.display == "none" + @el.style.visibility = '' + + # make sure all pages start from the top position + # console.log("Page Render: ", this.$el.parent()) + if document.getElementById('swipeview-slider') && this.$el.parent().scrollTop() != 0 + this.$el.parent().scrollTop(0) + + if this.el.parentNode + this.el.parentNode.style.visibility = '' + + # set current page, track page view + setActive: -> + App.trigger('track', 'view', this.getTitle(), { page: this.getUrl() }) + + return if this.isActive() + + currentPath = location.pathname.split("/").filter (path)-> path != "" + currentPath = "/" + currentPath.join("/") + + # Set current + App.currentPage = this + + # Update history pushState + if !this.isEmbed() && this.getPath() != currentPath + history.pushState(null, null, this.getPath()) + document.title = this.getTitle() + + $('article.page.current').removeClass('current') + this.$el.addClass('current') + + # set autoplay + this.$('video, audio').each -> this.play() if this.hasAttribute('data-autoplay') + + App.trigger("page:active", @path) + + # set page as inactive + setInactive: -> + this.$('video, audio').each -> this.pause() + + getTheme: -> + this.$el.data('theme') || "white" - next: -> - scrollLeft = @container.scrollLeft() - - this.$el.css('opacity', '0') - - window.scrollTo( scrollLeft + App.viewport.width, 0) - - this.$el.animate({'opacity':1}, 0.3, 'ease-out') - - + @number += 1 + + if this.isSwipe() + $(@el).addClass('animate') + this.updatePos(@offset -= @viewport.width) + else + window.scrollTo(@container.scrollLeft() + @viewport.width, 0) + prev: -> - scrollLeft = @container.scrollLeft() - - # this.$el.css('-webkit-animation', 'none') - this.$el.css('opacity', '0') - - window.scrollTo( Math.max(0, scrollLeft - App.viewport.width) , 0) - - this.$el.animate({'opacity':1}, 0.3, 'ease-out') - + @number -= 1 + + if this.isSwipe() + $(@el).addClass('animate') + this.updatePos(@offset += @viewport.width) + else + window.scrollTo( Math.max(0, @container.scrollLeft() - @viewport.width) , 0) + + isEmbed: -> + this.$el.hasClass('embed') || $(document.body).hasClass("editions-embed") + canScroll: (dir)-> - if dir == 'left' - @container.scrollLeft() >= App.viewport.width - else - @container.scrollLeft() < this.$el.width() - App.viewport.width - - back: -> - - + if dir == 'prev' || dir == 'left' + if this.isSwipe() + # @offset >= @viewport.width + @offset < 0 && @offset < @viewport.width + else + @container.scrollLeft() >= @viewport.width + else + if this.isSwipe() + Math.abs(@offset) < (@width - @viewport.width) + else + @container.scrollLeft() < this.$el.width() - @viewport.width + + # Multi media + # + playVideo: (e)-> + container = $(e.currentTarget) + thumb = $(e.currentTarget).addClass('play').find('.thumbnail').hide() + + video = container.find('video') + iframe = container.find('iframe') + + if video.length > 0 + + video[0].play() + + else if iframe.length > 0 + + iframe.attr('src', iframe.data('src')).show() + + notifyPlayer = (data)-> + iframe[0].contentWindow.postMessage(JSON.stringify(data), iframe.data('src').split('?')[0]) + + App.trigger("track", "video:play", iframe.data('src')) + + toggleAudio: (e)-> + button = $(e.currentTarget) + audio = this.$('audio')[0] + + return unless audio + console.log("Toggle audio", audio.playing, button) + + button.removeClass('audio-on audio-off') + + if audio.paused + button.addClass("audio-on") + audio.play() + else + button.addClass("audio-off") + audio.pause() + + false + + showHotspot: (e)-> + hotspot = e.currentTarget + model = App.pages[this.$el.attr("data-page")] + + @hotspot = new Hotspot(el: hotspot, model: model) + @hotspot.render() + + false + + hideHotspot: (e)-> + if @hotspot + @hotspot.hide() + + openLayer: (e)-> + link = $(e.currentTarget) + + App.pageOverlay(true) + # App.lockScroll(true) + + layer = $(link.attr('href')) + + if layer.parent('[role=main]').length == 0 + $('[role=main]').append(layer) + + layer.show().removeClass('show').addClass('show') + + console.log("open layer", link, layer) + + false + + cleanup: -> + this.el.style.visibility = 'hidden' + this.hideHotspot() + this.undelegateEvents() + + detectSwipe: -> + return if App.support.webview + + if App.support.touch + @events = _.extend({ + touchstart: "onTouch" + touchmove: "onMove" + touchend: "onTouchEnd" + }, @events) + else + @events = _.extend({ + mousedown: "onTouch" + mousemove: "onMove" + mouseup: "onTouchEnd" + }, @events) + + paginate: -> + return unless this.isPaginated() + + # Observe page + this.detectSwipe() + + this.delegateEvents() + + # Method 1 - scroll height to test overflow + # this.$el.removeClass('paginate') + # overflown = @el.scrollHeight > (@el.offsetHeight + 20) + # console.log("Paginate overflow height", @el.scrollHeight, @el.offsetHeight) + + # Method 2 - scroll width to test overflow + overflown = @el.scrollWidth > @el.offsetWidth + console.log("Paginate overflow width?", @el.scrollWidth, @el.offsetWidth) + + # detect if content overflows then + if overflown + + console.log("paginate overflow content", this.$('.body').width()) + + this.$el.css('width', '') + # Method 1 # this.$el.addClass('paginate') + + App.on("layout:refresh", this.refreshPaginate) + + # Wait for browser to render pagination + setTimeout => + @width = Math.ceil( this.el.scrollWidth / @viewport.width ) * @viewport.width + this.$el.width(@width) + + # ??? + # if this.isSwipe() + # $(@el).addClass('animate') + # this.updatePos(@offset -= @viewport.width) + # else + # window.scrollTo( @container.scrollLeft() + @viewport.width, 0) + + , 200 + + refreshPaginate: => + return if @number == 1 + this.el.style.width = "" + + # Wait for browser to apply width and update scrollWidth + setTimeout => + @width = Math.ceil( this.el.scrollWidth / @viewport.width ) * @viewport.width + + console.log("Refresh pagination", this.el.scrollWidth, @viewport.width, @width, this.el.style.width) + + this.$el.width(@width) + + # calculate offset + offset = @viewport.width * ( @number - 1 ) + + if this.isSwipe() + @offset = - offset + this.updatePos(@offset) + else + window.scrollTo(offset, 0) + , 200 + # setTimeout => + # this.el.style.visibility = "" + # , 150 + + # Scroll end + isSwipe: -> + $('#swipeview-slider').length > 0 + + isPaginated: -> + this.$el.hasClass('paginate') && App.viewport.width > 480 + + trackAttributes: -> + { + page: @url, + title: this.$('.title').text(), + page_id: this.$el.attr("data-page-id"), + author: this.$el.attr("data-author") + } + + isActive: -> + this.$el.hasClass('current') + + isCover: -> + this.$el.hasClass('cover') + + # TODO: Move to page model + getTitle: -> + if @model && @model.title + @model.title + else if @model && @model.parentTitle + "#{@model.parentTitle} - #{@model.handle.split("/").slice(-1)[0]}" + + getPath: -> + page = this.$el.data('page') + parts = [ + $('[data-magazine]').data('magazine'), + $('[data-issue]').data('issue') + ] + + parts.push(page) unless page == "index" + + "/" + parts.join('/') + + getUrl: -> + location.origin + this.getPath() + # Export to global -this.PageView = PageView \ No newline at end of file +this.PageView = PageView diff --git a/assets/javascripts/embed.coffee b/assets/javascripts/embed.coffee index 9238b2b6..18b57c46 100644 --- a/assets/javascripts/embed.coffee +++ b/assets/javascripts/embed.coffee @@ -1,234 +1,221 @@ -` -/* mousetrap v1.4.6 craig.is/killing/mice */ -(function(J,r,f){function s(a,b,d){a.addEventListener?a.addEventListener(b,d,!1):a.attachEvent("on"+b,d)}function A(a){if("keypress"==a.type){var b=String.fromCharCode(a.which);a.shiftKey||(b=b.toLowerCase());return b}return h[a.which]?h[a.which]:B[a.which]?B[a.which]:String.fromCharCode(a.which).toLowerCase()}function t(a){a=a||{};var b=!1,d;for(d in n)a[d]?b=!0:n[d]=0;b||(u=!1)}function C(a,b,d,c,e,v){var g,k,f=[],h=d.type;if(!l[a])return[];"keyup"==h&&w(a)&&(b=[a]);for(g=0;gg||h.hasOwnProperty(g)&&(p[h[g]]=g)}e=p[d]?"keydown":"keypress"}"keypress"==e&&f.length&&(e="keydown");return{key:c,modifiers:f,action:e}}function F(a,b,d,c,e){q[a+":"+d]=b;a=a.replace(/\s+/g," ");var f=a.split(" ");1":".","?":"/","|":"\\"},G={option:"alt",command:"meta","return":"enter",escape:"esc",mod:/Mac|iPod|iPhone|iPad/.test(navigator.platform)?"meta":"ctrl"},p,l={},q={},n={},D,z=!1,I=!1,u=!1;for(f=1;20>f;++f)h[111+f]="f"+f;for(f=0;9>=f;++f)h[f+96]=f;s(r,"keypress",y);s(r,"keydown",y);s(r,"keyup",y);var m={bind:function(a,b,d){a=a instanceof Array?a:[a];for(var c=0;c95&&e<112){continue}if(r.hasOwnProperty(e)){u[r[e]]=e}}}return u}function O(e,t,n){if(!n){n=A()[e]?"keydown":"keypress"}if(n=="keypress"&&t.length){n="keydown"}return n}function M(e,t,n,r){function i(t){return function(){d=t;++l[e];L()}}function s(t){T(n,t,e);if(r!=="keyup"){h=g(t)}setTimeout(b,10)}l[e]=0;for(var o=0;o1){M(e,s,t,n);return}o=D(e,n);a[o.key]=a[o.key]||[];w(o.key,o.modifiers,{type:o.action},r,e,i);a[o.key][r?"unshift":"push"]({callback:t,modifiers:o.modifiers,action:o.action,seq:r,level:i,combo:e})}function H(e,t,n){for(var r=0;r":".","?":"/","|":"\\"},o={option:"alt",command:"meta","return":"enter",escape:"esc",mod:/Mac|iPod|iPhone|iPad/.test(navigator.platform)?"meta":"ctrl"},u,a={},f={},l={},c,h=false,p=false,d=false;for(var v=1;v<20;++v){r[111+v]="f"+v}for(v=0;v<=9;++v){r[v+96]=v}m(t,"keypress",C);m(t,"keydown",C);m(t,"keyup",C);var B={bind:function(e,t,n){e=e instanceof Array?e:[e];H(e,t,n);return this},unbind:function(e,t){return B.bind(e,function(){},t)},trigger:function(e,t){if(f[e+":"+t]){f[e+":"+t]({},e)}return this},reset:function(){a={};f={};return this},stopCallback:function(e,t){if((" "+t.className+" ").indexOf(" mousetrap ")>-1){return false}return t.tagName=="INPUT"||t.tagName=="SELECT"||t.tagName=="TEXTAREA"||t.isContentEditable},handleKey:N};e.Mousetrap=B;if(typeof define==="function"&&define.amd){define(B)}})(window,document)` + + +#@App = {} unless jQuery? || Zepto? return alert("Error: Jquery or Zepto is required") ## # Detect magazine and issue params -# +# file = (script.src for script in document.getElementsByTagName('script') when script.src.match(/embed\.js/)) -parser = document.createElement('a') -parser.href = file[0] +request = document.createElement('a') +request.href = file[0] -if matches = parser.search.match(/magazine=([^&]+)/) +if matches = request.search.match(/magazine=([^&]+)/) magazine = matches[1] else alert("Error: Require a valid magazine params ") -if matches = parser.search.match(/issue=([^&]+)/) +if matches = request.search.match(/issue=([^&]+)/) issue = matches[1] else issue = null -base_url = if parser.host.match(/\.dev/) then "http://issue.dev/embed/" else "http://issue.by/embed/" - -issue_url = base_url + "#{magazine}/#{issue}" +# Base url +if request.host.match(/\.dev/) + base_url = "http://spring.dev/" +else + base_url = "http://issue.by/embed/" +issue_url = base_url + "#{magazine}/#{issue}/" # # Issue viewer # Viewer = - + # http://localhost:3000/issue # file:///var/a/b/d/issue path: null - + init: (url) -> - @url = url - - @container = $("#issue-viewer").css({ - 'background': "#fff" - }) - + + @container = $("#issue-viewer").css({'background': "#fff"}) @container = document.body if @container.length == 0 - + parts = url.split('/') - parts.pop() if parts.length > 5 + # parts.pop() if parts.length > 5 @path = parts.join("/") - + console.log("Init viewer", @path) - + # Build iframe @frame = this.buildIframe() + this.goTo('index') + # Load pages and menu - $.getJSON issue_url + '/issue.json?callback=?', (data)-> + $.getJSON issue_url + 'issue.json?callback=?', (data)-> Viewer.load(data) - - # Observe events + + # Set current page + this.setCurrentPage( this.currentPage() ) + @nextBtn = $('') @prevBtn = $('') - - - # Set current page - this.setCurrentPage( @currentPage() ) - + @container.prepend(@nextBtn).prepend(@prevBtn) + @menuBtn = $('a.issue-menu') - @menuBtn.on "click", this.toggleMenu + + # Observe events + this.observeEvents() + + + trigger: (event, params...)-> + data = { + method: event, + params: params + } + + frame = document.getElementById('issue-frame') + from = frame.src.split("?")[0] - @nextBtn.on "click", $.proxy(this.next, this) - @prevBtn.on "click", $.proxy(this.prev, this) - @container.prepend(@nextBtn).prepend(@prevBtn) + XD.postMessage(JSON.stringify(data), from , frame.contentWindow ); - $('.issue-subscribe').on('click', -> false) + # + # Observe viewer events from keyboard, user interaction and iframe messages + # + observeEvents: -> - Mousetrap.bind("right", $.proxy(this.next, this)) - Mousetrap.bind("left", $.proxy(this.prev, this)) - Mousetrap.bind("option", this.toggleMenu) - Mousetrap.bind("r", this.reload) + # Dispatched Iframe communication (MessageEvent) + # Request { method: 'string', params: 'array', id: 'unique_id } + # Request { result: 'object', id: 'unique_id } + + window.addEventListener 'message', (message)=> + request = $.parseJSON(message.data) + + # go next/prev + this[request.method]() if request.method.match(/next|prev/) + + , "http://#{request.host}" + + # UI Events + $(document).on 'click', '.issue-menu', this.toggleMenu - $("nav.toc a").on "click", -> - - link = @href - link = link.replace(/\/viewer\//, "/issues/") if link.match(/\/viewer\//) - - Viewer.setCurrentPage link - Viewer.toggleMenu() + $(document).on 'click', '.next-page', (e)=> this.trigger("next-page") + $(document).on 'click', '.prev-page', (e)=> this.trigger("prev-page") + + $(document).on 'click', '.issue-subscribe', -> false + + $(document).on "click", "nav.toc a", -> + Viewer.goTo(@href) false + # Keyboard events + Mousetrap.bind "right", => this.trigger("next-page") + Mousetrap.bind "left", => this.trigger("prev-page") + Mousetrap.bind("option", this.toggleMenu) + Mousetrap.bind("r", this.reload) load: (data)-> @pages = data.pages - + $(@frame).after(data.menu_html) # @container.append() + goTo: (path)-> + page = this.currentPage(path) + + page = "" if page == "index" + + @frame.src = @path + page + "?from=#{encodeURIComponent(document.location.href)}&embed=1" + + this.setCurrentPage(page) + + next: -> current = this.currentPage() index = @pages.indexOf(current) - next = @pages[index + 1] - - console.log("Go Next", current, index, next) - # Set App glob - App = this.App() - - # console.log(App) - - # console.log(">> current", current) - # console.log(">> index", index) - # console.log(">> next", next) - - if App.pageView && App.pageView.canScroll() - App.pageView.next() - - else if next - $("#issue-frame").attr "src", @path + "/" + next + if next = @pages[index + 1] + this.goTo(next) - $("#issue-frame").off('load').on 'load', => - - @setCurrentPage next - @toggleMenu false - false - goTo: (path)-> - $("#issue-frame").attr "src", path - prev: -> - - # Set App glob - App = this.App() - current = @currentPage() index = @pages.indexOf(current) - prev = @pages[index - 1] - - if App.pageView && App.pageView.canScroll('left') - App.pageView.prev() - - else if prev - - $("#issue-frame").attr "src", @path + "/" + prev - - $("#issue-frame").off('load').on 'load', => - - @setCurrentPage prev - @toggleMenu false - # Set App glob - App = this.App() + if prev = @pages[index - 1] + this.goTo(prev) false - - currentPage: (story) -> - src = @frame.src - page = undefined - - if src.match(@path + "/") - page = @frame.src.replace(@path + "/", "") - else - page = "index" - page - toggleMenu: (state) -> nav = $("nav.toc") nav.toggleClass "show", state - + false - + # Private buildIframe: -> - width = @container.width() || 1024 - + # Build iframe iframe = document.createElement("iframe") - iframe.id = "issue-frame" - iframe.width = width + iframe.id = iframe.name = "issue-frame" + iframe.width = width iframe.height = width / 1.33 iframe.scrolling = "no" iframe.frameBorder = "0" - # iframe.style.overflow = "hidden" - # + + # iframe.src = @url + "?from=#{encodeURIComponent(document.location.href)}" + @container.prepend(iframe) - iframe.src = @url + iframe + currentPage: (path) -> + path ||= @frame.src + page = path.replace(@path, "").replace(/\?from=(.+)/, '') + page ||= "index" + page + # Return parent path if possible, otherwise return self setCurrentPage: (path) -> - page = path.replace(@path + "/", "") + page = path.replace(@path, "") parts = page.split(/\/|\?/) if parts.length > 1 story = parts[0] else story = parts[0] - + @container.attr "data-page", story - - + $("nav.toc a.active").removeClass "active" $("[data-page=\"" + story + "\"] .toc [class=\"" + story + "\"] a").addClass "active" - - App: -> - document.getElementById('issue-frame').contentWindow.App || {} + + this.toggleMenu(false) + + + #App: -> + # document.getElementById('issue-frame').contentWindow.App || {} reload: -> - document.getElementById("issue-frame").contentWindow.location.reload() - + $('#issue-frame').src = $('#issue-frame').src # When dom ready -$ -> +$ -> window.Viewer = Viewer Viewer.init(issue_url) - - - \ No newline at end of file + diff --git a/assets/javascripts/issue.coffee b/assets/javascripts/issue.coffee index f34c3bc7..b2b5feb0 100644 --- a/assets/javascripts/issue.coffee +++ b/assets/javascripts/issue.coffee @@ -3,10 +3,12 @@ #= require zepto #= require underscore #= require backbone -#= require fastclick - #= require mustache +# Patches/Polyfills +#= require post_message +#= require fastclick + #= require spring.ui #= require app/core #= require app/layout @@ -30,10 +32,10 @@ stream -> page issue -> page - issue.js core layout hotspot notification page - application.js core layout hotspot notification page ui viewer - admin.js application, admin - embed.js core layout hotspot notification page ui viewer + issue.js core layout hotspot notification page + application.js core layout hotspot notification page ui viewer + admin.js application, admin + embed.js core layout hotspot notification page ui viewer Clients: @@ -49,16 +51,62 @@ ### -$(document).on "click", '.video .thumbnail', -> - - iframe = $(this).next().children('iframe') - - iframe.attr('src', iframe.data('src')).show() - - $(this).css('visibility', 'hidden') - $(this).parent().css('zoom', 1) - + +### + + Embed viewer + +### + + + + +if App.support.embed + request = document.createElement('a') + + if matches = document.location.search.match(/from=([^&]+)/) + request.href = decodeURIComponent(matches[1]) + + App.embed_url = request.href + +App.notifyViewer = (method, params...)=> + + # Dispatched Iframe communication (MessageEvent) + # Request { method: 'string', params: 'array', id: 'unique_id } + # Request { result: 'object', id: 'unique_id } + message = JSON.stringify({ method: method, params: params}) + + console.log("Notify viewer", message) + XD.postMessage(message, request.href, parent); + +window.addEventListener 'message', (event)-> + console.log(event.domain, event.data) + + event = $.parseJSON(event.data) + args = [null, "embed", event.method].concat( event.params ) + + if event.method == "next-page" + if App.pageView && App.pageView.canScroll() + App.pageView.next() + else + App.notifyViewer("next") + + else if event.method == "prev-page" + + if App.pageView && App.pageView.canScroll("left") + App.pageView.prev() + else + + App.notifyViewer("prev") + # parent.Viewer.prev() if request.host == parent.location.host + + App.trigger.call(args) + + console.log("Embed Issue", args) + window.addEventListener 'load', -> + FastClick.attach(document.body) + , false diff --git a/assets/javascripts/vendor/swipeview.js b/assets/javascripts/vendor/swipeview.js index 56b0a004..45306767 100644 --- a/assets/javascripts/vendor/swipeview.js +++ b/assets/javascripts/vendor/swipeview.js @@ -1,8 +1,9 @@ /*! - * SwipeView v1.0 ~ Copyright (c) 2012 Matteo Spinelli, http://cubiq.org + * SwipeView v1.2 ~ Copyright (c) 2012 Matteo Spinelli, http://cubiq.org * Released under MIT license, http://cubiq.org/license */ -var SwipeView = (function (window, document) { +;(function (window, document) { + var dummyStyle = document.createElement('div').style, vendor = (function () { var vendors = 't,webkitT,MozT,msT,OT'.split(','), @@ -122,6 +123,16 @@ var SwipeView = (function (window, document) { page: 0, pageIndex: 0, customEvents: [], + + onMoveStart: function (fn){ + this.wrapper.addEventListener('swipeview-moveStart', fn, false); + this.customEvents.push(['moveStart', fn]); + }, + + onMove: function (fn) { + this.wrapper.addEventListener('swipeview-move', fn, false); + this.customEvents.push(['move', fn]); + }, onFlip: function (fn) { this.wrapper.addEventListener('swipeview-flip', fn, false); @@ -143,6 +154,21 @@ var SwipeView = (function (window, document) { this.customEvents.push(['touchstart', fn]); }, + onEndEvent: function(fn) { + this.wrapper.addEventListener('swipeview-endEvent', fn, false); + this.customEvents.push(['endEvent', fn]); + }, + + onTransitionEndEvent: function(fn){ + this.wrapper.addEventListener('swipeview-transitionEndEvent', fn, false); + this.customEvents.push(['transitionEndEvent', fn]); + }, + + onMouseMoveEvent: function(fn){ + this.wrapper.addEventListener('swipeview-mouseMoveEvent', fn, false); + this.customEvents.push(['mouseMoveEvent', fn]); + }, + destroy: function () { while ( this.customEvents.length ) { this.wrapper.removeEventListener('swipeview-' + this.customEvents[0][0], this.customEvents[0][1], false); @@ -249,6 +275,7 @@ var SwipeView = (function (window, document) { break; case moveEvent: this.__move(e); + this.__event('mouseMoveEvent'); break; case cancelEvent: case endEvent: @@ -257,9 +284,18 @@ var SwipeView = (function (window, document) { case resizeEvent: this.__resize(); break; - case transitionEndEvent: + + //case transitionEndEvent: + case 'transitionend': + case 'webkitTransitionEnd': + case 'transitionend': + case 'oTransitionEnd': + case 'MSTransitionEnd': case 'otransitionend': - if (e.target == this.slider && !this.options.hastyPageFlip) this.__flip(); + if (e.target == this.slider && !this.options.hastyPageFlip) + this.__flip(); + this.moved = false; + this.__event('transitionEndEvent'); break; } }, @@ -286,6 +322,8 @@ var SwipeView = (function (window, document) { if (this.initiated) return; + this.__event('moveStart'); + var point = hasTouch ? e.touches[0] : e; this.initiated = true; @@ -336,6 +374,8 @@ var SwipeView = (function (window, document) { return; } + this.__event('move'); + e.preventDefault(); this.directionLocked = true; @@ -357,6 +397,7 @@ var SwipeView = (function (window, document) { }*/ this.__pos(newX); + }, __end: function (e) { @@ -382,6 +423,7 @@ var SwipeView = (function (window, document) { } this.__checkPosition(); + this.__event('endEvent'); }, __checkPosition: function () { @@ -467,5 +509,22 @@ var SwipeView = (function (window, document) { return vendor + style; } - return SwipeView; + + + // AMD / RequireJS + if (typeof define !== 'undefined' && define.amd) { + define([], function () { + return SwipeView; + }); + } + // Node.js + else if (typeof module !== 'undefined' && module.exports) { + module.exports = SwipeView; + } + // included directly via + + +Marketing in startups is often thought of as “other”, something you think about after the real work of validating and building your product is finished. Perhaps, something you can leave outsiders (third party publicists) to take care of? + +> Marketing has to be an integral part of your startup from the very beginning. + +If not, you’re missing out on a number of important opportunities for customer discovery, as well as a chance to better understand what your product market/fit is. At the end of the day that is what customer development is. Here are three compelling reasons to think of marketing AS customer development: + +### 1) Early market testing around messaging leads you to understand what your customers are looking for + +One of the first things that startups can do to validate an idea (before any code is written) is run a number of ads with different messages to see which is clicked on/interacted with the most. This means you can drill down to what exactly your customers are wanting. Often we set up ads at launch, only to discover that what interests people is not what you are really offering. It’s much harder to change a product than it is an ad. Use marketing from day one to understand what your customers are looking for. + +TIP: I’ve worked on a number of startups where we used Facebook ads to look at the demographics (FB reports these) of the people that click on the ads. In at least two startups the audience we thought we were attracting was not the one who showed interest. In one case, we identified our target audience as female, household decision makers to find that the demographic was in fact young, single males. + +### 2) Opportunities and thinking around for product discovery need to be made from day one + +How are people going to hear about your product? Think about this from the very beginning and let it inform the product you build. An example of this sort of thinking is to limit beta releases to users who are invited by friends. People are likely to use products that their friends are using, particularly if it has a social element. If new user’s friends are there, then you’re someway to solving that problem. + +CASE STUDY: Tupperware are considered the original pioneers on this by creating Tupperware parties. Until then, they were flogging pretty much the same thing as everything else. Their Tupperware parties became part of the product (if not THE product). + +### 3) Understanding and retelling the company story to your customers is as important as pitching to your investors + +Marketing is a lot like pitching, only the “investor” is your customer. Understanding your company story and being able to communicate that to people is an essential part of any successful startup. When you use external PR, the connection between you and that story can become distorted. Get advice, but try and hone those skills internally. Nobody but you will be more compelling when it comes to the story of the thing that you passionately believe in. If you can pitch an investor, you can learn to relate and engage your customers. + +TIP: In the early days especially, it is important not to lose any company learnings by engaging third parties to run marketing or advertising campaigns. Keep the sharing tight between the team and don’t be tempted to outsource what is essentially a channel to your early customers (and discovering product/market fit). If you can pitch a startup idea, you can market an early one too. + +Don’t shy away from learning about marketing. It’s an integral part of any startup. Without it you could have the greatest startup that nobodies ever heard of. It happens. A lot. diff --git a/issues/accelerator/data/story-five/1.md b/issues/accelerator/data/story-five/1.md new file mode 100644 index 00000000..efe2378d --- /dev/null +++ b/issues/accelerator/data/story-five/1.md @@ -0,0 +1,21 @@ +--- + + title: Customer development hacks + author_name: Sam Birmingham + + cover_url: assets/story-five/p2-1.jpg + + layout: + type: two-column + content_align: left + content_valign: middle + content_height: auto + image_style: background + +--- + +Dave McClure’s Startup Metrics for Pirates is one of the essential startup resources. If you haven’t checked it out already then please do. + +Now. + +Seriously. We’ll wait… diff --git a/issues/accelerator/data/story-five/2.md b/issues/accelerator/data/story-five/2.md new file mode 100644 index 00000000..53a63939 --- /dev/null +++ b/issues/accelerator/data/story-five/2.md @@ -0,0 +1,90 @@ +--- + + images: + - assets/story-five/p3-1.jpg + - assets/story-five/p3-2.jpg + - assets/story-five/p3-3.jpg + - assets/story-five/p3-4.jpg + + layout: + content_overflow: paginate + +--- + +Startup Metrics for Pirates from Dave McClure + + + +OK, so we all know about **AARRR**; the most important acronym in the apparently-less-different-than-once-thought worlds of both pirates and startups. + +Now I want to step you through five of the most brilliant customer development hacks that (IMHO, at least) were vital to the eventual success of five startups we have since gone on to become household names… Let’s learn from the best and see how they worked their way through the funnel – from acquiring eyeballs in the first place, to activation, through retention and referral, and ultimately to what we are all shooting for – revenue! + +## Acquisition + +Two-sided marketplaces are hard. Reeeeeally hard. It is a chicken-and-egg proposition, trying to bring both sides of a market together at once, but Air BnB did a superb job of overcoming this oft-terminal challenge. + +> “How did they do it?”, you ask… They faked it until the made it! + +Rather than having to acquire a bunch of travellers’ eyeballs and hosts’ eyeballs at the same time, they focused on one side of the market, went to where they knew a treasure trove of properties were already being listed and *ahem* started spamming. + + + +Dave Gooden’s post on how Air BnB became a billion dollar company is brilliant. Let’s just say it all started with a mountain of Gmail accounts, an unknown number of sales people who were contracted to (but not employees of) the company, and a lot of copy’n’pasting! + +## Activation + +I know, I know… I said we would look at five superstar startups as we work our way through the five stages of the AARRR funnel, but I’m going to cheat and use Air BnB again here. + +So, they attracted lots of potential hosts to their site by hacking Craigslist. Now, how did they activate those leads and get them doing something which requires a whole lot more effort than an ugly text-only Craigslist advert? + +They gave out free professional photography to spruce up listings. + +Not only did this remove a major barrier which was preventing potential hosts completing their listing, the stylish images gave prospective guests a sense of what they were in for and helped them trust (complete with “verified” ribbon) what was at that stage a completely new approach to short-stay accommodation. + +Sure there was a cost to this, but as an added benefit for Air BnB, when users could see the professionally photographed listings attracting more bookings, it increased the incentive for other hosts to spend a bit more time on their own listing – after all, this is a marketplace and everyone is competing for the next booking! + +## Retention + +I know I am going to regret this, but do you remember the Facebook *poke* …? + +Was it a harmless whim? Perhaps a developer’s joke that went too far? Whatever the case, I put it to you that the Poke was one of many retention initiatives that drove user engagement in Facebook’s early days. + +Go on, admit it… Each time you logged in to Facebook your eyes scanned to that right-hand column to see who had poked you since your last visit. You returned the favour, which triggered an email notification in their inbox, which brought them back to Facebook, where they poked you back, which triggered an email notification in your inbox, which brought you back to Facebook… You get the drift. + + + +[Side Note: Apparently Twitter has a retention problem, with a mere 11% of Twitter's new users from 2012 still tweeting. Have you noticed any new retention initiatives they are experimenting with? If you are like me and find yourself tweeting less and less, what is Twitter doing to try bring you back into their platform?] + +## Referral + +Put your hands up if you use Dropbox… Everyone? + +Right, now keep your hands up if you were referred to Dropbox by a friend in the first place, and/or have gone on to refer Dropbox to other people (and earned yourself some free space in the process)… Still everyone?! + + + + +If I was to describe what Dropbox does in four words, it would be “document management and collaboration”. And it is that second element – collaboration between multiple authors of the same document – which drives so much of Dropbox’s customer acquisition strategy. + +I don’t know this for a fact, but I would be very surprised if Drew Houston and his cloud boffins haven’t run the numbers and worked out that it is more much efficient (read “cheaper”) for them to provide an extra 500MB for every new customer that you refer, rather than pay for a bunch of ads and try to drag new users into the top of their funnel the old-fashioned way. + +When your product is that sticky, and referral is baked into its very existence, Dropbox is obviously pretty confident that enough of us are eventually going to move all the way through the funnel and become paying customers… If it costs them a few (thousand) extra servers here and there to bring more collaborators into the top of the funnel (and make the product even stickier in the process) then so be it! + +## Revenue + +Don’t tell anyone, but the catalyst for this whole post was a discussion we had at Pollenizer the other day about our new favourite communications tool. For those who haven’t heard of it, Slack “brings all your communication together in one place. It’s real-time messaging, archiving and search for modern teams”. + +Since we first trialled it a few months ago, Slack’s “freemium” service has completely revolutionised the way we communicate - our inboxes will never be the same again! Well, at least they will never be the same again now, after we have upgraded to a paid plan. + +“How did Slack bump you tight arses up to a paid account?” you ask… + + + +Search. + +When it comes to functionality, Slack is awesome. But from a business model perspective, search is their killer feature. + +Seriously, the product is so darn addictive that you can hardly imagine life without it except when you cross the magical 10,000 message barrier you lose access to your old archives. And, because the product is so good, when you have completely changed your behaviour and reduced emails by a factor of 10, it isn’t that hard to ask people to pay for the privilege of a fully searchable archive. + +So, there you have it. Five customer development hacks from your favourite startups. + diff --git a/issues/accelerator/data/story-one.md b/issues/accelerator/data/story-one.md new file mode 100644 index 00000000..11a604c9 --- /dev/null +++ b/issues/accelerator/data/story-one.md @@ -0,0 +1,97 @@ +--- + + category: Inspiration + title: Six Startup Stories to Inspire You + description: Everyone involved in a startup can do with a bit of inspiration at any given moment. This is a collection of my favourite startup inspiration stories – ones that I’ve liked to remind myself of from time to time. + + cover_url: assets/story-one/p1-1.jpg + thumb_url: assets/story-one/p1-1.jpg + + layout: + type: three-column + content_overflow: paginate + image_style: cover + +--- + +### YouTube + + +In the very early days of Facebook, when it had fewer than 15 employees, there was an employee called Steve Chen who decided that, after working there for only a few weeks, it just wasn’t for him. Like a lot of talented people, he just wanted to do his own thing and had an idea for a video startup. + +Matt Cohler, who had hired him, tried to convince him that it was a bad idea, telling him that facebook was going to be huge, and that there were already many video startups around. + +Chen wasn’t convinced. He left to start a company called YouTube. + +> TAKEAWAY: Go with your passion. + +- - - + +### Angry Birds + + +In 2003 some Finnish guys decided to convert their love for making games into a video game company. Their plan was to make one game after another in the hope that one of them would catch on. + +51 games and 6 years later, they were still at it. Their 52nd game was a slingshot game involving birds. + +Today, they have over a billion users, 500 employees and partnerships with some of the world’s most recognizable names like Star Wars, NASA and the Chinese government. + +> TAKEAWAY: It can take 51 failures to become a success. + +- - - + +### Lego + +During the Great Depression, **Ole Kirk Christiansen**, a carpenter in a small rural town, started making wooden toys as a side business. + +Then, after WWII, he took a big gamble and invested most of his company’s cash into buying a plastic injection moulding machine. Its first plastic toy was a truck that could be taken apart and rebuilt. + +At the time plastic toys were seen as cheap and low-quality, and many of his customers suggested he continue to concentrate on his high-quality, very popular wooden or metal toys. + +But he took the plunge and invested in plastics all the same. Over the next 10 or so years, the company made more and more plastic toys. A fire in the factory saw most of their wooden products destroyed and they took the plunge and went ahead with all-plastic lego bricks. + +> TAKEAWAY: Go against the grain and break the mould! + +- - - + +### Pinterest + + +There are many great pivot stories (Flickr and eBay are some of the more well known), but it’s a trait common to more startups than not. + +CEO Ben Silberman abandoned his long held plans to become a doctor and founded Pinterest during the recession. + +Before Pinterest became social media’s fastest growing website, and landed on the cover of Fast Company, CEO Ben Silbermann set out to transform every cell phone into a clothing retail outlet with an app called Tote. He didn’t succeed. + +> TAKEAWAY: Pivot is not a dirty word. + +- - - + +### Airbnb + + +Shortly after moving to San Francisco in October of 2007, Brian Chesky and Joe Gebbia created the initial concept for AirBed & Breakfast during the Industrial Design Conference held by Industrial Designers Society of America. + +The original site offered short-term living quarters, breakfast and a unique business networking opportunity for attendees who were unable to book a hotel in the saturated market. + +At the time, roommates Chesky and Gebbia could not afford the rent for their loft in San Francisco. They made their living room into a bed and breakfast, accommodating three guests on air mattresses and providing homemade breakfast. + +The site, “airbedandbreakfast.com” was officially launched on August 11, 2008. + +To help fund the site, the founders created special edition breakfast cereals, with candidates Barack Obama and John McCain as the inspiration for “Obama O’s” and “Cap’n McCains”. In two months, 800 boxes of cereal were sold for $40, which generated more than $30,000 for the company’s incubation and attracting Y Combinator’s Paul Graham. + +> TAKEAWAY: Think outside the (cereal) box. + +- - - + +### Pandora + +What makes the Pandora story so compelling is not the enormous growth that the internet music streaming has had, but the depths of financial despair that it rose from. At his most desperate, Founder Tim Westergren, had maxed out credit cards, had $500,000 of personal debt and was being sued by some of his former employees + +It took 350 pitches to investors before Pandora got its first investment. Westergren used about $2 million of that initial investment to pay back his employees, who had all been working for free until then. + +In September last year, the company filed a prospectus to raise $230.8 million dollars through the sale of 10 million shares at a price of $23.99 per share. The offering dwarfed its $90 million IPO in 2011 by a factor of three. + +> TAKEAWAY: If you truly believe that what you’re doing is worth something, stick with it. + +- - - diff --git a/issues/accelerator/data/story-seven.md b/issues/accelerator/data/story-seven.md new file mode 100644 index 00000000..772eb0f6 --- /dev/null +++ b/issues/accelerator/data/story-seven.md @@ -0,0 +1,91 @@ +--- + + category: LEAN STARTUP + title: A Quick Walkthrough Lean Dashboard + description: We are constantly developing our lean startup tools and we have recently updated our lean dashboard template for anybody to use. It has evolved through our own observations building companies, as well as the great practice of Ash Maurya, Alex Osterwalder, Lean Startup Machine and Jim Collins. You can grab a copy from our Tools page. This post is a quick introduction to get it out there. We’ll do more detailed posts on specific pieces in the future. You can also attend one of Building Lean Startups courses for a full immersion. + author_name: Phil Morle + + cover_url: assets/story-seven/p1-1.jpg + thumb_url: assets/story-seven/p1-1.jpg + + images: + - url: assets/story-seven/p1-2.jpg + caption: Lean Canvas + - url: assets/story-seven/p1-3.jpg + - url: assets/story-seven/p1-4.jpg + + layout: + image_align: left + image_style: fit + content_overflow: paginate + +--- + +We are constantly developing our lean startup tools and we have recently updated our lean dashboard template for anybody to use. It has evolved through our own observations building companies, as well as the great practice of Ash Maurya, Alex Osterwalder, Lean Startup Machine and Jim Collins. + +You can grab a copy from our Tools page. This post is a quick introduction to get it out there. We’ll do more detailed posts on specific pieces in the future. You can also attend one of Building Lean Startups courses for a full immersion. + +The Lean Dashboard is the tool that we use to track our progress of BUILD > MEASURE > LEARN that is at the heart of Lean Startup. + +Here ‘s a very quick run through of how to use the Lean Dashboard + +### SETUP + +Log into your Google account +Open the template +File > Save a Copy +Share with your team +COVER + +The cover is a summary of who you are, what your purpose is and how much time you have. + +Write in the name of your company. If this is a brand new idea, still have a punt at a name. It is powerful to name something to start making it real. You can always change it later. + +Write in your ‘Big Hairy Audacious Goal’ – coined by Jim Collins in ‘Good to Great’, this is a statement of ambition. What will you strive to become. It should be a stretch. In Pollenizer we call this our ‘Top Right’ imagining the journey from where we are today with no revenue or traction through time to the right as we gain traction, customers, value and revenue. + +Change the ‘Phase’ to 1,2 or 3. This keeps us all aligned with the stage or our startup and the things we need to great right. It is based on the Marmer Stages in the Startup Genome Project. If you skip a stage and ‘inconsistently’ grow, you will increase the chance of failure. + +Write in how many weeks you have left. This is your runway. When does it all end? When do you run out of resources? This may be money, time that you can afford to not take a wage, patience of your partner, time a big company has given your team. + +We review this every week, even if it rarely changes. + +### LEAN CANVAS + + +This is your one page business plan. You can have lots of these as your startup evolves towards becoming a business. On the first day we collect our hypotheses and, over time, we mark which ones we prove to be a fact with our experiments. The process is, collect the whole canvas, hen mark which cells are HYPOTHESIS (all at the start) and which are FACT (because you have evidence to show from experiments). + +A lean canvas with empty cells is a fragile business that could have a hidden flaw. Complete it all. It is OK if the content is just a hypothesis for now. As long as it all makes sense. + +### METRICS DASHBOARD + + + +How are you measuring that a sustainable business model is emerging? + +You don’t need to complete all of these metric fields. Just decide which are important to your startup. + +This business is looking at it’s main conversion funnel using Dave McClure’s Startup Metrics for Pirates. + +- Select which metrics are important +- Define the metric with what you will specifically measure. +- Change the big number to what you are seeing this week in your data +- Change the smaller number to what you want to hit as a target +- The sparkline on the right is fed from the next tab – Metric Tracking + +Metric Tracking + +This is where we track each metric week on week. As with the dashboard, it is not necessary to track everything. You need to decide what is important. + +### EXPERIMENT + +This is where we track what we learn through the lean startup BUILD > MEASURE > LEARN loop. + + + +- Add the date that the experiment starts. +- Write the hypothesis that you want to prove in the BUILD cell, indicating that the experiment is being assembled. This could be a manual test or an actual feature being built in your product to validate a hypothesis. +- When it is is built, move the hypothesis to the MEASURE cell while you are collecting data by seeing what real customers/users do. +- When you have collected data, move it along again to the LEAN cell where you look at the data as a team to see what you have learned. +- We then move it to the DONE cell to show that the experiment is over. At this stage we write in the METRIC that proves our hypothesis valid or invalid and we write “Valid” or “Invalid” in the final cell. + +Good Luck diff --git a/issues/accelerator/data/story-six.md b/issues/accelerator/data/story-six.md new file mode 100644 index 00000000..aba8ab0a --- /dev/null +++ b/issues/accelerator/data/story-six.md @@ -0,0 +1,48 @@ +--- + + category: "#STARTUP HACKS" + title: Pitching hacks + author_name: Phil Morle + + thumb_url: assets/story-six/p1-1.jpg + + videos: + - type: video/youtube + link: "http://www.youtube.com/watch?v=juR49xtSj68" + thumb_url: assets/story-six/p1-2.jpg + cover: true + + layout: + type: one-column + +--- + +I spent yesterday afternoon at Muru-D where the final 22 companies are battling it out for 10 spots in the first intake of Telstra’s new accelerator. I worked with two startups throughout the course of the afternoon, helping them tighten their pitches. Here are some themes that emerged. + +### 1. Look people in the eye. Breath. You know this shit + +No matter how nervous you are, stop. Take a breath. Look around the room at your audience. Smile. Look them in the eye. Get to know them. If you don’t, you will start speaking at the same rate that your heart is beating and your audience will not be able to keep up. Set the rhythm for what happens next. You are about to share how amazing your company is. There is nothing to be nervous about because your company IS amazing. + +Hack 1: One thing that works for me is to say “That’s amazing isn’t it!?” in my head when I have made an important point. It slows me down and gives the audience a chance to take it in. It’s easy to feel like you are boring people if you pause or speak too slow. The inverse it true, you bore them when you speak too fast and they are experiencing a talking body which doesn’t appear to care whether they understand. + +### 2. More != more + +More content does not make a more impressive pitch. The problem I describe in 1 is made worse when you put too much in your pitch and you feel like you need to cover it all in 5 minutes (which is how long you will get in most cases). If you do that, you have set yourself up for fail. You will not tell a full story and likely not manage to leave the audience with an impression of value for your startup. This problem tends to happen most to the cleverest product and engineering entrepreneurs who try to describe every detail of the product. + +Hack 2: To practice, we use our universal pitch deck as a starting point and try to get through the whole thing very quickly by setting the presentation to change slides automatically every 6.5 seconds. This forces us to get the key points out simply and completely as well as showing us what real fear from limited time feels like. Do this, and you easily get through everything you need to in 5 minutes and nothing will feel too short ever again. + +Hack 3: Use a ‘Gaddy Pitch’ to explain your startup without the BS. Here’s the pattern: “You know how… well what we do is… In fact…” This is how you explain your startup to your Mum and everyone needs to have that base understanding of value. + +> Canva: You know how everyone has a blog or Facebook page these days and needs images to stand out from the crowd and get better engagement. Well, what we do is, create a dead simple too for anyone to make a gorgeous original image online in just a few minutes for next to no money. In fact, we are only a few months old and we already have a few thousand people using Canva all over the world. + +Get the idea? Do you communicate this in your bigger pitch? Make sure the value proposition of your startup is crystal clear, there is always time in the Q&A and follow-up meetings for your to answer complex questions in detail and demonstrate how much you know what you are doing. + +### 4. What is the riskiest thing about YOUR startup? + +Our chairman Tony Faure has a gift for the ultra-clarifying framing question. Here is one he asks all the time: “For investors to invest, what do they have to believe?” Sometimes there might be doubt that there is a real problem to solve in which the startup needs to show how much pain people have. Sometimes there might concerns that the startup is entering a customer context that is controlled by other people who may fight to keep that startup out. Schools for example, or health. In this case the startup needs to convince the audience that there is a strategy to route around them. Yesterday I heard a pitch from a company that was solving a huge problem. A problem that is so huge that I have heard about 20 pitches in the last year for similar businesses. The reason the problem isn’t solved is that it is bloody hard to do so. So all of the 20 pitches I have heard are for businesses that will fail. This company needs to leave us with the thought that they have found a way. + +Hack 4: Share your pitch as often as you can with people that know the space and ask for feedback from them on what feels like the riskiest part of the business. You will quickly establish a pattern and refine the pitch to tell investors what they need to believe. + +Generally, I am distrusting pitches more and more. A great pitch does not mean that the business is also great and accelerators all over the world are spewing out awesome pitches for crappy businesses. + +But you still need to be good at it. diff --git a/issues/accelerator/data/story-six/1.md b/issues/accelerator/data/story-six/1.md new file mode 100644 index 00000000..377b2d8b --- /dev/null +++ b/issues/accelerator/data/story-six/1.md @@ -0,0 +1,42 @@ +--- + title: The Art of Pitching + author_name: Steve Sammartino + cover_url: assets/background_large.jpg + + layout: + content_overflow: paginate + type: one-column + +--- + +There are two parts to the pitching process when it comes to startups and pretty much selling anything. The Science and the Art. The first piece of advice I’d give to anyone learning how to pitch is learn the functional elements first – the Science. The formats, the basics, the techniques which give you a construct to work around. We’ve got a bunch of resources around that here at Pollenizer. The two simplest, cleanest and most useful are the Universal and Gaddie pitch. Which can both be found here. Learn these first, and then you’re in good shape to start to go for the high ground in pitching – the Art. + +Once we master that, there are what I call social hacks for pitching with the best of them. This is when we use the emotional side of being human to appeal to an audience. In this sense it becomes a performance art. And the good news is that anyone who dares to try can learn the Art of Pitching. + +So here are my Top 6 Social Hacks for pitching: + +### 1. They buy you + +I’m sure you’ve heard it, but I bet your don’t really believe it. I can’t count the number of investors who’ve told me this simple truth: They’d rather invest in an A grade team with a B grade product, than a B grade team with an A grade product. But think of this – it’s not that hard to change products, but it’s almost impossible for people to change who they are. The people watching the pitch are buying your effort, enthusiasm, energy and the belief you have in yourself and what you can deliver. Sure, this all sounds too Tony Robbins to be true, but it is. They buy you first. They buy what you can do and evidence that you can get it done. Sell yourself, unashamedly. If you can’t sell yourself, how will you ever sell a new startup in the market? + +### 2. They hear what they want to hear + +Here’s how people operate in life generally when it comes to human interaction. People make quick and early decisions on how you fit into their world. Then they look for evidence, reasons and clues to confirm their pre-conceived perception. In this sense they decide a great deal about you by what they’ve already seen and heard before you pitch. So then you need to think a lot about body language, they way you look and the conversations and interactions you have before the pitch. Interactions both virtually and physically. Yes, you can pitch before the pitching process, this is when you can hack the perceptions by being personable, and vibrant or considered and intelligent and having track record. This is why ex founders have no trouble raising capital – it’s because people believe their perception that 1 success equals a second success – which may and may not be true. + +### 3. Visuals and words + +We all know there should be a minimum of words on the slide. We know that when people are reading, that they are not listening. So here’s the rule for top level pitching. Slides have pictures – person delivers words. This is the combination of champions. Go back and have a look at any of Steve Jobs apple keynote speeches and you’ll see the power of this method. It also allows the people in the audience to use their imagination with the pictures. They go on a sensory journey of what they want to believe. But it also ensures your command their auditory attention. + +### 4. Take advantage of the monopoly of attention + +We all know the power of any business which has managed to create a monopoly. Well guess what? When you are presenting you have the opportunity to have a monopoly on people’s attention. It’s a powerful thing indeed. But it is only powerful when we don’t waste it. And the worst way to waste it is by distracting the audience with bad slides. Oh, and as a reminder in case you still haven’t got it yet, every word on your slide makes it a little bit worse. + +### 5. Who to learn from – stand up comedians + +We can pick up great social hacks for pitching just as soon as we start paying attention. Whenever we hear a good presenter in action, we should take note of their techniques. What we then do is take the bits we like and implement those that suit our style. In life every person is the aggregation of what they’ve learned from those around them, from those we admire – and pitching is one such thing. Also get in the habit of watching the best pitchers of all – stand up comedians. You’ll learn more about pitching from them than any business person ever because they are the worlds best public speakers. Just put your business brain on while you review their techniques. Also, you’ll see from the great variety of stand up comedians that any personality style can work. Everything from quiet and shy, to jumping bean to dead pan. It’s about developing a presentation style which suits your true persona. + +### 6. Practice in conversations + +Private speaking is that same as public speaking. We should remember how good we are at it when we talk to our family, or friends and anyone we are comfortable with. We pitch our ideas all day long with these people, from which café to go to, to what movie to see. We just need to transition this existing behaviour we all have into the new environment. It is possible. Practice pitching subtly in day to day interactions. This will give you an unfair advantage in startups and life. + +But most of all what we need to be is true to ourselves. In the end humans are very perceptive, we have sensors for the truth. What this means is that the people hearing our pitch believe what we believe. diff --git a/issues/accelerator/data/story-three.md b/issues/accelerator/data/story-three.md new file mode 100644 index 00000000..82cc5094 --- /dev/null +++ b/issues/accelerator/data/story-three.md @@ -0,0 +1,19 @@ +--- + + category: interview + title: Annie Parker from muru-D + author_name: Nicola Farrell + + cover_url: assets/story-three/p1-1.jpg + thumb_url: assets/story-three/p1-1.jpg + + layout: + type: three-column + image_style: background + content_align: right + content_valign: middle + content_style: white + +--- + +Annie Parker heads up Sydney accelerator, Muru-D. The team has just released the details of their final 10, who will enter the 6 months program this month. Here, she tells us what you need to know before putting your business forward to participate in the muru-D accelerator program. diff --git a/issues/accelerator/data/story-three/1.md b/issues/accelerator/data/story-three/1.md new file mode 100644 index 00000000..801c9e33 --- /dev/null +++ b/issues/accelerator/data/story-three/1.md @@ -0,0 +1,38 @@ +--- + + cover_url: assets/story-three/p2-1.jpg + + layout: + type: two-column + image_style: cover + content_style: black + +--- +### What should people consider before they submit their business to an accelerator program? + +Make sure you’ve done your homework, all accelerator programs have some mandatory requirements, make sure you’re happy to sign up to them! +For example, at muru-D we need the co-founders to commit to working on their idea full-time to move to Sydney for the 6 months of the program. There’s plenty of choice out there for startups now which is fantastic, so its important to choose the right program for your startup. + +### How do you usually choose your startups? + +The main thing we look at is the team. Is it a balanced team with the right skills and experience to build the startup, do they have traction already? + +This doesn’t necessarily mean that you have to have launched already or have paying customers (although that’s always nice!), but some sort of demonstrable progress momentum is key. Have you talked to potential customers, have you validated that you really are fixing a problem or filling a market need? + +Also, I’m looking for bucket loads of passion in the co-founding team. I want to know that they are all fully committed and will move mountains to make their business work and, that they won’t give up. + +### What type of companies would you like to see participate in an upcoming program? + +As long as the startup is digital and can scale to multiple markets then I’m interested in seeing their application. I’m really pleased that in our first intake we have a pretty much 50:50 split of B2B & B2C startups, that we cover lots of different industry categories, that we even have a hardware startup too. +One other thing I’m really proud of is that 4 of our final 10 have a female co-founder or CEO. I definitely want to see more of that! + +### At what stage in a company’s life should they apply for an accelerator? + +Obviously we invest in fairly early stage businesses, so we’re looking at startups that are usually less than 2 years old or have raised less than $250k of external funding (not including friends or family investment). +If your idea is super super early stage, we’d still consider it, but we do like to invest in teams that are formed and that there is a demo of the startup already in place (even if this is a mock-up). + +### Do you have any conditions on similar types of companies entering the program? + +We don’t have conditions that all startups need to be different. However if there are 2 or 3 startups doing exactly the same thing then it’s likely we’d invest in the best of the bunch. + +My coaching here to startups who are in a really competitive space would be, make sure you can prove exactly what your USP is versus everyone else’s. If you can prove it, maybe it’s time to look at pivoting or doing something different. diff --git a/issues/accelerator/data/story-two.md b/issues/accelerator/data/story-two.md new file mode 100644 index 00000000..a4592cb6 --- /dev/null +++ b/issues/accelerator/data/story-two.md @@ -0,0 +1,23 @@ +--- + + category: Feature + title: Getting Into an Accelerator + description: Accelerators didn’t exist before Y-Combinator was founded in Silicon Valley in 2005 but now they are in most cities. + author_name: Phil Morle + + thumb_url: assets/story-two/p1-1.jpg + cover_url: assets/story-two/p1-1.jpg + + videos: + - link: https://www.youtube.com/watch?v=d_eITVaO3jA + thumb_url: http://i1.ytimg.com/vi/d_eITVaO3jA/hqdefault.jpg + type: video/youtube + + layout: + type: two-column + image_style: background + content_style: black + content_align: center + content_valign: middle + +--- diff --git a/issues/accelerator/data/story-two/1.md b/issues/accelerator/data/story-two/1.md new file mode 100644 index 00000000..2a49f3de --- /dev/null +++ b/issues/accelerator/data/story-two/1.md @@ -0,0 +1,42 @@ +--- + + layout: + content_overflow: paginate + +--- + +Accelerators have slightly different ingredients in their recipe but the common elements are: + +The startups already exist before the program in some form. ‘Incubators’ like Pollenizer in contrast create something from nothing. +The program is a fixed duration. 3-6 months. +The program is heavily mentor driven. The main value comes from the connections and opportunities that the accelerator ‘family’ brings. +A small seed investment is made for equity + +The best accelerators are very competitive to get into. In Australia, Telstra’s accelerator gets about 300 applications per batch, from which 10 are chosen. If you are applying for Angelpad, you will be up against 2000, for 12 spots, likewise, Techstars will receive 1500 applicants for just 10 places. + +You need to: + +- Decide if there is a good fit between your startup and an accelerator +- Then hustle hustle hustle to get in. That’s what others will be doing. + +## Is there a good fit? + +First you should figure out if the accelerator and you are a good match. Don’t think about the accelerator exclusively as a source of capital. You will need to pay with a percentage of equity and you will need to dedicate a lot of time and effort to the program. This is all a waste if the fit is bad. Are you right? Is the accelerator right? + + +### Are you ready to be accelerated? + +There is a sweet spot for joining an accelerator. Simply point, the startup is ready for acceleration and NEEDS acceleration. If you are already growing very well, why go into an accelerator? If you are still wireframing your idea or doing very early customer development work, you will find that the accelerator program races by before you get a chance to extract real value. + +### Do your due diligence + +Not all accelerators are created equally. Do your research into your accelerator of choice. + +- How many graduating companies raise capital? +- How many graduating companies are still around a couple of years later. +- Go and meet graduated founders and ask them what it was like? +- Who are the mentors? Can they help you? + +This information can be hard to find but some accelerators like Y-Combinator, share their performance. + +If the fit looks good between you and the accelerator, let’s start hustling. diff --git a/issues/accelerator/data/story-two/2.md b/issues/accelerator/data/story-two/2.md new file mode 100644 index 00000000..3c1de25c --- /dev/null +++ b/issues/accelerator/data/story-two/2.md @@ -0,0 +1,40 @@ +--- + + title: Application Hacks + author_name: Phil Morle + cover_url: assets/story-two/p3-1.jpg + +--- + +### Product or Business? + +Do you understand your business model or are you 100% focused on making a kick-ass product. Accelerators want to know that you have a business model. Think through your business as a lean canvas and be ready to describe it as a business model. + +In the application process you will be required to describe it in detail on the forms and also in pitches. + +Never forget that the accelerator is, in the end, an investor. They want to see something that might 10x or more their investment. + +### Unique value + +Are you unique? What other startups do you sound like? Imagine the decision makers scrolling through hundreds of applications, frequently with multiple ‘variations on a theme’. What is it about your application that makes them pay attention? + +### Traction + +It is all about traction. Always. How do you communicate your business so that outsiders understand that this train is rolling and there is no stopping it. What have you done? What are you doing now? What’s next? How quickly are your engagement numbers showing that users love your product? Do you have sales? Are they growing? + +### Show execution (I can be accelerated) + +Related to traction. Accelerators want to be great at accelerating the growth of startups. Show them that you are an executor and, with their help, you will be a machine. + +### Meet mentors + +Learn who the mentors in the program are and try to meet at least one. Learn what is important to them. What do they think is a sign of a strong startup? Try to get a feel for the personality of the program and how you can present in that frame. Often mentors are also part of the decision making process about who gets in. So lobby them because others will. + +### and lastly.. Hustle ! + +It can all be in the Hustle, as US based startup, Vugle worked out, when applying to the Angelpad incubator set up by ex-Googler’s. Vungle’s co-founder, used unconventional techniques to get themselves noticed in the most notorious hack, read about it here. + + +### Good luck + +The best accelerators have it down to a science. If you find a good fit, you will get the maximum possible growth and development of your startup in a short amount of time. Good luck. Now start hustling. diff --git a/issues/accelerator/data/toc.md b/issues/accelerator/data/toc.md new file mode 100644 index 00000000..9c859145 --- /dev/null +++ b/issues/accelerator/data/toc.md @@ -0,0 +1,21 @@ +--- + + title: READY TO ACCELERATE? + + cover_url: assets/toc.jpg + thumb_url: assets/toc.jpg + + layout: + type: toc + content_overflow: scroll + +--- + +Pollenizer is Australia’s first early stage tech incubator founded in 2008. We incubate our own companies, while designing incubator and accelerator programs for partners in Asia Pacific. + +We’ve put together this Accelerator handbook to help you get the edge when you apply to top accelerator programs and to build confidence when communicating your business for investment. + +We’re excited to take you on a journey that could get your startup on the road to success. + +Phil Morle
+Pollenizer - Startup Science diff --git a/issues/accelerator/data/video-six.md b/issues/accelerator/data/video-six.md new file mode 100644 index 00000000..cedc5c89 --- /dev/null +++ b/issues/accelerator/data/video-six.md @@ -0,0 +1,20 @@ +--- + + title: Youtube Video + author_name: Zyralyn Bacani + author_icon: http://cl.ly/StPu/Image%202013.12.11%204%3A54%3A01%20pm.png + + cover_url: http://i.vimeocdn.com/video/457264187_640.jpg + + videos: + - thumb_url: http://i.vimeocdn.com/video/457264187_640.jpg + link: http://vimeo.com/81183852 + type: video/vimeo + cover: true + + layout: + image_style: background + content_valign: middle + content_align: center + +--- diff --git a/issues/accelerator/issue.yaml b/issues/accelerator/issue.yaml new file mode 100644 index 00000000..a290f79f --- /dev/null +++ b/issues/accelerator/issue.yaml @@ -0,0 +1,22 @@ +title: Accelerator Ready + +magazine_handle: pollenizer +magazine_title: Pollenizer + +theme: +thumb_url: "assets/background.jpg" +cover_url: "assets/background_large.jpg" + +assets: + - "custom.css" + +paths: + + - index + - toc + - story-one + - story-two + - story-three + - story-five + - story-six + - story-seven diff --git a/issues/adventure/assets/Unbranded/Look3-reverse.jpg b/issues/adventure/assets/Unbranded/Look3-reverse.jpg new file mode 100644 index 00000000..3f6eab28 Binary files /dev/null and b/issues/adventure/assets/Unbranded/Look3-reverse.jpg differ diff --git a/issues/adventure/assets/Unbranded/Look3.jpg b/issues/adventure/assets/Unbranded/Look3.jpg new file mode 100644 index 00000000..22a8fec2 Binary files /dev/null and b/issues/adventure/assets/Unbranded/Look3.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageA_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageA_LR3C.jpg new file mode 100644 index 00000000..ca9dbb6a Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageA_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageB_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageB_LR3C.jpg new file mode 100644 index 00000000..461eaf28 Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageB_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageC_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageC_LR3C.jpg new file mode 100644 index 00000000..b2d1f5ba Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageC_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageD_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageD_LR3C.jpg new file mode 100644 index 00000000..fd303db3 Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageD_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageE_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageE_LR3C.jpg new file mode 100644 index 00000000..1e7c2e6c Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageE_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageF_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageF_LR3C.jpg new file mode 100644 index 00000000..87fb0264 Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageF_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageG_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageG_LR3C.jpg new file mode 100644 index 00000000..d3e935ce Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageG_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageH_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageH_LR3C.jpg new file mode 100644 index 00000000..93ce3a4f Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageH_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageI_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageI_LR3C.jpg new file mode 100644 index 00000000..0ad3892b Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageI_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageJ_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageJ_LR3C.jpg new file mode 100644 index 00000000..91f9943a Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageJ_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageM_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageM_LR3C.jpg new file mode 100644 index 00000000..97e1093e Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageM_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageO_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageO_LR3C.jpg new file mode 100644 index 00000000..3ebf2b2a Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageO_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageP_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageP_LR3C.jpg new file mode 100644 index 00000000..511361de Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageP_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageQ_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageQ_LR3C.jpg new file mode 100644 index 00000000..29aa4344 Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageQ_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageR_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageR_LR3C.jpg new file mode 100644 index 00000000..fa52056a Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_AW14_PRimagery_Unbranded_ImageR_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/TheAcademyBrand_LR3C.jpg b/issues/adventure/assets/Unbranded/TheAcademyBrand_LR3C.jpg new file mode 100644 index 00000000..a8f64d19 Binary files /dev/null and b/issues/adventure/assets/Unbranded/TheAcademyBrand_LR3C.jpg differ diff --git a/issues/adventure/assets/Unbranded/cover.jpg b/issues/adventure/assets/Unbranded/cover.jpg new file mode 100644 index 00000000..670946ee Binary files /dev/null and b/issues/adventure/assets/Unbranded/cover.jpg differ diff --git a/issues/adventure/assets/Unbranded/thumb.jpg b/issues/adventure/assets/Unbranded/thumb.jpg new file mode 100644 index 00000000..c2f35e02 Binary files /dev/null and b/issues/adventure/assets/Unbranded/thumb.jpg differ diff --git a/issues/adventure/assets/background.jpg b/issues/adventure/assets/background.jpg new file mode 100644 index 00000000..62034caa Binary files /dev/null and b/issues/adventure/assets/background.jpg differ diff --git a/issues/adventure/assets/background.jpg.REMOVED.git-id b/issues/adventure/assets/background.jpg.REMOVED.git-id deleted file mode 100644 index e9297237..00000000 --- a/issues/adventure/assets/background.jpg.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -15799a84394d34302c4efc154fffc94b32b92740 \ No newline at end of file diff --git a/issues/adventure/assets/background_large.jpg b/issues/adventure/assets/background_large.jpg new file mode 100644 index 00000000..62034caa Binary files /dev/null and b/issues/adventure/assets/background_large.jpg differ diff --git "a/issues/adventure/assets/behind-the-scenes/Icon\r" "b/issues/adventure/assets/behind-the-scenes/Icon\r" new file mode 100644 index 00000000..e69de29b diff --git "a/issues/adventure/assets/breathein-breatheout/Icon\r" "b/issues/adventure/assets/breathein-breatheout/Icon\r" new file mode 100644 index 00000000..e69de29b diff --git a/issues/adventure/assets/california-voyage/1.jpg b/issues/adventure/assets/california-voyage/1.jpg new file mode 100644 index 00000000..152d7237 Binary files /dev/null and b/issues/adventure/assets/california-voyage/1.jpg differ diff --git a/issues/adventure/assets/california-voyage/2.jpg b/issues/adventure/assets/california-voyage/2.jpg new file mode 100644 index 00000000..e8b09226 Binary files /dev/null and b/issues/adventure/assets/california-voyage/2.jpg differ diff --git a/issues/adventure/assets/california-voyage/3.jpg b/issues/adventure/assets/california-voyage/3.jpg new file mode 100644 index 00000000..72642279 Binary files /dev/null and b/issues/adventure/assets/california-voyage/3.jpg differ diff --git a/issues/adventure/assets/california-voyage/4.jpg b/issues/adventure/assets/california-voyage/4.jpg new file mode 100644 index 00000000..808d3c75 Binary files /dev/null and b/issues/adventure/assets/california-voyage/4.jpg differ diff --git a/issues/adventure/assets/california-voyage/California Voyage - Peter Jamus.gdoc b/issues/adventure/assets/california-voyage/California Voyage - Peter Jamus.gdoc new file mode 100644 index 00000000..5564e295 --- /dev/null +++ b/issues/adventure/assets/california-voyage/California Voyage - Peter Jamus.gdoc @@ -0,0 +1 @@ +{"url": "https://docs.google.com/document/d/1fSl-KtgdO5XvhXW_tNPrcSJutvKGCp92RMS3wVPjCg0/edit?usp=docslist_api", "resource_id": "document:1fSl-KtgdO5XvhXW_tNPrcSJutvKGCp92RMS3wVPjCg0"} \ No newline at end of file diff --git a/issues/adventure/assets/california-voyage/California Voyage.docx b/issues/adventure/assets/california-voyage/California Voyage.docx new file mode 100644 index 00000000..674e6ca6 Binary files /dev/null and b/issues/adventure/assets/california-voyage/California Voyage.docx differ diff --git "a/issues/adventure/assets/california-voyage/Icon\r" "b/issues/adventure/assets/california-voyage/Icon\r" new file mode 100644 index 00000000..e69de29b diff --git a/issues/adventure/assets/california-voyage/Peter-Jamus12.jpg b/issues/adventure/assets/california-voyage/Peter-Jamus12.jpg new file mode 100644 index 00000000..8599f0ad Binary files /dev/null and b/issues/adventure/assets/california-voyage/Peter-Jamus12.jpg differ diff --git a/issues/adventure/assets/california-voyage/background.jpg b/issues/adventure/assets/california-voyage/background.jpg new file mode 100644 index 00000000..2d43b4ae Binary files /dev/null and b/issues/adventure/assets/california-voyage/background.jpg differ diff --git a/issues/adventure/assets/california-voyage/captions.docx b/issues/adventure/assets/california-voyage/captions.docx new file mode 100644 index 00000000..8fe41613 Binary files /dev/null and b/issues/adventure/assets/california-voyage/captions.docx differ diff --git a/issues/adventure/assets/coastal-adventure/p3-product-1.jpg b/issues/adventure/assets/coastal-adventure/p3-product-1.jpg new file mode 100644 index 00000000..29598119 Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p3-product-1.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p3-product-2.jpg b/issues/adventure/assets/coastal-adventure/p3-product-2.jpg new file mode 100644 index 00000000..94c4fc51 Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p3-product-2.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p3-product-3.jpg b/issues/adventure/assets/coastal-adventure/p3-product-3.jpg new file mode 100644 index 00000000..3c7d0ae9 Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p3-product-3.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p3-product-4.jpg b/issues/adventure/assets/coastal-adventure/p3-product-4.jpg new file mode 100644 index 00000000..410db388 Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p3-product-4.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p3-product-5.jpg b/issues/adventure/assets/coastal-adventure/p3-product-5.jpg new file mode 100644 index 00000000..a6d941b0 Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p3-product-5.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p3-product-6.jpg b/issues/adventure/assets/coastal-adventure/p3-product-6.jpg new file mode 100644 index 00000000..10205594 Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p3-product-6.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p5-product-1.jpg b/issues/adventure/assets/coastal-adventure/p5-product-1.jpg new file mode 100644 index 00000000..a05afc14 Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p5-product-1.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p5-product-2.jpg b/issues/adventure/assets/coastal-adventure/p5-product-2.jpg new file mode 100644 index 00000000..8b784bda Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p5-product-2.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p5-product-3.jpg b/issues/adventure/assets/coastal-adventure/p5-product-3.jpg new file mode 100644 index 00000000..1acaa941 Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p5-product-3.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p5-product-4.jpg b/issues/adventure/assets/coastal-adventure/p5-product-4.jpg new file mode 100644 index 00000000..beb1fd71 Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p5-product-4.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p5-product-5.jpg b/issues/adventure/assets/coastal-adventure/p5-product-5.jpg new file mode 100644 index 00000000..c978d14e Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p5-product-5.jpg differ diff --git a/issues/adventure/assets/coastal-adventure/p5-product-6.jpg b/issues/adventure/assets/coastal-adventure/p5-product-6.jpg new file mode 100644 index 00000000..5603395d Binary files /dev/null and b/issues/adventure/assets/coastal-adventure/p5-product-6.jpg differ diff --git a/issues/adventure/assets/custom.scss b/issues/adventure/assets/custom.scss new file mode 100644 index 00000000..4c12894e --- /dev/null +++ b/issues/adventure/assets/custom.scss @@ -0,0 +1,295 @@ +#adventure-issue { + [data-page="index"] { + .title { + font-size: 46px; + } + + @media only screen and (min-width: 768px) { + .title { + font-size: 100px; + } + } + } + + [data-page="adventure/1"] { + .cover { + height: 100%; + } + + .image h3 { + padding-top: 45%; + color: white; + font-size: 2em !important; + text-transform: uppercase; + text-shadow: 1px 1px 25px rgba(0,0,0,0.1); + letter-spacing: 2px; + } + + .summary { + padding: 10%; + } + } + + /* + Events Calendar + */ + + #flip-cards { + margin: 0; + padding: 0; + height: 100%; + list-style: none; + + -webkit-perspective: 1000; + -moz-perspective: 1000; + -o-perspective: 1000; + perspective: 1000; + + li { + float: left; + width: 100%; + height: 50%; + background-size: cover; + margin-bottom: 0; + padding-right: 0; + } + + h3 { + font-size: 1.4rem; + } + + .flipper { + position: relative; + width: 100%; + height: 100%; + + -webkit-transition: 0.6s; + -moz-transition: 0.6s; + -o-transition: 0.6s; + transition: 0.6s; + + -webkit-transform-style: preserve-3d; + -moz-transform-style: preserve-3d; + -o-transform-style: preserve-3d; + transform-style: preserve-3d; + } + + li .image { + position: absolute; + top: 0; + left: 0; + } + + /* front pane, placed above back */ + li .image { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 2; + background-position: center; + background-size: cover; + + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -o-backface-visibility: hidden; + backface-visibility: hidden; + } + + /* back, initially hidden pane */ + li .info { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 2; + overflow: auto; + padding: 20px; + background: #fff; + color: #333; + font-size: 14px; + + -webkit-transform: rotateY(180deg); + -moz-transform: rotateY(180deg); + -o-transform: rotateY(180deg); + transform: rotateY(180deg); + + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -o-backface-visibility: hidden; + backface-visibility: hidden; + } + + @media only screen and (min-width: 768px) { + li { + width: 50%; + } + + h3 { + font-size: 1.6rem; + } + + .summary { + display: block; + } + } + } + + .no-touch & #flip-cards li:hover .flipper, + #flip-cards li.hover .flipper { + -webkit-transform: rotateY(180deg); + -moz-transform: rotateY(180deg); + -o-transform: rotateY(180deg); + transform: rotateY(180deg); + } + + /* + Polaroid + */ + + article.page ul.polaroids { + margin: 0; + padding: 0; + } + + .polaroid-wrap { + list-style: none; + display: inline-block; + max-width: 48%; + } + + figure.polaroid { + display: inline; + float: left; + margin: 0; + max-width: 80%; + max-height: 300px; + width: auto; + color: #333; + text-align: center; + text-decoration: none; + + font-size: 18px; + font-family: "Marker Felt", sans-serif; + + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; + + -webkit-transform: rotate(-2deg); + -moz-transform: rotate(-2deg); + transform: rotate(-2deg); + + -webkit-backface-visibility: hidden; + -webkit-perspective: 1000; + } + + figure.polaroid figcaption { + text-align: center; + text-decoration: none; + } + + figure.polaroid img { + padding: 6px; + width: 100%; + background: #fff; + box-shadow: 0 3px 6px rgba(0,0,0,.25); + vertical-align: middle; + } + + .polaroid-wrap:nth-child(even) figure { + -webkit-transform: rotate(3deg); + -moz-transform: rotate(3deg); + transform: rotate(3deg); + } + + @media only screen and (min-width: 768px) { + figure.polaroid { + margin: 0 0% -5% 5%; + padding-left: 20px; + max-width: 24%; + max-height: 25vw; + } + + figure.polaroid img { + padding: 15px 15px 20px; + } + + .polaroid-wrap { + display: inline; + max-width: initial; + } + + .polaroid-wrap:nth-child(3n+1) { + clear: both; + } + + .polaroid-wrap:nth-child(4) figure { + clear: left; + } + + .polaroid-wrap:nth-child(5) figure { + position: relative; + left: 2vh; + + -webkit-transform: none; + -moz-transform: none; + transform: none; + } + + .polaroid-wrap:nth-child(8) figure { + position: relative; + top: -5vh; + left: 1vh; + + -webkit-transform: none; + -moz-transform: none; + transform: none; + } + + .polaroid-wrap:nth-child(11) figure { + position: relative; + + -webkit-transform: rotate(3deg); + -moz-transform: rotate(3deg); + transform: rotate(3deg); + + img { + padding: 0; + } + } + + .polaroid-wrap:nth-child(12) figure { + position: relative; + top: -20vh; + left: 5vh; + margin: 0; + + -webkit-transform: none; + -moz-transform: none; + transform: none; + } + + .polaroid-wrap:nth-child(13) figure { + position: relative; + top: -12vh; + left: 10vh; + margin: 0; + + -webkit-transform: none; + -moz-transform: none; + transform: none; + } + } + + .polaroid-wrap:hover figure { + position: relative; + z-index: 5; + + -webkit-transform: scale(1.5); + -moz-transform: scale(1.5); + transform: scale(1.5); + } +} diff --git a/issues/adventure/assets/inspiration/cover.jpg b/issues/adventure/assets/inspiration/cover.jpg new file mode 100644 index 00000000..200c14d1 Binary files /dev/null and b/issues/adventure/assets/inspiration/cover.jpg differ diff --git a/issues/adventure/assets/inspiration/redwoods.jpg b/issues/adventure/assets/inspiration/redwoods.jpg new file mode 100644 index 00000000..69780ed5 Binary files /dev/null and b/issues/adventure/assets/inspiration/redwoods.jpg differ diff --git a/issues/adventure/assets/inspiration/thumb.jpg b/issues/adventure/assets/inspiration/thumb.jpg new file mode 100644 index 00000000..9f996944 Binary files /dev/null and b/issues/adventure/assets/inspiration/thumb.jpg differ diff --git a/issues/adventure/assets/moments/1.jpg b/issues/adventure/assets/moments/1.jpg new file mode 100644 index 00000000..28dd2cb0 Binary files /dev/null and b/issues/adventure/assets/moments/1.jpg differ diff --git a/issues/adventure/assets/moments/2.jpg b/issues/adventure/assets/moments/2.jpg new file mode 100644 index 00000000..bed02bd6 Binary files /dev/null and b/issues/adventure/assets/moments/2.jpg differ diff --git a/issues/adventure/assets/moments/3.jpg b/issues/adventure/assets/moments/3.jpg new file mode 100644 index 00000000..194df486 Binary files /dev/null and b/issues/adventure/assets/moments/3.jpg differ diff --git a/issues/adventure/assets/moments/4.jpg b/issues/adventure/assets/moments/4.jpg new file mode 100644 index 00000000..33a092eb Binary files /dev/null and b/issues/adventure/assets/moments/4.jpg differ diff --git a/issues/adventure/assets/moments/5.jpg b/issues/adventure/assets/moments/5.jpg new file mode 100644 index 00000000..7f7f9bb2 Binary files /dev/null and b/issues/adventure/assets/moments/5.jpg differ diff --git a/issues/adventure/assets/moments/6.jpg b/issues/adventure/assets/moments/6.jpg new file mode 100644 index 00000000..1540de4a Binary files /dev/null and b/issues/adventure/assets/moments/6.jpg differ diff --git a/issues/adventure/assets/moments/7.jpg b/issues/adventure/assets/moments/7.jpg new file mode 100644 index 00000000..8cc360fe Binary files /dev/null and b/issues/adventure/assets/moments/7.jpg differ diff --git a/issues/adventure/assets/moments/8.jpg b/issues/adventure/assets/moments/8.jpg new file mode 100644 index 00000000..d52f947c Binary files /dev/null and b/issues/adventure/assets/moments/8.jpg differ diff --git a/issues/adventure/assets/moments/9.jpg b/issues/adventure/assets/moments/9.jpg new file mode 100644 index 00000000..daa20301 Binary files /dev/null and b/issues/adventure/assets/moments/9.jpg differ diff --git a/issues/adventure/assets/roadtrip/p3-product-1.jpg b/issues/adventure/assets/roadtrip/p3-product-1.jpg new file mode 100644 index 00000000..b183e6af Binary files /dev/null and b/issues/adventure/assets/roadtrip/p3-product-1.jpg differ diff --git a/issues/adventure/assets/roadtrip/p3-product-2.jpg b/issues/adventure/assets/roadtrip/p3-product-2.jpg new file mode 100644 index 00000000..8cfeec45 Binary files /dev/null and b/issues/adventure/assets/roadtrip/p3-product-2.jpg differ diff --git a/issues/adventure/assets/roadtrip/p3-product-3.jpg b/issues/adventure/assets/roadtrip/p3-product-3.jpg new file mode 100644 index 00000000..881b879b Binary files /dev/null and b/issues/adventure/assets/roadtrip/p3-product-3.jpg differ diff --git a/issues/adventure/assets/roadtrip/p3-product-4.jpg b/issues/adventure/assets/roadtrip/p3-product-4.jpg new file mode 100644 index 00000000..ec1f7f2d Binary files /dev/null and b/issues/adventure/assets/roadtrip/p3-product-4.jpg differ diff --git a/issues/adventure/assets/roadtrip/p3-product-5.jpg b/issues/adventure/assets/roadtrip/p3-product-5.jpg new file mode 100644 index 00000000..e1524f5a Binary files /dev/null and b/issues/adventure/assets/roadtrip/p3-product-5.jpg differ diff --git a/issues/adventure/assets/roadtrip/p3-product-6.jpg b/issues/adventure/assets/roadtrip/p3-product-6.jpg new file mode 100644 index 00000000..4bdec976 Binary files /dev/null and b/issues/adventure/assets/roadtrip/p3-product-6.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A6488.jpg b/issues/adventure/assets/south-coast/4R4A6488.jpg new file mode 100644 index 00000000..62034caa Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A6488.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A6625.jpg b/issues/adventure/assets/south-coast/4R4A6625.jpg new file mode 100644 index 00000000..7bb327c6 Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A6625.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A6782.jpg b/issues/adventure/assets/south-coast/4R4A6782.jpg new file mode 100644 index 00000000..f93b5c2b Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A6782.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A6875.jpg b/issues/adventure/assets/south-coast/4R4A6875.jpg new file mode 100644 index 00000000..bf07e769 Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A6875.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A6880.jpg b/issues/adventure/assets/south-coast/4R4A6880.jpg new file mode 100644 index 00000000..b9681840 Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A6880.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A7011.jpg b/issues/adventure/assets/south-coast/4R4A7011.jpg new file mode 100644 index 00000000..5cb89b86 Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A7011.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A8710.jpg b/issues/adventure/assets/south-coast/4R4A8710.jpg new file mode 100644 index 00000000..7ed22ab6 Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A8710.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A8781.jpg b/issues/adventure/assets/south-coast/4R4A8781.jpg new file mode 100644 index 00000000..35aded1a Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A8781.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A8918.jpg b/issues/adventure/assets/south-coast/4R4A8918.jpg new file mode 100644 index 00000000..7735d162 Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A8918.jpg differ diff --git a/issues/adventure/assets/south-coast/4R4A8950.jpg b/issues/adventure/assets/south-coast/4R4A8950.jpg new file mode 100644 index 00000000..116375e5 Binary files /dev/null and b/issues/adventure/assets/south-coast/4R4A8950.jpg differ diff --git a/issues/adventure/assets/south-coast/JIMMY_HILLS.jpg b/issues/adventure/assets/south-coast/JIMMY_HILLS.jpg new file mode 100644 index 00000000..6f3279be Binary files /dev/null and b/issues/adventure/assets/south-coast/JIMMY_HILLS.jpg differ diff --git a/issues/adventure/assets/south-coast/look-1.jpg b/issues/adventure/assets/south-coast/look-1.jpg new file mode 100644 index 00000000..bc7e45a1 Binary files /dev/null and b/issues/adventure/assets/south-coast/look-1.jpg differ diff --git "a/issues/adventure/assets/taylor-stitch/Icon\r" "b/issues/adventure/assets/taylor-stitch/Icon\r" new file mode 100644 index 00000000..e69de29b diff --git a/issues/adventure/assets/toc/Happy Adventure.gdoc b/issues/adventure/assets/toc/Happy Adventure.gdoc new file mode 100644 index 00000000..71905c99 --- /dev/null +++ b/issues/adventure/assets/toc/Happy Adventure.gdoc @@ -0,0 +1 @@ +{"url": "https://docs.google.com/document/d/1D1Sr9C2joYNTXhSKWsVlrDa_wbiP1g6jSOWFIq8dw5A/edit?usp=docslist_api", "resource_id": "document:1D1Sr9C2joYNTXhSKWsVlrDa_wbiP1g6jSOWFIq8dw5A"} \ No newline at end of file diff --git "a/issues/adventure/assets/toc/Icon\r" "b/issues/adventure/assets/toc/Icon\r" new file mode 100644 index 00000000..e69de29b diff --git a/issues/adventure/assets/toc/Letter from Editor.gdoc b/issues/adventure/assets/toc/Letter from Editor.gdoc new file mode 100644 index 00000000..627792f1 --- /dev/null +++ b/issues/adventure/assets/toc/Letter from Editor.gdoc @@ -0,0 +1 @@ +{"url": "https://docs.google.com/document/d/1VhomeNEiP0zJiAyyWtWOebCUYpx9ebexs6jDBqpnhV8/edit?usp=docslist_api", "resource_id": "document:1VhomeNEiP0zJiAyyWtWOebCUYpx9ebexs6jDBqpnhV8"} \ No newline at end of file diff --git a/issues/adventure/assets/toc/cover.jpg b/issues/adventure/assets/toc/cover.jpg new file mode 100644 index 00000000..c8a2f72b Binary files /dev/null and b/issues/adventure/assets/toc/cover.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/Exploring Winter Wonderment.docx b/issues/adventure/assets/winter-wonderment/Exploring Winter Wonderment.docx new file mode 100644 index 00000000..7bc7c0f2 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/Exploring Winter Wonderment.docx differ diff --git "a/issues/adventure/assets/winter-wonderment/Icon\r" "b/issues/adventure/assets/winter-wonderment/Icon\r" new file mode 100644 index 00000000..e69de29b diff --git a/issues/adventure/assets/winter-wonderment/autumn-season.png b/issues/adventure/assets/winter-wonderment/autumn-season.png new file mode 100644 index 00000000..1dc53bdd Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/autumn-season.png differ diff --git a/issues/adventure/assets/winter-wonderment/captions.txt b/issues/adventure/assets/winter-wonderment/captions.txt new file mode 100644 index 00000000..3e5ef860 --- /dev/null +++ b/issues/adventure/assets/winter-wonderment/captions.txt @@ -0,0 +1,4 @@ +1. lorem ipsum dah dah dah +2. lorem ipsum dah dah dah +3. lorem ipsum dah dah dah +4. lorem ipsum dah dah dah diff --git a/issues/adventure/assets/winter-wonderment/cover2.jpg b/issues/adventure/assets/winter-wonderment/cover2.jpg new file mode 100644 index 00000000..451f2c76 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/cover2.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/cover3.jpg b/issues/adventure/assets/winter-wonderment/cover3.jpg new file mode 100644 index 00000000..76a61fd1 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/cover3.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/spring-season.jpg b/issues/adventure/assets/winter-wonderment/spring-season.jpg new file mode 100644 index 00000000..cf5b9612 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/spring-season.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/spring-season2.jpg b/issues/adventure/assets/winter-wonderment/spring-season2.jpg new file mode 100644 index 00000000..df582ed7 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/spring-season2.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/summer-season1.jpg b/issues/adventure/assets/winter-wonderment/summer-season1.jpg new file mode 100644 index 00000000..a06a44d0 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/summer-season1.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/summer-season2.jpg b/issues/adventure/assets/winter-wonderment/summer-season2.jpg new file mode 100644 index 00000000..6f61ff60 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/summer-season2.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/summer-season3.jpg b/issues/adventure/assets/winter-wonderment/summer-season3.jpg new file mode 100644 index 00000000..6bea9318 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/summer-season3.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/video_thumb.jpg b/issues/adventure/assets/winter-wonderment/video_thumb.jpg new file mode 100644 index 00000000..f4d898aa Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/video_thumb.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/winter-season.jpg b/issues/adventure/assets/winter-wonderment/winter-season.jpg new file mode 100644 index 00000000..4f00b560 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/winter-season.jpg differ diff --git a/issues/adventure/assets/winter-wonderment/winter-season2.jpg b/issues/adventure/assets/winter-wonderment/winter-season2.jpg new file mode 100644 index 00000000..88e3bda2 Binary files /dev/null and b/issues/adventure/assets/winter-wonderment/winter-season2.jpg differ diff --git a/issues/adventure/data/adventure.md b/issues/adventure/data/adventure.md new file mode 100644 index 00000000..109323a7 --- /dev/null +++ b/issues/adventure/data/adventure.md @@ -0,0 +1,24 @@ +--- + + category: Inspiration + title: Adventure + + author_name: Zyralyn Bacani + + thumb_url: assets/inspiration/thumb.jpg + cover_url: assets/inspiration/redwoods.jpg + + layout: + type: three-column + image_style: cover + content_align: right + content_valign: middle + +--- + +If you're seeking advice on travel, taking on the wise words of English broadcaster and naturalist, David Attenborough, is a great place to start. +"It seems to me that the natural world is the greatest source of excitement; the greatest source of visual beauty; the greatest source of intellectual interest. It is the greatest source of so much in life that makes life worth living." + +So whether it means you embark on a hiking venture up snowed down mountains, go cliff diving in the summer or plan a camping trip with only the bare utilities of a roof top to hoist above your head, food to sustain and a mere compass to guide you through your walks- getting lost in adventure will never be more rewarding. In essence, travel far enough, that you meet yourself. + +We have presented you four breathtaking visuals to induce your senses, one from each season. diff --git a/issues/adventure/data/adventure/1.md b/issues/adventure/data/adventure/1.md new file mode 100644 index 00000000..d31fe6a9 --- /dev/null +++ b/issues/adventure/data/adventure/1.md @@ -0,0 +1,52 @@ +--- + + #author_name: Nkechi Deanna Njaka + + images: + - url: assets/winter-wonderment/winter-season2.jpg + title: "WINTER" + caption: Not all of us are fortunate enough to experience a landscape of snowed-down mountains or intricate snowflakes falling from the sky. It may take a bit more time for transport planning or even a little bit more than just dipping into the savings account. but it will definitely be worth the quest! Bomb down snowy mountains with your snowboard and indulge in a half an hour run, accompanied by a freshly made cup of hot cocoa. For an idyllic winter escape, set out on a wilderness trek to the woods and pitch a tent in the howling winds while overlooking picture-perfect views. Collect firewood on your way - because nothing says ‘nature-lover’ than a nifty bonfire, made by yours truly. Thermals are a must. + + - url: assets/winter-wonderment/summer-season2.jpg + title: "Summer" + caption: Whether you’re exploring secluded waterfalls or taking a dunk in mirrored lakes, summertime is the perfect chance to feel like you’re on a exotic getaway without having to leave the country’s borders. For the daring, plan a group expedition to the nearest falls and cliff dive into pristine waters. Alternatively, for those who prefer more secluded waters, hit the road up the coast- collect sand from your travels, seashells from the beach and build up a beautiful sun-kissed glow. + + - url: assets/winter-wonderment/spring-season2.jpg + title: "Autumn" + caption: This season, not only are we blessed with moderate heat but with visuals of vibrant colours to appeal and tickle one’s olfactory senses. Set up camp in the woods and bushwalk through lush greenery whilst listening to the rhythmic chirping of the inhabitants who have found home in the rainforest. Wander the heathlands full of wildflowers, while collecting memories along the way. This is the perfect way to embrace your surroundings- wind down, close your eyes and breathe in the fresh sandalwood around you. + + - url: assets/winter-wonderment/autumn-season.png + title: "Spring" + caption: "Enjoy warm, sunny days and cool, crisp nights. + View the splendor of Philmont fall colors. + Gaze at wildlife preparing for winter. + Photograph the panorama of peaks. + Fish for trout in sparkling streams." + + layout: + type: custom + image_style: background + content_align: left + +--- + +
+
    + + {{#images}} +
  • +
    +
    +

    {{ title }}

    +
    +
    +

    + {{ caption}} +

    +
    +
    +
  • + {{/images}} + +
+
diff --git a/issues/adventure/data/behind-the-scene.md b/issues/adventure/data/behind-the-scene.md new file mode 100644 index 00000000..fb5cfd10 --- /dev/null +++ b/issues/adventure/data/behind-the-scene.md @@ -0,0 +1,6 @@ +--- + + title: Behind the Scenes + description: Photos and videos + +--- diff --git a/issues/adventure/data/behind-the-scene/1.md b/issues/adventure/data/behind-the-scene/1.md new file mode 100644 index 00000000..e3cce1ce --- /dev/null +++ b/issues/adventure/data/behind-the-scene/1.md @@ -0,0 +1,182 @@ +--- + + images: + - title: Box lay + url: assets/behind-the-scene/1_MG_5831_square.jpg + + - title: Box + url: assets/behind-the-scene/2_MG_5770_sqaure.jpg + + - title: couch + url: assets/behind-the-scene/3_MG_6269_opt_square.jpg + + - title: pose + url: assets/behind-the-scene/4_MG_6153_square.jpg + + - title: back + url: assets/behind-the-scene/5_MG_6201.jpg + + - title: lay down + url: assets/behind-the-scene/6_img-Y20082646_2_opt.jpg + + - title: fix + url: assets/behind-the-scene/7_MG_6240_opt.jpg + + - title: hair + url: assets/behind-the-scene/8_MG_5876_opt.jpg + + - title: ladder + url: assets/behind-the-scene/10_MG_5505.jpg + + - title: drum + url: assets/behind-the-scene/11_MG_5893.jpg + + - title: legs + url: assets/behind-the-scene/12_img-Y20082732_opt.jpg + + - title: photographer 1 + url: assets/6-behind-the-scene/13_MG_5473.jpg + + - title: photographer 2 + url: assets/6-behind-the-scene/14_img-Y20082818_opt_square.jpg + + layout: + type: custom + +--- + + +
    +{{#images}} +
  • +
    + {{ title }} +
    {{ caption }}
    +
    +
  • +{{/images}} +
diff --git a/issues/adventure/data/california-voyage.md b/issues/adventure/data/california-voyage.md new file mode 100644 index 00000000..ae198732 --- /dev/null +++ b/issues/adventure/data/california-voyage.md @@ -0,0 +1,26 @@ +--- + + category: Interview + title: "California Voyage" + + cover_url: assets/california-voyage/background.jpg + thumb_url: assets/california-voyage/background.jpg + + cover_caption: "© Peter Jamus Photography" + + author_name: Interview with Peter Jamus + byline: by Nkechi Njaka + + layout: + type: three-column + image_style: cover + content_style: white + content_align: right + content_valign: middle + content_height: auto + +--- + +I met Peter Jamus a little over a year ago in Minneapolis. We crossed paths several times in the fashion circles we both were apart of. I admired and still admire his photographic work; he always evokes such intense emotion in his images and it’s equally perplexing, moving and captivating. I knew I wanted to know him, work with him and share his perspective with others. + +We met at the infamous First Avenue venue (where Purple Rain was filmed). One of his goal is a very popular Flickr photography trend of taking a new image every day for the whole year. Peter made about two months in last year. Luckily, it’s a brand new year, and Peter has brand new adventures planned. diff --git a/issues/adventure/data/california-voyage/1.md b/issues/adventure/data/california-voyage/1.md new file mode 100644 index 00000000..a5c2c9a1 --- /dev/null +++ b/issues/adventure/data/california-voyage/1.md @@ -0,0 +1,27 @@ +--- + + title: + #author_name: Nkechi Deanna Njaka + + images: + - url: assets/california-voyage/Peter-Jamus12.jpg + + layout: + type: two-column + content_overflow: paginate + +--- + + + +So who is Peter Jamus and what is he doing differently than last year? ‘I’m finding more purpose and meaning in my work; I had started to loose that working with clients,’ Peter explained when asked what he was focusing on in the next year. For him, that also means owning a body of work that fully summarizes him and his point of view. + +> This year I want to focus on personal expression. Closing off the space between the art and the audience. + +Self described as an adventure photographer, Peter admits that a lot of his favorite images from his collection are ‘stolen moments,’ which he describes as ‘photos from an adventure, where nothing is staged.’ This is evidenced in his uncanny ability to capture emotion with a single finger or feather. + +### California Voyage + +Peter recently went on a voyage along the California Coast to explore this concept of adventure photography. This voyage had an official name, and a hashtag (#LAFG). Peter hopped in an RV with some of his photographer friends from Flickr and headed west to adventure through different Californian landscapes to make and create and build community around entrepreneurial artistry. A lot of the artists at the LA Flickr Gathering are 100% supported by their work, and Peter is looking to achieve that in the next year. + +One challenge that Peter faced on this adventure was an assignment that required the artists to preconceive work. Peter explained that the photographers arrived at the beach destination with props and elaborate ideas. “It was hard for me. Pre-visions are stifling…people had props, all these ideas, just floating around.’ Instead, Peter hung out by himself drawing letters in the sand, noticing much later that he was drawing the letters “A,” “R,” “T”. He recalls his fellow photographers who were running around with their props and their sets asking ‘What are you making?’ ‘Art,’ Peter responded. It was ‘the expression I needed then to move forward.’ Feeling disconnected from the assignment to prefabricate art, Peter, who rarely takes self-portraits, set up his tripod. He related this experience of holding handfuls of sand and letting them sift through his fingertips to his newfound philosophy of art-creation. “This is the purest art form—no matter what, it will fade.’ And yet it was such a significant moment for him during his adventure. A very meaningful conclusion was born: ‘I want art to find me. I don’t think I am there yet.’ diff --git a/issues/adventure/data/california-voyage/2.md b/issues/adventure/data/california-voyage/2.md new file mode 100644 index 00000000..ed590677 --- /dev/null +++ b/issues/adventure/data/california-voyage/2.md @@ -0,0 +1,17 @@ +--- + + cover_url: assets/california-voyage/4.jpg + cover_caption: "© Peter Jamus Photography" + + layout: + type: one-column + image_style: background + content_style: black + content_valign: bottom + content_height: auto + +--- + +> I want art to find me. I don’t think I am there yet. + +-- Peter Jamus, photographer diff --git a/issues/adventure/data/california-voyage/3.md b/issues/adventure/data/california-voyage/3.md new file mode 100644 index 00000000..993e7875 --- /dev/null +++ b/issues/adventure/data/california-voyage/3.md @@ -0,0 +1,18 @@ +--- + + handle: 2-california-voyage + title: + #author_name: Nkechi Deanna Njaka + cover_url: assets/california-voyage/3.jpg + cover_caption: "Credits: © Peter Jamus Photography" + + layout: + type: three-column + image_style: background + content_style: black + content_align: left + content_valign: middle + content_height: full + content_transparent: "1" + +--- diff --git a/issues/adventure/data/coastal-adventure.md b/issues/adventure/data/coastal-adventure.md new file mode 100644 index 00000000..cf7ca6fa --- /dev/null +++ b/issues/adventure/data/coastal-adventure.md @@ -0,0 +1,21 @@ +--- + + category: Lookbook + title: Spring Awaking + byline: by Sarah Agboola + author_name: Sarah Agboola + + thumb_url: assets/south-coast/4R4A6782.jpg + cover_url: assets/south-coast/4R4A6782.jpg + + layout: + type: two-column + image_style: background + content_style: black + content_align: left + content_valign: middle + content_height: auto + +--- + +The Grand Pacific Drive evokes a sense of wonder seldom felt elsewhere. Located on the southern coast of New South Wales, the signage allows for an experience that enhances the regions significance. To be at this coast, is to be at an awakening. Hike across the cliff face, listen to the waves crash against the rocks and look across the horizon. Hood pulled up, you blend into the rocky backdrop, but then the weather shifts and the atmosphere draws you into reflection. No one is around and nobody knows you’re here, so what will you do next? diff --git a/issues/adventure/data/coastal-adventure/1.md b/issues/adventure/data/coastal-adventure/1.md new file mode 100644 index 00000000..667e3d4a --- /dev/null +++ b/issues/adventure/data/coastal-adventure/1.md @@ -0,0 +1,11 @@ +--- + + cover_url: assets/south-coast/4R4A7011.jpg + layout: + type: two-column + image_style: background + content_align: right + content_valign: bottom + content_style: black + +--- diff --git a/issues/adventure/data/coastal-adventure/2.md b/issues/adventure/data/coastal-adventure/2.md new file mode 100644 index 00000000..b08b1307 --- /dev/null +++ b/issues/adventure/data/coastal-adventure/2.md @@ -0,0 +1,58 @@ +--- + + category: Shopping + title: "The Wonderer" + cover_url: assets/south-coast/4R4A6880.jpg + + products: + - title: Fenway Parka + link: http://www.theiconic.com.au/Fenway-Parka-156619.html + image_url: assets/coastal-adventure/p3-product-1.jpg + description: Boasting a 100% cotton composition, the Academy Brand Fenway Parka is both practical and stylish with a detachable hood and generous storage. + brand: The Academy Brand + price: $179.95 + + - title: Basic V-Neck Knit + link: http://www.theiconic.com.au/Basic-V-Neck-Knit-141938.html + image_url: assets/coastal-adventure/p3-product-2.jpg + description: Made from 100% cotton, the Academy Brand Basic V-Neck Knit sweater has a versatile design that's ideal for transeasonal layering. + brand: The Academy Brand + price: $39.97 + + - title: Academy Vintage Chinos + link: http://www.theiconic.com.au/Academy-Vintage-Chinos-141982.html + image_url: assets/coastal-adventure/p3-product-3.jpg + # http://static.theiconic.com.au/p/academy-brand-1538-916651-1.jpg + description: Skinny chinos with canvas belt. The Academy Brand Academy Vintage Chinos have a narrow waistband, belt loops, and a buttoned zip fly front. The pants have a classic five pocket design and come with a canvas belt which has contrast leather-look trims. The Academy Brand Academy Vintage Chinos are made from 100% cotton and have a skinny leg fit. + brand: The Academy Brand + price: $99.00 + + - title: Classic Bristol 40MM + link: http://www.theiconic.com.au/Classic-Bristol-40MM-148822.html + image_url: assets/coastal-adventure/p3-product-4.jpg + description: Simple and classic in design, the men's Daniel Wellington Classic Bristol 40MM watch features an eggshell dial with silver-toned detailing, and a premium leather strap with a pin buckle closure. + brand: "Daniel Wellington" + price: $269.00 + + - title: JJ Monty High + link: http://www.theiconic.com.au/JJ-Monty-High-150041.html + image_url: assets/coastal-adventure/p3-product-5.jpg + description: "Featuring a rich, genuine leather upper, the Jack & Jones JJ Monty High sneakers are ideal for casual, weekend wear. " + brand: "Jack & Jones" + price: $139.95 + + - title: Polo Blue 125ml EDT + description: "The Ralph Lauren Polo Blue 125ml EDT SP is an aromatic fragrance for men. The composition features top notes of melon, mandarin, orange and cucumber and lead to a heart of basil, sage and geranium, and a base of musk, woody notes and suede." + link: http://www.theiconic.com.au/Polo-Blue-125ml-EDT-SP-60534.html + image_url: assets/coastal-adventure/p3-product-6.jpg + brand: Ralph Lauren + price: $97.95 + + layout: + type: three-column + image_style: cover + content_align: right + content_valign: middle + +--- + diff --git a/issues/adventure/data/coastal-adventure/3.md b/issues/adventure/data/coastal-adventure/3.md new file mode 100644 index 00000000..ef230f35 --- /dev/null +++ b/issues/adventure/data/coastal-adventure/3.md @@ -0,0 +1,11 @@ +--- + + cover_url: assets/south-coast/4R4A8918.jpg + layout: + type: two-column + image_style: background + content_align: right + content_valign: bottom + content_style: black + +--- diff --git a/issues/adventure/data/coastal-adventure/4.md b/issues/adventure/data/coastal-adventure/4.md new file mode 100644 index 00000000..b099cabc --- /dev/null +++ b/issues/adventure/data/coastal-adventure/4.md @@ -0,0 +1,57 @@ +--- + + category: Shopping + title: "The Hiker" + cover_url: assets/south-coast/4R4A8781.jpg + + products: + - title: Vale Hooded Vest + link: http://academybrand.com/jackets/vale-hooded-vest.html#.U9r4GfG1ZDs + image_url: assets/coastal-adventure/p5-product-1.jpg + description: "The Vale Hooded Vest will quickly become a favourite in your wardrobe. Its versatility allows it to be worn season-to-season, creating a whole range of great looks. The detachable hood, quilted design and inner lining bring style and comfort to this vest." + brand: The Academy Brand + price: $89.95 + + - title: Acad Basic V-Neck + link: http://www.theiconic.com.au/Acad-Basic-V-Neck-1470.html + image_url: assets/coastal-adventure/p5-product-2.jpg + description: Plain cotton tee. The The Academy Brand Acad Basic V-Neck has a staple design which is cut with a ribbed v neckline and short sleeves with a stitched Academy Brand tab on the cuff. The basic tee has a lightweight cotton construction which offers a regular fit. + brand: The Academy Brand + price: $24.95 + + - title: Skinny Stretch Chinos + link: http://www.theiconic.com.au/Skinny-Stretch-Chinos-158649.html + image_url: assets/coastal-adventure/p5-product-3.jpg + description: The Academy Brand Skinny Stretch Chinos are cut from smooth, stretch cotton and offer a skinny-leg fit. + brand: The Academy Brand + price: $89.95 + + - title: Liberty Sweatshirt + link: http://www.theiconic.com.au/Liberty-Sweatshirt-141953.html + image_url: assets/coastal-adventure/p5-product-4.jpg + description: Striped cotton sweatshirt. The Academy Brand Liberty Sweatshirt has a contrast crew neckline and long sleeves with wide cuffs. The jumper is made from a 100% cotton terry fabric and features a block-striped print. The Academy Brand Liberty Sweatshirt has a regular fit and a wide, contrast waistband. + brand: "The Academy Brand" + price: $39.97 + + - title: JJ Savek Leather Boots + link: http://www.theiconic.com.au/JJ-Savek-Leather-Boots-162249.html + image_url: assets/coastal-adventure/p5-product-5.jpg + description: "​Made from rich leather, the Jack & Jones JJ Savek Leather Boots offer a rugged appeal without sacrificing on quality. The lace-up design has a utilitarian edge, while the inner zip closure allows you step into them easier. " + brand: "Jack & Jones" + price: $139.95 + + - title: Novel + description: "Large canvas duffel bag with leather-look trims. The Herschel Novel bag has a canvas exterior, and features contrast leather-look handles. The bag has a spacious main compartment with a top zip closure and an internal mesh pocket. The Herschel Novel bag has a zip section on the side for shoes, and an adjustable shoulder strap with a padded shoulder pad." + link: http://www.theiconic.com.au/Novel-35362.html?nosto=Raptor-Detail-Footer + image_url: assets/coastal-adventure/p5-product-6.jpg + brand: Herschel + price: $119.00 + + layout: + type: three-column + image_style: cover + image_align: left + content_align: right + content_valign: middle + +--- diff --git a/issues/adventure/data/editors-letter.md b/issues/adventure/data/editors-letter.md new file mode 100644 index 00000000..9d8eae13 --- /dev/null +++ b/issues/adventure/data/editors-letter.md @@ -0,0 +1,40 @@ +--- + + title: Welcome to the Adventure Issue + + layout: + type: two-column + image_align: right + +--- + + + +##Letter from the Editor + +There is something exciting about the thought of embarking on uncharted expeditions-- whether literal or figurative. Regardless of which, I am always excited for major changes in the way I experience things and how I will ultimately learn and grow from them. + +Our particular uncharted expedition comes with a new way of publishing editorial content. Everything we do moving forward in 2013 is going to be an adventure. In being our very first issue, we created the Adventure Issue with a specific thought in mind. I hope you are inspired. + +Expect our first issue to come from a place of curiosity. A brand new year idea begs the question, ‘How is this going to be better than last?’ We have an answer: Get Adventurous. Whatever that means for you. The literal definition of adventure is ‘an exciting or very unusual experience; participation in exciting undertakings or enterprises; a bold undertaking; an action of uncertain outcome.’ Think about, but for not too long. + +Whether it means taking an exotic trip, learning a new language, becoming a yogi or going on your first climbing expedition, the intention of adventure is to create a deeper connection with your inner-self—one that hungers for excitement, thirsts for exploration and feeds off of adrenaline. There is nothing more exhilarating than pushing yourself through boundaries and facing the unknown with both courage and bravery. I believe that fearlessness and adventure are best friends and this Issue is meant to inspire both. + +What’s going to be your adventure? What are going to be the things you do this year that gets you off the couch and into new, unexplored territory? We encourage you to think about it. And act. + +Happy Adventure, +Nkechi Njaka, Fashion Editor and Content Curator diff --git a/issues/adventure/data/end.md b/issues/adventure/data/end.md new file mode 100644 index 00000000..7a6b7786 --- /dev/null +++ b/issues/adventure/data/end.md @@ -0,0 +1,18 @@ +--- + + title: End + + thumb_url: assets/background.jpg + cover_url: assets/background_large.jpg + + layout: + type: two-column + nav: false + image_style: background + content_style: black + content_height: auto + content_valign: middle + content_align: center + content_transparent: "1" + +--- diff --git a/issues/adventure/data/moments.md b/issues/adventure/data/moments.md new file mode 100644 index 00000000..aec4fa73 --- /dev/null +++ b/issues/adventure/data/moments.md @@ -0,0 +1,41 @@ +--- + + category: "Moments" + title: "#AcademyMoments" + + thumb_url: assets/moments/3.jpg + cover_url: assets/moments/3.jpg + + images: + - url: assets/moments/1.jpg + - url: assets/moments/2.jpg + - url: assets/moments/3.jpg + - url: assets/moments/4.jpg + - url: assets/moments/5.jpg + - url: assets/moments/6.jpg + - url: assets/moments/7.jpg + - url: assets/moments/8.jpg + - url: assets/moments/9.jpg + + layout: + type: custom + +--- + +
+
+ Social +

#AcademyMoments

+
+ +
    + {{#images}} +
  • +
    + {{ title }} +
    {{ caption }}
    +
    +
  • + {{/images}} +
+
diff --git a/issues/adventure/data/roadtrip.md b/issues/adventure/data/roadtrip.md new file mode 100644 index 00000000..337e60ac --- /dev/null +++ b/issues/adventure/data/roadtrip.md @@ -0,0 +1,23 @@ +--- + + category: Lookbook + title: Road Tripping + + author_name: Sarah Agboola + byline: Sarah Agboola + + cover_url: assets/Unbranded/cover.jpg + thumb_url: assets/Unbranded/thumb.jpg + + + layout: + type: three-column + image_style: background + content_style: white + content_valign: middle + +--- + +Things have come to a head. It’s sooner than expected, which makes it all the more exciting. Rugged up but feeling versatile, you’ve got enough packed to keep you mobile for the foreseeable future. The staples are there; jeans, shirts, a jumper, but it’s your jacket that will see you through the rough. + +Tucked away in your backpack it’s on hand at all times, stowed safe with an old map and a compass. You’re doing it alone with only your senses as a guide, and so it begins. diff --git a/issues/adventure/data/roadtrip/1.md b/issues/adventure/data/roadtrip/1.md new file mode 100644 index 00000000..4b7d2431 --- /dev/null +++ b/issues/adventure/data/roadtrip/1.md @@ -0,0 +1,12 @@ +--- + + cover_url: assets/Unbranded/TheAcademyBrand_LR3C.jpg + + layout: + type: two-column + image_style: background + content_align: right + content_valign: bottom + content_style: black + +--- diff --git a/issues/adventure/data/roadtrip/2.md b/issues/adventure/data/roadtrip/2.md new file mode 100644 index 00000000..e58ff909 --- /dev/null +++ b/issues/adventure/data/roadtrip/2.md @@ -0,0 +1,57 @@ +--- + + category: What to pack + title: "Roadtrip" + cover_url: assets/Unbranded/Look3-reverse.jpg + + products: + - title: Chunky Rib Beanie + link: http://academybrand.com/chunky-rib-beanie-vintage-red.html#.U9sm8fG1ZDt + image_url: assets/roadtrip/p3-product-1.jpg + description: The Chunky Rib Beanie is the perfect way to complete your outfit. Made from soft, comfortable materials and featuring rib detailing, this beanie is sure to keep you warm this winter. + brand: The Academy Brand + price: $34.95 + + - title: Marshall Jacket + link: http://www.theiconic.com.au/Marshall-Jacket-153256.html + image_url: assets/roadtrip/p3-product-2.jpg + description: Featuring a vintage design and cut from premium, 100% cotton, the Academy Brand Marshall Jacket boasts an insulated fit that will keep you warm and looking cool. + brand: The Academy Brand + price: $69.97 + + - title: Brookes Denim Shirt + link: http://www.theiconic.com.au/Brookes-Denim-Shirt-141968.html + image_url: assets/roadtrip/p3-product-3.jpg + description: Made from 100% cotton, the Academy Brand Brookes Denim Shirt has a versatile design with a button-down collar and single chest pocket. + brand: The Academy Brand + price: $62.96 + + - title: Chunky Cable Knit + link: http://academybrand.com/knitwear/chunky-cable-knit.html#.U9sm8_G1ZDt + image_url: assets/roadtrip/p3-product-4.jpg + description: Inspired by the original fisherman’s jumper, the Chunky Cable Knit is a must-have winter staple. Crafted from warm and comfortable cotton with a stylish cable detailing and available in three versatile colours, this knit is perfect for any occasion. + brand: "The Academy Brand" + price: $99.95 + + - title: Academy Vintage Chinos + link: http://www.theiconic.com.au/Academy-Vintage-Chinos-141984.html + image_url: assets/roadtrip/p3-product-5.jpg + description: "​Skinny chinos with canvas belt. The Academy Brand Academy Vintage Chinos have a narrow waistband, belt loops, and a buttoned zip fly front. The pants have a classic five pocket design and come with a canvas belt which has contrast leather-look trims. The Academy Brand Academy Vintage Chinos are made from 100% cotton and have a skinny leg fit." + brand: "The Academy Brand" + price: $69.30 + + - title: Nickler Bag + description: "Unisex shoulder bag. The Eastpak Nickler bag has dual leather reinforced carry handles, a detachable, adjustable padded shoulder strap and two pockets with flap and velcro closure on the front. The bag features zip closure to the main compartment, a padded laptop sleeve and durable lining. " + link: http://www.theiconic.com.au/Nickler-108504.html + image_url: assets/roadtrip/p3-product-6.jpg + brand: The Eastpak + price: $100.00 + + layout: + type: three-column + image_style: cover + image_align: left + content_align: right + content_valign: middle + +--- diff --git a/issues/adventure/data/toc.md b/issues/adventure/data/toc.md new file mode 100644 index 00000000..fe759364 --- /dev/null +++ b/issues/adventure/data/toc.md @@ -0,0 +1,21 @@ +--- + + cover_url: assets/toc/cover.jpg + thumb_url: assets/toc/cover.jpg + + layout: + type: toc + content_overflow: scroll + +--- + +There is something exciting about the thought of embarking on uncharted expeditions-- whether literal or figurative. I excited for changes in the way I experience things and how I learn and grow from them. + +‘How is this going to be better?’ We have an answer: Get Adventurous. Whatever that means for you. The literal definition of adventure is ‘an exciting or very unusual experience; participation in exciting undertakings or enterprises; a bold undertaking; an action of uncertain outcome.’ + +Whether it means taking an exotic trip, learning a new language, becoming a yogi or going on your first climbing expedition, the intention of adventure is to create a deeper connection with your inner-self—one that hungers for excitement, thirsts for exploration and feeds off of adrenaline. + +Happy Adventure! + +Nkechi Njaka +Editor diff --git a/issues/adventure/data/winter-wonderment.md b/issues/adventure/data/winter-wonderment.md new file mode 100644 index 00000000..b00f1de0 --- /dev/null +++ b/issues/adventure/data/winter-wonderment.md @@ -0,0 +1,21 @@ +--- + + category: Feature + title: Winter Wonderment + author_name: Nkechi Njaka + + cover_url: assets/winter-wonderment/cover2.jpg + thumb_url: assets/winter-wonderment/cover2.jpg + + layout: + type: two-column + image_style: background + content_align: left + content_valign: middle + content_style: white + +--- + +Anticipate those moments of crisp cold air and beautiful white landscapes, the smell of pine and sandalwood with a new, more adventurous perspective. + +Adventuring far beyond the comfort of our Sydney base, we recently partnered up on an epic voyage with cinematographer Daniel Coolahan on his latest project shooting an extreme skiing feature film in Alaska. Set around a remote fly-in glacier camp near the Arctic Circle, we're able to showcase our threads in the raw beauty and vastness of the Alaskan wilderness. diff --git a/issues/adventure/data/winter-wonderment/1.md b/issues/adventure/data/winter-wonderment/1.md new file mode 100644 index 00000000..34d2ca74 --- /dev/null +++ b/issues/adventure/data/winter-wonderment/1.md @@ -0,0 +1,23 @@ +--- + + category: video + title: Alaska, Sugar Mountain. + author_name: Zyralyn Bacani + author_icon: http://cl.ly/StPu/Image%202013.12.11%204%3A54%3A01%20pm.png + + thumb_url: assets/winter-wonderment/video_thumb.jpg + + videos: + - thumb_url: assets/winter-wonderment/video_thumb.jpg + link: "https://www.youtube.com/watch?v=myfs66cnjCQ" + type: video/youtube + cover: true + + layout: + image_style: background + content_valign: middle + content_align: center + +--- + +Adventuring far beyond the comfort of our Sydney base, we recently partnered up on an epic voyage with cinematographer Daniel Coolahan on his latest project shooting an extreme skiing feature film in Alaska. Set around a remote fly-in glacier camp near the Arctic Circle, we're able to showcase our threads in the raw beauty and vastness of the Alaskan wilderness. diff --git a/issues/adventure/issue.yaml b/issues/adventure/issue.yaml new file mode 100644 index 00000000..fe85ab07 --- /dev/null +++ b/issues/adventure/issue.yaml @@ -0,0 +1,27 @@ +title: Adventure +magazine_title: Official + +thumb_url: "assets/background.jpg" +cover_url: "assets/background_large.jpg" +theme: default + +assets: + - "custom.css" + +paths: + - index + - toc + - adventure + - winter-wonderment + - coastal-adventure + - california-voyage + - roadtrip + - moments + - end + + +collaborators: + + - name: Zyralyn Bacani + email: zyralyn.bacani@gmail.com + image_url: http://cl.ly/StPu/Image%202013.12.11%204%3A54%3A01%20pm.png \ No newline at end of file diff --git a/issues/broad-horizons/assets/arkaba/Untitled-10.jpg b/issues/broad-horizons/assets/arkaba/Untitled-10.jpg new file mode 100644 index 00000000..d2be6325 Binary files /dev/null and b/issues/broad-horizons/assets/arkaba/Untitled-10.jpg differ diff --git a/issues/broad-horizons/assets/arkaba/Untitled-11.jpg b/issues/broad-horizons/assets/arkaba/Untitled-11.jpg new file mode 100644 index 00000000..471d81e7 Binary files /dev/null and b/issues/broad-horizons/assets/arkaba/Untitled-11.jpg differ diff --git a/issues/broad-horizons/assets/arkaba/Untitled-12.jpg b/issues/broad-horizons/assets/arkaba/Untitled-12.jpg new file mode 100644 index 00000000..c301e13c Binary files /dev/null and b/issues/broad-horizons/assets/arkaba/Untitled-12.jpg differ diff --git a/issues/broad-horizons/assets/arkaba/Untitled-13.jpg b/issues/broad-horizons/assets/arkaba/Untitled-13.jpg new file mode 100644 index 00000000..0250a5f2 Binary files /dev/null and b/issues/broad-horizons/assets/arkaba/Untitled-13.jpg differ diff --git a/issues/broad-horizons/assets/arkaba/Untitled-4.jpg b/issues/broad-horizons/assets/arkaba/Untitled-4.jpg new file mode 100644 index 00000000..8f287324 Binary files /dev/null and b/issues/broad-horizons/assets/arkaba/Untitled-4.jpg differ diff --git a/issues/broad-horizons/assets/arkaba/Untitled-7.jpg b/issues/broad-horizons/assets/arkaba/Untitled-7.jpg new file mode 100644 index 00000000..0a578dd8 Binary files /dev/null and b/issues/broad-horizons/assets/arkaba/Untitled-7.jpg differ diff --git a/issues/broad-horizons/assets/arkaba/Untitled-8.jpg b/issues/broad-horizons/assets/arkaba/Untitled-8.jpg new file mode 100644 index 00000000..0b334cba Binary files /dev/null and b/issues/broad-horizons/assets/arkaba/Untitled-8.jpg differ diff --git a/issues/broad-horizons/assets/arkaba/Untitled-9.jpg b/issues/broad-horizons/assets/arkaba/Untitled-9.jpg new file mode 100644 index 00000000..3da2e374 Binary files /dev/null and b/issues/broad-horizons/assets/arkaba/Untitled-9.jpg differ diff --git a/issues/broad-horizons/assets/background.jpg b/issues/broad-horizons/assets/background.jpg new file mode 100644 index 00000000..77f5b0f2 Binary files /dev/null and b/issues/broad-horizons/assets/background.jpg differ diff --git a/issues/broad-horizons/assets/background_large.jpg b/issues/broad-horizons/assets/background_large.jpg new file mode 100644 index 00000000..45a73bdb Binary files /dev/null and b/issues/broad-horizons/assets/background_large.jpg differ diff --git a/issues/broad-horizons/assets/brand.png b/issues/broad-horizons/assets/brand.png new file mode 100644 index 00000000..45f9a9a9 Binary files /dev/null and b/issues/broad-horizons/assets/brand.png differ diff --git a/issues/broad-horizons/assets/custom.js b/issues/broad-horizons/assets/custom.js new file mode 100644 index 00000000..d1de2bde --- /dev/null +++ b/issues/broad-horizons/assets/custom.js @@ -0,0 +1,37 @@ +var setupGeoLink = function() { + console.log('map is ready'); +}; + +$(function() { + var script = document.createElement('script'); + script.type = 'text/javascript'; + script.src = 'https://maps.googleapis.com/maps/api/js?key=AIzaSyCV5jQkaOQYZO9szxfYYyb06lAvihOjbMw&callback=setupGeoLink'; + document.body.appendChild(script); + + + function resizeBgVideo() { + var video = $('.cover-area.video video'); + var imageWidth = 1922; + var imageHeight = 1080; + var headerHeight = video.parent().height(); + + if (video.length == 0) + return; + + // video.playbackRate = 1.5 + + videoWidth = video.parent().width(); + videoHeight = videoWidth * imageHeight / imageWidth; + + if (videoHeight <= headerHeight) { + videoHeight = headerHeight; + videoWidth = headerHeight * imageWidth / imageHeight; + } + + video[0].style.width = parseInt(videoWidth) + 'px'; + video[0].style.height = parseInt(videoHeight) + 'px'; + } + + resizeBgVideo(); + +}); diff --git a/issues/broad-horizons/assets/custom.scss b/issues/broad-horizons/assets/custom.scss new file mode 100644 index 00000000..94d40f0d --- /dev/null +++ b/issues/broad-horizons/assets/custom.scss @@ -0,0 +1,450 @@ +/* fix google map API */ +.map { + line-height: 16px; +} + +.toolbar a.share { + display: none; +} + +.toolbar a.subscribe { + right: 0; +} + +#broad-horizons-issue { + + #issue-branding { + font-size: 10px; + } + + figure.cover-area .gallery { + height: 100%; + margin: 0; + } + + p:empty { + display: none; + } + + article.one-column { + h2 { + font-weight: bold; + letter-spacing: 3px; + margin-bottom: 40px; + } + + .body p { + font-family: georgia; + line-height: 30px; + font-size: 18px; + } + + figure.wrapping { + text-align: center; + + figcaption { + text-align: left; + padding: 10px 0 0; + } + } + + figure.full { + margin: 50px 0; + height: 600px; + overflow: hidden; + + &:before { + content: ''; + position: absolute; + top: 0; left:0; right: 0; bottom: 0; + background: rgba(0,0,0,0.3); + } + + .container { + position: absolute; + top: 50%; + color: white; + left: 50%; + width: 280px; + margin-left: -140px; + height: 100px; + margin-top: -50px; + text-align: center; + } + + .subtitle { + color: white; + text-align: center; + } + } + + footer { + max-width: 1280px; + margin: 0px 0 10px; + padding-top: 100px; + min-height: initial; + + div { + line-height: 34px; + } + + img { + width: 80px; + } + + hr { + margin: 17px 0; + clear: none; + background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.05)); + background-image: linear-gradient(to right, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.05)); + } + + span { + color: #555; + text-transform: uppercase; + font-weight: bold; + } + } + + @media only screen and (min-width: 768px) { + .content { + max-width: initial; + padding: 50px 0 25px; + + .body > { + h1, h2, h3, p, figure, section { + max-width: 720px; + margin-left: auto; + margin-right: auto; + box-sizing: border-box; + + &.full { + max-width: initial; + } + } + + section { + margin-bottom: 20px; + } + } + } + + &.image-background .content { + max-width: 45em; + } + } + } + + [data-page=index] { + + .brand { + position: relative; + display: block; + background: url(brand.png) no-repeat; + background-size: contain; + background-position: center; + width: 45vmin; + height: 15vmin; + margin: 0 auto 0em; + color: transparent; + text-shadow: none; + } + + .title { + font-family: "HelveticaNeue-CondensedBold", "sans-serif-condensed"; + font-size: 36px; + font-weight: bold; + letter-spacing: 4px; + text-shadow: 1px 1px 30px rgba(0, 0, 0, 0.1); + } + + .description { + font-family: georgia; + font-style: italic; + text-transform: capitalize; + border: 0.5px solid rgba(255,255,255,0.5); + border-width: 1px 0; + padding: 5px 0; + margin: 0 auto 2vmin; + } + + .issue-logo { + display: none; + } + + @media only screen and (min-width: 768px) { + + .title { + + font-size: 90px; + letter-spacing: 5px; + } + + + .description { + width: 26em; + } + } + + } + + // Start Flinders Range Custom Styles + [data-page='flinders-range'] { + .cover-area { + height: 100%; + background-size: cover; + background-repeat: no-repeat; + overflow: hidden; + + &:before { + content: none; + } + + header { + max-width: 45em; + margin: 0 auto; + position: absolute; + bottom: 0; + left: 0; + right: 0; + top: 50%; + padding: 0 10px; + z-index: 1; + + transform: translateY(-20%); + -webkit-transform: translateY(-20%); + + // Video background image + .title, .subtitle { + color: white; + text-shadow: 1px 1px 20px rgba(0, 0, 0, 0.3); + z-index: 2; + } + + .title { + font-weight: bold; + padding: 0; + margin-bottom: 30px; + } + + .subtitle { + font-family: proxima-nova; + font-size: 1.9rem; + } + } + + video { + margin-left: -0.25em; // offset inline block white space + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + min-width: 100%; + min-height: 100%; + width: auto; + height: auto; + background-repeat: no-repeat; + + animation: fade 0.8s ease both; + -webkit-animation: fade 0.8s ease both; + + animation-delay: 0.8s; + -webkit-animation-delay: 0.8s; + } + + figcaption { + position: absolute; + left: 10px; + bottom: 20px; + font-size: 12px; + color: white; + padding: 0; + width: auto; + max-width: 100px; + } + + .page-scroll { + position: absolute; + bottom: 4px; + left: 50%; + margin-left: -20px; + text-decoration: none; + + i { + font-size: 40px; + color: white; + } + } + } + + .content { + background: white; + color: #222; + + h2 { + text-align: center; + } + } + + @media only screen and (min-width: 768px) { + .cover-area { + figcaption { + left: 20px; + font-size: 14px; + max-width: initial; + } + } + + .content { + figure.wrapping { + float: left; + max-width: 320px; + margin: 0 30px 10px 0; + } + } + } + } + // End Flinders Range Custom Styles + + // Start Luxe Hotel Custom Styles + [data-page='luxe-hotel'] { + .cover-area { + display: block; + height: 100%; + + -webkit-backface-visibility: hidden; + -webkit-perspective: 1000; + -webkit-transform: translate3d(0, 0, 0); + + background-position: 0px 0px; + background-repeat: repeat-x; + + .container { + background-color: rgba(0, 0, 0, 0.3); + } + + header { + max-width: 45em; + margin: 0 auto; + position: relative; + top: 50%; + padding: 0 10px; + + transform: translateY(-50%); + -webkit-transform: translateY(-50%); + + .title, .subtitle, .category { + color: white; + } + + .title { + font-size: 26px; + font-weight: bold; + padding: 0; + margin-bottom: 30px; + } + + .subtitle { + font-family: proxima-nova; + font-weight: lighter; + font-style: normal; + text-align: left; + } + } + } + + &.current .cover-area { + animation: animatedBackground 50s linear infinite; + -webkit-animation: animatedBackground 50s linear infinite; + } + } + + [data-page='luxe-hotel/1'] { + @media only screen and (min-width: 768px) and (orientation:portrait) { + figure.cover-area .gallery { + height: 50%; + margin-top: 50%; + } + } + } + + [data-page='luxe-hotel/2'] { + h3 { + margin: 0; + } + + .product-set li { + height: 190px; + } + } + // End Luxe Hotel Custom Styles + + // Start Outback Tours Custom Styles + [data-page='outback-tours'] { + header { + + .title, .subtitle, .category { + color: white; + } + + .title { + font-size: 26px; + font-weight: bold; + padding: 0; + } + + .subtitle { + font-family: proxima-nova; + font-weight: lighter; + font-style: normal; + text-align: left; + } + } + + @media only screen and (min-width: 768px) { + header { +// text-align: left; + } + } + } + + [data-page='outback-tours/1'] { + .content { + h3 { + text-transform: uppercase; + } + + a { + text-decoration: none; + } + + .links { + text-align: left; + } + } + } + // End Outback Tours Custom Styles +} + +@keyframes animatedBackground { + 0% { background-position: 0 0; } + 50% { background-position: 100% 0; } + 100% { background-position: 0 0; } +} + +@-webkit-keyframes animatedBackground { + 0% { background-position: 0 0; } + 50% { background-position: 100% 0; } + 100% { background-position: 0 0; } +} + +@keyframes videoFadeIn { + from { opacity: 0; } + to { opacity: 1; } +} + +@-webkit-keyframes videoFadeIn { + from { opacity: 0; } + to { opacity: 1; } +} diff --git a/issues/broad-horizons/assets/flinders-range/cover.jpg b/issues/broad-horizons/assets/flinders-range/cover.jpg new file mode 100644 index 00000000..bd0373da Binary files /dev/null and b/issues/broad-horizons/assets/flinders-range/cover.jpg differ diff --git a/issues/broad-horizons/assets/flinders-range/image-1.jpg b/issues/broad-horizons/assets/flinders-range/image-1.jpg new file mode 100644 index 00000000..cdf16df5 Binary files /dev/null and b/issues/broad-horizons/assets/flinders-range/image-1.jpg differ diff --git a/issues/broad-horizons/assets/flinders-range/image-2.jpg b/issues/broad-horizons/assets/flinders-range/image-2.jpg new file mode 100644 index 00000000..9c8a5c88 Binary files /dev/null and b/issues/broad-horizons/assets/flinders-range/image-2.jpg differ diff --git a/issues/broad-horizons/assets/flinders-range/image-3.jpg b/issues/broad-horizons/assets/flinders-range/image-3.jpg new file mode 100644 index 00000000..16846343 Binary files /dev/null and b/issues/broad-horizons/assets/flinders-range/image-3.jpg differ diff --git a/issues/broad-horizons/assets/flinders-range/image-4.jpg b/issues/broad-horizons/assets/flinders-range/image-4.jpg new file mode 100644 index 00000000..187ee6d0 Binary files /dev/null and b/issues/broad-horizons/assets/flinders-range/image-4.jpg differ diff --git a/issues/broad-horizons/assets/flinders-range/lake-eyre-dark.jpg b/issues/broad-horizons/assets/flinders-range/lake-eyre-dark.jpg new file mode 100644 index 00000000..06998b42 Binary files /dev/null and b/issues/broad-horizons/assets/flinders-range/lake-eyre-dark.jpg differ diff --git a/issues/broad-horizons/assets/flinders-range/lake-eyre.jpg b/issues/broad-horizons/assets/flinders-range/lake-eyre.jpg new file mode 100644 index 00000000..d367a31e Binary files /dev/null and b/issues/broad-horizons/assets/flinders-range/lake-eyre.jpg differ diff --git a/issues/broad-horizons/assets/flinders-range/made.png b/issues/broad-horizons/assets/flinders-range/made.png new file mode 100644 index 00000000..9d8f916e Binary files /dev/null and b/issues/broad-horizons/assets/flinders-range/made.png differ diff --git a/issues/broad-horizons/assets/flinders-range/video.mp4 b/issues/broad-horizons/assets/flinders-range/video.mp4 new file mode 100644 index 00000000..343730a3 Binary files /dev/null and b/issues/broad-horizons/assets/flinders-range/video.mp4 differ diff --git a/issues/broad-horizons/assets/getting-there/cover.jpg b/issues/broad-horizons/assets/getting-there/cover.jpg new file mode 100644 index 00000000..471d81e7 Binary files /dev/null and b/issues/broad-horizons/assets/getting-there/cover.jpg differ diff --git a/issues/broad-horizons/assets/getting-there/virgin-australia.jpg b/issues/broad-horizons/assets/getting-there/virgin-australia.jpg new file mode 100644 index 00000000..0db7da6e Binary files /dev/null and b/issues/broad-horizons/assets/getting-there/virgin-australia.jpg differ diff --git a/issues/broad-horizons/assets/icon.png b/issues/broad-horizons/assets/icon.png new file mode 100644 index 00000000..763ec8b5 Binary files /dev/null and b/issues/broad-horizons/assets/icon.png differ diff --git a/issues/broad-horizons/assets/luxe-hotel/arkaba-homestead.jpg b/issues/broad-horizons/assets/luxe-hotel/arkaba-homestead.jpg new file mode 100644 index 00000000..50ecbcd6 Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/arkaba-homestead.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/food-2.jpg b/issues/broad-horizons/assets/luxe-hotel/food-2.jpg new file mode 100644 index 00000000..b1da21b1 Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/food-2.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/food.jpg b/issues/broad-horizons/assets/luxe-hotel/food.jpg new file mode 100644 index 00000000..ead9db0f Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/food.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/header_128.jpg b/issues/broad-horizons/assets/luxe-hotel/header_128.jpg new file mode 100644 index 00000000..7d5b5e9c Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/header_128.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/jazz-ambient.m4a b/issues/broad-horizons/assets/luxe-hotel/jazz-ambient.m4a new file mode 100644 index 00000000..fd59afd7 Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/jazz-ambient.m4a differ diff --git a/issues/broad-horizons/assets/luxe-hotel/jazz-ambient.mp3 b/issues/broad-horizons/assets/luxe-hotel/jazz-ambient.mp3 new file mode 100644 index 00000000..31d5b8e5 Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/jazz-ambient.mp3 differ diff --git a/issues/broad-horizons/assets/luxe-hotel/stay-2.jpg b/issues/broad-horizons/assets/luxe-hotel/stay-2.jpg new file mode 100644 index 00000000..f9a53d81 Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/stay-2.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/stay-3.jpg b/issues/broad-horizons/assets/luxe-hotel/stay-3.jpg new file mode 100644 index 00000000..4d3ca60a Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/stay-3.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/stay.jpg b/issues/broad-horizons/assets/luxe-hotel/stay.jpg new file mode 100644 index 00000000..ae01c565 Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/stay.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/style.jpg b/issues/broad-horizons/assets/luxe-hotel/style.jpg new file mode 100644 index 00000000..4851531c Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/style.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/style_p1.jpg b/issues/broad-horizons/assets/luxe-hotel/style_p1.jpg new file mode 100644 index 00000000..9d8a37cb Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/style_p1.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/style_p2.jpg b/issues/broad-horizons/assets/luxe-hotel/style_p2.jpg new file mode 100644 index 00000000..8d55d5de Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/style_p2.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/style_p3.jpg b/issues/broad-horizons/assets/luxe-hotel/style_p3.jpg new file mode 100644 index 00000000..5225e23e Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/style_p3.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/style_p4.jpg b/issues/broad-horizons/assets/luxe-hotel/style_p4.jpg new file mode 100644 index 00000000..96350977 Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/style_p4.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/style_p5.jpg b/issues/broad-horizons/assets/luxe-hotel/style_p5.jpg new file mode 100644 index 00000000..bc1e2ff8 Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/style_p5.jpg differ diff --git a/issues/broad-horizons/assets/luxe-hotel/style_p6.jpg b/issues/broad-horizons/assets/luxe-hotel/style_p6.jpg new file mode 100644 index 00000000..66ccba0a Binary files /dev/null and b/issues/broad-horizons/assets/luxe-hotel/style_p6.jpg differ diff --git a/issues/broad-horizons/assets/made.png b/issues/broad-horizons/assets/made.png new file mode 100644 index 00000000..e8b0d8f4 Binary files /dev/null and b/issues/broad-horizons/assets/made.png differ diff --git a/issues/broad-horizons/assets/outback-tours/12852_legionnaire_b_925.jpg b/issues/broad-horizons/assets/outback-tours/12852_legionnaire_b_925.jpg new file mode 100644 index 00000000..5a23e15d Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/12852_legionnaire_b_925.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/40501_dashpack_v5_456.jpg b/issues/broad-horizons/assets/outback-tours/40501_dashpack_v5_456.jpg new file mode 100644 index 00000000..3cd8a2b1 Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/40501_dashpack_v5_456.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/51200_nomadic_901.jpg b/issues/broad-horizons/assets/outback-tours/51200_nomadic_901.jpg new file mode 100644 index 00000000..490a093c Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/51200_nomadic_901.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/61487_handtorchgrip_480_321.jpg b/issues/broad-horizons/assets/outback-tours/61487_handtorchgrip_480_321.jpg new file mode 100644 index 00000000..65993983 Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/61487_handtorchgrip_480_321.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/83155_harness_picnicrug_755.jpg b/issues/broad-horizons/assets/outback-tours/83155_harness_picnicrug_755.jpg new file mode 100644 index 00000000..d8dc31f0 Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/83155_harness_picnicrug_755.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/87139_cabana_c_sg10013_f82.jpg b/issues/broad-horizons/assets/outback-tours/87139_cabana_c_sg10013_f82.jpg new file mode 100644 index 00000000..f67592af Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/87139_cabana_c_sg10013_f82.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/cover.jpg b/issues/broad-horizons/assets/outback-tours/cover.jpg new file mode 100644 index 00000000..29956230 Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/cover.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/people-SA.jpg b/issues/broad-horizons/assets/outback-tours/people-SA.jpg new file mode 100644 index 00000000..d602e430 Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/people-SA.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/stocksy-108480.jpg b/issues/broad-horizons/assets/outback-tours/stocksy-108480.jpg new file mode 100644 index 00000000..2a960743 Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/stocksy-108480.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/stocksy-276199.jpg b/issues/broad-horizons/assets/outback-tours/stocksy-276199.jpg new file mode 100644 index 00000000..391d5746 Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/stocksy-276199.jpg differ diff --git a/issues/broad-horizons/assets/outback-tours/wine-SA.jpg b/issues/broad-horizons/assets/outback-tours/wine-SA.jpg new file mode 100644 index 00000000..98e9ba6e Binary files /dev/null and b/issues/broad-horizons/assets/outback-tours/wine-SA.jpg differ diff --git a/issues/broad-horizons/assets/preview.jpg b/issues/broad-horizons/assets/preview.jpg new file mode 100644 index 00000000..5a43875d Binary files /dev/null and b/issues/broad-horizons/assets/preview.jpg differ diff --git a/issues/broad-horizons/data/flinders-range.md b/issues/broad-horizons/data/flinders-range.md new file mode 100644 index 00000000..608e370f --- /dev/null +++ b/issues/broad-horizons/data/flinders-range.md @@ -0,0 +1,111 @@ +--- + + title: The Flinders Rangers & Outback + summary: The Flinders Rangers and Outback. Roads to somewhere ... afternoon drinks. It may be hard to define, but the rich history and stunning landscape of the outback provides an ideal backdrop for journeys of discovery, writes Max Anderson. + + videos: + - thumb_url: "assets/flinders-range/cover.jpg" + url: "assets/flinders-range/video.mp4" + location: + name: + coordinates: [] + cover: true + + images: + + - url: "assets/flinders-range/image-1.jpg" + - url: "assets/flinders-range/image-2.jpg" + - url: "assets/flinders-range/image-3.jpg" + + - url: "assets/flinders-range/image-4.jpg" + caption: Something about this lonely cow that inspires a lot of confidence + + - url: "assets/flinders-range/lake-eyre.jpg" + title: Lake Eyre + caption: Takes you 15 metres below sea + + - url: "assets/made.png" + + custom_html: true + + layout: + type: custom + image_style: background + content_style: black + custom_class: one-column page-snap + +--- + +
+
+

{{title}}

+

{{summary}}

+
+ +
Flinders Ranges National Park, South Australia
+ + +
+ +
+
+

No line is painted on the road to indicate you are entering outback South Australia (please drive carefully). However, you know the outback when you see it.

+ +

Open spaces under giant skies, ancient ranges that undo your sense of ”now”, wide horizons riven by empty roads that lead to nowhere - until, that is, they arrive (rather surprisingly) at somewhere. What outback communities lack in population they make up for in colour, eccentricity and resourcefulness. They’re also rich in story, the very fabric of place: when the camera has taken its fill of ranges, waterholes and landforms, it’s the local people who add some of the landscape’s most meaningful layers.

+ +

There is no line to indicate you are leaving outback South Australia (please come again). But once returned to your office, home or school, there’ll be no question where it was or what it was. You’ll be able to point to a map and say, ”There - I found it there.”

+ + + +

A drive on the wild side

+
+ +
+ +
+
Something about this lonely cow that inspires a lot of confidence
+
+ +

+ A 300-kilometre, two-day tour of the unsealed Oodnadatta Track is safe and surprising, with weirdness and wilderness aplenty. Start with Mutonia Sculpture Park near Marree (home of Plane Henge and Spinning Car - mildly deranged but compelling) then head into the yawning gibber plains. You’ll follow the remains of the first Ghan railway, where ruins of sidings and repeater stations for the overland telegraph line are dotted along a ”string of springs”.

+
+ +
+
+

Lake Eyre

+

Takes you 15 metres below sea

+
+ +
+ +

Camp at Coward Springs, a delicious respite to wash off the dust in the hot mineral waters and barbecue under gums cackling with cockatoos. Stop to allow Lake Eyre South to boggle your eye and be sure to detour to the Mound Springs - these blisters in the plains are leaky ecosystems the size of houses that have evolved their own species of shrimp. Similarly unique species are at William Creek, especially at the famous pub; air tours over Lake Eyre are available with Wrightsair. Finish in Coober Pedy.

+

+
+ +
+
+

+
+ + Broad Horizons ISSUE #1 + +
+
+
diff --git a/issues/broad-horizons/data/gallery.md b/issues/broad-horizons/data/gallery.md new file mode 100644 index 00000000..d0e7a9ab --- /dev/null +++ b/issues/broad-horizons/data/gallery.md @@ -0,0 +1,85 @@ +--- + + title: The Flinders Rangers & Outback + summary: The Flinders Rangers and Outback. Roads to somewhere ... afternoon drinks. It may be hard to define, but the rich history and stunning landscape of the outback provides an ideal backdrop for journeys of discovery, writes Max Anderson. + + images: + - url: assets/background_large.jpg + location: + name: + coordinates: [] + cover: true + + layout: + type: custom + image_style: background + custom_class: one-column page-snap + +--- + + +
+ +
+ +
+
+ + + +

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+ + + + +
+
diff --git a/issues/broad-horizons/data/getting-there.md b/issues/broad-horizons/data/getting-there.md new file mode 100644 index 00000000..4915c77b --- /dev/null +++ b/issues/broad-horizons/data/getting-there.md @@ -0,0 +1,32 @@ +--- + + title: Getting There + summary: "Discover South Australia in person" + + cover_url: assets/getting-there/cover.jpg + thumb_url: assets/getting-there/cover.jpg + + images: + - url: assets/getting-there/virgin-australia.jpg + + layout: + type: two-column + +--- + +Qantas flights to Adelaide cost $106 for the 80-minute journey from Melbourne and $141 for the two-hour journey from Sydney. Virgin charges $59 from Melbourne and $94 from Sydney. If you adhere to the view that Port Augusta is the gateway, the outback starts after three hours' freeway driving north from Adelaide. Don't, however, underestimate the size of this region: there's another 4½-hour drive from Port Augusta to Coober Pedy, two hours to Parachilna or three hours to Arkaroola. The further you go the more notice you need to take of servo stops and road conditions. +Rental cars are available from the usual outlets at Adelaide airport, as well as Coober Pedy and Port Augusta. + +Sharp Airlines flies daily from Adelaide to Port Augusta ($109 for a 50-minute flight); charter companies such as Ross Air can hop you around the outback, while Big Blue Air Touring can build - and host - your entire outback itinerary. Flying isn't cheap but the larger your party, the more cost-effective it becomes. + +
+
+ +
+

Fly with Virgin

+

Sydney to Adelaide from $94

+ + BOOK NOW +
diff --git a/issues/broad-horizons/data/luxe-hotel.md b/issues/broad-horizons/data/luxe-hotel.md new file mode 100644 index 00000000..0af388b4 --- /dev/null +++ b/issues/broad-horizons/data/luxe-hotel.md @@ -0,0 +1,35 @@ +--- + + category: Utlimate Outback + title: Arkaba Homestead + summary: Dating back to the 1850s, Arkaba Homestead's 5 ensuite bedrooms have been tastefully restored in tune with the property's pioneering history. + + images: + - url: "assets/luxe-hotel/arkaba-homestead.jpg" + cover: true + + audios: + - url: "assets/luxe-hotel/jazz-ambient.mp3" + autoplay: true + controls: false + + custom_html: true + + layout: + type: custom + image_style: background + content_style: black + custom_class: one-column page-snap + +--- +
+
+
+ {{category}} +

{{title}}

+

{{summary}}

+
+ +
+ +
diff --git a/issues/broad-horizons/data/luxe-hotel/1.md b/issues/broad-horizons/data/luxe-hotel/1.md new file mode 100644 index 00000000..b5b67ce0 --- /dev/null +++ b/issues/broad-horizons/data/luxe-hotel/1.md @@ -0,0 +1,58 @@ +--- + + cover_url: assets/luxe-hotel/stay.jpg + + custom_html: true + + layout: + type: custom + custom_class: three-column white scroll right middle height-auto image-cover cover-left + + images: + - url: assets/luxe-hotel/food.jpg + - url: assets/luxe-hotel/stay.jpg + - url: assets/luxe-hotel/food-2.jpg + - url: assets/luxe-hotel/stay-2.jpg + - url: assets/luxe-hotel/stay-3.jpg +--- + +
+ +
+ +
diff --git a/issues/broad-horizons/data/luxe-hotel/2.md b/issues/broad-horizons/data/luxe-hotel/2.md new file mode 100644 index 00000000..72970e00 --- /dev/null +++ b/issues/broad-horizons/data/luxe-hotel/2.md @@ -0,0 +1,50 @@ +--- + + category: What to Pack + title: Outback Retreat + description: "Loose fits, timeless feel with an all round boho chic vibe!" + + cover_url: assets/luxe-hotel/style.jpg + + products: + - link: "http://www.farfetch.com/shopping/women/item10984416.aspx?utm_source=issue.by&utm_campain=broad-horizons&utm_content=What%20To%20Pack" + image_url: assets/luxe-hotel/style_p1.jpg + description: "Nude straw fedora hat from Lanvin featuring a wide brim." + title: LANVIN FEDORA HAT + price: 457.57 + + - link: "http://www.matchesfashion.com/product/1012189" + image_url: assets/luxe-hotel/style_p2.jpg + description: "Sophie Anderson's beautifully hand-woven bags have a philanthropic spirit at their core. This soft-beige cotton drawstring Lilla shoulder bag is handcrafted by an all-female group of Columbian artisans and takes up to four weeks to create. It's detailed with a contrasting pink geometric pattern and same-tone pompoms and is the perfect size for storing beach essentials." + title: "LILLA WOVEN-COTTON SHOULDER BAG" + price: 393 + + - link: http://www.shopbop.com/chloe-tunic-coolchange/vp/v=1/1566899414.htm?folderID=2534374302067619&fm=other-shopbysize&colorId=16825 + image_url: assets/luxe-hotel/style_p3.jpg + description: "Chloe Tunic" + title: "LILLA WOVEN-COTTON SHOULDER BAG" + price: 281.41 + + - link: http://www.katesomerville.com/illumikate-cc/ + image_url: assets/luxe-hotel/style_p4.jpg + description: "ILLUMIKATE™ CC CREAM BROAD SPECTRUM SPF 50+ PA+++" + title: KATE SOMMERVILLE + price: 48 + + - link: http://www.theiconic.com.au/Coco-Leather-Slides-176038.html + image_url: assets/luxe-hotel/style_p5.jpg + description: "Buy Atmos&Here - Coco Leather Slides - Sandals (Bone) at THE ICONIC with free overnight delivery over $50 and 100 days free returns!" + title: "ATMOS&HERE - COCO LEATHER SLIDES - SANDALS (BONE)" + price: 59.95 + + - link: http://www.theiconic.com.au/Vintage-Polaroid-600-Camera-169471.html + image_url: assets/luxe-hotel/style_p4.jpg + description: "Buy Polaroid - Vintage Polaroid 600 Camera - Novelty Gifts (Black) at THE ICONIC with free overnight delivery over $50 and 100 days free returns!" + title: "POLAROID - VINTAGE POLAROID 600 CAMERA - NOVELTY GIFTS (BLACK)" + price: 249.95 + + layout: + type: three-column + +--- + diff --git a/issues/broad-horizons/data/outback-tours.md b/issues/broad-horizons/data/outback-tours.md new file mode 100644 index 00000000..e991426d --- /dev/null +++ b/issues/broad-horizons/data/outback-tours.md @@ -0,0 +1,21 @@ +--- + + category: What To Do + title: Outback Experience + summary: "When the camera has taken its fill of ranges, waterholes and landforms, it's the local people who add some of the landscape's most meaningful layers." + + images: + - url: "assets/outback-tours/cover.jpg" + cover: true + + layout: + type: three-column + image_style: background + content_align: right + content_valign: middle + content_height: auto + content_style: black + content_transparent: true + custom_class: transparent + +--- diff --git a/issues/broad-horizons/data/outback-tours/1.md b/issues/broad-horizons/data/outback-tours/1.md new file mode 100644 index 00000000..592599a7 --- /dev/null +++ b/issues/broad-horizons/data/outback-tours/1.md @@ -0,0 +1,73 @@ +--- + + images: + - url: assets/outback-tours/people-SA.jpg + - url: assets/outback-tours/wine-SA.jpg + + layout: + type: two-column + content_overflow: paginate + +--- + + + +### Opals in the dust +The milky opalescent stuff lying in shards in the dirt around Coober Pedy is ''potch'' - the matrix for opal and raison d'etre for this strange town. Yes, there are tourists here but the mining madness is authentic and palpable, ably assisted by Heath Robinson-esque opal-digging contraptions, hippie-trippy outlets, bizarre props from science-fiction movies left lying in the sun and the famous underground hotels and hostels (even rooms in the 4½-star Desert Cave are distinctly other-worldly). Just when you think it's really weird, go out to the opal fields (preferably on a tour), the Moon Plains and the paint-box Breakaways to see truly bizarre landscapes. The smaller town of Andamooka is where opals are strip-mined; it's more gritty, more intense and just as interesting. The great-great-grandson of composer Mendelssohn is a resident artist. No, really, it's true. + + + +### Arkaroola Ridgetop Tour +This is an iconic tour of iconic country, where you cling to an open-topped four-wheel-drive while it scales the red-rock battlements of the northern Flinders Ranges. The tour operates out of private Arkaroola Wilderness Sanctuary, a seventh heaven for wildlife lovers (trails lead through chasms to waterholes and yellow-footed rock wallabies), stargazers (the observatory and star chair are open for business under clarion skies) and eco-warriors. The resort is comfortable and caters to all budgets. Debates about whether uranium miners should extract local resources occasionally stir the restaurant-bar at night. + + + + +### Traditional perspectives +Some of the secrets of this old, old country still reside with Aboriginal people of the region. Tour guide Haydyn Bromley is a Kaurna man leading 4WD adventures out of Adelaide into the outback, where he invites local elders to share their knowledge, their company and (quite often) their quiet humour. Bromley connects guests with the different levels of outback - the natural, the European/pastoral and the Aboriginal - and few stones are left unturned. Reg Dodd is an Arabunna elder who was born at the southern end of Lake Eyre; he's been running tours of the region since 1996. You see sand, salt and stones? Now see what he sees. + + + + + + +### Pop Quorn +The township of Quorn makes for a top long-weekend escape. It's a charming old-world railway town that offers great heritage, dry-country upland scenery and real outback flavour. The Austral pub is a hub; so, too, the Quandong Cafe. The owner of Quornucopia Gallery keeps his own hours; don't be surprised to see him open when you leave the pub. Bushwalking is particularly good, with walking trails to Warren Gorge and scenic drives to Devil's Peak, Mount Brown Conservation Park and Pichi Richi Pass. The bushwalk up to Devil's Peak is steep but reveals native vegetation, wildflowers, birds and fantastic panoramic views from the 670-metre summit. + + + +### Do it differently +Two- or four-day Pichi Richi camel safaris will have you looping out of Quorn through gorge country, encountering waterholes, wildlife and views with campfires, bush cooking and cold beers along the way. The Pichi Richi steam trains take you puffing through deep cuttings in the southern Flinders Ranges from Port Augusta to Quorn. Goldrush Ballooning offers a leisurely way to get aloft over Wilpena, with dawn views from the basket showing the land in a whole new light. The Outback Mail Run will have you playing postie for outlying cattle stations around William Creek. Contrast the desert with the rich waters of the Spencer Gulf on a cruise out of Port Augusta; dolphin encounters are pretty certain. + + + + +### The wow and how of Wilpena Pound +''Wow'' is the easy bit: Wilpena Pound is a 17-kilometre-wide, saucer-shaped piece of planet looming out of the red desert. The rim of the saucer is ragged, bulging and provocative, a thing you can circle and climb; from vantages such as St Mary's Peak (a daunting 1170 metres up), you can see into the smooth depression (strangely calm by contrast) and out to the magnificent ranges all around. Wilpena Pound Resort and Rawnsley Park are perfectly placed to help you properly explore the compelling landform; their guides also have the time and patience to explain the ''how'' in terms of its formation. + + + +### The cradle of life +Fossils from the Ediacaran period found near Nilpena station in the 1990s proved primitive life forms were evolving much earlier than thought and the clocks of science had to be reset by hundreds of million of years. Four-wheel-drive tours out of the Prairie Hotel, the sign-posted self-drive tour through Brachina Gorge and the good folk at Arkaroola go a long way to explaining the complexities of this geological treasure house. To extract some not-unrelated insights, take the fascinating BHP surface tour at Olympic Dam, the world's biggest uranium and copper mine. + + diff --git a/issues/broad-horizons/data/outback-tours/2.md b/issues/broad-horizons/data/outback-tours/2.md new file mode 100644 index 00000000..16183a96 --- /dev/null +++ b/issues/broad-horizons/data/outback-tours/2.md @@ -0,0 +1,50 @@ +--- + + title: Outback & Camping Shopping Guide + + images: + - url: assets/outback-tours/stocksy-108480.jpg + cover: true + + products: + - title: Harness Picnic Rug - Lake Blue + link: http://www.kathmandu.com.au/harness-picnic-rug-lake-blue-1.html + image_url: assets/outback-tours/83155_harness_picnicrug_755.jpg + description: Large picnic rug. Rolls down to fit into detachable harness with carry handle for easy transportation. + price: $39.99 AUD + + - title: Legionnaire Removable Neck Cover Cap v2 - Graphite + link: http://www.kathmandu.com.au/legionnaire-cap-v2-graphite-2.html + image_url: assets/outback-tours/12852_legionnaire_b_925.jpg + description: Unisex cap with removable neck cover for added sun protection. + price: $22.99 AUD + + - title: Dash 20L Lightweight Backpack v5 - Red/Graphite + link: http://www.kathmandu.com.au/dash-pack-v5-red-graphite.html + image_url: assets/outback-tours/40501_dashpack_v5_456.jpg + description: The 20L Dash Pack delivers super-light form and multiple day pack functions for your favourite activities. The streamlined, durable design is lightweight and top-loading for quick and easy access, so you can push the speed barrier without being weighed down. A removable back rest doubles as a seat. + price: $44.99 AUD + + - title: Nomadic Semi-Rectangular Insulated Sleeping Bag - Charcoal + link: http://www.kathmandu.com.au/nomadic-sleeping-bag-charcoal-2.html + image_url: assets/outback-tours/51200_nomadic_901.jpg + description: Summer campers and travellers to moderate climates who want a roomy fit and need to bag to be more compact. + price: $69.99 AUD + + - title: Hand Torch Grip 480 - Orange Black + link: http://www.kathmandu.com.au/hand-torch-grip-480-orange-black-1.html + image_url: assets/outback-tours/61487_handtorchgrip_480_321.jpg + description: Designed to deliver illumination in challenging conditions. + price: $71.99 AUD + + - title: Cabana 6 Person Tent - Aluminium/Dark Blue + link: http://www.kathmandu.com.au/cabana-6-tent-aluminium-dark-blue-1.html + image_url: assets/outback-tours/87139_cabana_c_sg10013_f82.jpg + description: You’ll want to spend the entire summer camping in the Cabana 6, our premium family camping tent. This waterproof, 6-person tent is a luxury hideaway on those long camping getaways. Its two rooms have spacious 360° standing room height and near vertical walls, offering an unsurpassed useable foot-print compared to other dome tents. A storable room divider adds even more spaciousness and privacy, taking the space from big to HUGE, and there’s plenty of integrated space for storage. + price: $699.99 AUD + + layout: + type: three-column + +--- + diff --git a/issues/broad-horizons/issue.yaml b/issues/broad-horizons/issue.yaml new file mode 100644 index 00000000..f5ea05ff --- /dev/null +++ b/issues/broad-horizons/issue.yaml @@ -0,0 +1,20 @@ +title: Broad Horizons +description: "The Flinders Range & Outback" + +magazine_handle: southaustralia +magazine_title: South Australia + +thumb_url: assets/background.jpg +cover_url: assets/background_large.jpg +icon_url: assets/icon.png + +assets: + - custom.css + - custom.js + +paths: + - index + - flinders-range + - outback-tours + - luxe-hotel + - getting-there diff --git a/issues/cookrepublic/assets/1-kitchen/cover.jpg b/issues/cookrepublic/assets/1-kitchen/cover.jpg new file mode 100644 index 00000000..cf753580 Binary files /dev/null and b/issues/cookrepublic/assets/1-kitchen/cover.jpg differ diff --git a/issues/cookrepublic/assets/1-kitchen/kitchen_before_after.jpg b/issues/cookrepublic/assets/1-kitchen/kitchen_before_after.jpg new file mode 100644 index 00000000..88d23c63 Binary files /dev/null and b/issues/cookrepublic/assets/1-kitchen/kitchen_before_after.jpg differ diff --git a/issues/cookrepublic/assets/1-kitchen/kitchen_before_after_1.jpg b/issues/cookrepublic/assets/1-kitchen/kitchen_before_after_1.jpg new file mode 100644 index 00000000..6855a03a Binary files /dev/null and b/issues/cookrepublic/assets/1-kitchen/kitchen_before_after_1.jpg differ diff --git a/issues/cookrepublic/assets/1-kitchen/living_room_before_after.jpg b/issues/cookrepublic/assets/1-kitchen/living_room_before_after.jpg new file mode 100644 index 00000000..72f35aee Binary files /dev/null and b/issues/cookrepublic/assets/1-kitchen/living_room_before_after.jpg differ diff --git a/issues/cookrepublic/assets/1-kitchen/makeover_21.jpg b/issues/cookrepublic/assets/1-kitchen/makeover_21.jpg new file mode 100644 index 00000000..821dde30 Binary files /dev/null and b/issues/cookrepublic/assets/1-kitchen/makeover_21.jpg differ diff --git a/issues/cookrepublic/assets/1-kitchen/pantry_before_after.jpg b/issues/cookrepublic/assets/1-kitchen/pantry_before_after.jpg new file mode 100644 index 00000000..3a9a3f73 Binary files /dev/null and b/issues/cookrepublic/assets/1-kitchen/pantry_before_after.jpg differ diff --git a/issues/cookrepublic/assets/1-kitchen/partition_before_after.jpg b/issues/cookrepublic/assets/1-kitchen/partition_before_after.jpg new file mode 100644 index 00000000..b1dd6752 Binary files /dev/null and b/issues/cookrepublic/assets/1-kitchen/partition_before_after.jpg differ diff --git a/issues/cookrepublic/assets/1-kitchen/sneh_kids_in_old_kitchen.jpg b/issues/cookrepublic/assets/1-kitchen/sneh_kids_in_old_kitchen.jpg new file mode 100644 index 00000000..f82f72eb Binary files /dev/null and b/issues/cookrepublic/assets/1-kitchen/sneh_kids_in_old_kitchen.jpg differ diff --git a/issues/cookrepublic/assets/1-kitchen/transformation.jpg b/issues/cookrepublic/assets/1-kitchen/transformation.jpg new file mode 100644 index 00000000..cbd4d14b Binary files /dev/null and b/issues/cookrepublic/assets/1-kitchen/transformation.jpg differ diff --git a/issues/cookrepublic/assets/2-confession/cover.jpg b/issues/cookrepublic/assets/2-confession/cover.jpg new file mode 100644 index 00000000..cfcbb50e Binary files /dev/null and b/issues/cookrepublic/assets/2-confession/cover.jpg differ diff --git a/issues/cookrepublic/assets/3-valentine-smoothie/couple.jpg b/issues/cookrepublic/assets/3-valentine-smoothie/couple.jpg new file mode 100644 index 00000000..0bbb9ff9 Binary files /dev/null and b/issues/cookrepublic/assets/3-valentine-smoothie/couple.jpg differ diff --git a/issues/cookrepublic/assets/3-valentine-smoothie/cover.jpg b/issues/cookrepublic/assets/3-valentine-smoothie/cover.jpg new file mode 100644 index 00000000..4164d056 Binary files /dev/null and b/issues/cookrepublic/assets/3-valentine-smoothie/cover.jpg differ diff --git a/issues/cookrepublic/assets/3-valentine-smoothie/smoothie.jpg b/issues/cookrepublic/assets/3-valentine-smoothie/smoothie.jpg new file mode 100644 index 00000000..3e28e625 Binary files /dev/null and b/issues/cookrepublic/assets/3-valentine-smoothie/smoothie.jpg differ diff --git a/issues/cookrepublic/assets/3-valentine-smoothie/smoothie_2.jpg b/issues/cookrepublic/assets/3-valentine-smoothie/smoothie_2.jpg new file mode 100644 index 00000000..5a20511f Binary files /dev/null and b/issues/cookrepublic/assets/3-valentine-smoothie/smoothie_2.jpg differ diff --git a/issues/cookrepublic/assets/3-valentine-smoothie/smoothie_3.jpg b/issues/cookrepublic/assets/3-valentine-smoothie/smoothie_3.jpg new file mode 100644 index 00000000..6c714781 Binary files /dev/null and b/issues/cookrepublic/assets/3-valentine-smoothie/smoothie_3.jpg differ diff --git a/issues/cookrepublic/assets/3-valentine-smoothie/smoothie_4.jpg b/issues/cookrepublic/assets/3-valentine-smoothie/smoothie_4.jpg new file mode 100644 index 00000000..103221d2 Binary files /dev/null and b/issues/cookrepublic/assets/3-valentine-smoothie/smoothie_4.jpg differ diff --git a/issues/cookrepublic/assets/4-smoothie-anatomy/cover.jpg b/issues/cookrepublic/assets/4-smoothie-anatomy/cover.jpg new file mode 100644 index 00000000..79ed681d Binary files /dev/null and b/issues/cookrepublic/assets/4-smoothie-anatomy/cover.jpg differ diff --git a/issues/cookrepublic/assets/4-smoothie-anatomy/ingredients.jpg b/issues/cookrepublic/assets/4-smoothie-anatomy/ingredients.jpg new file mode 100644 index 00000000..d14b9689 Binary files /dev/null and b/issues/cookrepublic/assets/4-smoothie-anatomy/ingredients.jpg differ diff --git a/issues/cookrepublic/assets/background.jpg b/issues/cookrepublic/assets/background.jpg new file mode 100644 index 00000000..43d37af1 Binary files /dev/null and b/issues/cookrepublic/assets/background.jpg differ diff --git a/issues/cookrepublic/assets/background_large.jpg b/issues/cookrepublic/assets/background_large.jpg new file mode 100644 index 00000000..43d37af1 Binary files /dev/null and b/issues/cookrepublic/assets/background_large.jpg differ diff --git a/issues/cookrepublic/assets/custom.scss b/issues/cookrepublic/assets/custom.scss new file mode 100644 index 00000000..cf0cbb04 --- /dev/null +++ b/issues/cookrepublic/assets/custom.scss @@ -0,0 +1,104 @@ +#cookrepublic-issue { + + [data-page="toc"] { + .menu li .story { + text-decoration: initial; + text-transform: initial; + } + } + + /* + Polaroid + */ + + ul.polaroids { + margin: 0; + padding: 0; + } + + .polaroid-wrap { + list-style: none; + display: inline-block; + max-width: 48%; + } + + figure.polaroid { + display: inline; + float: left; + margin: 0; + max-width: 80%; + max-height: 300px; + width: auto; + color: #333; + text-align: center; + text-decoration: none; + + font-size: 18px; + font-family: "Marker Felt", sans-serif; + + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; + + -webkit-transform: rotate(-2deg); + -moz-transform: rotate(-2deg); + transform: rotate(-2deg); + + -webkit-backface-visibility: hidden; + -webkit-perspective: 1000; + } + + figure.polaroid figcaption { + text-align: center; + text-decoration: none; + } + + figure.polaroid img { + padding: 6px; + width: 100%; + background: #fff; + box-shadow: 0 3px 6px rgba(0,0,0,.25); + vertical-align: middle; + } + + .polaroid-wrap:nth-child(even) figure { + -webkit-transform: rotate(3deg); + -moz-transform: rotate(3deg); + transform: rotate(3deg); + } + + @media only screen and (min-width: 768px) { + figure.polaroid { + margin: 0 0% -5% 5%; + padding-left: 20px; + max-width: 24%; + max-height: 25vw; + } + + figure.polaroid img { + padding: 15px 15px 20px; + } + + .polaroid-wrap { + display: inline; + max-width: initial; + } + + .polaroid-wrap:nth-child(3n+1) { + clear: both; + } + + .polaroid-wrap:nth-child(4) figure { + clear: left; + } + } + + .polaroid-wrap:hover figure { + position: relative; + z-index: 5; + + -webkit-transform: scale(1.5); + -moz-transform: scale(1.5); + transform: scale(1.5); + } +} diff --git a/issues/cookrepublic/assets/end/award.jpg b/issues/cookrepublic/assets/end/award.jpg new file mode 100644 index 00000000..3099cd0a Binary files /dev/null and b/issues/cookrepublic/assets/end/award.jpg differ diff --git a/issues/cookrepublic/assets/end/cooking.jpg b/issues/cookrepublic/assets/end/cooking.jpg new file mode 100644 index 00000000..8de2d119 Binary files /dev/null and b/issues/cookrepublic/assets/end/cooking.jpg differ diff --git a/issues/cookrepublic/assets/end/cookrepublic.jpg b/issues/cookrepublic/assets/end/cookrepublic.jpg new file mode 100644 index 00000000..3a4c0b92 Binary files /dev/null and b/issues/cookrepublic/assets/end/cookrepublic.jpg differ diff --git a/issues/cookrepublic/assets/end/kid_biting_giant_cookie.jpg b/issues/cookrepublic/assets/end/kid_biting_giant_cookie.jpg new file mode 100644 index 00000000..36c0d992 Binary files /dev/null and b/issues/cookrepublic/assets/end/kid_biting_giant_cookie.jpg differ diff --git a/issues/cookrepublic/assets/end/kid_making_burger.jpg b/issues/cookrepublic/assets/end/kid_making_burger.jpg new file mode 100644 index 00000000..51c70d56 Binary files /dev/null and b/issues/cookrepublic/assets/end/kid_making_burger.jpg differ diff --git a/issues/cookrepublic/assets/end/kid_making_smoothie.jpg b/issues/cookrepublic/assets/end/kid_making_smoothie.jpg new file mode 100644 index 00000000..43496eaa Binary files /dev/null and b/issues/cookrepublic/assets/end/kid_making_smoothie.jpg differ diff --git a/issues/cookrepublic/assets/end/kitchen.jpg b/issues/cookrepublic/assets/end/kitchen.jpg new file mode 100644 index 00000000..29893ba6 Binary files /dev/null and b/issues/cookrepublic/assets/end/kitchen.jpg differ diff --git a/issues/cookrepublic/assets/end/kitchen_corner.jpg b/issues/cookrepublic/assets/end/kitchen_corner.jpg new file mode 100644 index 00000000..b4d077f6 Binary files /dev/null and b/issues/cookrepublic/assets/end/kitchen_corner.jpg differ diff --git a/issues/cookrepublic/assets/end/man_cutting_girder.jpg b/issues/cookrepublic/assets/end/man_cutting_girder.jpg new file mode 100644 index 00000000..e312c0df Binary files /dev/null and b/issues/cookrepublic/assets/end/man_cutting_girder.jpg differ diff --git a/issues/cookrepublic/assets/end/pantry.jpg b/issues/cookrepublic/assets/end/pantry.jpg new file mode 100644 index 00000000..37130b24 Binary files /dev/null and b/issues/cookrepublic/assets/end/pantry.jpg differ diff --git a/issues/cookrepublic/assets/shopping/cover.jpg b/issues/cookrepublic/assets/shopping/cover.jpg new file mode 100644 index 00000000..4f80efc1 Binary files /dev/null and b/issues/cookrepublic/assets/shopping/cover.jpg differ diff --git a/issues/cookrepublic/assets/shopping/cover_1.jpg b/issues/cookrepublic/assets/shopping/cover_1.jpg new file mode 100644 index 00000000..85087967 Binary files /dev/null and b/issues/cookrepublic/assets/shopping/cover_1.jpg differ diff --git a/issues/cookrepublic/data/end.md b/issues/cookrepublic/data/end.md new file mode 100644 index 00000000..a218e7e3 --- /dev/null +++ b/issues/cookrepublic/data/end.md @@ -0,0 +1,41 @@ +--- + + category: SHARE YOUR STORY + title: "#cookrepublic" + + cover_url: assets/end/pantry.jpg + thumb_url: assets/end/pantry.jpg + + images: + - url: assets/end/pantry.jpg + - url: assets/end/award.jpg + - url: assets/end/kid_biting_giant_cookie.jpg + - url: assets/end/kid_making_burger.jpg + - url: assets/end/cookrepublic.jpg + - url: assets/end/kitchen.jpg + - url: assets/end/cooking.jpg + - url: assets/end/kid_making_smoothie.jpg + - url: assets/end/man_cutting_girder.jpg + + layout: + type: custom +--- + +
+
+

#cookrepublic

+
+ +
    + {{#images}} + {{^layout}} +
  • +
    + {{ title }} +
    {{ caption }}
    +
    +
  • + {{/layout}} + {{/images}} +
+
diff --git a/issues/cookrepublic/data/shopping.md b/issues/cookrepublic/data/shopping.md new file mode 100644 index 00000000..d302b2e2 --- /dev/null +++ b/issues/cookrepublic/data/shopping.md @@ -0,0 +1,21 @@ +--- + + title: Tasty Express + category: Cookbook + author_name: Sneh Roy + + cover_url: assets/shopping/cover.jpg + thumb_url: assets/shopping/cover.jpg + + layout: + type: two-column + content_valign: middle + image_style: fit + image_align: right + +--- + +Tasty Express, the first cookbook by Sneh Roy published by Random House, Australia releases on April 1, 2014. With over 100 recipes, stunning photographs and heaps of tips, tricks, stories and step-by-steps; this cookbook will become an essential part of your everyday cooking. Easy-to-make and easy-to-take mainly vegetarian recipes will become your lunchbox and weeknight staples. + +Buy +$19.79 diff --git a/issues/cookrepublic/data/story-four.md b/issues/cookrepublic/data/story-four.md new file mode 100644 index 00000000..224840ad --- /dev/null +++ b/issues/cookrepublic/data/story-four.md @@ -0,0 +1,48 @@ +--- + + category: Guide + title: The Anatomy Of A Smoothie + author_name: Sneh Roy + + cover_url: assets/4-smoothie-anatomy/cover.jpg + thumb_url: assets/4-smoothie-anatomy/cover.jpg + + layout: + type: two-column + image_style: fit + content_align: right + content_height: full + +--- + +1. Main And Supporting Fruit Or Vegetable – Choose 2 or 3 from this group +mango, banana, spinach, blueberries, raspberries, avocado, pineapple, orange, kale, celery, cooked pumpkin, cooked sweet potato, apple, pear, peach, beetroot, grapes. + +2. Fibre And Bulking Ingredients – Choose 1 or 2 from this group +instant oats, desiccated coconut, pecan nuts, pistachios, almonds, macadamia nuts, nut butters, coconut oil, cottage cheese, ricotta cheese, silken tofu. + +3. Thinners – Choose 1 or occasionally 2 from this group +cow milk, soy milk, almond milk, rice milk, quinoa milk, coconut milk, coconut water, buttermilk, yoghurt. + +4. Health And Wellness Extras – Choose 1 or 2 from this group +chia seeds, green tea powder (matcha), maca powder, protein powder, raw cacao powder, cacao nibs, turmeric, cayenne pepper, fresh ginger or ginger powder, acai berry powder, probiotic powder. + +5. Flavour Ingredients – Choose 1 from this group +cocoa powder, cinnamon, nutmeg, cardamom, chai spice powder, pumpkin spice powder, lemon juice, lime juice, herbs. + +6. Sweeteners (optional) +rice malt syrup, maple syrup, dates, dried figs, honey, vanilla extract. + +7. Toppers (optional) +chia seeds, sunflower kernels, pumpkin seeds, desiccated coconut, goji berries, cacao nibs, nuts. + +## Notes + +As a rule of thumb, add no more than 8 to 9 ingredients in order to draw the maximum flavour of one star ingredient in the recipe. +Use frozen fruit. Once a week, prepare smoothie packs of chopped fruit in ziplock bags. Freeze. +Use ice cubes if you don’t have frozen fruit. +Sneak in healthy ingredients you would never dare to eat on their own. Avocado? Kale? Seriously overripe banana? +Do have a mid morning "real" breakfast of eggs maybe? Protein is vital. + + +You can add as many ingredients as you want. Once you start experimenting, you will figure out which flavours compliment each other well. And remember to have fun! Before you know it, your body will crave the goodness of all these beautiful ingredients even before breakfast. diff --git a/issues/cookrepublic/data/story-four/1.md b/issues/cookrepublic/data/story-four/1.md new file mode 100644 index 00000000..2a1bd905 --- /dev/null +++ b/issues/cookrepublic/data/story-four/1.md @@ -0,0 +1,10 @@ +--- + + author_name: Sneh Roy + cover_url: assets/4-smoothie-anatomy/ingredients.jpg + + layout: + image_style: background + +--- + diff --git a/issues/cookrepublic/data/story-one.md b/issues/cookrepublic/data/story-one.md new file mode 100644 index 00000000..b08d9c9d --- /dev/null +++ b/issues/cookrepublic/data/story-one.md @@ -0,0 +1,17 @@ +--- + + title: Welcome to our new Kitchen + category: Design + author_name: Sneh Roy + + cover_url: assets/1-kitchen/cover.jpg + thumb_url: assets/1-kitchen/cover.jpg + + layout: + type: one-column + image_style: background + content_style: black + content_align: center + content_valign: middle + +--- diff --git a/issues/cookrepublic/data/story-one/1.md b/issues/cookrepublic/data/story-one/1.md new file mode 100644 index 00000000..5d26870b --- /dev/null +++ b/issues/cookrepublic/data/story-one/1.md @@ -0,0 +1,17 @@ +--- + + title: Background + + cover_url: assets/1-kitchen/makeover_21.jpg + + layout: + type: three-column + image_style: cover + +--- + + For 8 years, I worked day and night on a single steel bench overflowing with kitchen paraphernalia, food, portable cooktop and very little working space. The barely functioning kitchen housed an old oven, a leaking sink, sunken and peeling countertops and basically served as a large mustard storage space. And I had fun with those limited resources testing recipes for my blog, writing a cookbook and developing new flavours for clients. Because I knew someday we would save enough to change it all. Then I won a $30,000 kitchen makeover by the Good Guys at Kidspot’s Voices Of 2013 event in November last year. And everything changed! + +With an amount so generous, we decided to fast track our renovations and so began what would become a six-month-and-ongoing exercise to create a beautiful space for our family and for my work. Our old kitchen was in the centre of the house with extensions to the house radiating off it. I wanted the kitchen to be close to windows and the outer wall of the house. Our home is close to 60 years old and had dark wood panelling on the walls, a patchwork of rose hued carpet, slate tiles and parquetry flooring flowing throughout. We also had all these walls and openings creating unnecessary nooks and stealing all the light and usable space. Knocking down walls and making it open plan was one of the first things our builder did. We wanted to retain all that gorgeous light in our family room (that I used as my kitchen/study/studio). So we made one of the best decisions we have which was to build a low lying kitchen with massive counters/island and not have any cupboards or storage overhead. Which meant, we could have beautiful long windows running along the length of the 6 meter long counter. + +Our old space had metal and glass doors, reminiscent of the French industrial era; the kind you would find in an old factory or warehouse. We wanted to carry that look through our renovation. We spent hours configuring the most perfect set of windows with bold black bars that were dynamic and changed the look just by sliding and creating an entirely new configuration. We pulled up our old timber floor boards and lay down wide oak planks with gorgeous wood knots and grain detailing. diff --git a/issues/cookrepublic/data/story-one/2.md b/issues/cookrepublic/data/story-one/2.md new file mode 100644 index 00000000..a2b27931 --- /dev/null +++ b/issues/cookrepublic/data/story-one/2.md @@ -0,0 +1,50 @@ +--- + + title: The Transformation + + images: + - url: assets/1-kitchen/transformation.jpg + caption: Nick painting late into the night + + - url: assets/1-kitchen/sneh_kids_in_old_kitchen.jpg + caption: kids in the kitchen + + layout: + content_overflow: paginate + +--- + +We reclaimed some of the space from the new kitchen zone and built a new bedroom for Rish. Some of the space went into an ample walk in pantry hidden behind a chalkboard/magnetic wall. Our laundry was moved into a compact cupboard with bifold doors within the living area. The old fireplace was half sealed and lifted to a sexy rectangular reveal high in the wall. The idea was to have a portable biofuel burner during the colder months and a display of indoor potted plants during summer. The kitchen was built to enable small groups of 6-8 to cook together. I retained the same old corner I have always used for my photography. Nothing fancy. I have realised a good window and enough space for a small table is all you need for smashing photos. The sink is a huge professional sink with a pull out tap mixer that also has a spray. I love the black tap by Oliveri. Just love it! Although my photography style is often dark and moody, I knew I wanted a bright light filled space for my kitchen and a nod to marble. So we chose to go with Lagoon by Silestone that mimics a soft marble facade for our bench top. The 6 meter long counters have a matching window sill in the same marble effect stone. It is super handy for herb pots, flower vases, sprouting jars and other kitchen experiments. + +My pantry storage was plastic and over 13 years old from my Singapore days so I decided to go all glass with the amazing Fido flip top jars. We chose induction mainly for the kids, for its aesthetic appeal and ease of cleaning. The Indian signage of an actual vintage truck banner was a surprise Temple & Webster find. I refreshed our old wooden chairs with some black paint and created this bold yet cosy dining corner with a hand loomed rug from India and industrial pendant to bring it together with my old reclaimed wood round table. + + + +The library unit was a clever solution from IKEA where we bought a few different sizes and piled them to get floor to ceiling storage for my books. The stunning industrial fan light was Nick’s find and was one of the first things we bought prior to demolition. After weeks of poring over industrial stools online (because it is just so hard to find them in the shops) and being completely uninspired by the round corkscrew stools that everyone seems to be going for, I found the gorgeous square Dakota stools. With a metal frame that matched our windows and a soft suede cushion, these were meant to be. They are counter stools. Not bar stools. Because they match the counter height which is always lower than a bar. The beautiful and lush house plant was a dream of mine for years (see my plant obsessed Pinterest board) and we found just the right thing last week at our local nursery. It is a heart-shaped philodendron that makes that nook look like an amazonian rainforest. It is on NASA’s list of top 15 plants that can save your life and plants that are impossible to kill. I hope I don’t. + +We began our process in early February with several visits to the Good Guys showrooms in Chatswood and Castle Hill. We looked at their kitchen display and brought back samples of Silestone benchtops. The Good Guys organised for a designer to visit us at home and create the kitchen we were after. Blake spent an entire day discussing our needs and bringing our design to life on screen. Because the Good Guys were sponsoring The Block and because I was a prize winner, there were a few hiccups in initially getting the whole process rolling but once all the different companies got involved (Kitchen/Appliances/Benchtop), things started happening. The girls at The Good Guys were amazing throughout the process, super helpful and always there to assure me that things were on track (thank you Leiana, Monica, Lisa!). Holly and Blake from the kitchen group worked tirelessly to get the design and kitchen contract running smoothly. Anjana from The Good Guys Castle Hill showroom was a champ when it came to appliance pricing and Michael Pap our installer got it done without a hitch. Darren Brooks put the spotlight on all the right bits (quite literally with his fancy electrical work!). But this amazing space came to life with the tireless efforts and vision of Craig Becchio, the most intuitive and resourceful builder there was. + +The kitchen cost us a total of $62,000. The $30,000 that I won courtesy of The Good Guys went towards design consultation, Silestone benchtops for the counter/island/laundry, kitchen cabinets and laundry under bench cabinet, tile splash back, kitchen sink and tap, induction cooktop and built in oven. Then we spent approximately $32,000 on the remaining appliances, building and structural work, flooring, plumbing, electrical, light fixtures, furniture, pots and pans, pantry, paint and decor. We spent an additional amount on the rest of the living areas, the additional bedroom and are continuing our renovations with new carpets for the internal rooms, an open deck in our backyard, more painting and restructuring. + +Our end of the renovations began in mid March when we moved into the garage and started glamping. For a while we had no ceiling and big gaps in the floor, we discovered possums remains in our sealed fireplace and resorted to doing dishes in tubs using the garden tap. We had no heating, no hot running water for the makeshift kitchen and no laundry but we survived. Like squatters, we jumped in and reclaimed any small area of the house that was habitable. We played hide and seek in the new fireplace, we spread out our lego sets amidst nails and air compressors, we floorboarded (quite a fun sport!), we cursed as we painted into the night, we cursed even more when after nearly 10 litres of paint we realised that the white we chose actually looked a tiny shade of purple and had to redo all of it in a more vivid shade of white. + +But we made memories and we braved the cold and we celebrated milestones in our garage. Rivs celebrated his 10th, Nick revelled in being 37 and I cooked food for my book launch and television appearance. It was all worth the wait. We have already stamped the new space with our messy ways and I have to still bake my first cake in the new oven (the boys baked one!), but I am taking it slow and savouring every little bit as it comes. I love how the light changes the look and feel of everything during different times of the day. The kitchen is easily my most favourite part of the house now and it is a dream in the making that surpassed all my wildest expectations. A dream that wouldn’t have been if not for everyone involved and the jumpstart and opportunity that Kidspot and The Good Guys chose to give me! Thank You from the bottom of my heart!! Much love!! x + + + +## POINTS TO NOTE + +- We debated about having a double sink or a single sink with a drainer. We chose to go with a single large sink with a drainer because we felt it was more usable. The sink is 45 litres (as big as a laundry trough) and swallows huge amounts of dishes. It is large enough to section off parts of it for food prep (thawing/washing) etc. +- We put a huge pull out drawers on either side of the oven. One for all the spoons/gadgets/peelers and the other for spices. All the prep utensils are under the spice drawers and all the most used plates and bowls are under the gadget drawer and next to the dishwasher for fast loading/unloading. +- We decided to keep the island free of any surface disturbance (no sinks/cooktops) to maximise prep and eating space. The island is 2.8 meters by 1.2 meters. The extra depth means storage on both sides of the island. Deeper cupboards on one side, slightly narrow cupboards behind the stools for less used crockery, linen and appliances. +- We got a cheap kitchen island from IKEA and converted that into a beverage station to house our coffee machine, blender, juicer and toaster – 4 of the most used items in the kitchen that needed to sit on the bench without crowding the counters. The bottom shelf is great for heaps of chopping and serving boards. +- The only overhead cupboard is above the fridge which houses kitchen tissue, hand held vaccuum, lunch boxes and drink bottles. +- We have got heaps of portable tiered wire shelves from Howards Storage World to use inside the cupboards to increase storage. +- We have also lined all drawers and cupboards with non slip liners from IKEA. +- A non-slip rubber backed mat from IKEA protects the wooden floor near the sink and dishwasher. I have also bought eco-mats from ALDI for protecting the floor in many other areas. +- The cornice seen in the living areas is called "Alto". The timber beams in the kitchen are the original ceiling painted in white. +- The pantry was constructed by our builder using strong and thick plywood. I coated it in polyurethane to enable quick cleaning. It cost us a third of what it would’ve cost to get it built by the kitchen guys. +- The kitchen cabinetry is called "Essendon" and the colour is "Alabaster". It is amazingly easy to wipe and is German made. +- We have a powerpoint on the side of the island. It is brilliant for juicing when the juicer, bowls full of fruit and chopping boards need to have a lot of room. It is also great to quickly connect extra appliances on the island for prepping. +- The bifold doors in the laundry were bought from HUME Doors. They were painted white to blend into the room. +- The laundry tub is also by Oliveri. The tap in the laundry is from IKEA. diff --git a/issues/cookrepublic/data/story-one/3.md b/issues/cookrepublic/data/story-one/3.md new file mode 100644 index 00000000..74461220 --- /dev/null +++ b/issues/cookrepublic/data/story-one/3.md @@ -0,0 +1,15 @@ +--- + + cover_url: assets/1-kitchen/pantry_before_after.jpg + + images: + - url: assets/1-kitchen/partition_before_after.jpg + + layout: + style: two-column + image_style: fit + content_valign: middle + +--- + + diff --git a/issues/cookrepublic/data/story-one/4.md b/issues/cookrepublic/data/story-one/4.md new file mode 100644 index 00000000..fdbd70ab --- /dev/null +++ b/issues/cookrepublic/data/story-one/4.md @@ -0,0 +1,14 @@ +--- + + cover_url: assets/1-kitchen/living_room_before_after.jpg + + images: + - url: assets/1-kitchen/kitchen_before_after_1.jpg + + layout: + image_style: fit + content_valign: middle + +--- + + diff --git a/issues/cookrepublic/data/story-three.md b/issues/cookrepublic/data/story-three.md new file mode 100644 index 00000000..23c592ab --- /dev/null +++ b/issues/cookrepublic/data/story-three.md @@ -0,0 +1,16 @@ +--- + + category: Recipe + author_name: Sneh Roy + title: The Valentine Smoothie + + cover_url: assets/3-valentine-smoothie/cover.jpg + thumb_url: assets/3-valentine-smoothie/cover.jpg + + layout: + type: three-column + content_valign: middle + +--- + +I have an addiction. I feed it at eight o’clock every morning. Long before I feed it, I am thinking about it. Wondering how it will make me feel. Today, I fed it as usual. diff --git a/issues/cookrepublic/data/story-three/1.md b/issues/cookrepublic/data/story-three/1.md new file mode 100644 index 00000000..dc258982 --- /dev/null +++ b/issues/cookrepublic/data/story-three/1.md @@ -0,0 +1,21 @@ +--- + + cover_url: assets/3-valentine-smoothie/smoothie_2.jpg + + layout: + type: three-column + image_align: right + +--- + +## My addiction. + +It made me feel voracious and larger than life. It felt indulgent and smooth and dark and sweet and consuming. When I was done, I felt satisfied and nourished. Like being bear hugged from behind and being swept off my feet (by him!). It felt almost that good. + +## The smoothie. + +Every single day. Before breakfast. + +For a while now since I got my Vitamix, I have been creating smoothies. What started out as a couple of times every week, has now become my daily ritual. My addiction. It grew when I realised that I could go to town and get really creative with the smoothies. After the initial excitement of tossing random things in the jug of the blender and figuring out that they tasted great no matter what, I started getting serious with my daily concoctions. + +I consume very little sugar. Six years ago I cut back copious amounts of sugar from my diet, switched to more natural and wholefoods and started running. I eventually lost 22 kilos in the space of two years and have managed to keep it off. I do not take sugar in my tea, coffee or cereal. I rarely ever have dessert (I am a savoury girl!). So I make an exception in my smoothies. With a fruit and vegetable base, my smoothies will often have mango or banana which provides me with the sugar my body craves to charge through the morning. Spinach, celery, raspberries, blueberries, orange or pineapple will provide the supporting act to the star fruit. Oats are a constant fixture. As are nuts. I skip conventional dairy and opt for soy milk, almond milk and coconut water to thin the smoothies. Ginger and turmeric have been immensely valuable in my quest to heal the body from within. The fancy (and expensive) additives often include Maca powder, Acai berry powder, cacao nibs, matcha, wheatgrass powder, probiotic powder and protein powder. I ought to have a mobile smoothie lab with little glass containers filled with everything from exotic to mundane. I can picture myself rolling up my hypothetical sleeves and dropping in a spoonful of this and a drop of that like a modern day smoothie witch. diff --git a/issues/cookrepublic/data/story-three/2.md b/issues/cookrepublic/data/story-three/2.md new file mode 100644 index 00000000..a5d6e46e --- /dev/null +++ b/issues/cookrepublic/data/story-three/2.md @@ -0,0 +1,65 @@ +--- + + cover_url: assets/3-valentine-smoothie/smoothie_4.jpg + + images: + - url: assets/3-valentine-smoothie/smoothie.jpg + + layout: + type: two-column + image_align: right + +--- + +Today’s smoothie is an ode to today. Valentine’s Day. Not the day that guilts you into buying overpriced flowers and boxes of chocolates. But a day dedicated to the single greatest thing that makes this world go around (besides physics!) – love. If you want to know where Valentine’s Day originated and it’s symbolism, go read the Wiki. For me, it is just another day with a few add-ons and flourishes. A day to hug your loved ones just a bit more tighter and longer. A day to look at love with fresh eyes (did you notice that the raspberry looks like a heart?). A day to step outside the ordinary, take a page off Ashley Rodriguez’s brilliant concept and go on a date with my husband – at home. Today, we are celebrating our 19th Valentine’s Day together. And I made him a special aphrodisiac laced smoothie that has one of his favourite words in it. Cacao. It cracks him up. Every single time. His amusement makes me smile. Every single time I hear him parrot it like a macaw. + +Sometimes it feels like only yesterday that we met, all fresh faced and giddy in love. And then on other days when I wake up next to him every morning and he has hit the snooze button for the second time, I lie there and look at his peaceful face; wakefulness still evading him. I look at the lines on his face and an entire lifetime flashes through my head. In that instant, I realise that I just can’t remember the time before I met him. Over almost two decades, I have loved him and have grown into the person I am because of him and his love. I am thankful for it. So today, I wish you all love. Because there is someone or something to love. There is life. It is precious. Never stop looking at it with fresh eyes! + +
+ +

THE VALENTINE SMOOTHIE

+ View recipe +
+
+
+

The Valentine Smoothie

+

+ +

+

Ingredients

+
    +
  • 2 cups chilled soy milk
  • +
  • 1 cup frozen raspberries
  • +
  • 2 small fresh figs
  • +
  • 1/2 cup cashew nuts
  • +
  • 2 tablespoons raw cacao powder
  • +
  • 1 teaspoon maca powder
  • +
  • 1/2 teaspoon sweet paprika
  • +
  • 1 tablespoon maple syrup
  • +
  • fresh raspberries, to serve (optional)
  • +
+

Method

+

Blend all ingredients in a blender until smooth. Serve topped with a sprinkling of cacao powder and fresh raspberries

+

More Smoothies Recipes

+ +
+ +
diff --git a/issues/cookrepublic/data/story-three/3.md b/issues/cookrepublic/data/story-three/3.md new file mode 100644 index 00000000..34fd95b0 --- /dev/null +++ b/issues/cookrepublic/data/story-three/3.md @@ -0,0 +1,10 @@ +--- + + cover_url: assets/3-valentine-smoothie/couple.jpg + + layout: + type: one-column + image_style: background + +--- + diff --git a/issues/cookrepublic/data/story-two.md b/issues/cookrepublic/data/story-two.md new file mode 100644 index 00000000..7430555d --- /dev/null +++ b/issues/cookrepublic/data/story-two.md @@ -0,0 +1,56 @@ +--- + + title: Foodie Confessions + author_name: Sneh Roy + + cover_url: assets/2-confession/cover.jpg + thumb_url: assets/2-confession/cover.jpg + + layout: + type: two-column + image_style: fit + +--- + +What is your quirky foodie trait?? + +1. I cannot peel a boiled egg without giving it cellulite. +1. I have panic attacks before icing a cake for a special occasion. +1. I cannot sleep if I fail at a recipe, making batch after batch till I get it right. My kitchen looks like a catering house for a party of 60 when that happens. +1. I need therapy for my cookbook addiction. I think I buy more cookbooks every month than I cook from (Yes, I am blaming marketing departments of those darned publishing houses). +1. In my next life, I would like to be a pastry chef. +1. I might be single handedly responsible for the zillion page hits bookdepository.com gets everyday after I indulge myself virtual window shopping for cookbooks. Mind you, I am just looking and wishlisting *cough cough*! +1. Every now and then I will completely obsess about some particular food. A few years ago it was cupcakes followed by Agedashi Tofu followed by Okonomiyaki followed by soft centered eggs. When that happens, I NEED to have it every other day. Then I start making it every chance I get. This madness usually lasts for a couple of weeks. My current obsession is Cendol! +1. When the urge to cook something hits, I first head to my windows and visually measure the amount of light streaking in. If it is dark and blustery, I let my whim to cook pass because I know I won’t be able to get good shots of the food I cook. Well hello ISO and M mode! I am no longer a slave to the light outside the window! +1. When I watch movies or television shows, I am sub consciously scoping out surfaces, kitchen props and food on display. +1. Whenever we go out to dine, Nick sits with an exasperated expression on his face, his stomach rumbling louder with each passing minute as I try to get a decent shot of the food that has arrived at our table. I only feel guilty sometimes. +1. I grow a cartload of herb varieties in my backyard so I can have a fresh garnish for that perfect food shot. +1. I once licked my finger and dabbed it on the lens to clean a smudge. ON THE LENS!!! SPIT!!! +1. As days go by, obsessing about food, food and more food; I find myself becoming something of a food snob. Why buy a birthday cake when I can bake my own! Cookies from the supermarket? Blasphemy!! I need to bake my own gourmet cookies every week. +1. I have taken up thrifting for unusual food photography props. As I head into a thrift store or op shop, I can feel the blood pounding in my veins and my heart hammering away in my chest. The thrill of scoring a rare vintage English floral plate or a hallmarked ornate silver spoon is tremedously palpable. Who needs to bungee jump after that kind of excitement? +1. I need to build a separate room to store my kitchen and photography props, cookbooks and cooking magazines. +1. I need to tweet about every single thing I am eating. The burning need to share with the world that I am having a piece of toast is ridiculously compulsive. +1. I use Foursquare and Urbanspoon to log my food shenanigans and scope out new places to eat. +1. I am constantly pinning kitchen, food, props and photography on Pinterest. +1. I can probably count more celebrity chefs on my fingers than Hollywood celebrities. +1. I roll sushi at 10 o’clock in the night so it is fresh for an early morning snack. +1. I have truffle oil, rose petals, squid ink linguini, chocolate spaghetti, 3 different kinds of quinoa, chia seeds, dried porcini mushroom, 3 different kinds of salt flakes, every possible variety of beans, nuts and lentils in my pantry for a cooking emergency. +1. I have close to 1000 cookbooks and cooking magazines overflowing from my shelves. Even then when the urge to cook strikes, I head to the computer and google the recipe. +1. I go to bed thinking of food. I wake up thinking of food. +1. The crusty sound that comes from breaking a freshly baked baguette is pure music. The bread scene in Ratatouille is the best ever! +1. Vintage, retro and quirky food packaging gets my knickers twisted in a knot. I love bespoke labels, rustic crates and paper bags printed with gorgeous typography. +1. Fete food is the best. Don’t tell me otherwise! +1. I love playing Cooking Dash and have mastered all versions at all levels of difficulty. Flo rules! +1. I wish Butterbeer was real and widely sold throughout the world! +1. I have not eaten rabbit, kangaroo, crocodile and venison. I have no intention of doing so. +1. I think Food Porn needs to be a legally and globally accepted term. +1. My first attempt at making macarons was also my last. They looked like whoopie pies who needed to get to the gym. +1. Shaking Jamie Oliver’s hand would be akin to being in the same room as Dalai Lama. +1. I have peelers and cutters for everything under the sun. Mango, corn, avocado, strawberry, banana, pineapple … you name it. Do I use them? No. That is where my trusty knife comes in. +1. At a 2 hatted restaurant for an extraordinary degustation lunch, the thing that I was most looking forward to was their bread and churned butter. I dreamt about it for days and stared at pictures of it longingly on other blogs that had reviewed the restaurant. +1. I would love to possess knife skills of a fruit ninja. But I am scared to learn. So instead I practice on Fruit Ninja – the APP! +1. When cutting chicken, I freak out if the head is till on. Sometimes I freak out more, if the head is unattached. So chicken cutting is left to Nick. +1. Some of the most adventurous things I have eaten have to be tortoise eggs and frog legs. +1. For all the food influence and thoughts that mark my everyday, I don’t eat very much. I love to feed. + +So tell me guys, what is your quirky foodie/food-blogger trait?? Come on confess up!! diff --git a/issues/cookrepublic/data/toc.md b/issues/cookrepublic/data/toc.md new file mode 100644 index 00000000..2cb7e33a --- /dev/null +++ b/issues/cookrepublic/data/toc.md @@ -0,0 +1,19 @@ +--- + + title: Your story begins here + + cover_url: assets/4-smoothie-anatomy/ingredients.jpg + thumb_url: assets/4-smoothie-anatomy/ingredients.jpg + + layout: + type: toc + content_overflow: scroll + +--- + +Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. + +

+ Editor

+ Sneh Roy +

diff --git a/issues/cookrepublic/issue.yaml b/issues/cookrepublic/issue.yaml new file mode 100644 index 00000000..ae6f10e1 --- /dev/null +++ b/issues/cookrepublic/issue.yaml @@ -0,0 +1,21 @@ +title: Cookrepublic + +magazine_handle: cookrepublic +magazine_title: Cookrepublic + +theme: fashion +thumb_url: "assets/background.jpg" +cover_url: "assets/background_large.jpg" + +assets: + - "custom.css" + +paths: + - index + - toc + - story-one + - story-two + - story-three + - story-four + - shopping + - end diff --git a/issues/cool-kids/assets/icon.png b/issues/cool-kids/assets/icon.png new file mode 100644 index 00000000..f6ca021a Binary files /dev/null and b/issues/cool-kids/assets/icon.png differ diff --git a/issues/cool-kids/assets/preview.jpg b/issues/cool-kids/assets/preview.jpg new file mode 100644 index 00000000..bd7ea354 Binary files /dev/null and b/issues/cool-kids/assets/preview.jpg differ diff --git a/issues/demo/assets/Sweet-Chargrilled-Peaches-Sourdough.jpg b/issues/demo/assets/Sweet-Chargrilled-Peaches-Sourdough.jpg new file mode 100644 index 00000000..6b744bee Binary files /dev/null and b/issues/demo/assets/Sweet-Chargrilled-Peaches-Sourdough.jpg differ diff --git a/issues/demo/assets/appstore-ad.jpg b/issues/demo/assets/appstore-ad.jpg new file mode 100644 index 00000000..4d9476be Binary files /dev/null and b/issues/demo/assets/appstore-ad.jpg differ diff --git a/issues/demo/assets/appstore_download.svg b/issues/demo/assets/appstore_download.svg new file mode 100644 index 00000000..ad9cff93 --- /dev/null +++ b/issues/demo/assets/appstore_download.svg @@ -0,0 +1,118 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/issues/demo/assets/background.jpg b/issues/demo/assets/background.jpg new file mode 100644 index 00000000..9b37a69f Binary files /dev/null and b/issues/demo/assets/background.jpg differ diff --git a/issues/demo/assets/background_large.jpg b/issues/demo/assets/background_large.jpg new file mode 100644 index 00000000..387bc894 Binary files /dev/null and b/issues/demo/assets/background_large.jpg differ diff --git a/issues/demo/assets/badge_itunes.svg b/issues/demo/assets/badge_itunes.svg new file mode 100644 index 00000000..518eeb14 --- /dev/null +++ b/issues/demo/assets/badge_itunes.svg @@ -0,0 +1,93 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/issues/demo/assets/blueberry-cake-bg.png b/issues/demo/assets/blueberry-cake-bg.png new file mode 100644 index 00000000..36167118 Binary files /dev/null and b/issues/demo/assets/blueberry-cake-bg.png differ diff --git a/issues/demo/assets/blueberry.jpg b/issues/demo/assets/blueberry.jpg new file mode 100644 index 00000000..14b9386f Binary files /dev/null and b/issues/demo/assets/blueberry.jpg differ diff --git a/issues/demo/assets/custom.scss b/issues/demo/assets/custom.scss new file mode 100644 index 00000000..19da62c9 --- /dev/null +++ b/issues/demo/assets/custom.scss @@ -0,0 +1,173 @@ +/* fix google map API */ +article.two-column, +article.three-column { + .content .map img { + max-height: inherit; + max-width: inherit; + } +} + +article.page[data-page="blueberry-cream-cheese-cake/1"] .content { + background: url(blueberry-cake-bg.png) repeat-y !important; + background-size: 100% !important; +} + +.itunes-preview { + width: 70%; + margin: 0 auto 10px; + + audio { width: 100% } + + .itunes-download { + display: block; + text-align: center; + } +} + + +/* Responsive */ +@media only screen and (min-width: 768px) { + .itunes-preview { + width: 60%; + } +} + + +/* + Polaroid +*/ + +.polaroid-wrap { + list-style: none; +} + +article.page ul.polaroids { + padding: 0; + margin: 0; +} + +figure.polaroid { + float: left; + + -webkit-backface-visibility: hidden; + -webkit-perspective: 1000; + + display: inline-block; + + max-width: 48%; + max-height: 300px; + + display: inline; + float: left; + + margin: 0 -5% -10% 1%; + width: auto; + + font-size: 18px; + text-align: center; + font-family: "Marker Felt", sans-serif; + text-decoration: none; + color: #333; + + -webkit-transform: rotate(-2deg); + -webkit-transition: all .15s linear; + + -moz-transform: rotate(-2deg); + -moz-transition: all .15s linear; + + transition: all .15s linear; +} + +figure.polaroid figcaption { + text-decoration: none; + text-align: center; +} + +figure.polaroid img { + + width: 100%; + padding: 15px 15px 20px; + background: #fff; + box-shadow: 0 3px 6px rgba(0,0,0,.25); + + vertical-align: middle; + width: 100%; +} + +.polaroid-wrap:hover figure { + -webkit-transform: scale(1.7); + -moz-transform: scale(1.7); + transform: scale(1.7); + position: relative; + z-index: 5; +} + +@media only screen and (min-width: 768px) { + figure.polaroid { + max-width: 24%; + margin: 0 0% -5% 5%; + max-height: 25vw; + } + + .polaroid-wrap:nth-child(3n+1) { + clear: both; + } +} + +.polaroid-wrap:nth-child(even) { + -webkit-transform: rotate(3deg); + -moz-transform: rotate(3deg); + transform: rotate(3deg); +} + +.polaroid-wrap:nth-child(5) { + -webkit-transform: none; + -moz-transform: none; + transform: none; + + position: relative; + top: 14vh; + left: 2vh; +} + +.polaroid-wrap:nth-child(8) { + -webkit-transform: none; + -moz-transform: none; + transform: none; + + position: relative; + top: 5vh; + left: -2vh; +} + +.polaroid-wrap:nth-child(4) figure { + clear: left; +} + +.polaroid-wrap:nth-child(11) { + -webkit-transform: rotate(3deg); + -moz-transform: rotate(3deg); + transform: rotate(3deg); + + position: relative; + left: -2vh; +} + +.polaroid-wrap:nth-child(12) { + -webkit-transform: none; + -moz-transform: none; + transform: none; + + position: relative; + left: 5vh; +} + +.polaroid-wrap:nth-child(13) { + -webkit-transform: none; + -moz-transform: none; + transform: none; + + position: relative; + top: -8vh; + left: 2vh; +} diff --git a/issues/demo/assets/distribution.jpg b/issues/demo/assets/distribution.jpg new file mode 100644 index 00000000..8a760d5e Binary files /dev/null and b/issues/demo/assets/distribution.jpg differ diff --git a/issues/demo/assets/mobile-audience.jpg b/issues/demo/assets/mobile-audience.jpg new file mode 100644 index 00000000..fe33cacf Binary files /dev/null and b/issues/demo/assets/mobile-audience.jpg differ diff --git a/issues/demo/assets/recipes/french_sourdough.jpg b/issues/demo/assets/recipes/french_sourdough.jpg new file mode 100644 index 00000000..dde69668 Binary files /dev/null and b/issues/demo/assets/recipes/french_sourdough.jpg differ diff --git a/issues/demo/assets/recipes/icing-sugar.png b/issues/demo/assets/recipes/icing-sugar.png new file mode 100644 index 00000000..e6155161 Binary files /dev/null and b/issues/demo/assets/recipes/icing-sugar.png differ diff --git a/issues/demo/assets/recipes/philly-cream-cheese.jpg b/issues/demo/assets/recipes/philly-cream-cheese.jpg new file mode 100644 index 00000000..8f79ce6b Binary files /dev/null and b/issues/demo/assets/recipes/philly-cream-cheese.jpg differ diff --git a/issues/demo/assets/recipes/summer-peaches.jpg b/issues/demo/assets/recipes/summer-peaches.jpg new file mode 100644 index 00000000..9dca30a6 Binary files /dev/null and b/issues/demo/assets/recipes/summer-peaches.jpg differ diff --git a/issues/demo/assets/storytelling.jpg b/issues/demo/assets/storytelling.jpg new file mode 100644 index 00000000..e4d935e4 Binary files /dev/null and b/issues/demo/assets/storytelling.jpg differ diff --git a/issues/demo/assets/storytelling2.jpg b/issues/demo/assets/storytelling2.jpg new file mode 100644 index 00000000..30ad0d3b Binary files /dev/null and b/issues/demo/assets/storytelling2.jpg differ diff --git a/issues/demo/assets/wearables.jpg b/issues/demo/assets/wearables.jpg new file mode 100644 index 00000000..5b670827 Binary files /dev/null and b/issues/demo/assets/wearables.jpg differ diff --git a/issues/demo/data/app-ad.md b/issues/demo/data/app-ad.md new file mode 100644 index 00000000..a6ab1503 --- /dev/null +++ b/issues/demo/data/app-ad.md @@ -0,0 +1,13 @@ +--- + title: App Ad + thumb_url: assets/appstore-ad.jpg + + cover_url: assets/appstore-ad.jpg + + layout: + + image_style: background + +--- + + diff --git a/issues/demo/data/berry-cheesecake-parfait.md b/issues/demo/data/berry-cheesecake-parfait.md new file mode 100644 index 00000000..79b1e53f --- /dev/null +++ b/issues/demo/data/berry-cheesecake-parfait.md @@ -0,0 +1,23 @@ +--- + + + title: Berry Cheesecake Parfait + description: Looking for a sweet treat? Look no further! Our delicious recipe for Berry Cheesecake Parfait made with Philadelphia Cream Cheese, mixed berries, Nilla wafers and Cool Whip is definitely the perfect treat! + category: Show me how + + thumb_url: http://kitchenconfidante.com/wp-content/uploads/2012/04/Lemon-Berry-Cheesecake-Parfait-Kitchen-Confidante-Parfait.jpg + + cover_url: http://kitchenconfidante.com/wp-content/uploads/2012/04/Lemon-Berry-Cheesecake-Parfait-Kitchen-Confidante-Parfait.jpg + + videos: + - link: https://www.youtube.com/watch?v=d_eITVaO3jA + thumb_url: http://i1.ytimg.com/vi/d_eITVaO3jA/hqdefault.jpg + type: video/youtube + + +--- + +Looking for a sweet treat? Look no further! Our delicious recipe for Berry Cheesecake Parfait made with Philadelphia Cream Cheese, mixed berries, Nilla wafers and Cool Whip is definitely the perfect treat! + + +