Radically modified layout/views of toolbar

Added profile logging Fixed incorrect hiding of logging table headers
fiesh · Mar 18, 2012 · be07682 · be07682
1 parent 46e5476
commit be07682
Show file tree

Hide file tree

Showing 13 changed files with 309 additions and 203 deletions.
diff --git a/yii-debug-toolbar/YiiDebugToolbarRoute.php b/yii-debug-toolbar/YiiDebugToolbarRoute.php
@@ -18,7 +18,7 @@
 class YiiDebugToolbarRoute extends CLogRoute
 {
 
-    private $_panels = array(
+    public $_panels = array(
         'YiiDebugToolbarPanelServer',
         'YiiDebugToolbarPanelRequest',
         'YiiDebugToolbarPanelSettings',

diff --git a/yii-debug-toolbar/assets/yii.debugtoolbar.css b/yii-debug-toolbar/assets/yii.debugtoolbar.css
@@ -20,50 +20,46 @@
     list-style-type:none;
 
     color: #424242;
-    font-family: Arial,Helvetica,sans-serif;
-    font-size: 12px;
-    line-height: 20px;
+    font: 12px "Helvetica Neue",Helvetica,Arial,sans-serif;
+    /*line-height: 20px;*/
 
 }
 
 #yii-debug-toolbar{
-    display:block;
+    display:inline;
     position:fixed;
     z-index:10000;
     top:0;
-    right:0;
-    bottom:0;
-    width:190px;
-    line-height:24px;
-    background:#192839;
+    right:5px;
+    margin-right: 5px;
+    padding-right: 15px;
+    /*width:425px;*/
+    line-height:12px;
+    background:#e4f5ff;
+    border: 1px solid #cdcdcd;
 
 }
 
 #yii-debug-toolbar-swither{
     display:block;
     position:fixed;
     z-index:1000000;
-    top:5px;
-    right:5px;
-    bottom:0;
-    height:28px;
-    width:28px;
-    line-height:28px;
-
+    top:3px;
+    right:15px;
 }
 
 #yii-debug-toolbar-swither a{
-    background:transparent url(panel.png) no-repeat scroll center center;
-    text-indent:-999999px;
+    /*background:transparent url(panel.png) no-repeat scroll center center;*/
+    /*text-indent:-999999px;*/
     z-index:100000000;
-    display:block;
-    height:24px;
-    width:24px;
-    line-height:24px;
-    padding:4px 0 0 4px;
+    /*display:block;*/
+    /*height:24px;*/
+    /*width:24px;*/
+    /*line-height:24px;*/
+    /*padding:4px 0 0 4px;*/
 }
 #yii-debug-toolbar-swither a.close{
-    background:transparent url(panel-close.png) no-repeat scroll center center;
+    /*background:transparent url(panel-close.png) no-repeat scroll center center;*/
 }
 
 #yii-debug-toolbar p{
@@ -81,12 +77,15 @@ line-height:50px;
 #yii-debug-toolbar h4 {
     margin:0.8em 0 0 0;
     color: #313131;
-    font-size: 18px;
+    font-size: 14px;
+    font-weight: bold;
 }
 
 
 #yii-debug-toolbar #yii-debug-toolbar-buttons{
     opacity:0.9;
+    height: 15px;
+    padding: 3px 0;
 }
 
 #yii-debug-toolbar #yii-debug-toolbar-buttons ul{
@@ -97,29 +96,33 @@ line-height:50px;
 
 #yii-debug-toolbar #yii-debug-toolbar-buttons ul li{
     color:#fff;
-    display:block;
+    display:inline;
     font-weight:bold;
-    float:none;
+    float:left;
     margin:0;
-    padding:0;
-    position:relative;
-    width:auto;
+    padding:0 10px;
+    /*position:relative;*/
+    /*width:auto;*/
 }
 
 #yii-debug-toolbar #yii-debug-toolbar-buttons li>a,
 #yii-debug-toolbar #yii-debug-toolbar-buttons li>div.contentless{
     font-weight:normal;
     font-style:normal;
-    text-decoration:none;
+    text-decoration:underline;
     display:block;
-    font-size:14px;
-    color:#fff;
-    padding:10px 10px 5px 25px;
+    font-size:12px;
+    color:#008000;
+    /*padding:10px 10px 5px 25px;*/
 }
 
 #yii-debug-toolbar #yii-debug-toolbar-buttons li a:hover {
-    background-color:#FFFFCC;
-    color:#000;
+    /*background-color: #e4f5ff;*/
+}
+
+#yii-debug-toolbar #yii-debug-toolbar-buttons li>a span {
+    font-weight: bold;
+    color: #ff7700;
 }
 
 #yii-debug-toolbar #yii-debug-toolbar-buttons small {
@@ -128,28 +131,29 @@ line-height:50px;
 
 #yii-debug-toolbar #yii-debug-toolbar-buttons li small {
     font-size:12px;
-    color:#999;
+    color:#666;
     font-style:normal;
     text-decoration:none;
     font-variant:small-caps;
 }
 
-#yii-debug-toolbar #yii-debug-toolbar-buttons .yii-debug-toolbar-button.active,
-#yii-debug-toolbar #yii-debug-toolbar-buttons .yii-debug-toolbar-button.active a:hover{
-    background:#474747 url(indicator.png) no-repeat 0 50%;
-    color:#fff;
-
+#yii-debug-toolbar #yii-debug-toolbar-buttons .yii-debug-toolbar-button.active a{
+    /*color:#ff7700;*/
 }
 
 #yii-debug-toolbar .yii-debug-toolbar-panel{
     display:block;
     position:fixed;
     z-index:10000000;
-    top:0px;
-    right:190px;
-    left:0;
-    bottom:0;
+    top:30px;
+    right:5px;
     background:#EEEEEE;
+
+    border: 1px solid #cdcdcd;
+    width: 800px;
+    max-height: 500px;
+    padding: 10px;
+    overflow: auto;
 }
 
 
@@ -162,6 +166,7 @@ line-height:50px;
     right:0;
     left:0;
     height:50px;
+    display: none;
 }
 
 #yii-debug-toolbar .yii-debug-toolbar-panel-title .yii-debug-toolbar-panel-close {
@@ -170,7 +175,7 @@ line-height:50px;
     position:absolute;
     top:4px;
     right:15px;
-    height:40px;
+    height:30px;
     width:40px;
     background:url(close.png) no-repeat center center;
 }
@@ -184,13 +189,13 @@ line-height:50px;
 }
 #yii-debug-toolbar .yii-debug-toolbar-panel-content
 {
-    display:block;
-    position:fixed;
-    margin:0;
-    top:50px;
-    right:210px;
-    bottom:0;
-    left:0px;
+    /*display:block;*/
+    /*position:fixed;*/
+    /*margin:0;*/
+    /*top:40px;*/
+    /*right:0px;*/
+    /*bottom:0;*/
+    /*left:0px;*/
     background-color:#eee;
     color:#666;
     z-index:100000000;
@@ -237,10 +242,7 @@ line-height:50px;
 
 #yii-debug-toolbar .yii-debug-toolbar-panel-content .scroll
 {
-    width:100%;height:100%;
-    overflow:auto;
-    display:block;
-    padding:0 10px;
+    overflow:inherit;
 }
 
 
@@ -256,7 +258,7 @@ line-height:50px;
     width:100%;
     background-color:#fff;
     margin-top:0.8em;
-    overflow:auto;
+    /*overflow:auto;*/
 }
 
 #yii-debug-toolbar .yii-debug-toolbar-panel-content table thead tr
@@ -437,7 +439,7 @@ line-height:50px;
 
 #yii-debug-toolbar #resource-usage{
     border-top:1px double #EEEEEE;
-
+    display: none;
     position:absolute;
     right:0px;
     bottom:0px;

diff --git a/yii-debug-toolbar/assets/yii.debugtoolbar.js b/yii-debug-toolbar/assets/yii.debugtoolbar.js
@@ -142,6 +142,9 @@
             $('#yii-debug-toolbar .collapsible').bind('click', function(){ yiiDebugToolbar.toggleSection($(this).attr('rel'), this); });
             $('#yii-debug-toolbar .collapsible.collapsed').next().hide();
 
+            // fix for hiding the log messages collapse
+            $("#yii-debug-toolbar-log .collapsible.collapsed").next().show();
+
         },
 
         toggleDetails: function(selector, cell){