From a24c39b85004209dee3580f7341837a90175457d Mon Sep 17 00:00:00 2001
From: 03bgls25 <03bgls25@gmail.com>
Date: Tue, 7 Nov 2017 01:48:53 +0545
Subject: [PATCH] added gulp js file for scss compiler

---
 README.md              | 22 +++++++++++++++++++++-
 SageFrame/gulpfile.js  | 42 ++++++++++++++++++++++++++++++++++++++++++
 SageFrame/package.json | 24 ++++++++++++++++++++++++
 3 files changed, 87 insertions(+), 1 deletion(-)
 create mode 100644 SageFrame/gulpfile.js
 create mode 100644 SageFrame/package.json

diff --git a/README.md b/README.md
index 6fa5953..d61ac05 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,24 @@
 # SageFrameV3.8
 
 After the success of SageFrame 1.0, SageFrame 2.0, SageFrame 2.1, SageFrame 3.0, SageFrame 3.1, SageFrame 3.5 and SageFrame 3.6, SageFrame 3.8 is here itching to marvel you with a better version than its predecessors. This release focuses on features suitable mainly for designers with features that enhance the existing ones. The attractive features for this release include creating modern layout where the users can create their own customizable layouts and containers. They can also incorporate their old codes here in SageFrame layouts. The second feature is the addition of theme options from where the users can generate customizable themes to give their sites a dash of their own flavors. The development team always aims to work and produce the best CMS that is easy to use with great flexibility and this version release is not different. 
-From now on, all the source code for the latest release from SageFrame is available on github. So, feel free to utilize this opportunity and also share your part for open source projects. 
\ No newline at end of file
+From now on, all the source code for the latest release from SageFrame is available on github. So, feel free to utilize this opportunity and also share your part for open source projects. 
+
+
+----------
+
+Compile SCSS for sageframeV3.8 template with Gulp.JS
+------------------------------------------------
+Compile your CSS pre-processor **SCSS** of sageframeV3.8 template with Gulp.JS
+
+**Prerequisite** 
+
+ - [Node JS](https://nodejs.org/en/)
+ - [Gulp JS](https://gulpjs.com/)
+
+Installation Guide and Setup
+------------------------------------
+
+ - **Step 1:** Go inside directory of SageFrameV3.8\SageFrame\ 
+ -  **Step 2:** Install node package module using command `npm install`
+ - **Step 3:** Configure gulpfile.js with path of sageframe template in `var config = {scssPath: "", dest: ""}` 
+ - **Step 4:** Run Gulp JS task using command `gulp`  which will watch all scss compilation task
\ No newline at end of file
diff --git a/SageFrame/gulpfile.js b/SageFrame/gulpfile.js
new file mode 100644
index 0000000..9c2e394
--- /dev/null
+++ b/SageFrame/gulpfile.js
@@ -0,0 +1,42 @@
+var gulp = require('gulp');
+var sass = require('gulp-sass');
+var sourcemaps = require('gulp-sourcemaps');
+var autoprefixer = require('gulp-autoprefixer');
+var minifycss = require('gulp-minify-css');
+var rename = require('gulp-rename');
+var plumber = require('gulp-plumber');
+var notify = require("gulp-notify");
+
+var config = {
+    scssPath : './Templates/TemplateName/scss',
+    dest : './Templates/TemplateName'
+};
+
+gulp.task('sass', function() {
+    var onError = function(err) {
+        notify.onError({
+            title: "Gulp Sass",
+            subtitle: "Failure",
+            message: "<%= error.message %>",
+            sound: "Beep"
+        })(err);
+        this.emit('end');
+    };
+    return gulp.src(config.scssPath + '*.scss')
+        .pipe(plumber({ errorHandler: onError }))
+        .pipe(sourcemaps.init())
+        .pipe(sass())
+        .pipe(autoprefixer())
+        .pipe(plumber.stop())
+        .pipe(sourcemaps.write({includeContent: false}))
+        .pipe(sourcemaps.init({loadMaps: true}))
+        .pipe(sourcemaps.write('.'))
+        .pipe(gulp.dest(config.dest + 'css'))
+        .pipe(rename({suffix: '.min'}))
+        .pipe(minifycss())
+        .pipe(gulp.dest(config.dest + 'css'))
+});
+gulp.task('watch', function() {
+    gulp.watch(config.scssPath + '**/*.scss', ['sass']);
+});
+gulp.task('default', ['sass', 'watch']);
\ No newline at end of file
diff --git a/SageFrame/package.json b/SageFrame/package.json
new file mode 100644
index 0000000..ae3ffbc
--- /dev/null
+++ b/SageFrame/package.json
@@ -0,0 +1,24 @@
+{
+  "name": "SageFrame",
+  "version": "3.8",
+  "description": "Content Management System (CMS) built on top of ASP.NET",
+  "main": "index.js",
+  "scripts": {
+    "test": "console.log(\"SageFrame v3.8\");"
+  },
+  "author": "Braindigit IT Solutions",
+  "license": "MIT",
+  "devDependencies": {
+    "gulp": "^3.9.1",
+    "sass": "^1.0.0-beta.2"
+  },
+  "dependencies": {
+    "gulp-autoprefixer": "^4.0.0",
+    "gulp-minify-css": "^1.2.4",
+    "gulp-notify": "^3.0.0",
+    "gulp-plumber": "^1.1.0",
+    "gulp-rename": "^1.2.2",
+    "gulp-sass": "^3.1.0",
+    "gulp-sourcemaps": "^2.6.1"
+  }
+}