- gray 테마 테이블 헤더 수정, 스크롤 색상 수정

- 트랜잭션 개수 위치 조절 - 컨트롤러의 레이아웃 표시 간소화 - 로딩바 투명도 수정
scouter-contrib · Jun 22, 2019 · aef19e6 · aef19e6
1 parent 334d9fd
commit aef19e6
Show file tree

Hide file tree

Showing 6 changed files with 57 additions and 11 deletions.
diff --git a/src/Theme.css b/src/Theme.css
@@ -146,6 +146,16 @@ html.theme-gray, .theme-gray body {
     color: white;
 }
 
+.theme-gray .scrollbar::-webkit-scrollbar {
+    width: 7px;
+    height: 7px;
+    background-color: rgba(0, 0, 0, 0.4);
+}
+
+.theme-gray .scrollbar::-webkit-scrollbar-thumb {
+    background-color: #FCDC3B;
+}
+
 /* THEME, Menu.css */
 .theme-gray .menu-div {
     background-color: #222;
@@ -321,4 +331,18 @@ html.theme-gray, .theme-gray body {
 .theme-gray .frame-profile-step-detail .sub-detail-title .sql-btns > div {
     background-color: rgba(255,255,255,0.4);
     color: white;
-}
+}
+
+/* ProfileList.css */
+.xlog-profile-list > div.header.row.fixed > span {
+    position: sticky;
+    top: 0;
+    background-color: #F2F2F2;
+}
+
+.theme-gray .xlog-profile-list > div.header.row.fixed > span {
+    position: sticky;
+    top: 0;
+    background-color: #111;
+}
+
diff --git a/src/components/Controller/Controller.css b/src/components/Controller/Controller.css
@@ -121,6 +121,14 @@
 }
 
 .controller-wrapper .control-item.first {
+    z-index: 3;
+}
+
+.controller-wrapper .control-item.control-item-search {
+    z-index: 2;
+}
+
+.controller-wrapper .control-item.control-item-calendar {
     z-index: 1;
 }
 
@@ -159,20 +167,27 @@
     display: inline-block;
     margin-left: 10px;
     position: absolute;
-    top : 2px;
+    top : 3px;
+    right : 10px;
+    font-size: 10px;
 }
 
 .controller-wrapper .control-item .row > div.row-message .breakpoints .breakpoint {
     display: inline-block;
-    padding: 2px 4px;
+    padding-top: 1px;
+    text-align: center;
+    width: 14px;
+    height: 14px;
+    border-radius: 50%;
+    box-sizing: border-box;
 }
 
 .controller-wrapper .control-item .row > div.row-message .breakpoints .breakpoint:first-child {
-    border-radius: 2px 0 0 2px;
+    _border-radius: 5px 0 0 5px;
 }
 
 .controller-wrapper .control-item .row > div.row-message .breakpoints .breakpoint:last-child {
-    border-radius: 0 2px 2px 0;
+    _border-radius: 0 5px 5px 0;
 }
 
 .controller-wrapper .control-item .row > div.row-message .breakpoints .breakpoint.selected {

diff --git a/src/components/Controller/Controller.js b/src/components/Controller/Controller.js
@@ -1112,7 +1112,7 @@ class Controller extends Component {
                             </div>
                         </div>
                     </div>
-                    <div className="control-item paper-only">
+                    <div className="control-item paper-only control-item-search">
                         <div className="row desc">
                             <div className="step"><span>3</span></div>
                             <div className="row-message">SEARCH</div>
@@ -1126,11 +1126,11 @@ class Controller extends Component {
                         </div>
                     </div>
 
-                    <div className="control-item paper-only">
+                    <div className="control-item paper-only control-item-calendar">
                         <div className="row desc">
                             <div className="step"><span>4</span></div>
                             <div className="row-message">CHANGE LAYOUT
-                                <div className="breakpoints" data-tip="CURRENT PAPER LAYER"><span className={"breakpoint " + (this.props.control.breakpoint === "lg" ? "selected" : "")}>Large</span><span className={"breakpoint " + (this.props.control.breakpoint === "md" ? "selected" : "")}>Small</span></div>
+                                <div className="breakpoints"><span data-tip="SMALL LAYOUT ( < 800PX)" className={"breakpoint " + (this.props.control.breakpoint === "lg" ? "selected" : "")}>L</span><span  data-tip="LARGE LAYOUT ( > 800PX)" className={"breakpoint " + (this.props.control.breakpoint === "md" ? "selected" : "")}>S</span></div>
                             </div>
                         </div>
                         <div className="row control">

diff --git a/src/components/Loading/Loading.css b/src/components/Loading/Loading.css
@@ -5,7 +5,7 @@
     left : 0;
     bottom : 0;
     right : 0;
-    background-color: rgba(0,0,0,0.6);
+    background-color: rgba(0,0,0,0.4);
     width: 100%;
     height: 100%;
     box-sizing: border-box;

diff --git a/src/components/Paper/XLog/XLog.css b/src/components/Paper/XLog/XLog.css
@@ -79,7 +79,14 @@
 
 .xlog-viewer .text-right {
     position: absolute;
-    right: 5%;
+    right: 15px;
+    top : 6px;
+    font-size: 8px;
+    text-transform: uppercase;
+}
+
+.xlog-viewer .text-right > p {
+    margin: 0;
 }
 
 .xlog-viewer .text-right .text-error  {

diff --git a/src/components/Paper/XLog/XLog.js b/src/components/Paper/XLog/XLog.js
@@ -651,7 +651,7 @@ class XLog extends Component {
                 }
                 <div>
                     <div className="axis-button axis-up noselect" onClick={this.axisUp} onMouseDown={this.stopPropagation}>+</div>
-                    <div className="text-right"><p>Error / Total : <span className="text-error">{this.errorCount}</span> / {this.callCount}</p></div>
+                    <div className="text-right"><p>Total : {this.callCount} (<span className="text-error">{this.errorCount}</span>)</p></div>
                 </div>
                 <div className="axis-button axis-down noselect" onClick={this.axisDown} onMouseDown={this.stopPropagation}>-</div>
                 {this.props.box.values.showPreview === "Y" &&