Merge branch 'master' into style-cpp-domain

Gruntfile.js

@@ -1,189 +0,0 @@
-module.exports = function(grunt) {
-
-  // load all grunt tasks
-  require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
-
-  grunt.initConfig({
-    // Read package.json
-    pkg: grunt.file.readJSON("package.json"),
-
-    open : {
-      dev: {
-        path: 'http://localhost:1919'
-      }
-    },
-
-    connect: {
-      server: {
-        options: {
-          port: 1919,
-          base: 'docs/build',
-          livereload: true
-        }
-      }
-    },
-    copy: {
-      fonts: {
-        files: [
-          {
-              expand: true,
-              flatten: true,
-              src: ['bower_components/font-awesome/fonts/*'],
-              dest: 'sphinx_rtd_theme/static/fonts/',
-              filter: 'isFile'
-          },
-          {
-              expand: true,
-              flatten: true,
-              src: ['fonts/Lato/*'],
-              dest: 'sphinx_rtd_theme/static/fonts/Lato',
-              filter: 'isFile'
-          },
-          {
-              expand: true,
-              flatten: true,
-              src: ['fonts/RobotoSlab/*'],
-              dest: 'sphinx_rtd_theme/static/fonts/RobotoSlab/',
-              filter: 'isFile'
-          }
-        ]
-      }
-    },
-
-    sass: {
-      dev: {
-        options: {
-          style: 'expanded',
-          loadPath: ['bower_components/bourbon/dist', 'bower_components/neat/app/assets/stylesheets', 'bower_components/font-awesome/scss', 'bower_components/wyrm/sass']
-        },
-        files: [{
-          expand: true,
-          cwd: 'sass',
-          src: ['*.sass'],
-          dest: 'sphinx_rtd_theme/static/css',
-          ext: '.css'
-        }]
-      },
-      build: {
-        options: {
-          style: 'compressed',
-          sourcemap: 'none',
-          loadPath: ['bower_components/bourbon/dist', 'bower_components/neat/app/assets/stylesheets', 'bower_components/font-awesome/scss', 'bower_components/wyrm/sass']
-        },
-        files: [{
-          expand: true,
-          cwd: 'sass',
-          src: ['*.sass'],
-          dest: 'sphinx_rtd_theme/static/css',
-          ext: '.css'
-        }]
-      }
-    },
-
-    browserify: {
-      dev: {
-        options: {
-          external: ['jquery'],
-          alias: {
-            'sphinx-rtd-theme': './js/theme.js'
-          }
-        },
-        src: ['js/*.js'],
-        dest: 'sphinx_rtd_theme/static/js/theme.js'
-      },
-      build: {
-        options: {
-          external: ['jquery'],
-          alias: {
-            'sphinx-rtd-theme': './js/theme.js'
-          }
-        },
-        src: ['js/*.js'],
-        dest: 'sphinx_rtd_theme/static/js/theme.js'
-      }
-    },
-    uglify: {
-      dist: {
-        options: {
-          sourceMap: false,
-          mangle: {
-            reserved: ['jQuery'] // Leave 'jQuery' identifier unchanged
-          },
-          ie8: true // compliance with IE 6-8 quirks
-        },
-        files: [{
-          expand: true,
-          src: ['sphinx_rtd_theme/static/js/*.js', '!sphinx_rtd_theme/static/js/*.min.js'],
-          dest: 'sphinx_rtd_theme/static/js/',
-          rename: function (dst, src) {
-            // Use unminified file name for minified file
-            return src;
-          }
-        }]
-      }
-    },
-    usebanner: {
-      dist: {
-        options: {
-          position: 'top',
-          banner: '/* <%= pkg.name %> version <%= pkg.version %> | MIT license */\n' +
-                  '/* Built <%= grunt.template.today("yyyymmdd HH:mm") %> */',
-          linebreak: true
-        },
-        files: {
-          src: [ 'sphinx_rtd_theme/static/js/theme.js', 'sphinx_rtd_theme/static/css/theme.css' ]
-        }
-      }
-    },
-    exec: {
-      bower_update: {
-        cmd: 'bower update'
-      },
-      build_sphinx: {
-        cmd: 'sphinx-build docs/ docs/build'
-      }
-    },
-    clean: {
-      build: ["docs/build"],
-      fonts: ["sphinx_rtd_theme/static/fonts"],
-      css: ["sphinx_rtd_theme/static/css"],
-      js: ["sphinx_rtd_theme/static/js/*", "!sphinx_rtd_theme/static/js/modernizr.min.js"]
-    },
-
-    watch: {
-      /* Compile sass changes into theme directory */
-      sass: {
-        files: ['sass/*.sass', 'bower_components/**/*.sass'],
-        tasks: ['sass:dev']
-      },
-      /* Changes in theme dir rebuild sphinx */
-      sphinx: {
-        files: ['sphinx_rtd_theme/**/*', 'README.rst', 'docs/**/*.rst', 'docs/**/*.py'],
-        tasks: ['clean:build','exec:build_sphinx']
-      },
-      /* JavaScript */
-      browserify: {
-        files: ['js/*.js'],
-        tasks: ['browserify:dev']
-      },
-      /* live-reload the docs if sphinx re-builds */
-      livereload: {
-        files: ['docs/build/**/*'],
-        options: { livereload: true }
-      }
-    }
-
-  });
-
-  grunt.loadNpmTasks('grunt-exec');
-  grunt.loadNpmTasks('grunt-contrib-connect');
-  grunt.loadNpmTasks('grunt-contrib-watch');
-  grunt.loadNpmTasks('grunt-contrib-sass');
-  grunt.loadNpmTasks('grunt-contrib-clean');
-  grunt.loadNpmTasks('grunt-contrib-copy');
-  grunt.loadNpmTasks('grunt-open');
-  grunt.loadNpmTasks('grunt-browserify');
-
-  grunt.registerTask('default', ['exec:bower_update','clean','copy:fonts','sass:dev','browserify:dev','usebanner','exec:build_sphinx','connect','open','watch']);
-  grunt.registerTask('build', ['exec:bower_update','clean','copy:fonts','sass:build','browserify:build','uglify','usebanner','exec:build_sphinx']);
-}

bower.json

@@ -1,37 +0,0 @@
-{
-  "name": "sphinx-rtd-theme",
-  "version": "0.4.3",
-  "homepage": "https://github.com/rtfd/sphinx_rtd_theme",
-  "authors": [
-    "Dave Snider, Read the Docs, Inc. & contributors <dev@readthedocs.org>"
-  ],
-  "description": "Sphinx theme for readthedocs.org.",
-  "license": "MIT",
-  "main": [
-    "js/theme.js"
-  ],
-  "ignore": [
-    "docs",
-    ".gitignore",
-    ".DS_Store",
-    ".sass-cache*",
-    ".bowerrc",
-    "bower.json",
-    "package.json",
-    "Gruntfile.js",
-    "node_modules",
-    "bower_components",
-    "test",
-    "tests",
-    "src"
-  ],
-  "devDependencies": {
-    "wyrm": "~1.0.x"
-  },
-  "dependencies": {
-    "font-awesome": "~4.7"
-  },
-  "resolutions": {
-    "font-awesome": "~4.7"
-  }
-}

docs/changelog.rst

@@ -19,6 +19,7 @@ Other Changes
 * Add the ``navigation`` template block around the navigation area.
 * Added Spanish translation
 * Added i18n support using Babel
+* Moved build system from Grunt and friends to Webpack
 
 0.4.3
 ======

docs/contributing.rst

@@ -10,13 +10,12 @@ Modifying the theme
 ===================
 
 The styles for this theme use SASS_ and a custom CSS framework called Wyrm_. We
-use Bower_ to manage these dependencies and SASS_ to build the CSS. Grunt_ is
-used to watch for changes, rebuild the static assets, and rebuild the Sphinx
-demo documentation.
+use Webpack_ and node-sass_ to build the CSS. Webpack_ is used to watch for
+changes, rebuild the static assets, and rebuild the Sphinx demo documentation.
 
 .. note::
-    The installation of Ruby and Node is outside the scope of this
-    documentation. You will need both in order to make changes to this theme.
+    The installation of Node is outside the scope of this documentation. You
+    will need Node version 10+ in order to make changes to this theme.
 
 Set up your environment
 -----------------------
@@ -27,13 +26,7 @@ Set up your environment
 
        pip install -e '.[dev]'
 
-#. Install SASS.
-
-   .. code:: console
-
-       gem install sass
-
-#. Install Bower, Grunt, and theme dependencies locally.
+#. Install Webpack_, node-sass_, and theme dependencies locally.
 
    .. code:: console
 
@@ -42,31 +35,31 @@ Set up your environment
 Making changes
 --------------
 
-Changes to the theme can be compiled and tested with the default Grunt task:
+Changes to the theme can be compiled and tested with Webpack_:
 
 .. code:: console
 
-    grunt
+    npm run dev
 
-This default task will do the following:
+This script will do the following:
 
-#. Install and update any Bower dependencies.
+#. Install and update any dependencies.
 #. Build the static CSS from SASS source files.
 #. Build the demo documentation.
 #. Watch for changes to the SASS files and documentation and rebuild everything
    on any detected changes.
 
-Alternatively, if you don't need to watch the files, Grunt can be called with
-the same task used for releases:
+Alternatively, if you don't need to watch the files, the release build script
+can be used to test built assets:
 
 .. code:: console
 
-    grunt build
+    npm run build
 
-.. _Bower: http://www.bower.io
+.. _Webpack: https://webpack.js.org/
+.. _node-sass: https://github.com/sass/node-sass
 .. _SASS: http://www.sass-lang.com
 .. _Wyrm: http://www.github.com/snide/wyrm/
-.. _Grunt: http://www.gruntjs.com
 .. _Sphinx: http://www.sphinx-doc.org/en/stable/
 
 Translations
@@ -96,10 +89,12 @@ Releasing the theme
 
 To release a new version of the theme, core team will take the following steps:
 
-#. Bump the version in ``sphinx_rtd_theme/__init__.py``, ``bower.json`` and ``package.json`` --
-   we try to follow `semver <http://semver.org/>`_, so be careful with breaking changes.
+#. Bump the version in ``sphinx_rtd_theme/__init__.py``, ``setup.py`` and
+   ``package.json``.  We follow `semver <http://semver.org/>`_ and `PEP440`_
+   (with regards to alpha release and development versions). The version
+   increment should reflect these releases and any potentially breaking changes.
 #. Update the changelog (``docs/changelog.rst``) with the version information.
-#. Run ``grunt build`` to rebuild all the theme assets.
+#. Run ``npm run build`` to rebuild all the theme assets.
 #. Run ``python setup.py update_translations`` to compile new translation files and update Transifex
 #. Commit that change.
 #. Tag the release in git: ``git tag $NEW_VERSION``.
@@ -111,3 +106,5 @@ To release a new version of the theme, core team will take the following steps:
         rm -rf dist/
         python setup.py sdist bdist_wheel
         twine upload --sign --identity security@readthedocs.org dist/*
+
+.. _PEP440: https://www.python.org/dev/peps/pep-0440/

package.json

@@ -3,21 +3,33 @@
   "main": "js/theme.js",
   "version": "0.4.3",
   "private": true,
+  "scripts": {
+    "dev": "webpack-dev-server --open --config webpack.dev.js",
+    "build": "webpack --config webpack.prod.js"
+  },
+  "dependencies": {},
   "devDependencies": {
-    "bower": "^1.8.4",
-    "browserify": "^13.0.0",
-    "connect-livereload": "~0.6.0",
-    "grunt": "~1.0.1",
-    "grunt-banner": "^0.6.0",
-    "grunt-browserify": "^5.0.0",
-    "grunt-contrib-clean": "^1.0.0",
-    "grunt-contrib-connect": "^1.0.2",
-    "grunt-contrib-copy": "~1.0.0",
-    "grunt-contrib-sass": "~1.0.0",
-    "grunt-contrib-uglify": "~3.3.0",
-    "grunt-contrib-watch": "~1.0.0",
-    "grunt-exec": "~1.0.1",
-    "grunt-open": "0.2.3",
-    "matchdep": "~1.0.1"
+    "bourbon": "~4.3",
+    "bourbon-neat": "~1.9",
+    "css-loader": "^3.1.0",
+    "file-loader": "^3.0.1",
+    "font-awesome": "^4.7.0",
+    "imports-loader": "^0.8.0",
+    "jquery": "^3.4.1",
+    "lato-font": "^3.0.0",
+    "matchdep": "~1.0.1",
+    "mini-css-extract-plugin": "^0.6.0",
+    "node-sass": "^4.12.0",
+    "optimize-css-assets-webpack-plugin": "^5.0.3",
+    "roboto-fontface": "^0.10.0",
+    "sass-loader": "^7.1.0",
+    "style-loader": "^0.23.1",
+    "webpack": "^4.30.0",
+    "webpack-cli": "^3.3.1",
+    "webpack-dev-server": "^3.3.1",
+    "webpack-merge": "^4.2.1",
+    "webpack-shell-plugin": "^0.5.0",
+    "webpack-watch-files-plugin": "^1.0.3",
+    "wyrm": "^1.0.9"
   }
 }

sass/_theme_font_local.sass

@@ -1,47 +0,0 @@
-@font-face
-  font-family: 'Lato'
-  src: url('../fonts/Lato/lato-regular.eot')
-  src: url('../fonts/Lato/lato-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato/lato-regular.woff2') format('woff2'), url('../fonts/Lato/lato-regular.woff') format('woff'), url('../fonts/Lato/lato-regular.ttf') format('truetype')
-  font-weight: 400
-  font-style: normal
-  font-display: $font-display
-
-@font-face
-  font-family: 'Lato'
-  src: url('../fonts/Lato/lato-bold.eot')
-  src: url('../fonts/Lato/lato-bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato/lato-bold.woff2') format('woff2'), url('../fonts/Lato/lato-bold.woff') format('woff'), url('../fonts/Lato/lato-bold.ttf') format('truetype')
-  font-weight: 700
-  font-style: normal
-  font-display: $font-display
-
-@font-face
-  font-family: 'Lato'
-  src: url('../fonts/Lato/lato-bolditalic.eot')
-  src: url('../fonts/Lato/lato-bolditalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato/lato-bolditalic.woff2') format('woff2'), url('../fonts/Lato/lato-bolditalic.woff') format('woff'), url('../fonts/Lato/lato-bolditalic.ttf') format('truetype')
-  font-weight: 700
-  font-style: italic
-  font-display: $font-display
-
-@font-face
-  font-family: 'Lato'
-  src: url('../fonts/Lato/lato-italic.eot')
-  src: url('../fonts/Lato/lato-italic.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato/lato-italic.woff2') format('woff2'), url('../fonts/Lato/lato-italic.woff') format('woff'), url('../fonts/Lato/lato-italic.ttf') format('truetype')
-  font-weight: 400
-  font-style: italic
-  font-display: $font-display
-
-@font-face
-  font-family: 'Roboto Slab'
-  font-style: normal
-  font-weight: 400
-  src: url('../fonts/RobotoSlab/roboto-slab.eot')
-  src: url('../fonts/RobotoSlab/roboto-slab-v7-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/RobotoSlab/roboto-slab-v7-regular.woff2') format('woff2'), url('../fonts/RobotoSlab/roboto-slab-v7-regular.woff') format('woff'), url('../fonts/RobotoSlab/roboto-slab-v7-regular.ttf') format('truetype')
-  font-display: $font-display
-
-@font-face
-  font-family: 'Roboto Slab'
-  font-style: normal
-  font-weight: 700
-  src: url('../fonts/RobotoSlab/roboto-slab-v7-bold.eot')
-  src: url('../fonts/RobotoSlab/roboto-slab-v7-bold.eot?#iefix') format('embedded-opentype'), url('../fonts/RobotoSlab/roboto-slab-v7-bold.woff2') format('woff2'), url('../fonts/RobotoSlab/roboto-slab-v7-bold.woff') format('woff'), url('../fonts/RobotoSlab/roboto-slab-v7-bold.ttf') format('truetype')
-  font-display: $font-display

setup.py

@@ -10,8 +10,6 @@ import distutils.cmd
 from io import open
 from setuptools import setup
 
-from sphinx_rtd_theme import __version__
-
 
 class UpdateTranslationsCommand(distutils.cmd.Command):
 
@@ -55,7 +53,7 @@ class TransifexCommand(distutils.cmd.Command):
 
 setup(
     name='sphinx_rtd_theme',
-    version=__version__,
+    version='0.4.3.dev0',
     url='https://github.com/rtfd/sphinx_rtd_theme/',
     license='MIT',
     author='Dave Snider, Read the Docs, Inc. & contributors',

src/index.js

@@ -0,0 +1,3 @@
+import './sass/theme.sass';
+import './sass/badge_only.sass';
+import './theme.js';

src/sass/_theme_badge_fa.sass

@@ -1,6 +1,6 @@
 // Slimmer version of FA for use on the badge_only.sass file.
 
-+font-face(FontAwesome, '#{$font-awesome-dir}fontawesome-webfont')
++font-face(FontAwesome, '#{$fa-font-path}/fontawesome-webfont')
 
 .fa:before
   display: inline-block

src/sass/_theme_font_local.sass

@@ -0,0 +1,46 @@
+$lato-font-path: "~lato-font/fonts";
+$roboto-font-path: "~roboto-fontface/fonts/roboto-slab";
+
+//  $font-full-path: '#{$roboto-font-path}/roboto-slab/Roboto-Slab';
+
+@font-face
+  font-family: 'Lato'
+  src: url('#{$lato-font-path}/lato-normal/lato-normal.woff2') format('woff2'), url('#{$lato-font-path}/lato-normal/lato-normal.woff') format('woff')
+  font-weight: 400
+  font-style: normal
+  font-display: $font-display
+
+@font-face
+  font-family: 'Lato'
+  src: url('#{$lato-font-path}/lato-bold/lato-bold.woff2') format('woff2'), url('#{$lato-font-path}/lato-bold/lato-bold.woff') format('woff')
+  font-weight: 700
+  font-style: normal
+  font-display: $font-display
+
+@font-face
+  font-family: 'Lato'
+  src: url('#{$lato-font-path}/lato-bold-italic/lato-bold-italic.woff2') format('woff2'), url('#{$lato-font-path}/lato-bold-italic/lato-bold-italic.woff') format('woff')
+  font-weight: 700
+  font-style: italic
+  font-display: $font-display
+
+@font-face
+  font-family: 'Lato'
+  src: url('#{$lato-font-path}/lato-normal-italic/lato-normal-italic.woff2') format('woff2'), url('#{$lato-font-path}/lato-normal-italic/lato-normal-italic.woff') format('woff')
+  font-weight: 400
+  font-style: italic
+  font-display: $font-display
+
+@font-face
+  font-family: 'Roboto Slab'
+  font-style: normal
+  font-weight: 400
+  src: url('#{$roboto-font-path}/Roboto-Slab-Regular.woff2') format('woff2'), url('#{$roboto-font-path}/Roboto-Slab-Regular.woff') format('woff')
+  font-display: $font-display
+
+@font-face
+  font-family: 'Roboto Slab'
+  font-style: normal
+  font-weight: 700
+  src: url('#{$roboto-font-path}/Roboto-Slab-Bold.woff2') format('woff2'), url('#{$roboto-font-path}/Roboto-Slab-Bold.woff') format('woff')
+  font-display: $font-display

src/sass/_theme_variables.sass

@@ -2,7 +2,7 @@
 // that are set in wyrm_core/wy_variables.sass. You'll find wyrm in bower_components if you're looking
 // for a reference.
 
-$font-awesome-dir:                    "../fonts/"
+$fa-font-path:                        "~font-awesome/fonts"
 $static-img:                          "../img/"
 
 $nav-content-width:                   800px

src/sass/badge_only.sass

@@ -8,8 +8,8 @@ $border-box-sizing: false !default
 
 @import wyrm_core/wy_variables
 @import theme_variables
-@import bourbon
-@import neat
+@import ~bourbon/app/assets/stylesheets/bourbon
+@import ~bourbon-neat/app/assets/stylesheets/neat
 @import wyrm_core/mixin
 @import wyrm_core/grid_settings
 @import _theme_badge_fa

src/sass/theme.sass

@@ -13,11 +13,11 @@
 @import theme_variables
 
 // bourbon.io framework
-@import bourbon
+@import ~bourbon/app/assets/stylesheets/bourbon
 
 // Bourbon.io/neat framework, with some default media queries
 @import wyrm_core/grid_settings
-@import neat
+@import ~bourbon-neat/app/assets/stylesheets/neat
 // Some corrections for neat
 @import wyrm_core/neat_extra
 

webpack.common.js

@@ -0,0 +1,56 @@
+const path = require('path');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+
+module.exports = {
+  entry: './src/index.js',
+  output: {
+    filename: 'js/theme.js',
+    path: path.resolve(__dirname, 'sphinx_rtd_theme/static')
+  },
+  module: {
+    rules: [
+      {
+        test: require.resolve('./src/theme.js'),
+        use: 'imports-loader?this=>window'
+      },
+      {
+        test: /\.sass$/,
+        use: [{
+          loader: MiniCssExtractPlugin.loader
+        },
+        {
+          loader: "css-loader"
+        },
+        {
+          loader: "sass-loader?indentedSyntax",
+          options: {
+            includePaths: [
+              'node_modules/bourbon/app/assets/stylesheets',
+              'node_modules/bourbon-neat/app/assets/stylesheets',
+              'node_modules/font-awesome/scss',
+              'node_modules/wyrm/sass'
+            ]
+          }
+        }]
+      },
+      {
+        test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
+        use: [{
+          loader: 'file-loader',
+          options: {
+            name: '[name].[ext]?[hash]',
+            outputPath: 'fonts/',
+            publicPath: '../fonts/',
+          }
+        }]
+      }
+    ]
+  },
+  plugins: [
+    new MiniCssExtractPlugin({
+      // Options similar to the same options in webpackOptions.output
+      // both options are optional
+      filename: 'css/theme.css'
+    })
+  ],
+};

webpack.dev.js

@@ -0,0 +1,34 @@
+const path = require('path');
+const merge = require('webpack-merge');
+const exec = require('child_process').exec;
+const WatchPlugin = require('webpack-watch-files-plugin').default;
+const ShellPlugin = require('webpack-shell-plugin');
+const common = require('./webpack.common.js');
+
+module.exports = merge(common, {
+  mode: 'development',
+  watch: true,
+  devServer: {
+    contentBase: path.join(__dirname, 'docs/build/html'),
+    watchContentBase: true,
+    compress: false,
+    port: 1919,
+    hot: false,
+    liveReload: true,
+    publicPath: '/_static/'
+  },
+  plugins: [
+    new WatchPlugin({
+      files: [
+        './docs/**/*.rst',
+        './docs/**/*.py',
+      ]
+    }),
+    new ShellPlugin({
+      onBuildEnd: ['make -C docs clean html'],
+      // dev=false here to force every build to trigger make, the default is
+      // first build only.
+      dev: false,
+    }),
+  ]
+});

webpack.prod.js

@@ -0,0 +1,11 @@
+const merge = require('webpack-merge');
+const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
+const TerserPlugin = require('terser-webpack-plugin');
+const common = require('./webpack.common.js');
+
+module.exports = merge(common, {
+  mode: 'production',
+  optimization: {
+    minimizer: [new TerserPlugin(), new OptimizeCssAssetsPlugin({})],
+  },
+});