Files
jenkins/war/webpack.config.js
T
673a18c637 [JENKINS 60920] header breadcrumbs CSS update (#4463)
* New styles for breadcrumbs and warnings monitor

* Adds the svgxuse polyfill for svg sprites on IE 11

* Created new styles for the page header

- Used the material icons svg sprites to deliver the icons
- Icons are rendered using a <svg> tag

* Create new base styles file and undo changes to the layout-common and style css files

* Fixes and refactor for the new UI CSS code

* Make the new header color and logo section opt-in

- The new UI can be toggled with the -Dui.enableNewUi=true flag

* Rename and refactor the page-header css

- Rename the css class namespace from .main-header to .page-header
- Page header CSS moved into a modules folder and now included on the new-base-styles.css. This is done to avoid loading a separate file everytime.
- Extracted color variables to their own file

* Updated localization for header and admin monitor

- The pageHeader template receives localization strings as props
- Missing translation for the admin monitor on the it, bg and pl locales

* Update core/src/main/resources/lib/layout/layout.jelly

Co-Authored-By: Tim Jacomb <t.jacomb@kainos.com>

* Most measurements migrated to REMs

* Code cleanup and apply new-ui toggle to the html.jelly file

* Breadcrumb fixes

- Reverts breadcrumb link styling to use nested selectors instead of the .breadcrumbs__link class. The reason is that several plugins would break.
- Shifted margins so that breadcrumbs can be fullwidth in the absence of the auto refresh link

* Implemented some fixes from the feedback received

- Removed box shadow webkit prefix
- Fixed formatting on the breadcrumbs.css and layout-commons.less files
- Renamed the new UI toggle class from _new-ui_ to _ui-refresh_
- Renamed references to the _new ui_ to _v2_

* Created jelly helper to use svg icons

* Fix: restore proper icon for the user on the header

* Fixes for Edge, IE 11 and IE 10

* Improvements on the header and breadcrumbs

- Logo v2 changed and optimized using the svgo frontend https://jakearchibald.github.io/svgomg/
- Refactored the ammonitor insertion code
- Breadcrumbs are no longer capitalized
- Classic logo link no longer stretches past the images
- Fixed classic logo link on IE11
- Updated color of the footer
- Menu items background is also changed when hovering over the menu selector
- Removed copyright notice on top of some files

* Bumped JTH version with the SVG download fix

* Update test/pom.xml

Co-Authored-By: Tim Jacomb <t.jacomb@kainos.com>

* Added a function to check boolean system properties from jelly

* Fix header links and add svg styles for legacy layout

*  Some bug fixing for the new header

- The ui-refresh changes were not properly being enabled with the boolean system property. Added explicit true check on the jelly templates.
- Added an explicit width for the ui-refresh logo because it would mess with the layout

* Update core/src/main/java/hudson/Functions.java

Co-Authored-By: Adrien Lecharpentier <adrien.lecharpentier@gmail.com>

* Do not check the system property on every page render

Co-authored-by: Tim Jacomb <t.jacomb@kainos.com>
Co-authored-by: Adrien Lecharpentier <adrien.lecharpentier@gmail.com>
Co-authored-by: Daniel Beck <1831569+daniel-beck@users.noreply.github.com>
2020-02-20 16:57:47 +00:00

140 lines
4.1 KiB
JavaScript

/* eslint no-undef: 0 */
const path = require('path');
const MiniCSSExtractPlugin = require('mini-css-extract-plugin');
const FixStyleOnlyEntriesPlugin = require('webpack-fix-style-only-entries');
const CopyPlugin = require('copy-webpack-plugin');
const { CleanWebpackPlugin: CleanPlugin } = require('clean-webpack-plugin');
module.exports = {
mode: 'development',
entry: {
"page-init": [path.join(__dirname, "src/main/js/page-init.js")],
"pluginSetupWizard": [
path.join(__dirname, "src/main/js/pluginSetupWizard.js"),
path.join(__dirname, "src/main/less/pluginSetupWizard.less"),
],
"upgradeWizard": [path.join(__dirname, "src/main/js/upgradeWizard.js")],
"add-item": [
path.join(__dirname, "src/main/js/add-item.js"),
path.join(__dirname, "src/main/js/add-item.less"),
],
"config-scrollspy": [
path.join(__dirname, "src/main/js/config-scrollspy.js"),
path.join(__dirname, "src/main/js/config-scrollspy.less"),
],
"config-tabbar": [
path.join(__dirname, "src/main/js/config-tabbar.js"),
path.join(__dirname, "src/main/js/config-tabbar.less"),
],
// New UI CSS files
"base-styles-v2": [path.join(__dirname, "src/main/less/base-styles-v2.less")],
"ui-refresh-overrides": [path.join(__dirname, "src/main/less/ui-refresh-overrides.less")],
},
output: {
path: path.join(__dirname, "src/main/webapp/jsbundles"),
},
plugins: [
new FixStyleOnlyEntriesPlugin(),
new MiniCSSExtractPlugin({
filename: "[name].css",
}),
new CopyPlugin([
// Copies fonts to the src/main/webapp/css for compat purposes
// Some plugins or parts of the UI try to load them from these paths
{
context: 'src/main/fonts',
from: "**/*",
to: path.join(__dirname, "src/main/webapp/css")
}
]),
// Clean all assets within the specified output.
// It will not clean copied fonts
new CleanPlugin(),
],
module: {
rules: [
{
test: /\.(css|less)$/,
loader: [
MiniCSSExtractPlugin.loader,
{
loader: 'css-loader',
options: {
url: (url, resourcePath) => {
// ignore the URLS on the base styles as they are picked
// from the src/main/webapp/images dir
if (resourcePath.includes('base-styles-v2.less')) {
return false;
}
return true;
}
}
},
'less-loader'
]
},
{
test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
use: [
{
loader: 'file-loader',
options: {
name: '[name].[ext]',
outputPath: 'fonts/'
}
}
]
},
{
test: /\.hbs$/,
loader: "handlebars-loader",
options: {
// The preferred option for adding handlebars helpers is putting them
// inside this helpers directory
helperDirs: path.join(__dirname, 'src/main/js/handlebars-helpers'),
precompileOptions: {
knownHelpersOnly: false,
// Helpers registered with Handlebars.registerHelper must be listed so that
// handlebars-loader will expect them when compiling the templates.
// This helpers cannot be moved to the helpers directory because they are closures
knownHelpers: [
'pluginCountForCategory',
'totalPluginCount',
'inSelectedPlugins',
'dependencyCount',
'eachDependency',
'ifVisibleDependency'
]
},
},
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: "babel-loader",
},
]
},
optimization: {
splitChunks: {
chunks: 'async',
cacheGroups: {
commons: {
test: /[\\/]node_modules[\\/]/,
name: 'vendors',
chunks: 'all'
}
}
}
},
resolve: {
alias:{
// Needed to be able to register helpers at runtime
handlebars: 'handlebars/runtime',
},
},
}