fix: 修复promql模式下小屏样式问题

TencentBlueKing · Dec 9, 2023 · fa81561 · fa81561
1 parent 1791e1a
commit fa81561
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 1 deletion.
diff --git a/bkmonitor-event-datasource/src/sass/query.scss b/bkmonitor-event-datasource/src/sass/query.scss
@@ -95,6 +95,10 @@
       align-items: center;
       background-color: #e7e9ef;
       color: #313238;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      flex-wrap: nowrap;
       .label-tip {
         margin-right: -8px;
         margin-left: 8px;

diff --git a/bkmonitor-timeseries-datasource/src/components/addvance-setting.tsx b/bkmonitor-timeseries-datasource/src/components/addvance-setting.tsx
@@ -125,7 +125,9 @@ export default class AddvanceSetting extends React.PureComponent<IAddvanceSettin
         </div>
         <div className={`addvance-setting-content ${showContent ? '' : 'is-hidden'}`}>
           {
-            mode === 'code' ? <EditorForm title='Min Step'>
+            mode === 'code' ? <EditorForm title='Min Step' labelStyle={{
+              minWidth: '86px',
+            }}>
               <AliasInput style={{ width: '88px', height: '32px' }}
                 inputProps={{ defaultValue: step, placeholder: 'auto' }}
                 onChange={v => onChange('step', v)} />

diff --git a/bkmonitor-timeseries-datasource/src/sass/query.scss b/bkmonitor-timeseries-datasource/src/sass/query.scss
@@ -104,6 +104,10 @@
       align-items: center;
       background-color: #e7e9ef;
       color: #313238;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      flex-wrap: nowrap;
       .label-tip {
         margin-right: -8px;
         margin-left: 8px;