lets-collab 0.1.1 → 0.1.2

data/assets/main.scss

@@ -1,4 +1,4 @@
----
----
-
-@import "base";
+---
+---
+
+@import "base";

data/index.html

@@ -1,69 +1,95 @@
----
-layout: home-page
-title: Hello Tina May
-description: This is the blurb for SEO
-logo: true
-logo_path: /images/hello-tina-may-logo.png
-banner-title: Hello Tina May
-banner-image_path: /images/photo1.jpg
-banner_color: '#16a085'
-banner-text_color: '#ffffff'
-featured_color: '#16a085'
-stats:
-  - amount: 200k
-    subtitle: Total
-    title: Instagram Followers
-  - amount: 150k
-    subtitle: Monthly
-    title: Blog Traffic
-  - amount: 18%
-    subtitle: Average
-    title: Engagement Rate
-  - amount: 1.2 mill
-    subtitle: Monthly
-    title: Total Reach
-gallery-captions: true
-gallery:
-  - image_path: /images/photo1.jpg
-    caption: Hello Tina May
-  - image_path: /images/photo2.jpg
-    caption: Tina May
-  - image_path: /images/photo3.jpg
-    caption: Hello Tina May
-  - image_path: /images/photo2.jpg
-    caption: Tina May
-  - image_path: /images/photo3.jpg
-    caption: Peekaboo Tina May
-  - image_path: /images/photo1.jpg
-    caption: Hello Goodbye
-  - image_path: /images/photo1.jpg
-    caption: Hello Goodbye
-brand-partnerships: true
-brand-logos:
-  - image_path: /images/logo.png
-  - image_path: /images/logo.png
-  - image_path: /images/logo.png
-  - image_path: /images/logo.png
-testimonials-section: true
-testimonials:
-  - quote: >-
-      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
-      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
-      veniam.
-    author: Amy Smith
-  - quote: >-
-      Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
-      et dolore magna  aliqua. Ut enim ad minim veniam.
-    author: Jane Lu
-  - quote: >-
-      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
-      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
-      veniam.
-    author: Johnny Appleseed
-custom-font_html: |
-    <link href="https://fonts.googleapis.com/css?family=Slabo+27px" rel="stylesheet">
-font-name:
-instagram: true
-instagram-code: |
-  <!-- LightWidget WIDGET --><script src="//lightwidget.com/widgets/lightwidget.js"></script><iframe src="//lightwidget.com/widgets/e4fd7255dccd5462bd71b8a59cc17d2f.html" scrolling="no" allowtransparency="true" class="lightwidget-widget" style="width: 100%; border: 0; overflow: hidden;"></iframe>
----
+---
+layout: home-page
+title: Hello Tina May
+description: This is the blurb for SEO
+logo: true
+logo_path: /assets/hello-tina-may-logo.png
+banner-title: Hello Tina May
+banner-subtitle: '@justynjen'
+banner-image_path: /assets/photo1.jpg
+banner_color: '#16a085'
+banner-text_color: '#ffffff'
+featured_color: '#16a085'
+custom-font_html: |
+    <link href="https://fonts.googleapis.com/css?family=Slabo+27px" rel="stylesheet">
+font-name: Slabo 27px
+intro-title: Introduction
+intro-text_html: |
+  <p> Tina May started a marketing agency at 20, travelled the world building websites for boutique hotels and now runs the highly regarded coding school Institute of Code. In between running immersive coding bootcamps in Bali and teaching digital marketing, she builds stunning websites designed to convert, using only the latest technologies. For a recent portfolio example, please see our recently updated website <a href="www.instituteofcode.com" target="_blank">www.instituteofcode.com</a> and <a href="www.eyesofanomad.com"> www.eyesofanomad.com </a> </p>
+instagram: true
+instagram-code: |
+  <!-- LightWidget WIDGET --><script src="//lightwidget.com/widgets/lightwidget.js"></script><iframe src="//lightwidget.com/widgets/e4fd7255dccd5462bd71b8a59cc17d2f.html" scrolling="no" allowtransparency="true" class="lightwidget-widget" style="width: 100%; border: 0; overflow: hidden;"></iframe>
+stats-title: My Stats
+stats:
+  - amount: 200k
+    subtitle: Total
+    title: Instagram Followers
+  - amount: 150k
+    subtitle: Monthly
+    title: Blog Traffic
+  - amount: 18%
+    subtitle: Average
+    title: Engagement Rate
+  - amount: 1.2 mill
+    subtitle: Monthly
+    title: Total Reach
+audience-title: My Audience
+audience-text_html:  |
+   <p> 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.</p>
+    <p> 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. </p>
+brand-partnerships: true
+brand-title: Brands I've Worked With
+brand-text_html: |
+  <p> 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.</p>
+brand-logos:
+  - image_path: /assets/logo.png
+  - image_path: /assets/logo.png
+  - image_path: /assets/logo.png
+  - image_path: /assets/logo.png
+testimonials-title: Work With Me
+testimonials-text_html: |
+    <p> 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.</p>
+testimonials-section: true
+testimonials:
+  - quote: >-
+      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
+      veniam.
+    author: Amy Smith
+  - quote: >-
+      Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
+      et dolore magna  aliqua. Ut enim ad minim veniam.
+    author: Jane Lu
+  - quote: >-
+      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
+      veniam.
+    author: Johnny Appleseed
+gallery-title: Gallery
+gallery-text_html: |
+    <p> 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.</p>
+gallery-captions: true
+gallery:
+  - image_path: /assets/photo1.jpg
+    caption: Hello Tina May
+  - image_path: /assets/photo2.jpg
+    caption: Tina May
+  - image_path: /assets/photo3.jpg
+    caption: Hello Tina May
+  - image_path: /assets/photo2.jpg
+    caption: Tina May
+  - image_path: /assets/photo3.jpg
+    caption: Peekaboo Tina May
+  - image_path: /assets/photo1.jpg
+    caption: Hello Goodbye
+  - image_path: /assets/photo1.jpg
+    caption: Hello Goodbye
+contact-title: Let's Connect
+contact:
+  - type: Phone
+    value: (+1) 555 555 5555
+  - type: Email
+    value: hello@tinamay.com
+  - type: Instagram
+    value: www.instagram.com/hellotinamay
+---

data/lets-collab-0.1.2/.gitignore

@@ -0,0 +1,5 @@
+*.gem
+.bundle
+.sass-cache
+_site
+Gemfile.lock

data/lets-collab-0.1.2/Gemfile

@@ -0,0 +1,2 @@
+source "https://rubygems.org"
+gemspec

data/lets-collab-0.1.2/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2017 Tina May
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/lets-collab-0.1.2/README.md

@@ -0,0 +1,50 @@
+# media-kit-template
+
+Welcome to your new Jekyll theme! In this directory, you'll find the files you need to be able to package up your theme into a gem. Put your layouts in `_layouts`, your includes in `_includes` and your sass in `_sass`. To experiment with this code, add some sample content and run `bundle exec jekyll serve` – this directory is setup just like a Jekyll site!
+
+TODO: Delete this and the text above, and describe your gem
+
+## Installation
+
+Add this line to your Jekyll site's `Gemfile`:
+
+```ruby
+gem "lets-collab"
+```
+
+And add this line to your Jekyll site's `_config.yml`:
+
+```yaml
+theme: lets-collab
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install media-kit-template
+
+## Usage
+
+TODO: Write usage instructions here. Describe your available layouts, includes, and/or sass.
+
+
+## Development
+
+To set up your environment to develop this theme, run `bundle install`.
+
+Your theme is setup just like a normal Jekyll site! To test your theme, run `bundle exec jekyll serve` and open your browser at `http://localhost:4000`. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.
+
+When your theme is released, only the files in `_layouts`, `_includes`, and `_sass` tracked with Git will be released.
+
+## License
+
+The theme is available for use with permission from the team at Institute of Code
+
+## temp
+
+s.files = `git ls-files -z`.split("\x0").select do |f|
+    f.match(%r{^(_(includes|layouts|sass)/|(LICENSE|README)((\.(txt|md|markdown)|$)))}i)
+end

data/lets-collab-0.1.2/_config.yml

@@ -0,0 +1,2 @@
+sass:
+    sass_dir: _sass

data/lets-collab-0.1.2/_layouts/default.html

@@ -0,0 +1,24 @@
+<!DOCTYPE>
+<html>
+  <head>
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/gridlex/2.6.0/gridlex.min.css">
+    <link href="https://fonts.googleapis.com/css?family=Playfair+Display:400,700|Lato:300,400,600" rel="stylesheet">
+
+    {{page.custom-font_html}}
+
+    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
+    <link href="/assets/main.css" rel="stylesheet" />
+
+    <title> {{page.title}}</title>
+    <meta type="description" content="{{page.description}}" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta property="og:image" content="{{page.social-share-image_path}}" />
+
+  </head>
+  <body>
+
+    {{content}}
+
+  </body>
+</html>

data/lets-collab-0.1.2/_layouts/home-page.html

@@ -0,0 +1,204 @@
+---
+layout: default
+_comments:
+  layout: Keep this as home-page
+  title: Title for google search results and social media previews
+  description: This is the description for SEO and shown in search results and social media previews
+  logo: Do you have a logo image?
+  logo_path: Upload your logo here (recommended size is 300px wide)
+  banner-title: Title displayed on the top banner
+  banner-subtitle: A subtitle displayed on the banner
+  banner-image_path: The large banner image (recommended size is around 1200px wide by 900px tall)
+  banner_color: Color for the banner background
+  banner-text_color: Color for the banner text
+  featured_color: A featured color to use throughout the media kit
+  custom-font_html: If you want to use a custom font for your headings, paste the embed link for a custom google font
+  font-name: Name of the Google Font (with correct capitalisation)
+  intro-title: Title of the first introduction banner
+  intro-text_html: Write a short description of you, your brand and what you offer.
+  instagram: Do you want to add an instagram widget?
+  instagram-code: Go to lightwidget.com and copy the embed code here.
+  stats-title: Title of the statistics section
+  stats: Some general statistics about you or your audience
+  audience-title: Title of the Audience Section
+  audience-text_html: Short blurb of your audience or target market. Alternatively you can use this section for any other short text block.
+  brand-partnerships: Do you want a section that shows brands or clients you have worked with?
+  brand-title: Title of Brand Partnerships or Client section
+  brand-text_html: Short blurb about your experience and brands you have worked with.
+  brand-logo-displayed: true
+  brand-logos: Upload the logos of clients you have worked with (recommended size 300px x 200px)
+  testimonials-title: Title of the work with me section
+  testimonials-text_html: Short blurb about the servies you offer
+  testimonials-section: Do you want to include a section for testimonials?
+  testimonials:
+    - quote: A short testimonial
+      author: Who the testimonial is from
+  gallery-title: Title of the Gallery Section
+  gallery-text_html: Short blurb about the gallery or your content creation skills
+  gallery-captions: Do you want to display a caption for each photo?
+  contact-title: Title of the contact section
+  contact:
+    - type: Eg. Phone, Email, Instagram
+      value: Contact Number, Email or URL
+---
+
+
+<style>
+    h2, a {
+      color: {{page.featured_color}};
+    }
+    hr, a {
+      border-color: {{page.featured_color}};
+    }
+    section.featured {
+      background-color: {{page.featured_color}};
+    }
+    .banner-color {
+      background-color: {{page.banner_color}};
+      color: {{page.banner-text_color}}
+    }
+    h1, h2, h3, h4 {
+        font-family: '{{page.font-name}}';
+    }
+</style>
+
+
+  <section class="banner grid banner-color">
+
+    <div class="col-4_sm-12 inner vertical-align">
+        <div>
+          {% if page.logo %}
+            <img class="logo" src="{{page.logo_path}}" />
+          {% else %}
+           <h1> {{page.banner-title}} </h1>
+          {% endif %}
+           <p class="mob-hide"> {{page.banner-subtitle}} </p>
+        </div>
+       <p class="pin-bottom mob-hide"> MEDIA KIT</p>
+    </div>
+    <div class="col-8_sm-12 bg" style="background-image:url('{{page.banner-image_path}}')">
+      <!-- background image -->
+      <p class="pin-bottom banner-color mob-show"> MEDIA KIT</p>
+    </div>
+  </section>
+
+  <section>
+
+    <h2 class="editable">{{page.intro-title}}</h2>
+    <hr />
+    <div class="editable">
+    {{page.intro-text_html}}
+    </div>
+  </section>
+
+  <!--- - - - - - - - - -->
+  {% if page.instagram %}
+  <section class="no-padding">
+    {{page.instagram-code}}
+  </section>
+  {% endif %}
+
+  <section class="stats-section">
+     <h2 class="editable"> {{page.stats-title}} </h2>
+     <hr />
+     <div class="grid-center">
+       {% for stat in page.stats %}
+        <div class="col-3_sm-6_xs-12 center">
+
+          <span class="info">{{stat.amount}}</span>
+          <span class="info-subtitle">{{stat.subtitle}}</span>
+          <h3>{{stat.title}}</h3>
+        </div>
+        {% endfor %}
+     </div>
+  </section>
+
+  <!--- - - - - - - - - -->
+
+  <section>
+    <h2 class="editable"> {{page.audience-title}} </h2>
+    <hr />
+    <div class="editable">
+        {{page.audience-text_html}}
+    </div>
+</section>
+
+
+
+<!--- - - - - - - - - -->
+{% if page.brand-partnerships %}
+<section>
+  <h2 class="editable"> {{page.brand-title}} </h2>
+  <hr />
+  <div class="editable">
+    {{page.brand-text_html}}
+  </div>
+{% if page.brand-logo-displayed %}
+  <div class="grid-center margin-top">
+    {% for logo in page.brand-logos %}
+    <div class="col-3_sm-6_xs-12">
+         <div class="logo-item" style="background-image:url('{{logo.image_path}}');">
+         </div>
+     </div>
+     {% endfor %}
+  </div>
+{% endif %}
+</section>
+{% endif %}
+
+<!--- - - - - - - - - -->
+
+<section>
+  <h2 class="editable"> {{page.testimonials-title}} </h2>
+  <hr />
+  <div class="editable">
+    {{page.testimonials-text_html}}
+  </div>
+
+{% if page.testimonials-section %}
+  <div class="grid-center margin-top">
+    {% for testimonial in page.testimonials %}
+     <div class="col-4_sm-12 testimonial">
+       <p>{{testimonial.quote}}</p>
+       <p class="author">- {{testimonial.author}}</p>
+     </div>
+     {% endfor %}
+  </div>
+  {% endif %}
+
+</section>
+
+
+<!-- - - - - - -->
+  <section class="gallery-section">
+    <h2 class="editable"> {{page.gallery-title}} </h2>
+    <hr />
+    <div class="editable">
+      {{page.gallery-text_html}}
+    </div>
+     <div class="grid-center margin-top">
+       {% for gallery in page.gallery %}
+        <div class="col-3_sm-6_xs-12">
+          <div class="gallery-item" style="background-image:url('{{gallery.image_path}}');">
+          </div>
+          {% if page.gallery-captions %}
+            <p class="caption">{{gallery.caption}}</p>
+          {% endif %}
+        </div>
+        {% endfor %}
+     </div>
+  </section>
+<!-- - - - - - -->
+
+<section class="featured editable">
+  <h2>{{page.contact-title}} </h2>
+  <hr />
+  {% for item in page.contact %}
+  <p> <strong> {{item.type}}:  </strong> {{item.value}} </p>
+  {% endfor %}
+
+</section>
+<footer>
+   <p> Media Kit Created with <i class="fa fa-heart" aria-hidden="true"></i> by <a href="http://www.instituteofcode.com">The Institute of Code </a> </p>
+   <p class="subtle">Get your own<a href="http://www.letscollab.io"> online media kit at letscollab.io</a> <br />or join one of our courses in Bali and in 10 days we'll teach you how to <a href="http://www.instituteofcode.com/courses/social-media"> become an influencer or social media manager.</a> </p>
+</footer>