diff --git a/package.json b/package.json
index 42731a8..cc99517 100644
--- a/package.json
+++ b/package.json
@@ -17,19 +17,23 @@
"chrome-remote-interface": "^0.25.5",
"compression-webpack-plugin": "~1.0.0",
"copy-webpack-plugin": "~3.0.1",
+ "css-loader": "^0.28.11",
"eslint": "^3.0.0",
"eslint-loader": "~1.6.1",
"eslint-plugin-react": "~6.9.0",
+ "extract-text-webpack-plugin": "^2.1.0",
"htmlparser": "^1.7.7",
"jed": "^1.1.1",
"jshint": "~2.9.1",
"jshint-loader": "~0.8.3",
"po2json": "^0.4.5",
+ "sass-loader": "^7.0.3",
"sizzle": "^2.3.3",
"stdio": "^0.2.7",
"webpack": "^2.6.1"
},
"dependencies": {
+ "node-sass": "^4.9.0",
"react-lite": "0.15.30"
}
}
diff --git a/src/app.jsx b/src/app.jsx
index 8c81d9f..a7f4aa6 100644
--- a/src/app.jsx
+++ b/src/app.jsx
@@ -20,6 +20,7 @@
import cockpit from 'cockpit';
import React from 'react';
+import './app.scss';
const _ = cockpit.gettext;
@@ -36,9 +37,9 @@ export class Application extends React.Component {
return (
Starter Kit
-
- { cockpit.format(_("Running on $0"), this.state.hostname) }
-
+
+ { cockpit.format(_("Running on $0"), this.state.hostname) }
+
);
}
diff --git a/src/app.scss b/src/app.scss
new file mode 100644
index 0000000..87b46f4
--- /dev/null
+++ b/src/app.scss
@@ -0,0 +1,3 @@
+p {
+ font-weight: bold;
+}
diff --git a/src/index.html b/src/index.html
index 794a072..5182d9b 100644
--- a/src/index.html
+++ b/src/index.html
@@ -23,6 +23,7 @@ along with this package; If not, see .
+
diff --git a/test/check-application b/test/check-application
index befa153..34c90e6 100755
--- a/test/check-application
+++ b/test/check-application
@@ -26,8 +26,8 @@ class TestApplication(testlib.MachineCase):
# verify expected host name
hostname = m.execute("hostname").strip()
- b.wait_present(".container-fluid span")
- b.wait_text(".container-fluid span", "Running on " + hostname)
+ b.wait_present(".container-fluid p")
+ b.wait_text(".container-fluid p", "Running on " + hostname)
# change language to German
b.switch_to_top()
@@ -46,7 +46,7 @@ class TestApplication(testlib.MachineCase):
b.go("/starter-kit")
b.enter_page("/starter-kit")
# page label (from js) should be translated
- b.wait_in_text(".container-fluid span", "Läuft auf")
+ b.wait_in_text(".container-fluid p", "Läuft auf")
if __name__ == '__main__':
testlib.test_main()
diff --git a/webpack.config.js b/webpack.config.js
index b162489..1b64da4 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,5 +1,6 @@
const path = require("path");
const copy = require("copy-webpack-plugin");
+const extract = require("extract-text-webpack-plugin");
const fs = require("fs");
const webpack = require("webpack");
const CompressionPlugin = require("compression-webpack-plugin");
@@ -82,7 +83,8 @@ var plugins = [
'NODE_ENV': JSON.stringify(production ? 'production' : 'development')
}
}),
- new copy(info.files)
+ new copy(info.files),
+ new extract("[name].css")
];
/* Only minimize when in production mode */
@@ -149,6 +151,11 @@ module.exports = {
exclude: /node_modules/,
loader: 'babel-loader',
test: /\.es6$/
+ },
+ {
+ exclude: /node_modules/,
+ loader: extract.extract('css-loader!sass-loader'),
+ test: /\.scss$/
}
]
},