Update

Author: accgit

composer.json

@@ -0,0 +1,44 @@
+{
+	"require": {
+		"npm-asset/css-ui-simple": "^2.4",
+		"npm-asset/open-sans-fontface": "^1.4",
+		"bower-asset/jquery": "^3.3",
+		"npm-asset/font-awesome": "^4.7",
+		"npm-asset/perfect-scrollbar": "^1.4"
+	},
+	"config": {
+		"fxp-asset": {
+			"ignore-files": {
+				"npm-asset/css-ui-simple": [
+					"src/css/"
+				],
+				"npm-asset/open-sans-fontface": [
+					"sass",
+					"*.html",
+					"*.less",
+					"*.scss"
+				],
+				"bower-asset/jquery": [
+					".*",
+					"src",
+					"external"
+				],
+				"npm-asset/font-awesome": [
+					".*",
+					".txt",
+					"less",
+					"scss"
+				],
+				"npm-asset/perfect-scrollbar": [
+					".*",
+					"src",
+					"types"
+				]
+			},
+			"installer-paths": {
+				"npm-asset-library": "www/assets",
+				"bower-asset-library": "www/assets"
+			}
+		}
+	}
+}

src/css/style.menu.css

@@ -97,22 +97,17 @@
 /* perfect scrollbar
    ========================================================================== */
 .scrollbar {
-    overflow: hidden;
     position: relative;
 }
 
 .ps__thumb-y {
-    width: 4px;
-}
-
-.ps__rail-y {
-    margin: 10px 0;
-    width: auto;
+    width: 5px;
 }
 
 .ps__rail-y:hover > .ps__thumb-y,
-.ps__rail-y:focus > .ps__thumb-y {
-    width: 4px;
+.ps__rail-y:focus > .ps__thumb-y,
+.ps__rail-y.ps--clicking .ps__thumb-y {
+    width: 5px;
 }
 
 @media only screen and (min-width: 768px) {

src/css/style.menu.dark.css

@@ -84,10 +84,17 @@
 /* perfect scrollbar
    ========================================================================== */
 .ps__thumb-y {
-    background: #515867;
+    background: #586173;
 }
 
 .ps__rail-y:hover > .ps__thumb-y,
-.ps__rail-y:focus > .ps__thumb-y {
-    background: #515867;
+.ps__rail-y:focus > .ps__thumb-y,
+.ps__rail-y.ps--clicking .ps__thumb-y {
+    background: #586173;
+}
+
+.ps .ps__rail-y:hover,
+.ps .ps__rail-y:focus,
+.ps .ps__rail-y.ps--clicking {
+    background: none;
 }

src/css/style.menu.light.css

@@ -84,10 +84,17 @@
 /* perfect scrollbar
    ========================================================================== */
 .ps__thumb-y {
-    background: #d3d3d3;
+    background: #e0e0e0;
 }
 
 .ps__rail-y:hover > .ps__thumb-y,
-.ps__rail-y:focus > .ps__thumb-y {
-    background: #d3d3d3;
+.ps__rail-y:focus > .ps__thumb-y,
+.ps__rail-y.ps--clicking .ps__thumb-y {
+    background: #e0e0e0;
+}
+
+.ps .ps__rail-y:hover,
+.ps .ps__rail-y:focus,
+.ps .ps__rail-y.ps--clicking {
+    background: none;
 }

src/index.html

@@ -8,16 +8,16 @@
 	<title>CSS UI - Responsive menu</title>
 
 	<!-- css -->
-	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.0/normalize.min.css">
-	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.perfect-scrollbar/1.3.0/css/perfect-scrollbar.min.css">
-	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
-	<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,600&amp;subset=latin-ext">
-	<link rel="stylesheet" href="https://css-ui.github.io/css/cssui.min.css">
+	<link rel="stylesheet" href="../www/assets/normalize.css/normalize.css">
+	<link rel="stylesheet" href="../www/assets/perfect-scrollbar/css/perfect-scrollbar.css">
+	<link rel="stylesheet" href="../www/assets/font-awesome/css/font-awesome.css">
+	<link rel="stylesheet" href="../www/assets/open-sans-fontface/open-sans.css">
+	<link rel="stylesheet" href="../www/assets/css-ui-simple/src/cssui.css">
 
 	<!-- css menu -->
 	<link rel="stylesheet" href="css/style.menu.css">
-	<link rel="stylesheet" href="css/style.menu.light.css">
-	<!--<link rel="stylesheet" href="css/style.menu.dark.css">-->
+	<!--<link rel="stylesheet" href="css/style.menu.light.css">-->
+	<link rel="stylesheet" href="css/style.menu.dark.css">
 
 	<!-- css only for this page -->
 	<style>
@@ -105,8 +105,8 @@
 	<div class="content-wrapper"></div>
 
 	<!-- javascript libraries and plugins  -->
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.perfect-scrollbar/1.3.0/perfect-scrollbar.min.js"></script>
+	<script src="../www/assets/jquery/dist/jquery.js"></script>
+	<script src="../www/assets/perfect-scrollbar/dist/perfect-scrollbar.js"></script>
 	<script>
 		$(function() {