diff --git a/package.json b/package.json index 75cf92b..923d28f 100644 --- a/package.json +++ b/package.json @@ -19,6 +19,8 @@ "file-loader": "^0.8.5", "html-loader": "^0.4.3", "html-webpack-plugin": "^2.15.0", + "less": "^2.6.1", + "less-loader": "^2.2.3", "postcss-loader": "^0.8.2", "style-loader": "^0.13.1", "url-loader": "^0.5.7", diff --git a/src/main/resources/static/css/comments.less b/src/main/resources/static/css/comments.less new file mode 100644 index 0000000..2393e01 --- /dev/null +++ b/src/main/resources/static/css/comments.less @@ -0,0 +1,13 @@ +@base: #f938ab; + +.box-shadow(@style, @c) when (iscolor(@c)) { + -webkit-box-shadow: @style @c; + box-shadow: @style @c; +} +.box-shadow(@style, @alpha: 50%) when (isnumber(@alpha)) { + .box-shadow(@style, rgba(0, 0, 0, @alpha)); +} +.box { + color: saturate(@base, 5%); + border-color: lighten(@base, 30%); +} \ No newline at end of file diff --git a/src/main/resources/static/js/app.render.jsx b/src/main/resources/static/js/app.render.jsx index 0e1003b..beed912 100644 --- a/src/main/resources/static/js/app.render.jsx +++ b/src/main/resources/static/js/app.render.jsx @@ -10,6 +10,7 @@ import $ from 'jquery'; require('bootstrap/dist/css/bootstrap.css'); require('../css/comments.css'); +require('../css/comments.less'); global.renderClient = function (comments) { var data = comments || []; diff --git a/src/main/resources/templates/index-template.html b/src/main/resources/templates/index-template.html index 2d5b495..8cecf56 100644 --- a/src/main/resources/templates/index-template.html +++ b/src/main/resources/templates/index-template.html @@ -8,7 +8,7 @@