UNPKG

golden-layout

Version:

A multi-screen javascript Layout manager https://golden-layout.com

134 lines (109 loc) 11.7 kB
.lm_goldenlayout{ background: #000; background-repeat: repeat; background: -webkit-linear-gradient(#000, #222); } .lm_content{ background: #272822; } .lm_dragProxy .lm_content{ box-shadow: 2px 2px 4px rgba( 0, 0, 0, 0.9 ); } .lm_dropTargetIndicator{ box-shadow: inset 0 0 30px #000; outline: 1px dashed #ccc; transition: all 200ms ease; } .lm_dropTargetIndicator .lm_inner{ background: #000; opacity: 0.2; filter: alpha(opacity=40); /** bit darker to compensate for lack of box shadow **/ } .lm_splitter{ background: #000; opacity: 0.001; transition: opacity 200ms ease; } .lm_splitter:hover, .lm_splitter.lm_dragging{ opacity: 1; background: #444; } .lm_header{ height: 28px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAcCAIAAAAvP0KbAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowNEMyNTYwNTM0MDAxMUU0OENDMTlEMkNBRTJGQTE5OCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowNEMyNTYwNjM0MDAxMUU0OENDMTlEMkNBRTJGQTE5OCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjA0QzI1NjAzMzQwMDExRTQ4Q0MxOUQyQ0FFMkZBMTk4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjA0QzI1NjA0MzQwMDExRTQ4Q0MxOUQyQ0FFMkZBMTk4Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+um2R4AAAADRJREFUeNpi0NbWZgIBRkZGOGZgYIDTyGx8Ysj0v3//wOyfP38yaWlpsbx58wYsBuQDBBgACokP6kE3oX4AAAAASUVORK5CYII=); } .lm_header.lm_selectable{ cursor: pointer; } .lm_selected .lm_header{ background-color: #452500; } .lm_maximised .lm_header{ background-color: #000; } .lm_header .lm_tab{ background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAcCAIAAAAvP0KbAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpENTQ0RjgyMDMzRkYxMUU0OTNBRTgyRDg3NTdBQzBGNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpENTQ0RjgyMTMzRkYxMUU0OTNBRTgyRDg3NTdBQzBGNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkQ1NDRGODFFMzNGRjExRTQ5M0FFODJEODc1N0FDMEY2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkQ1NDRGODFGMzNGRjExRTQ5M0FFODJEODc1N0FDMEY2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+0oQNrwAAADdJREFUeNpitrCwYGJjYwNjBgYGnPj///8YbGQaC5tZQECASUtLi+XNmzdM//79Y/r58ydAgAEATLgfS3hbXWQAAAAASUVORK5CYII=); color: #999; font-size: 13px; padding-bottom: 4px; font-family: Arial, sans-serif; height: 22px; margin: 0; } .lm_tab.lm_active, .lm_tab:hover{ color: #eee; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAcCAIAAAAvP0KbAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpERDgyOEQwRDMzRkQxMUU0ODk2NzlGNjA3RDYyNUUwQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpERDgyOEQwRTMzRkQxMUU0ODk2NzlGNjA3RDYyNUUwQiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkREODI4RDBCMzNGRDExRTQ4OTY3OUY2MDdENjI1RTBCIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkREODI4RDBDMzNGRDExRTQ4OTY3OUY2MDdENjI1RTBCIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Qa1dywAAACxJREFUeNpi8vLyYuLm5mZiYGBg+v//P5xGZ2PjE1KDzP737x/Tz58/AQIMACXnOeodZuHuAAAAAElFTkSuQmCC); } .lm_header .lm_tab.lm_active{ padding-bottom: 5px; border-bottom: none; } .lm_header .lm_tab .lm_close_tab{ background-position: center center; background-repeat: no-repeat; opacity: 0.4; filter: alpha(opacity=40); background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpFQ0EwQjYyQ0YzOUExMUUzODEzRUM2RjIwMjQwNUVGMyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpFQ0EwQjYyREYzOUExMUUzODEzRUM2RjIwMjQwNUVGMyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkVDQTBCNjJBRjM5QTExRTM4MTNFQzZGMjAyNDA1RUYzIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkVDQTBCNjJCRjM5QTExRTM4MTNFQzZGMjAyNDA1RUYzIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+71iVHAAAAE5JREFUeNpsTQkKwDAIS6Uf8P9/1CdkKtp1MCFqDgjMjAGQ/CB1AbACdHfMxM/Ud/MJ1G0OUVXcgTHKzNUBXoHSVpZPB94pLj/GqXgEGAC1mzL201rjRgAAAABJRU5ErkJggg==); } .lm_header .lm_tab .lm_close_tab{ width: 11px; height: 11px; right: 6px; top: 4px; background-repeat: no-repeat; } .lm_header .lm_tab .lm_close_tab:hover, .lm_header .lm_tab.lm_active .lm_close_tab{ opacity: 1; filter: alpha(opacity=100); } .lm_controls > li{ background-position: center center; background-repeat: no-repeat; position: relative; opacity: 0.4; filter: alpha(opacity=40); -webkit-transition: opacity 300ms ease; -o-transition: opacity 300ms ease; -ms-transition: opacity 300ms ease; -moz-transition: opacity 300ms ease; transition: opacity 300ms ease; } .lm_controls > li:hover{ opacity: 1; filter: alpha(opacity=100); } .lm_controls .lm_popout{ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3FpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpjOWFlODE3Zi0zMjcxLWJkNDItOTY0Mi03MDJiZjVkNGJmOWEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDlDNzcyMkJGQjYyMTFFM0IzQUE4RkIyQzNDRDI0MDgiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDlDNzcyMkFGQjYyMTFFM0IzQUE4RkIyQzNDRDI0MDgiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOmM5YWU4MTdmLTMyNzEtYmQ0Mi05NjQyLTcwMmJmNWQ0YmY5YSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpjOWFlODE3Zi0zMjcxLWJkNDItOTY0Mi03MDJiZjVkNGJmOWEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5u9IgFAAAAPElEQVR42mL8//8/AxTAGeiABY3PiEXNfyYGIgALmjX/sZnMgs8aGIOQdf+xOZwBm3VEOxxvGIEAQIABAAoJChZkbRwFAAAAAElFTkSuQmCC); } .lm_controls .lm_maximise{ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3FpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpjOWFlODE3Zi0zMjcxLWJkNDItOTY0Mi03MDJiZjVkNGJmOWEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDlDQ0YxNUVGQjYyMTFFM0IzQUE4RkIyQzNDRDI0MDgiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDlDNzcyMzJGQjYyMTFFM0IzQUE4RkIyQzNDRDI0MDgiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOmM5YWU4MTdmLTMyNzEtYmQ0Mi05NjQyLTcwMmJmNWQ0YmY5YSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpjOWFlODE3Zi0zMjcxLWJkNDItOTY0Mi03MDJiZjVkNGJmOWEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5DFX8LAAAAJklEQVR42mL8DwQMBAATAxGABUoz4lHznyiTBqMimO/whhVAgAEAMIEGEQk8OGQAAAAASUVORK5CYII=); } .lm_controls .lm_close{ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3FpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpjOWFlODE3Zi0zMjcxLWJkNDItOTY0Mi03MDJiZjVkNGJmOWEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RDlDQ0YxNjZGQjYyMTFFM0IzQUE4RkIyQzNDRDI0MDgiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RDlDQ0YxNjVGQjYyMTFFM0IzQUE4RkIyQzNDRDI0MDgiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOmM5YWU4MTdmLTMyNzEtYmQ0Mi05NjQyLTcwMmJmNWQ0YmY5YSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpjOWFlODE3Zi0zMjcxLWJkNDItOTY0Mi03MDJiZjVkNGJmOWEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6rmsrNAAAAQ0lEQVR42nTOUQ4AMAQDUHr/O3dbIgtN+cMTTd6KiIy9iALcwNujGgf/B7RhhyMC5DoVOET3Gi6DQrgMCrGAAY8AAwDe6xQOLXhdxAAAAABJRU5ErkJggg==); } .lm_transition_indicator{ background-color: #000; border: 1px dashed #555; }