diff --git a/.gitignore b/.gitignore index 1824b939..02d67216 100644 --- a/.gitignore +++ b/.gitignore @@ -8,5 +8,5 @@ yarn-error.log .vscode/ manifest.yml .imdone/ - +website/site/data/contributors.yml /coverage/ diff --git a/website/config/variables.js b/website/config/variables.js index 96fec710..ac0bece2 100644 --- a/website/config/variables.js +++ b/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', diff --git a/website/gulpfile.babel.js b/website/gulpfile.babel.js index ee52417e..ab8b757c 100755 --- a/website/gulpfile.babel.js +++ b/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("server", ["hugo", "css", "js", "fonts", "images"], () => { +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", ["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"); - } - }); -} - diff --git a/website/package.json b/website/package.json index 94f0cf82..83a9ca39 100755 --- a/website/package.json +++ b/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", diff --git a/website/site/data/landing.yaml b/website/site/data/landing.yaml index 28dc6e36..00309950 100644 --- a/website/site/data/landing.yaml +++ b/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." -thanksdevs: "**Thanks to all our contributors.**Keep shooting for the stars with Netlify CMS." +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/)" -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" +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" -featureshook: "Designed with developers in mind - it’s in our DNA." +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" -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) --- diff --git a/website/site/data/notifications.yml b/website/site/data/notifications.yml index ec99f1b7..c684e498 100644 --- a/website/site/data/notifications.yml +++ b/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' diff --git a/website/site/layouts/index.html b/website/site/layouts/index.html index e1b78da8..59bba34c 100755 --- a/website/site/layouts/index.html +++ b/website/site/layouts/index.html @@ -1,69 +1,72 @@ {{ partial "header" . }}
- As seen on... - -
+ {{ .Site.Data.landing.hero.subhead | markdownify }}{{ .Site.Data.landing.collab.body | markdownify }}
-{{ .description | markdownify }}
{{ .Site.Data.landing.cta.primaryhook | markdownify }} {{ .Site.Data.landing.cta.primary | markdownify }}
{{ .Site.Data.landing.cta.button | markdownify }} +{{ .Site.Data.landing.editors.intro | markdownify }}
+{{ .description | markdownify }}
+{{ .Site.Data.landing.inspiration | markdownify }}
+{{ .description | markdownify }}
+