🎉 initial commit

.editorconfig

@@ -0,0 +1,13 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_size = 2
+indent_style = space
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.eslintrc.js

@@ -0,0 +1,21 @@
+module.exports = {
+  root: true,
+  env: {
+    browser: true,
+    node: true
+  },
+  parserOptions: {
+    parser: 'babel-eslint'
+  },
+  extends: [
+    // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
+    // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
+    'plugin:vue/essential'
+  ],
+  // required to lint *.vue files
+  plugins: [
+    'vue'
+  ],
+  // add your custom rules here
+  rules: {}
+}

.gitignore

@@ -0,0 +1,14 @@
+# dependencies
+node_modules
+
+# logs
+npm-debug.log
+
+# Nuxt build
+.nuxt
+
+# Nuxt generate
+dist
+
+*.swp
+.DS_Store

assets/README.md

@@ -0,0 +1,8 @@
+# ASSETS
+
+This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/assets#webpacked
+
+**This directory is not required, you can delete it if you don't want to use it.**

assets/stylus/fonts.styl

@@ -0,0 +1,6 @@
+@font-face
+  font-family Museo Sans
+  src url('/museo-sans/500.otf')
+  font-weight 500
+
+

assets/stylus/includes/colors.styl

@@ -0,0 +1,7 @@
+fountain-blue = #00c2c9
+fountain-blue-hover = #00b2b8
+fountain-blue-active = #009297
+fountain-blue-focus = rgba(0, 170, 176, .25)
+mineshaft = #333333
+black-haze = #F7F7F7
+robin-egg-blue = #00C4CA

assets/stylus/includes/fonts.styl

@@ -0,0 +1,9 @@
+font-h1()
+  font-family Museo Sans
+  font-size 18px
+  font-weight 500
+
+font-c1()
+  font-family Museo Sans
+  font-size 14px
+  font-weight 500

assets/stylus/includes/mixins.styl

@@ -0,0 +1,14 @@
+tplr()
+  top 0
+  left 0
+  bottom 0
+  right 0
+
+clear()
+  &:before
+  &:after
+    content: ""
+    display: table
+  &:after
+    clear: both
+  zoom: 1 if support-for-ie

assets/stylus/includes/viewport.styl

@@ -0,0 +1,81 @@
+inViewport(delay = 0, speed = 1)
+  &.below-viewport
+    opacity 0
+  &.above-viewport
+    opacity 0.6
+  &.in-viewport
+    transition opacity unit(speed, 's') ease-in-out unit(delay, 's')
+    opacity 1
+
+inViewportBottom(delay = 0, speed = 1)
+  &.below-viewport
+    opacity 0
+    transform translate(0, 20px) 
+  &.above-viewport
+    opacity 0.6
+    transform translate(0, 0)
+  &.in-viewport
+    transition opacity unit(speed, 's') ease-in-out unit(delay, 's'), transform unit(speed, 's') ease-in-out unit(delay, 's')
+    opacity 1
+    transform translate(0, 0)
+
+inViewportLeft(delay = 0, speed = 1)
+  &.below-viewport
+    opacity 0
+    transform translate(-20px, 0px) 
+  &.above-viewport
+    opacity 0.6
+    transform translate(-5, 0px)
+  &.in-viewport
+    opacity 1
+    transform translate(0, 0)
+    transition opacity unit(speed, 's') ease-in-out unit(delay, 's'), transform unit(speed, 's') ease-in-out unit(delay, 's')
+
+inViewportRight(delay = 0, speed = 1)
+  &.below-viewport
+    opacity 0
+    transform translate(20px, 0px) 
+  &.above-viewport
+    opacity 0.6
+    transform translate(5, 0px)
+  &.in-viewport
+    opacity 1
+    transform translate(0, 0)
+    transition opacity unit(speed, 's') ease-in-out unit(delay, 's'), transform unit(speed, 's') ease-in-out unit(delay, 's')
+
+inViewportScale(delay = 0, speed = 1)
+  &.below-viewport
+    opacity 0
+    transform scale(1.1)
+  &.above-viewport
+    opacity 0.6
+    transform scale(0.95)
+  &.in-viewport
+    opacity 1
+    transform scale(1)
+    transition opacity unit(speed, 's') ease-in-out unit(delay, 's'), transform unit(speed, 's') ease-in-out unit(delay, 's')
+
+inViewportBlurBottom(delay = 0, speed = 1)
+  &.below-viewport
+    filter blur(10px)
+    transform translate(0, 20px) 
+  &.above-viewport
+    filter blur(5px)
+    transform translate(0, -10px)
+  &.in-viewport
+    filter blur(0px)
+    transform translate(0, 0)
+    transition filter unit(speed, 's') ease-in-out unit(delay, 's'), transform unit(speed, 's') ease-in-out unit(delay, 's')
+
+inViewportWidth(delay = 0, speed = 1,from = 0%, to = 100%)
+  &.below-viewport
+    width from
+    opacity 0
+  &.above-viewport
+    width to
+    opacity 0.5
+  &.in-viewport
+    opacity 1
+    width to
+    transition width unit(speed, 's') ease-in-out unit(delay, 's'), opacity unit(speed, 's') ease-in-out unit(delay, 's')
+

assets/stylus/main.styl

@@ -0,0 +1,10 @@
+@import 'fonts.styl'
+@import 'includes/*'
+
+body, html
+  margin 0
+  padding 0
+  font-c1()
+  background-image linear-gradient(to bottom, #fbfbfb, #ebebeb, #f8f8f8, #f4f4f4)
+  background-size 4px 4px
+  background-repeat repeat

components/README.md

@@ -0,0 +1,6 @@
+# COMPONENTS
+
+The components directory contains your Vue.js Components.
+Nuxt.js doesn't supercharge these components.
+
+**This directory is not required, you can delete it if you don't want to use it.**

layouts/README.md

@@ -0,0 +1,8 @@
+# LAYOUTS
+
+This directory contains your Application Layouts.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/views#layouts
+
+**This directory is not required, you can delete it if you don't want to use it.**

layouts/default.vue

@@ -0,0 +1,3 @@
+<template>
+  <nuxt/>
+</template>

middleware/README.md

@@ -0,0 +1,9 @@
+# MIDDLEWARE
+
+This directory contains your Application Middleware.
+The middleware lets you define custom function to be ran before rendering a page or a group of pages (layouts).
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/routing#middleware
+
+**This directory is not required, you can delete it if you don't want to use it.**

nuxt.config.js

@@ -0,0 +1,50 @@
+module.exports = {
+  /*
+  ** Headers of the page
+  */
+  head: {
+    title: 'pub',
+    meta: [
+      { charset: 'utf-8' },
+      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+      { hid: 'description', name: 'description', content: 'Content Licensing Platorm' }
+    ],
+    link: [
+      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
+      { rel: 'shortcut icon', href: '/icons/favicon.ico' },
+      { rel: 'apple-touch-icon', sizes: '180x180', href: '/icons/apple-touch-icon.png' },
+      { rel: 'icon', type: 'image/png', sizes: '32x32', href: '/icons/favicon-32x32.png' },
+      { rel: 'icon', type: 'image/png', sizes: '16x16', href: '/icons/favicon-16x16.png' },
+      { rel: 'manifest', href: '/icons/manifest.json' },
+      { rel: 'mask-icon', href: '/icons/safari-pinned-tab.svg', color: '#00c2c9' },
+
+      { rel: 'stylesheet', href: '//use.fontawesome.com/releases/v5.0.6/css/all.css' },
+    ]
+  },
+  /*
+  ** Customize the progress bar color
+  */
+  loading: { color: '#333333' },
+  /*
+  ** Build configuration
+  */
+
+  css: [
+    { src: '~assets/stylus/main.styl', lang: 'stylus' },
+  ],
+  build: {
+    /*
+    ** Run ESLint on save
+    */
+    extend (config, { isDev, isClient }) {
+      if (isDev && isClient) {
+        config.module.rules.push({
+          enforce: 'pre',
+          test: /\.(js|vue)$/,
+          loader: 'eslint-loader',
+          exclude: /(node_modules)/
+        })
+      }
+    }
+  }
+}

package.json

@@ -0,0 +1,28 @@
+{
+  "name": "website",
+  "version": "1.0.0",
+  "description": "pub website",
+  "author": "kevin olson <[email protected]>",
+  "private": true,
+  "scripts": {
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt start",
+    "generate": "nuxt generate",
+    "lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
+    "precommit": "npm run lint"
+  },
+  "dependencies": {
+    "nuxt": "^1.0.0",
+    "pug": "^2.0.3",
+    "stylus": "^0.54.5",
+    "stylus-loader": "^3.0.2"
+  },
+  "devDependencies": {
+    "babel-eslint": "^8.2.1",
+    "eslint": "^4.15.0",
+    "eslint-friendly-formatter": "^3.0.0",
+    "eslint-loader": "^1.7.1",
+    "eslint-plugin-vue": "^4.0.0"
+  }
+}

pages/README.md

@@ -0,0 +1,7 @@
+# PAGES
+
+This directory contains your Application Views and Routes.
+The framework reads all the .vue files inside this directory and creates the router of your application.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/routing

pages/index.vue

@@ -0,0 +1,85 @@
+<template lang="pug">
+#Pub
+  header
+    .logo
+      include ../static/pub.svg
+    .title maximizing the value of content
+
+  .container
+    .content-blocks
+
+      .content-block
+        .content-block-title MEDIA COMPANIES
+        .content-block-copy
+          p License content from established creators to distribute across your owned and operated properites. 
+          p License out the content you make on a daily basis to other media companies and partners. 
+
+      .content-block.content-block-reverse
+        .content-block-title CREATORS
+        .content-block-copy
+          p License your content directly to media companiees and platforms to know the value of your content and create incremental revenue streams.
+          p Make your content avaialable for turnkey sponsorships from brands. No custom content, no brief - just the content you make on a daily basis.
+
+</template>
+
+<script>
+export default {
+}
+</script>
+
+<style lang="stylus">
+@import '../assets/stylus/includes/*'
+
+header
+  background-color fountain-blue
+  padding 60px
+  color white
+  .logo
+    width 200px
+    height 100px
+    margin auto
+    > svg
+      path, polygon
+        fill white
+
+  .title
+    font-c1()
+    text-align center
+    padding 20px 0 0 0
+
+
+.container
+  max-width 640px
+  margin auto
+
+.content-blocks
+  display flex
+  padding 40px 0
+  flex-direction column
+
+.content-block
+  margin 20px 0
+  display flex
+  flex-direction row
+  background-color white
+  &.content-block-reverse
+    flex-direction row-reverse
+    .content-block-title
+      margin-right -10%
+    .content-block-copy
+      margin 0 60px 0 0
+
+.content-block-title
+  background-color fountain-blue
+  color white
+  padding 20px 10px
+  font-h1()
+  white-space nowrap
+  width 200px
+  align-self center
+  margin-left -10%
+
+.content-block-copy
+  padding 60px
+
+</style>