perfect-gui 4.0.6 → 4.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "perfect-gui",
-  "version": "4.0.6",
+  "version": "4.1.0",
   "description": "Nice and simple GUI for JavaScript",
   "main": "src/index.js",
   "scripts": {

package/src/index.js

@@ -621,6 +621,7 @@ export default class GUI {
         let closed = typeof options.closed == 'boolean' ? options.closed : false;
         let name = options.name || '';
         let color = options.color || null;
+        let maxHeight = options.maxHeight || null;
 
         this.imageContainer = null;
 
@@ -633,10 +634,13 @@ export default class GUI {
         if (closed) {
             className += ' p-gui__folder--closed';
         }
+
+        let container_style = color ? `background-color: ${color};` : '';
+        container_style += maxHeight ? `max-height: ${maxHeight}px;` : '';
         
         let container = this._createElement({
             class: className,
-            inline: color ? `background-color: ${color};`: null,
+            inline: container_style,
         });
         
         let folderHeader = this._createElement({

package/src/styles.js

@@ -3,7 +3,7 @@
  * depending on a css loader
  */
 
-export default function( position_type ) {
+ export default function( position_type ) {
 return /* css */`
 .p-gui {
     position: ${ position_type };
@@ -26,6 +26,10 @@ return /* css */`
     border-bottom-left-radius: 3px;
 }
 
+.p-gui * {
+    font-size: 11px;
+}
+
 .p-gui--collapsed {
     height: 0;
     padding: 21px 10px 0 10px;
@@ -87,7 +91,6 @@ return /* css */`
     position: absolute;
     bottom: -15px;
     color: #eee;
-    font-size: 11px;
     text-shadow: 0 -1px 0 #111;
     white-space: nowrap;
     width: 100%;
@@ -102,7 +105,6 @@ return /* css */`
 .p-gui__color {
     width: 100%;
     padding: 7px;
-    font-size: 11px;
     color: white;
     border-bottom: 1px solid #00ff89;
     cursor: pointer;
@@ -236,17 +238,16 @@ return /* css */`
 }
 
 .p-gui__color-picker::-webkit-color-swatch-wrapper {
-	padding: 0;
+    padding: 0;
 }
 .p-gui__color-picker::-webkit-color-swatch {
-	border: none;
+    border: none;
 }
 
 .p-gui__slider {
     width: 100%;
     margin-bottom: 8px;
     padding: 7px;
-    font-size: 11px;
     color: white;
     position: relative;
     min-height: 14px;
@@ -300,7 +301,7 @@ return /* css */`
     width: 100%;
     position: relative;
     background: #434343;
-    overflow: hidden;
+    overflow: auto;
     margin-bottom: 3px;
     display: flex;
     flex-wrap: wrap;
@@ -318,7 +319,6 @@ return /* css */`
 
 .p-gui__folder-header {
     padding: 5px;
-    font-size: 11px;
     background-color: rgba(0, 0, 0, .5);
     color: white;
     cursor: pointer;