feat(VS15): Increase accent color usage

- Make sure contrast foreground color is used when the background is the accent or hover color
- Reduce checkbox size to fix column fits all text functionality
- Unify buttons style
- Use accent color in more places - for selected and hover colors
- Reduce accent color variety to two - accent and hover color
- Make "Yellow" theme color more yellow
- Add "Pink" and "Dark" accent color themes
- Remove unused image
- Group styles using accent and hover colors
- Integrate prettier
- Switch to Dart Sass
- Update dependencies
- Compress png images with PNGGauntlet

.gitignore

@@ -5,56 +5,11 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
-# Runtime data
-pids
-*.pid
-*.seed
-*.pid.lock
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-
-# nyc test coverage
-.nyc_output
-
-# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
-.grunt
-
-# Bower dependency directory (https://bower.io/)
-bower_components
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (http://nodejs.org/api/addons.html)
-build/Release
+# IDE
+.vscode
 
 # Dependency directories
 node_modules/
-jspm_packages/
-
-# Typescript v1 declaration files
-typings/
-
-# Optional npm cache directory
-.npm
-
-# Optional eslint cache
-.eslintcache
-
-# Optional REPL history
-.node_repl_history
-
-# Output of 'npm pack'
-*.tgz
-
-# Yarn Integrity file
-.yarn-integrity
-
-# dotenv environment variables file
-.env
 
-dist
+# Build directories
+dist

.prettierrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  printWidth: 80,
+  singleQuote: true,
+  semi: false,
+  endOfLine: 'lf',
+  trailingComma: 'es5',
+};

Gulpfile.js

@@ -1,6 +1,7 @@
 const gulp = require('gulp')
 const pump = require('pump')
 const sass = require('gulp-sass')
+const Fiber = require('fibers')
 const replace = require('gulp-replace')
 const rename = require('gulp-rename')
 const del = require('del')
@@ -10,7 +11,7 @@ const {
   _: [, , task],
   theme,
   dest,
-  version
+  version,
 } = require('minimist')(process.argv)
 
 if (!theme) {
@@ -21,6 +22,8 @@ if (task === 'build' && !version) {
   throw new Error(`'version' parameter is required`)
 }
 
+sass.compiler = require('sass')
+
 const sassGlob = `themes/${theme}/sass/**/*.scss`
 const imagesGlob = `themes/${theme}/images/*.png`
 const destPath = dest || `./dist/`
@@ -29,7 +32,7 @@ const destGlobs = [`${destPath}/${theme}*`, `${imagesDest}**`]
 
 function clean() {
   return del(destGlobs, {
-    force: true
+    force: true,
   })
 }
 
@@ -41,12 +44,12 @@ function buildCss(done) {
   pump(
     [
       gulp.src(sassGlob),
-      sass().on('error', sass.logError),
+      sass({ fiber: Fiber }).on('error', sass.logError),
       replace('/*POSTSASS ', ''),
       replace(' POSTSASS*/', ''),
       replace('VERSION', version),
       rename({ extname: '.qss' }),
-      gulp.dest(destPath)
+      gulp.dest(destPath),
     ],
     done
   )
@@ -57,7 +60,7 @@ function zipTheme(done) {
     [
       gulp.src(destGlobs, { base: destPath }),
       zip(`${theme}-${version}.zip`),
-      gulp.dest(destPath)
+      gulp.dest(destPath),
     ],
     done
   )
@@ -68,7 +71,7 @@ function watchSass() {
 }
 
 function watchImages() {
-  return gulp.watch(imagesGlob, copyImages)
+  return gulp.watch(imagesGlob, { ignoreInitial: false }, copyImages)
 }
 
 exports.build = gulp.series(

README.md

@@ -1,90 +1,104 @@
-Set of themes for Mod Organizer 2
+Set of themes for Mod Organizer 1/2
 
 Get [latest versions](https://github.com/nikolay-borzov/modorganizer-themes/releases)
 
 # General
 
 ## Installation
+
 Download and extract to `ModOrganizer 2\stylesheets\` folder
 
 ## Credits
-* Tannin for creating [Mod Organizer](http://www.nexusmods.com/skyrim/mods/1334/?)
-* [Mod Organizer 2](https://github.com/ModOrganizer2/modorganizer) team 
+
+- Tannin for creating [Mod Organizer](http://www.nexusmods.com/skyrim/mods/1334/?)
+- [Mod Organizer 2](https://github.com/ModOrganizer2/modorganizer) team
 
 # Skyrim
 
 Skyrim UI theme
 
 ## Known Issues
-* Links are hard to read on dark background. Unfortunately it's impossible to fix through styles. But you can lighten background color (e.g. `QWidget { background-color: #8B8C93; }`)
-* Transparent background on hover for disabled check box in the Archives tab. Can't figure out how to fix it (if you care)
-* If filter is applied fancy border disappears. Also there is so no red border around mod list. I cannot fix it because it's hardcoded in MO source code. Optionally I can remove image border. 
+
+- Links are hard to read on dark background. Unfortunately it's impossible to fix through styles. But you can lighten background color (e.g. `QWidget { background-color: #8B8C93; }`)
+- Transparent background on hover for disabled check box in the Archives tab. Can't figure out how to fix it (if you care)
+- If filter is applied fancy border disappears. Also there is so no red border around mod list. I cannot fix it because it's hardcoded in MO source code. Optionally I can remove image border.
 
 ## Future plans
-* Bug fixes (if any)
+
+- Bug fixes (if any)
 
 ## Credits
-* Bethesda Softworks for a great game
+
+- Bethesda Softworks for a great game
 
 # VS15
 
 Dark theme inspired by VS 2015 UI.
 
 ## Features
-* Minimalist
-* Increased list items height (Mods  List, Plugins List and etc.)
-* Unchecked .bsa highlight on Archives tab
-* Unique sort indicator
-* Several fixes
+
+- Minimalist
+- Increased list items height (Mods  List, Plugins List and etc.)
+- Unchecked .bsa highlight on Archives tab
+- Unique sort indicator
+- Several fixes
 
 ## Installation
+
 Download and extract to `ModOrganizer\stylesheets\` folder
 
 ## Known Issues
-* Links are hard to read on dark background. Unfortunately it's impossible to fix through styles. But you can lighten background color (e.g. `QWidget { background-color: #8B8C93; }`)
-* Transparent background on hover for disabled check box in the Archives tab. Can't figure out how to fix it (if you care)
+
+- Links are hard to read on dark background. Unfortunately it's impossible to fix through styles. But you can lighten background color (e.g. `QWidget { background-color: #8B8C93; }`)
+- Transparent background on hover for disabled check box in the Archives tab. Can't figure out how to fix it (if you care)
 
 ## Future plans
-* Bug fixes (if any)
-* Light theme (less possible)
+
+- Bug fixes (if any)
+- Light theme (less possible)
 
 ## Credits
-* Microsoft for bringing clean and smooth UI for Visual Studio 2015
-* EGraf for [UI Tweaks - Alternative style for Mod Organizer](http://www.nexusmods.com/skyrim/mods/70774/?)
 
+- Microsoft for bringing clean and smooth UI for Visual Studio 2015
+- EGraf for [UI Tweaks - Alternative style for Mod Organizer](http://www.nexusmods.com/skyrim/mods/70774/?)
 
 # Development
 
 ### Build
+
 ```
 npm run build -- --theme=vs15 --version=2.1.0
 ```
 
 ### Watch
+
 ```
 npm run watch -- --theme=vs15
 ```
 
 ### Change default build destination
+
 ```
 npm run watch -- --theme=vs15 --dest="C:\Games\Mod Organizer 2\stylesheets"
 ```
 
 ### Add a new theme
+
 1. Add new folder to `/themes`
 2. Use folder name as theme id `npm run build -- --theme=my-theme`
 3. Place theme images inside `images` sub-folder
 
 # Other
 
 ## Resources
-* [Qt Documentation - The Style Sheet Syntax](http://doc.qt.io/qt-5/stylesheet-syntax.html)
-* [StackOverflow](http://stackoverflow.com/)
-* Mod Organizer source code
+
+- [Qt Documentation - The Style Sheet Syntax](http://doc.qt.io/qt-5/stylesheet-syntax.html)
+- [StackOverflow](http://stackoverflow.com/)
+- Mod Organizer source code
 
 ## Tools
-* [ColorPic](http://www.iconico.com/colorpic/)
-* [Paint.NET](http://www.getpaint.net/index.html)
-* [SASS](http://sass-lang.com/)
-* [Gulp](http://gulpjs.com/) ([gulp-sass](https://www.npmjs.com/package/gulp-sass), [gulp-replace](https://www.npmjs.com/package/gulp-replace), [gulp-rename](https://www.npmjs.com/package/gulp-rename) and [gulp-clean-css](https://github.com/scniro/gulp-clean-css))
 
+- [ColorPic](http://www.iconico.com/colorpic/)
+- [Paint.NET](http://www.getpaint.net/index.html)
+- [SASS](http://sass-lang.com/)
+- [Gulp](http://gulpjs.com/) ([gulp-sass](https://www.npmjs.com/package/gulp-sass), [gulp-replace](https://www.npmjs.com/package/gulp-replace), [gulp-rename](https://www.npmjs.com/package/gulp-rename) and [gulp-clean-css](https://github.com/scniro/gulp-clean-css))