Merge pull request #880 from ziburski/netlifycmsorg-new

Shipping Netlify CMS website 1.0

Author: Erin Symons

.gitignore

@@ -8,5 +8,5 @@ yarn-error.log
 .vscode/
 manifest.yml
 .imdone/
-
+website/site/data/contributors.yml
 /coverage/

website/config/variables.js

@@ -6,12 +6,16 @@ module.exports = {
   lightestGrey: '#E6E6E6',
   lighterGrey: '#F7F8F8',
   lightGrey: '#F6F6F6',
+  lightishGrey: '#51555D',
   grey: '#313D3E',
   darkGrey: '#2F3132',
   darkerGrey: '#1C1E1E',
+  blueGrey: '#9AA1AE',
   lightGreen: '#97bf2f',
   green: '#C9FA4B',
   darkGreen: '#7CA511',
+  shadeBlue: '#EFF0F4',
+  blue: '#3A69C7',
 
   // typography
   thin: 100,
@@ -35,7 +39,7 @@ module.exports = {
 
   // border radius
   borderRadius: '4px',
-  largeBorderRadius: '10px',
+  largeBorderRadius: '8px',
 
   // responsive breakpoints
   mobile: '480px',

website/gulpfile.babel.js

@@ -1,8 +1,11 @@
 import gulp from "gulp";
 import cp from "child_process";
-import hugoBin from "hugo-bin"
+import hugoBin from "hugo-bin";
 import gutil from "gulp-util";
 import postcss from "gulp-postcss";
+import transform from "gulp-transform";
+import yaml from "yamljs";
+import rename from "gulp-rename";
 import cssImport from "postcss-import";
 import neatgrid from "postcss-neat";
 import nestedcss from "postcss-nested";
@@ -18,53 +21,94 @@ import webpackConfig from "./webpack.conf";
 const browserSync = BrowserSync.create();
 const defaultArgs = ["-d", "../dist", "-s", "site", "-v"];
 
-gulp.task("hugo", (cb) => buildSite(cb));
-gulp.task("hugo-preview", (cb) => buildSite(cb, ["--buildDrafts", "--buildFuture"]));
+function buildSite(cb, options) {
+  const args = options ? defaultArgs.concat(options) : defaultArgs;
+  return cp.spawn(hugoBin, args, { stdio: "inherit" }).on("close", code => {
+    if (code === 0) {
+      browserSync.reload();
+      cb();
+    } else {
+      browserSync.notify("Hugo build failed :(");
+      cb("Hugo build failed");
+    }
+  });
+}
+
+gulp.task("hugo", ["copy"], cb => buildSite(cb));
+gulp.task("hugo-preview", ["copy"], cb =>
+  buildSite(cb, ["--buildDrafts", "--buildFuture"])
+);
 
 gulp.task("build", ["css", "js", "fonts", "images", "hugo"]);
 gulp.task("build-preview", ["css", "js", "fonts", "images", "hugo-preview"]);
 
-gulp.task("css", () => (
-  gulp.src("./src/css/**/*.css")
-    .pipe(postcss([
-      cssImport({from: "./src/css/main.css"}),
-      neatgrid(),
-      nestedcss(),
-      colorfunctions(),
-      hdBackgrounds(),
-      cssextend(),
-      cssvars({variables: styleVariables})]))
+gulp.task("css", () =>
+  gulp
+    .src("./src/css/**/*.css")
+    .pipe(
+      postcss([
+        cssImport({ from: "./src/css/main.css" }),
+        neatgrid(),
+        nestedcss(),
+        colorfunctions(),
+        hdBackgrounds(),
+        cssextend(),
+        cssvars({ variables: styleVariables })
+      ])
+    )
     .pipe(gulp.dest("./dist/css"))
     .pipe(browserSync.stream())
-));
+);
 
-gulp.task("js", (cb) => {
+gulp.task("js", cb => {
   const myConfig = Object.assign({}, webpackConfig);
 
   webpack(myConfig, (err, stats) => {
     if (err) throw new gutil.PluginError("webpack", err);
-    gutil.log("[webpack]", stats.toString({
-      colors: true,
-      progress: true
-    }));
+    gutil.log(
+      "[webpack]",
+      stats.toString({
+        colors: true,
+        progress: true
+      })
+    );
     browserSync.reload();
     cb();
   });
 });
 
-gulp.task("fonts", () => (
-  gulp.src("./src/fonts/**/*")
+gulp.task("fonts", () =>
+  gulp
+    .src("./src/fonts/**/*")
     .pipe(gulp.dest("./dist/fonts"))
     .pipe(browserSync.stream())
-));
+);
 
-gulp.task("images", () => (
-  gulp.src("./src/img/**/*")
+gulp.task("images", () =>
+  gulp
+    .src("./src/img/**/*")
     .pipe(gulp.dest("./dist/img"))
     .pipe(browserSync.stream())
-));
+);
+
+gulp.task("copy", () =>
+  gulp
+    .src("../.all-contributorsrc")
+    .pipe(
+      transform(
+        "utf8",
+        content =>
+          new Promise((resolve, reject) => {
+            const contributors = JSON.parse(content);
+            resolve(yaml.dump({ contributors: contributors.contributors }));
+          })
+      )
+    )
+    .pipe(rename("contributors.yml"))
+    .pipe(gulp.dest("./site/data"))
+);
 
-gulp.task("server", ["hugo", "css", "js", "fonts", "images"], () => {
+gulp.task("server", ["css", "js", "fonts", "images", "hugo"], () => {
   browserSync.init({
     server: {
       baseDir: "./dist"
@@ -77,18 +121,3 @@ gulp.task("server", ["hugo", "css", "js", "fonts", "images"], () => {
   gulp.watch("./src/fonts/**/*", ["fonts"]);
   gulp.watch("./site/**/*", ["hugo"]);
 });
-
-function buildSite(cb, options) {
-  const args = options ? defaultArgs.concat(options) : defaultArgs;
-
-  return cp.spawn(hugoBin, args, {stdio: "inherit"}).on("close", (code) => {
-    if (code === 0) {
-      browserSync.reload();
-      cb();
-    } else {
-      browserSync.notify("Hugo build failed :(");
-      cb("Hugo build failed");
-    }
-  });
-}
-

website/package.json

@@ -32,6 +32,8 @@
     "gulp": "^3.9.1",
     "gulp-babel": "^6.1.2",
     "gulp-postcss": "^6.1.1",
+    "gulp-rename": "^1.2.2",
+    "gulp-transform": "^3.0.5",
     "gulp-util": "^3.0.7",
     "hugo-bin": "^0.18.0",
     "imports-loader": "^0.6.5",

website/site/data/landing.yaml

@@ -1,50 +1,41 @@
 ---
 hero:
-  headline: An open-source CMS for your Git workflow
-  subhead: |
-    - Content management in a single-page app
-    - Built in React.js with extensible components
-    - Integrate with any build tool
-    - Plug in to any static site generator
-  ctas: |
-    - [Take it for a test drive →](/docs/test-drive)
-productvideo:
-  thumbnail: "/img/hero-graphic.jpg"
-  mp4: "/img/demo.mp4"
-  ogg: "/img/demo.ogg"
-  webm: "/img/demo.webm"
+  headline: "Open source content management for your Git workflow"
+  subhead: "Use Netlify CMS with any static site generator for a faster and more flexible web project"
+  devfeatures:
+    - feature: "Static + content management = ♥"
+      description: "Get the speed, security, and scalability of a static site, while still providing a convenient editing interface for content."
+    - feature: "An integrated part of your Git workflow"
+      description: "Content is stored in your Git repository alongside your code for easier versioning, multi-channel publishing, and the option to handle content updates directly in Git."
+    - feature: "An extensible CMS built on React"
+      description: "Netlify CMS is built as a single-page React app. Create custom-styled previews, UI widgets, and editor plugins or add backends to support different Git platform APIs."
+
+cta:
+  primaryhook: "Getting started is simple and free."
+  primary: "Choose a template that’s pre-configured with a static site generator and deploys to a global CDN in one click."
+  button: "[Get started](/docs/start-with-a-template/)"
+
+editors:
+  hook: "A CMS that developers and content editors can agree on"
+  intro: "You get to implement modern front end tools to deliver a faster, safer, and more scalable site. Editors get a friendly UI and intuitive workflow that meets their content management requirements."
+  features:
+    - feature: "Editor-friendly user interface"
+      description: "The web-based app includes rich-text editing, real-time preview, and drag-and-drop media uploads."
+      imgpath: "/img/screenshot-editor.png"
+    - feature: "Intuitive workflow for content teams"
+      description: "Writers and editors can easily manage content from draft to review to publish across any number of custom content types."
+      imgpath: "/img/screenshot-editorial.png"
+    - feature: "Instant access, without a GitHub account"
+      description: "With [Git Gateway](/docs/authentication-backends/#git-gateway-with-netlify-identity), you can add CMS access for any team member — even if they don’t have a GitHub account. "
+      imgpath: "/img/screenshot-identity.png"
+
+community:
+  hook: "Supported by a growing community"
+  features:
+    - feature: "Support when you need it"
+      description: "Get up and running with comprehensive [documentation](/docs) and templates or work through difficult problems with help from the community on [Gitter](https://gitter.im/netlify/NetlifyCMS)."
+    - feature: "A community-driven project you can help evolve"
+      description: "Netlify CMS is built by a community of 60+ contributors — and you can help. Join our [bi-weekly planning sessions](/community) or read the [contributing guide](/docs/contributor-guide) to join in."
+  contributors: "Made possible by awesome contributors"
 
-thanksdevs: "**Thanks to all our contributors.**Keep shooting for the stars with Netlify CMS."
-
-collab:
-  hook: "Integrate the roles of developers, writers, and editors."
-  body: "Writers can focus on writing. Editors can approve content and publish with ease. Developers can use their favorite tools and libraries. **Netlify CMS keeps all of their contributions together, in Git.**"
-  graphicpath: "/img/collab.svg"
-
-featureshook: "Designed with developers in mind - it’s in our DNA."
-
-features:
-  - feature: "Fast, web-based UI"
-    description: "Built with React, featuring rich-text editing, real-time preview, and drag-and-drop media uploads."
-  - feature: "Platform agnostic"
-    description: "Works with most static site generators for sites stored in GitHub."
-  - feature: "Easy installation"
-    description: "Add two files to your site, include or link to the JS, and add your custom configuration."
-  - feature: "Modern authentication"
-    description: "Connect with Netflify's authentication service or roll your own, using GitHub and JSON web tokens."
-  - feature: "Flexible content types"
-    description: "Specify an unlimited number of content types with custom fields."
-  - feature: "Fully extensible"
-    description: "Create custom-styled previews, UI widgets, and editor plugins."
-
-featuresgraphic: "/img/helix.svg"
-
-inspiration: |
-  Netlify CMS is part of a long evolution in content management for the web. Even in the budding realm of the [JAMstack](https://www.jamstack.org) and [static site generators](https://www.staticgen.com), developers have a variety [“headless” CMS](http://www.headlesscms.org) options to choose from.
-
-  Proprietary services like Contentful and DatoCMS provide the ease and polish of a concierge provider, while simple open source projects like Prose and Google Drive CMS provide targeted functionality for limited use cases. We love that these other projects help advance the modern web, and we believe there will always be a place for them in the JAMstack ecosystem.
-
-  With Netlify CMS, we hope to carve a different niche. We aim to do for the JAMstack what WordPress did for dynamic sites back in the day. In other words, we want to build a CMS that is open-source but fully-featured and production-ready, that’s as easy to customize as it is to use, and that developers and content editors can build a community around.
-
-  [Help us make it happen!](/docs/contributor-guide)
 ---

website/site/data/notifications.yml

@@ -11,6 +11,6 @@ notifications:
     message: >-
       We have a community on Gitter - join now to ask questions and discuss the
       project with other devs!
-    published: true
+    published: false
     title: Gitter shoutout
     url: 'https://gitter.im/netlify/netlifycms'