Adds LESS stylesheets.

cpsubrian · Jun 20, 2015 · 5bacb79 · 5bacb79
1 parent 72fc9fa
commit 5bacb79
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 11 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -107,12 +107,6 @@ module.exports = function (grunt) {
           cwd: '.',
           src: ['package.json', 'settings.json', 'index.html'],
           dest: 'build/'
-        }, {
-          // This might be replaced by LESS.
-          expand: true,
-          cwd: 'styles/',
-          src: ['**/*'],
-          dest: 'build/'
         }, {
           expand: true,
           cwd: 'images/',
@@ -173,6 +167,18 @@ module.exports = function (grunt) {
       }
     },
 
+    // Styles (LESS)
+    less: {
+      options: {
+        sourceMapFileInline: true
+      },
+      dist: {
+        files: {
+          'build/main.css': 'styles/main.less'
+        }
+      }
+    },
+
     // Rename files.
     rename: {
       installer: {
@@ -226,23 +232,26 @@ module.exports = function (grunt) {
         files: ['src/**/*.js'],
         tasks: ['newer:babel']
       },
+      less: {
+        files: ['styles/**/*.less'],
+        tasks: ['less']
+      },
       copy: {
-        // Remove styles if using LESS.
-        files: ['images/*', 'index.html', 'fonts/*', 'styles/*'],
+        files: ['images/*', 'index.html', 'fonts/*'],
         tasks: ['newer:copy:dev']
       }
     }
   });
 
 
   // Define default (development) task.
-  grunt.registerTask('default', ['newer:babel', 'newer:copy:dev', 'shell:electron', 'watchChokidar']);
+  grunt.registerTask('default', ['newer:babel', 'less', 'newer:copy:dev', 'shell:electron', 'watchChokidar']);
 
   // Define platform-specific release task.
   if (process.platform === 'win32') {
-    grunt.registerTask('release', ['clean:release', 'babel', 'copy:dev', 'electron:windows', 'copy:windows', 'rcedit:exes', 'create-windows-installer', 'rename:installer']);
+    grunt.registerTask('release', ['clean:release', 'babel', 'less', 'copy:dev', 'electron:windows', 'copy:windows', 'rcedit:exes', 'create-windows-installer', 'rename:installer']);
   } else {
-    grunt.registerTask('release', ['clean:release', 'babel', 'copy:dev', 'electron:osx', 'copy:osx', 'shell:sign', 'shell:zip']);
+    grunt.registerTask('release', ['clean:release', 'babel', 'less', 'copy:dev', 'electron:osx', 'copy:osx', 'shell:sign', 'shell:zip']);
   }
 
   // Bail-out on electron command if this dies.

diff --git a/index.html b/index.html
@@ -2,6 +2,7 @@
 <html>
   <head>
     <title>RedisExplorer</title>
+    <link rel="stylesheet" href="main.css"/>
   </head>
   <body>
     <script src="main.js"></script>

diff --git a/package.json b/package.json
@@ -38,6 +38,7 @@
     "grunt-cli": "^0.1.13",
     "grunt-contrib-clean": "^0.6.0",
     "grunt-contrib-copy": "^0.8.0",
+    "grunt-contrib-less": "^1.0.1",
     "grunt-contrib-watch-chokidar": "^1.0.0",
     "grunt-download-electron": "^2.1.1",
     "grunt-electron": "^1.0.0",

diff --git a/styles/main.less b/styles/main.less
@@ -0,0 +1,20 @@
+// Imports
+@import "variables.less";
+
+// Reset html/body
+html, body {
+  height: 100%;
+  width: 100%;
+  overflow: hidden;
+  background: none;
+  -webkit-user-select: none;
+  -webkit-user-drag: none;
+  font-family: @font-regular;
+  cursor: default;
+  -webkit-font-smoothing: subpixel-antialiased;
+  text-rendering: optimizelegibility;
+  //-webkit-font-smoothing: antialiased;
+  img {
+    pointer-events: none;
+  }
+}
diff --git a/styles/variables.less b/styles/variables.less
@@ -0,0 +1,3 @@
+// Fonts
+@font-regular: "Helvetica Neue", Segoe UI, Arial, "Lucida Grande", sans-serif;
+@font-code: Menlo, Consolas;
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,6 +2,7 @@ @@
     <html>
       <head>
         <title>RedisExplorer</title>
+        <link rel="stylesheet" href="main.css"/>
       </head>
       <body>
         <script src="main.js"></script>
@@ Expand Down @@