You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@druid.apache.org by fj...@apache.org on 2019/04/25 14:59:42 UTC

[incubator-druid] branch master updated: Fix history dialog styling (#7536)

This is an automated email from the ASF dual-hosted git repository.

fjy pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-druid.git


The following commit(s) were added to refs/heads/master by this push:
     new 3ec9fba  Fix history dialog styling (#7536)
3ec9fba is described below

commit 3ec9fbaa477d221f56a2a2ff75b9f4c2ae428295
Author: Qi Shu <sh...@gmail.com>
AuthorDate: Thu Apr 25 07:59:34 2019 -0700

    Fix history dialog styling (#7536)
    
    * Fix history dialog
    
    * more styling
---
 web-console/src/dialogs/history-dialog.scss | 20 ++++++++++----------
 web-console/src/dialogs/history-dialog.tsx  | 13 ++++++-------
 web-console/src/dialogs/snitch-dialog.tsx   |  1 +
 3 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/web-console/src/dialogs/history-dialog.scss b/web-console/src/dialogs/history-dialog.scss
index 247e916..11dd9c4 100644
--- a/web-console/src/dialogs/history-dialog.scss
+++ b/web-console/src/dialogs/history-dialog.scss
@@ -26,8 +26,11 @@
 
     padding: 15px 15px 0 15px;
 
-    h3 {
+    .history-dialog-title {
       padding-left: 10px;
+      margin-bottom: 2px;
+      font-size: 24px;
+      font-weight: 600;
     }
 
     .no-record {
@@ -39,7 +42,7 @@
 
     .history-record-entries {
 
-      margin-bottom: 10px;
+      margin: 10px 0;
       max-height: 60vh;
       overflow: scroll;
 
@@ -49,10 +52,6 @@
         border-style: dot-dash;
         word-wrap: break-word;
 
-        hr {
-          margin: 5px 0 5px 0;
-        }
-
         .bp3-card {
           padding-bottom: 10px;
         }
@@ -60,13 +59,14 @@
         .history-record-title {
           justify-content: space-between;
           display: flex;
+          margin-bottom: 5px;
 
-
+          .history-record-title-change {
+            font-weight: 600;
+            font-size: 16px;
+          }
         }
 
-        .history-record-comment-title {
-          margin-bottom: 5px;
-        }
 
         .json-collapse {
           button {
diff --git a/web-console/src/dialogs/history-dialog.tsx b/web-console/src/dialogs/history-dialog.tsx
index b940d99..9a860e6 100644
--- a/web-console/src/dialogs/history-dialog.tsx
+++ b/web-console/src/dialogs/history-dialog.tsx
@@ -16,14 +16,14 @@
  * limitations under the License.
  */
 
-import { Card, Dialog } from '@blueprintjs/core';
+import {Card, Dialog, Divider, IDialogProps} from '@blueprintjs/core';
 import * as React from 'react';
 
 import { JSONCollapse } from '../components/json-collapse';
 
 import './history-dialog.scss';
 
-interface HistoryDialogProps extends React.Props<any> {
+interface HistoryDialogProps extends IDialogProps {
   historyRecords: any;
 }
 
@@ -46,7 +46,7 @@ export class HistoryDialog extends React.Component<HistoryDialogProps, HistoryDi
       content = <div className="no-record">No history records available</div>;
     } else {
        content = <>
-          <h3>History</h3>
+          <span className={'history-dialog-title'}>History</span>
           <div className="history-record-entries">
             {
               historyRecords.map((record: any) => {
@@ -57,10 +57,10 @@ export class HistoryDialog extends React.Component<HistoryDialogProps, HistoryDi
                 return <div key={record.auditTime} className="history-record-entry">
                   <Card>
                     <div className="history-record-title">
-                      <h5>Change</h5>
-                      <p>{formattedTime}</p>
+                      <span className="history-record-title-change">Change</span>
+                      <span>{formattedTime}</span>
                     </div>
-                    <hr/>
+                    <Divider/>
                     <p>{auditInfo.comment === '' ? '(No comment)' : auditInfo.comment}</p>
                     <JSONCollapse
                       stringValue={record.payload}
@@ -81,7 +81,6 @@ export class HistoryDialog extends React.Component<HistoryDialogProps, HistoryDi
 
   render(): React.ReactNode {
     return <Dialog
-      className="history-dialog"
       isOpen
       {...this.props}
     >
diff --git a/web-console/src/dialogs/snitch-dialog.tsx b/web-console/src/dialogs/snitch-dialog.tsx
index c6ef328..91b94e7 100644
--- a/web-console/src/dialogs/snitch-dialog.tsx
+++ b/web-console/src/dialogs/snitch-dialog.tsx
@@ -127,6 +127,7 @@ export class SnitchDialog extends React.Component<SnitchDialogProps, SnitchDialo
     const { historyRecords } = this.props;
     return <HistoryDialog
       {...this.props}
+      className={'history-dialog'}
       historyRecords={historyRecords}
     >
       <div className={Classes.DIALOG_FOOTER_ACTIONS}>


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@druid.apache.org
For additional commands, e-mail: commits-help@druid.apache.org