From e120422b058eb47630d1eff8b9ae84f66d29c54c Mon Sep 17 00:00:00 2001 From: n1474335 Date: Sun, 9 Apr 2017 14:06:59 +0100 Subject: [PATCH] Styles now imported through Sass. Less removed. --- Gruntfile.js | 8 +-- package.json | 6 +- src/web/css/index.js | 18 ------ src/web/css/lib/bootstrap.less | 58 ------------------- src/web/index.js | 6 +- src/web/stylesheets/main.scss | 21 +++++++ .../structure/layout.scss} | 0 .../structure/overrides.scss} | 0 .../structure/utils.scss} | 0 .../themes/classic.scss} | 0 src/web/stylesheets/vendors/bootstrap.scss | 58 +++++++++++++++++++ 11 files changed, 89 insertions(+), 86 deletions(-) delete mode 100644 src/web/css/index.js delete mode 100644 src/web/css/lib/bootstrap.less create mode 100644 src/web/stylesheets/main.scss rename src/web/{css/structure/layout.css => stylesheets/structure/layout.scss} (100%) rename src/web/{css/structure/overrides.css => stylesheets/structure/overrides.scss} (100%) rename src/web/{css/structure/utils.css => stylesheets/structure/utils.scss} (100%) rename src/web/{css/themes/classic.css => stylesheets/themes/classic.scss} (100%) create mode 100644 src/web/stylesheets/vendors/bootstrap.scss diff --git a/Gruntfile.js b/Gruntfile.js index 1d357613..68bc4751 100755 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -54,7 +54,7 @@ module.exports = function (grunt) { // Project configuration - var compileTime = grunt.template.today("dd/mm/yyyy HH:MM:ss") + " UTC", + var compileTime = grunt.template.today("UTC:dd/mm/yyyy HH:MM:ss") + " UTC", banner = "/**\n" + "* CyberChef - The Cyber Swiss Army Knife\n" + "*\n" + @@ -184,11 +184,11 @@ module.exports = function (grunt) { }) }, { - test: /\.less$/, - use: ExtractTextPlugin.extract({ + test: /\.scss$/, + loader: ExtractTextPlugin.extract({ use: [ { loader: "css-loader?minimize" }, - { loader: "less-loader" } + { loader: "sass-loader" } ] }) }, diff --git a/package.json b/package.json index 9381cf03..b2e90601 100644 --- a/package.json +++ b/package.json @@ -47,16 +47,16 @@ "html-webpack-plugin": "^2.28.0", "imports-loader": "^0.7.1", "ink-docstrap": "^1.1.4", - "less": "^2.7.2", - "less-loader": "^4.0.2", + "node-sass": "^4.5.2", + "sass-loader": "^6.0.3", "style-loader": "^0.15.0", "url-loader": "^0.5.8", "web-resource-inliner": "^4.1.0", "webpack": "^2.2.1" }, "dependencies": { - "bootstrap": "^3.3.7", "bootstrap-colorpicker": "^2.5.1", + "bootstrap-sass": "^3.3.7", "bootstrap-switch": "^3.3.4", "crypto-api": "^0.6.2", "crypto-js": "^3.1.9-1", diff --git a/src/web/css/index.js b/src/web/css/index.js deleted file mode 100644 index 6c76009a..00000000 --- a/src/web/css/index.js +++ /dev/null @@ -1,18 +0,0 @@ -/** - * CSS index - * - * @author n1474335 [n1474335@gmail.com] - * @copyright Crown Copyright 2017 - * @license Apache-2.0 - */ - -import "google-code-prettify/src/prettify.css"; - -import "./lib/bootstrap.less"; -import "bootstrap-switch/src/less/bootstrap3/build.less"; -import "bootstrap-colorpicker/dist/css/bootstrap-colorpicker.css"; - -import "./structure/overrides.css"; -import "./structure/layout.css"; -import "./structure/utils.css"; -import "./themes/classic.css"; diff --git a/src/web/css/lib/bootstrap.less b/src/web/css/lib/bootstrap.less deleted file mode 100644 index 12637095..00000000 --- a/src/web/css/lib/bootstrap.less +++ /dev/null @@ -1,58 +0,0 @@ -/** - * Bootstrap imports - * - * @author n1474335 [n1474335@gmail.com] - * @copyright Crown Copyright 2017 - * @license Apache-2.0 - */ - -// Core variables and mixins -@import "~bootstrap/less/variables.less"; -@import "~bootstrap/less/mixins.less"; - -// Reset and dependencies -@import "~bootstrap/less/normalize.less"; -@import "~bootstrap/less/print.less"; -// @import "~bootstrap/less/glyphicons.less"; - -// Core CSS -@import "~bootstrap/less/scaffolding.less"; -@import "~bootstrap/less/type.less"; -@import "~bootstrap/less/code.less"; -// @import "~bootstrap/less/grid.less"; -@import "~bootstrap/less/tables.less"; -@import "~bootstrap/less/forms.less"; -@import "~bootstrap/less/buttons.less"; - -// Components -@import "~bootstrap/less/component-animations.less"; -@import "~bootstrap/less/dropdowns.less"; -@import "~bootstrap/less/button-groups.less"; -@import "~bootstrap/less/input-groups.less"; -@import "~bootstrap/less/navs.less"; -// @import "~bootstrap/less/navbar.less"; -// @import "~bootstrap/less/breadcrumbs.less"; -// @import "~bootstrap/less/pagination.less"; -// @import "~bootstrap/less/pager.less"; -@import "~bootstrap/less/labels.less"; -// @import "~bootstrap/less/badges.less"; -// @import "~bootstrap/less/jumbotron.less"; -// @import "~bootstrap/less/thumbnails.less"; -@import "~bootstrap/less/alerts.less"; -@import "~bootstrap/less/progress-bars.less"; -// @import "~bootstrap/less/media.less"; -@import "~bootstrap/less/list-group.less"; -@import "~bootstrap/less/panels.less"; -// @import "~bootstrap/less/responsive-embed.less"; -// @import "~bootstrap/less/wells.less"; -@import "~bootstrap/less/close.less"; - -// Components w/ JavaScript -@import "~bootstrap/less/modals.less"; -@import "~bootstrap/less/tooltip.less"; -@import "~bootstrap/less/popovers.less"; -// @import "~bootstrap/less/carousel.less"; - -// Utility classes -@import "~bootstrap/less/utilities.less"; -// @import "~bootstrap/less/responsive-utilities.less"; \ No newline at end of file diff --git a/src/web/index.js b/src/web/index.js index 8976b4fa..e0b86683 100755 --- a/src/web/index.js +++ b/src/web/index.js @@ -4,12 +4,12 @@ * @license Apache-2.0 */ -// CSS -import "./css/index.js"; +// Styles +import "./stylesheets/main.scss"; // Libs import "babel-polyfill"; -import "bootstrap"; +import "bootstrap-sass"; import "bootstrap-switch"; import "bootstrap-colorpicker"; import CanvasComponents from "../core/lib/canvascomponents.js"; diff --git a/src/web/stylesheets/main.scss b/src/web/stylesheets/main.scss new file mode 100644 index 00000000..df6c3641 --- /dev/null +++ b/src/web/stylesheets/main.scss @@ -0,0 +1,21 @@ +/** + * Styles index + * + * @author n1474335 [n1474335@gmail.com] + * @copyright Crown Copyright 2017 + * @license Apache-2.0 + */ + +// Libraries +@import "~google-code-prettify/src/prettify.css"; + +// Frameworks +@import "vendors/bootstrap.scss"; +@import "~bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.css"; +@import "~bootstrap-colorpicker/dist/css/bootstrap-colorpicker.css"; + +// CyberChef styles +@import "structure/overrides.scss"; +@import "structure/layout.scss"; +@import "structure/utils.scss"; +@import "themes/classic.scss"; diff --git a/src/web/css/structure/layout.css b/src/web/stylesheets/structure/layout.scss similarity index 100% rename from src/web/css/structure/layout.css rename to src/web/stylesheets/structure/layout.scss diff --git a/src/web/css/structure/overrides.css b/src/web/stylesheets/structure/overrides.scss similarity index 100% rename from src/web/css/structure/overrides.css rename to src/web/stylesheets/structure/overrides.scss diff --git a/src/web/css/structure/utils.css b/src/web/stylesheets/structure/utils.scss similarity index 100% rename from src/web/css/structure/utils.css rename to src/web/stylesheets/structure/utils.scss diff --git a/src/web/css/themes/classic.css b/src/web/stylesheets/themes/classic.scss similarity index 100% rename from src/web/css/themes/classic.css rename to src/web/stylesheets/themes/classic.scss diff --git a/src/web/stylesheets/vendors/bootstrap.scss b/src/web/stylesheets/vendors/bootstrap.scss new file mode 100644 index 00000000..86ac19a4 --- /dev/null +++ b/src/web/stylesheets/vendors/bootstrap.scss @@ -0,0 +1,58 @@ +/** + * Bootstrap imports + * + * @author n1474335 [n1474335@gmail.com] + * @copyright Crown Copyright 2017 + * @license Apache-2.0 + */ + +// Core variables and mixins +@import "~bootstrap-sass/assets/stylesheets/~bootstrap-sass/assets/stylesheets/bootstrap/variables"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/mixins"; + +// Reset and dependencies +@import "~bootstrap-sass/assets/stylesheets/bootstrap/normalize"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/print"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/glyphicons"; + +// Core CSS +@import "~bootstrap-sass/assets/stylesheets/bootstrap/scaffolding"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/type"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/code"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/grid"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/tables"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/forms"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/buttons"; + +// Components +@import "~bootstrap-sass/assets/stylesheets/bootstrap/component-animations"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/dropdowns"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/button-groups"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/input-groups"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/navs"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/navbar"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/breadcrumbs"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/pagination"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/pager"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/labels"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/badges"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/jumbotron"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/thumbnails"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/alerts"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/progress-bars"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/media"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/list-group"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/panels"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/responsive-embed"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/wells"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/close"; + +// Components w/ JavaScript +@import "~bootstrap-sass/assets/stylesheets/bootstrap/modals"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/tooltip"; +@import "~bootstrap-sass/assets/stylesheets/bootstrap/popovers"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/carousel"; + +// Utility classes +@import "~bootstrap-sass/assets/stylesheets/bootstrap/utilities"; +// @import "~bootstrap-sass/assets/stylesheets/bootstrap/responsive-utilities";