'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _style = require('styled-jsx/style.js');

var _style2 = _interopRequireDefault(_style);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _head = require('next/dist/lib/head.js');

var _head2 = _interopRequireDefault(_head);

var _index = require('next/dist/lib/router/index.js');

var _index2 = _interopRequireDefault(_index);

var _nprogress = require('nprogress');

var _nprogress2 = _interopRequireDefault(_nprogress);

var _reactGa = require('react-ga');

var _reactGa2 = _interopRequireDefault(_reactGa);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var _jsxFileName = '/Users/hshoff/Code/vx/packages/vx-demo/components/meta.js';


if (typeof window !== 'undefined' && window.location.hostname !== 'localhost') {
  _reactGa2.default.initialize('UA-96843800-1');
  _reactGa2.default.set({ page: window.location.pathname });
  _reactGa2.default.pageview(window.location.pathname);
}

_index2.default.onRouteChangeStart = function () {
  return _nprogress2.default.start();
};
_index2.default.onRouteChangeComplete = function () {
  _nprogress2.default.done();
  if (typeof window !== 'undefined' && window.location.hostname !== 'localhost') {
    _reactGa2.default.set({ page: window.location.pathname });
    _reactGa2.default.pageview(window.location.pathname);
  }
};
_index2.default.onRouteChangeError = function () {
  return _nprogress2.default.done();
};

exports.default = function (_ref) {
  var _ref$title = _ref.title,
      title = _ref$title === undefined ? 'visualization components' : _ref$title;
  return _react2.default.createElement('div', {
    'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 26
    }
  }, _react2.default.createElement(_head2.default, {
    __source: {
      fileName: _jsxFileName,
      lineNumber: 27
    }
  }, _react2.default.createElement('meta', { name: 'viewport', content: 'width=device-width, initial-scale=1', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 28
    }
  }), _react2.default.createElement('meta', { charSet: 'utf-8', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 29
    }
  }), _react2.default.createElement('meta', { name: 'twitter:card', content: 'summary', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 30
    }
  }), _react2.default.createElement('meta', { name: 'twitter:site', content: '@hshoff', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 31
    }
  }), _react2.default.createElement('meta', { name: 'twitter:title', content: 'vx | visualization components', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 32
    }
  }), _react2.default.createElement('meta', { name: 'twitter:description', content: 'react + d3 = vx', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 33
    }
  }), _react2.default.createElement('meta', { name: 'twitter:image', content: 'https://raw.githubusercontent.com/hshoff/vx/master/packages/vx-demo/static/tiger-twitter-card.jpg', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 34
    }
  }), _react2.default.createElement('meta', { name: 'twitter:image:alt', content: 'vx logo is a tiger leaper over the letters v and x', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 35
    }
  }), _react2.default.createElement('title', {
    'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 36
    }
  }, 'vx | ' + title), _react2.default.createElement('link', { rel: 'shortcut icon', type: 'image/png', href: 'static/favicon.ico', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 37
    }
  }), _react2.default.createElement('link', { rel: 'stylesheet', href: 'static/prism/prism-funky.css', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 38
    }
  }), _react2.default.createElement('link', { rel: 'stylesheet', href: 'static/prism/prism-line-numbers.css', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 39
    }
  }), _react2.default.createElement('link', { href: 'https://fonts.googleapis.com/css?family=Montserrat:800', rel: 'stylesheet', 'data-jsx': 3134598960,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 40
    }
  })), _react2.default.createElement(_style2.default, {
    styleId: 3134598960,
    css: '\n      body {\n        width: 100vw;\n        overflow-x: hidden;\n        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;\n        background: #ffffff;\n        display: flex;\n        color: white;\n        padding: 0;\n        margin: 0;\n        font-size: 18px;\n        line-height: 1.8em;\n      }\n\n      .tilt {\n        display: flex;\n        flex: 1;\n        min-width: 33%;\n      }\n\n      .page-left {\n        display: flex;\n        flex: 4;\n        flex-direction: column;\n        padding: 0 2rem 2rem;\n        margin-bottom: 50px;\n        margin-top: 140px;\n      }\n\n      .page-left h2:first-child {\n        margin-top: 0;\n        padding-top: 4px;\n      }\n\n      .page-right {\n        display: flex;\n        flex: 3;\n        flex-direction: column;\n        color: white;\n        padding: 10px 2rem 2rem;\n        margin-top: 140px;\n      }\n\n      .page-right > ul {\n        display: flex;\n        flex-direction: column;\n        flex: 1;\n        font-family: \'Karla\';\n        color: #000;\n      }\n\n      .page-right a {\n        font-size: 14px;\n      }\n\n      ol, ul {\n        padding-left: 0;\n      }\n\n      blockquote {\n        margin-left: 0;\n      }\n\n      li {\n        list-style-type: none;\n      }\n\n       p {\n         margin: 1rem 0;\n       }\n\n       code {\n         font-family: "Menlo", monospace;\n         font-weight: bold;\n         padding: .2rem .3rem;\n         background-color: #ebebeb;\n         line-height: 1.8em;\n         font-size: 14px;\n       }\n\n       h1 {\n         font-size: 54px;\n         display: block;\n         margin-bottom: 3rem;\n       }\n\n       h2 {\n         font-size: 19px;\n         margin-bottom: .2rem;\n         margin-top: 2rem;\n         display: block;\n       }\n\n       a {\n         color: #fc2e1c;\n         text-decoration: none;\n       }\n\n       .logo {\n         background-image: url(\'static/favicon.ico\');\n         background-position: center;\n         background-size: cover;\n         height: 24px;\n         width: 24px;\n         background-repeat: no-repeat;\n       }\n\n       .item-bottom .codeblock {\n         margin: 1em 0px 0;\n       }\n\n       .vx-brush:hover {\n         cursor: move;\n       }\n\n      /* loading progress bar styles */\n      #nprogress {\n        pointer-events: none;\n      }\n\n      #nprogress .bar {\n        background: #fc2e1c;\n        position: fixed;\n        z-index: 1031;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 2px;\n      }\n\n      #nprogress .peg {\n        display: block;\n        position: absolute;\n        right: 0px;\n        width: 100px;\n        height: 100%;\n        box-shadow: 0 0 10px #ff9300, 0 0 5px #ff9300;\n        opacity: 1.0;\n        transform: rotate(3deg) translate(0px, -4px);\n      }\n\n      svg {\n        user-select: none;\n        cursor: pointer;\n      }\n\n      .vx-heatmap-circle:hover,\n      .vx-heatmap-rect:hover {\n        stroke: white;\n        stroke-width: 1;\n      }\n\n      @media (max-width: 960px) {\n        .tilt {\n          min-width: 45%;\n        }\n      }\n\n      @media (max-width: 600px) {\n        .tilt {\n          min-width: 100%;\n        }\n      }\n    '
  }));
};