- Fix height and position problems with .fixed-footer

- Fix mobile sidebar height - Fix mobile breadcrumb position with .fixed-breadcrumb - Add new navbar toggler icon - Update old bootstrap classes ex. `hidden-sm-down` - Add gulp-autoprefixer
coreui · Oct 16, 2017 · a2f458d · a2f458d
1 parent 0fb9c92
commit a2f458d
Show file tree

Hide file tree

Showing 91 changed files with 4,383 additions and 14,651 deletions.
diff --git a/AJAX_Full_Project_GULP/css/font-awesome.css b/AJAX_Full_Project_GULP/css/font-awesome.css
diff --git a/AJAX_Full_Project_GULP/css/font-awesome.css.map b/AJAX_Full_Project_GULP/css/font-awesome.css.map
diff --git a/AJAX_Full_Project_GULP/css/font-awesome.min.css b/AJAX_Full_Project_GULP/css/font-awesome.min.css
diff --git a/AJAX_Full_Project_GULP/css/simple-line-icons.css b/AJAX_Full_Project_GULP/css/simple-line-icons.css
diff --git a/AJAX_Full_Project_GULP/css/style.css b/AJAX_Full_Project_GULP/css/style.css
diff --git a/AJAX_Full_Project_GULP/css/style.min.css b/AJAX_Full_Project_GULP/css/style.min.css
diff --git a/AJAX_Full_Project_GULP/gulp-tasks/vendors.js b/AJAX_Full_Project_GULP/gulp-tasks/vendors.js
@@ -5,6 +5,8 @@ var del = require('del');
 var rename = require("gulp-rename");
 var runSequence = require('run-sequence');
 var sass = require('gulp-sass');
+var autoprefixer = require('gulp-autoprefixer');
+var cssmin = require('gulp-cssmin')
 
 var paths = gulp.paths;
 var vendors = './scss/vendors/';
@@ -18,9 +20,10 @@ gulp.task('compile-vendors:clean', function () {
 gulp.task('compile-vendors:sass', function () {
   return gulp.src('./scss/vendors/**/*.scss')
   .pipe(sass().on('error', sass.logError))
+  .pipe(autoprefixer())
   .pipe(rename({dirname: ''}))
   .pipe(gulp.dest('./vendors/css/'))
-  .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
+  .pipe(cssmin())
   .pipe(rename({suffix: '.min'}))
   .pipe(rename({dirname: ''}))
   .pipe(gulp.dest('./vendors/css/'));

diff --git a/AJAX_Full_Project_GULP/gulpfile.js b/AJAX_Full_Project_GULP/gulpfile.js
@@ -3,6 +3,7 @@
 var gulp = require('gulp');
 var browserSync = require('browser-sync').create();
 var sass = require('gulp-sass');
+var autoprefixer = require('gulp-autoprefixer');
 var cssmin = require('gulp-cssmin')
 var rename = require('gulp-rename');
 var runSequence = require('run-sequence');
@@ -45,12 +46,16 @@ gulp.task('serve:lite', function() {
 gulp.task('sass', ['compile-vendors'], function() {
   return gulp.src('./scss/style.scss')
   .pipe(sass())
+  .pipe(autoprefixer())
+  .pipe(gulp.dest('./css'))
+  .pipe(cssmin())
+  .pipe(rename({suffix: '.min'}))
   .pipe(gulp.dest('./css'))
   .pipe(browserSync.stream());
 });
 
 gulp.task('sass:watch', function() {
-  gulp.watch('./scss/**/*.scss');
+  gulp.watch('./scss/**/*.scss', ['sass']);
 });
 
 gulp.task('default', ['serve']);
diff --git a/AJAX_Full_Project_GULP/index.html b/AJAX_Full_Project_GULP/index.html
@@ -1,6 +1,6 @@
 <!--
  * CoreUI - Open Source Bootstrap Admin Template
- * @version v1.0.1
+ * @version v1.0.2
  * @link http://coreui.io
  * Copyright (c) 2017 creativeLabs Łukasz Holeczek
  * @license MIT
@@ -55,9 +55,13 @@
 
 <body class="app header-fixed sidebar-fixed aside-menu-fixed aside-menu-hidden">
   <header class="app-header navbar">
-    <button class="navbar-toggler mobile-sidebar-toggler d-lg-none mr-auto" type="button">&#9776;</button>
+    <button class="navbar-toggler mobile-sidebar-toggler d-lg-none mr-auto" type="button">
+      <span class="navbar-toggler-icon"></span>
+    </button>
     <a class="navbar-brand" href="#"></a>
-    <button class="navbar-toggler sidebar-toggler d-md-down-none" type="button">&#9776;</button>
+    <button class="navbar-toggler sidebar-toggler d-md-down-none" type="button">
+      <span class="navbar-toggler-icon"></span>
+    </button>
 
     <ul class="nav navbar-nav d-md-down-none">
       <li class="nav-item px-3">
@@ -106,7 +110,9 @@
         </div>
       </li>
     </ul>
-    <button class="navbar-toggler aside-menu-toggler" type="button">&#9776;</button>
+    <button class="navbar-toggler aside-menu-toggler" type="button">
+      <span class="navbar-toggler-icon"></span>
+    </button>
 
   </header>
 

diff --git a/AJAX_Full_Project_GULP/package.json b/AJAX_Full_Project_GULP/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@coreui/ajax",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "",
   "main": "index.html",
   "dependencies": {
@@ -16,6 +16,7 @@
     "browser-sync": "^2.16.0",
     "del": "^3.0.0",
     "gulp": "^3.9.1",
+    "gulp-autoprefixer": "^4.0.0",
     "gulp-bower-src": "^0.1.0",
     "gulp-concat": "^2.6.0",
     "gulp-contains": "^1.1.0",
@@ -26,14 +27,22 @@
     "gulp-sass": "^3.1.0",
     "gulp-search": "^1.0.0",
     "gulp-uglify": "^3.0.0",
-    "gulp-web-dependencies": "^1.1.2",
-    "main-bower-files": "^2.13.1",
     "require-dir": "^0.3.2",
     "run-sequence": "^2.1.0"
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
+  "browserslist": [
+    "Chrome >= 45",
+    "Firefox ESR",
+    "Edge >= 12",
+    "Explorer >= 10",
+    "iOS >= 9",
+    "Safari >= 9",
+    "Android >= 4.4",
+    "Opera >= 30"
+  ],
   "author": "Łukasz Holeczek",
   "url": "http://coreui.io",
   "copyright": "Copyright 2016 creativeLabs Łukasz Holeczek",

diff --git a/AJAX_Full_Project_GULP/scss/core/_dropdown-menu-right.scss b/AJAX_Full_Project_GULP/scss/core/_dropdown-menu-right.scss
@@ -5,4 +5,4 @@
       right: auto;
     }
   }
-}
+}
diff --git a/AJAX_Full_Project_GULP/scss/core/_footer.scss b/AJAX_Full_Project_GULP/scss/core/_footer.scss
@@ -1,9 +1,9 @@
 .app-footer {
   display: flex;
+  flex-wrap: wrap;
+  align-items: center;
   padding: 0 $spacer;
   color: $footer-color;
   background: $footer-bg;
-  flex-wrap: wrap;
-  align-items: center;
   @include borders($footer-borders);
 }
diff --git a/AJAX_Full_Project_GULP/scss/core/_layout.scss b/AJAX_Full_Project_GULP/scss/core/_layout.scss
@@ -11,8 +11,8 @@
 app-dashboard,
 app-root {
   display: flex;
-  min-height: 100vh;
   flex-direction: column;
+  min-height: 100vh;
 }
 
 .app-header {
@@ -26,12 +26,12 @@ app-root {
 .app-body {
   display: flex;
   flex-direction: row;
-  overflow-x: hidden;
   flex-grow: 1;
+  overflow-x: hidden;
 
   .main {
-    min-width: 0;
     flex: 1;
+    min-width: 0;
   }
 
   .sidebar {
@@ -269,9 +269,11 @@ app-root {
 .footer-fixed {
   .app-footer {
     position: fixed;
+    right: 0;
     bottom: 0;
+    left: 0;
     z-index: $zindex-sticky;
-    width: 100%;
+    height: $footer-height;
   }
 
   .app-body {
@@ -328,17 +330,26 @@ app-root {
     margin-top: $navbar-height;
   }
 
+  .breadcrumb-fixed {
+    .main:nth-child(2) .breadcrumb {
+      right: auto;
+      left: auto;
+      width: 100%;
+    }
+  }
+
   .sidebar,
   .sidebar-fixed .sidebar {
     position: fixed;
     z-index: $zindex-sticky - 1;
     width: $mobile-sidebar-width;
-    height: 100%;
+    // height: 100%;
     margin-left: - $mobile-sidebar-width;
 
     .sidebar-nav,
     .nav {
       width: $mobile-sidebar-width !important;
+      height: calc(100vh - #{$navbar-height});
     }
 
     .sidebar-minimizer {
@@ -364,22 +375,11 @@ app-root {
     .sidebar {
       width: $mobile-sidebar-width;
       margin-left: 0;
-
-      .sidebar-nav {
-        height: calc(100vh - #{$navbar-height});
-      }
     }
 
     .main {
       margin-right: - $mobile-sidebar-width !important;
       margin-left: $mobile-sidebar-width !important;
     }
   }
-
-  .breadcrumb-fixed {
-    .main .breadcrumb {
-      right: 0 !important;
-      left: 0 !important;
-    }
-  }
 }
diff --git a/AJAX_Full_Project_GULP/scss/core/_navbar.scss b/AJAX_Full_Project_GULP/scss/core/_navbar.scss
@@ -1,7 +1,7 @@
 .app-header.navbar {
   position: relative;
-  height: $navbar-height;
   flex-direction: row;
+  height: $navbar-height;
   padding: 0;
   margin: 0;
   background-color: $navbar-bg;
@@ -22,7 +22,17 @@
   }
 
   .navbar-toggler {
-    color: $navbar-color;
+    min-width: 50px;
+    padding: $navbar-toggler-padding-y 0;
+
+    &:hover .navbar-toggler-icon {
+      background-image: $navbar-toggler-icon-hover;
+    }
+  }
+
+  .navbar-toggler-icon {
+    height: 23px;
+    background-image: $navbar-toggler-icon;
   }
 
   .navbar-nav {

diff --git a/AJAX_Full_Project_GULP/scss/core/_sidebar.scss b/AJAX_Full_Project_GULP/scss/core/_sidebar.scss
@@ -78,8 +78,8 @@
 
   .nav {
     @include sidebar-width($sidebar-borders, $sidebar-width);
-    min-height: 100%;
     flex-direction: column;
+    min-height: 100%;
   }
 
   .nav-title {

diff --git a/AJAX_Full_Project_GULP/scss/core/_variables.scss b/AJAX_Full_Project_GULP/scss/core/_variables.scss
@@ -69,6 +69,9 @@ $navbar-hover-color:                  $gray-800 !default;
 $navbar-active-color:                 $gray-800 !default;
 $navbar-disabled-color:               $gray-300 !default;
 
+$navbar-toggler-icon:                 str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-color}' stroke-width='2.25' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default;
+$navbar-toggler-icon-hover:           str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-hover-color}' stroke-width='2.25' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default;
+
 // Sidebar
 
 $sidebar-width:                       200px !default;

diff --git a/AJAX_Full_Project_GULP/scss/style.scss b/AJAX_Full_Project_GULP/scss/style.scss
@@ -1,10 +1,11 @@
 /*!
  * CoreUI - Open Source Bootstrap Admin Template
- * @version v1.0.1
+ * @version v1.0.2
  * @link http://coreui.io
  * Copyright (c) 2017 creativeLabs Łukasz Holeczek
  * @license MIT
  */
+
 // Override Boostrap variables
 @import "bootstrap-variables";
 

diff --git a/AJAX_Full_Project_GULP/vendors/css/chart.css b/AJAX_Full_Project_GULP/vendors/css/chart.css
@@ -0,0 +1,42 @@
+.chart-legend,
+.bar-legend,
+.line-legend,
+.pie-legend,
+.radar-legend,
+.polararea-legend,
+.doughnut-legend {
+  list-style-type: none;
+  margin-top: 5px;
+  text-align: center;
+  -webkit-padding-start: 0;
+  -moz-padding-start: 0;
+  padding-left: 0; }
+
+.chart-legend li,
+.bar-legend li,
+.line-legend li,
+.pie-legend li,
+.radar-legend li,
+.polararea-legend li,
+.doughnut-legend li {
+  display: inline-block;
+  white-space: nowrap;
+  position: relative;
+  margin-bottom: 4px;
+  padding: 2px 8px 2px 28px;
+  font-size: smaller;
+  cursor: default; }
+
+.chart-legend li span,
+.bar-legend li span,
+.line-legend li span,
+.pie-legend li span,
+.radar-legend li span,
+.polararea-legend li span,
+.doughnut-legend li span {
+  display: block;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 20px;
+  height: 20px; }
diff --git a/AJAX_Full_Project_GULP/vendors/css/chart.min.css b/AJAX_Full_Project_GULP/vendors/css/chart.min.css
diff --git a/AJAX_Full_Project_GULP/views/main.html b/AJAX_Full_Project_GULP/views/main.html
@@ -100,7 +100,7 @@ <h4 class="card-title mb-0">Traffic</h4>
           <div class="small text-muted">November 2015</div>
         </div>
         <!--/.col-->
-        <div class="col-sm-7 hidden-sm-down">
+        <div class="col-sm-7 d-none d-md-block">
           <button type="button" class="btn btn-primary float-right"><i class="icon-cloud-download"></i></button>
           <div class="btn-toolbar float-right" role="toolbar" aria-label="Toolbar with button groups">
             <div class="btn-group mr-3" data-toggle="buttons" aria-label="First group">
@@ -132,7 +132,7 @@ <h4 class="card-title mb-0">Traffic</h4>
             <div class="progress-bar bg-success" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
           </div>
         </li>
-        <li class="hidden-sm-down">
+        <li class="d-none d-md-table-cell">
           <div class="text-muted">Unique</div>
           <strong>24.093 Users (20%)</strong>
           <div class="progress progress-xs mt-2">
@@ -146,14 +146,14 @@ <h4 class="card-title mb-0">Traffic</h4>
             <div class="progress-bar bg-warning" role="progressbar" style="width: 60%" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
           </div>
         </li>
-        <li class="hidden-sm-down">
+        <li class="d-none d-md-table-cell">
           <div class="text-muted">New Users</div>
           <strong>22.123 Users (80%)</strong>
           <div class="progress progress-xs mt-2">
             <div class="progress-bar bg-danger" role="progressbar" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
           </div>
         </li>
-        <li class="hidden-sm-down">
+        <li class="d-none d-md-table-cell">
           <div class="text-muted">Bounce Rate</div>
           <strong>40.15%</strong>
           <div class="progress progress-xs mt-2">
-Original file line number
+Diff line change
@@ Expand Up / @@ -5,4 +5,4 @@ @@
           right: auto;
         }
       }
-    }
+    }