Initial

.gitignore

@@ -0,0 +1,6 @@
+.idea/
+*.iml
+bower_components/
+dist/**
+node_modules/
+src/.sass-cache

bower.json

@@ -0,0 +1,20 @@
+{
+  "name": "newtab",
+  "version": "0.0.0",
+  "authors": [
+    "JariZ <[email protected]>"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "dependencies": {
+    "polymer": "Polymer/polymer#~0.5.3",
+    "core-elements": "Polymer/core-elements#~0.5.4",
+    "paper-elements": "Polymer/paper-elements#~0.5.4"
+  }
+}

gulpfile.js

@@ -0,0 +1,36 @@
+var gulp = require('gulp'),
+    vulcanize = require('gulp-vulcanize'),
+    compass = require('gulp-compass'),
+    plumber = require('gulp-plumber'),
+    path = require("" +
+    "path"),
+    coffee = require("gulp-coffee");
+
+gulp.task('default', ['vulcanize', 'compass'])
+
+gulp.task('vulcanize', function () {
+    gulp.src('src/*.html')
+        .pipe(plumber())
+        .pipe(vulcanize({
+            dest: "dist",
+            strip: true,
+            csp: true, // chrome does not approve of inline scripts
+            verbose: true
+        }))
+        .pipe(gulp.dest('dist'));
+});
+
+gulp.task("compass", function() {
+   gulp.src("src/sass/*.scss")
+       .pipe(plumber())
+       .pipe(compass({
+           project: path.join(__dirname, "src")
+       }))
+       .pipe(gulp.dest('dist/css'));
+});
+
+gulp.task('watch', function () {
+    gulp.watch("src/**/*.scss", {}, "compass");
+
+    gulp.watch("src/**/*.html", {}, "vulcanize");
+});

manifest.json

@@ -0,0 +1,11 @@
+{
+  "name": "Blank new tab page",
+  "description": "Override the new tab page with a blank one",
+  "version": "0.2",
+  "incognito": "split",
+  "chrome_url_overrides": {
+    "newtab": "dist/tab.html"
+  },
+  "manifest_version": 2,
+  "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"
+}

src/config.rb

@@ -0,0 +1,25 @@
+require 'compass/import-once/activate'
+# Require any additional compass plugins here.
+
+# Set this to the root of your project when deployed:
+http_path = "/"
+css_dir = "css"
+sass_dir = "sass"
+images_dir = "images"
+javascripts_dir = "js"
+
+# You can select your preferred output style here (can be overridden via the command line):
+# output_style = :expanded or :nested or :compact or :compressed
+
+# To enable relative paths to assets via compass helper functions. Uncomment:
+# relative_assets = true
+
+# To disable debugging comments that display the original location of your selectors. Uncomment:
+# line_comments = false
+
+
+# If you prefer the indented syntax, you might want to regenerate this
+# project again passing --syntax sass, or you can uncomment this:
+# preferred_syntax = :sass
+# and then run:
+# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass

src/css/screen.css

@@ -0,0 +1,81 @@
+/* Welcome to Compass.
+ * In this file you should write your main styles. (or centralize your imports)
+ * Import this file using the following HTML or equivalent:
+ * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font: inherit;
+  font-size: 100%;
+  vertical-align: baseline;
+}
+
+html {
+  line-height: 1;
+}
+
+ol, ul {
+  list-style: none;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+caption, th, td {
+  text-align: left;
+  font-weight: normal;
+  vertical-align: middle;
+}
+
+q, blockquote {
+  quotes: none;
+}
+q:before, q:after, blockquote:before, blockquote:after {
+  content: "";
+  content: none;
+}
+
+a img {
+  border: none;
+}
+
+article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
+  display: block;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+.loader {
+  margin: 0 auto;
+  display: block;
+  width: 70px;
+  height: 70px;
+  top: 50%;
+  -moz-transform: translateY(-50%);
+  -ms-transform: translateY(-50%);
+  -webkit-transform: translateY(-50%);
+  transform: translateY(-50%);
+  position: relative;
+}
+
+.cards {
+  padding: 20px;
+  width: 100%;
+}

src/item-card.html

@@ -0,0 +1,23 @@
+<link rel="import" href="../bower_components/polymer/polymer.html">
+<polymer-element name="item-card" attributes="description">
+    <template>
+        <style>
+            :host {
+                width: 300px;
+                height: 100px;
+                border-radius: 2px;
+                box-shadow: rgba(0, 0, 0, 0.0980392) 0px 2px 4px, rgba(0, 0, 0, 0.0980392) 0px 0px 3px;
+                background-color: rgb(255, 255, 255);
+                display:block;
+            }
+        </style>
+        <h1>{{title}}</h1>
+        <p>{{description}}</p>
+    </template>
+    <script>
+        Polymer({
+            title: 'Title placeholder',
+            description: 'Description placeholder'
+        });
+    </script>
+</polymer-element>

src/sass/screen.scss

@@ -0,0 +1,27 @@
+/* Welcome to Compass.
+ * In this file you should write your main styles. (or centralize your imports)
+ * Import this file using the following HTML or equivalent:
+ * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
+
+@import "compass/reset";
+@import "compass/css3/transform";
+
+* {
+    box-sizing: border-box;
+}
+
+.loader {
+    margin: 0 auto;
+    display: block;
+    width: 70px;
+    height: 70px;
+
+    top:50%;
+    @include translateY(-50%);
+    position: relative;
+}
+
+.cards {
+    padding:20px;
+    width:100%;
+}

src/tab.html

@@ -0,0 +1,26 @@
+<html>
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <title>Jari's NewTab</title>
+
+    <!-- POLYMER -->
+    <script src="../bower_components/webcomponentsjs/webcomponents.min.js"></script>
+    <link rel="import" href="../bower_components/polymer/polymer.html">
+
+    <!-- 1STPARTY -->
+    <link rel="stylesheet" href="css/screen.css">
+    <link rel="import" href="item-card.html">
+
+    <!-- PAPER -->
+    <link rel="import" href="../bower_components/paper-spinner/paper-spinner.html">
+
+</head>
+<body unresolved>
+
+<paper-spinner class="loader" active></paper-spinner>
+
+<div class="cards">
+</div>
+
+</body>
+</html>