From 92fb55e5d2e85a96ce548f81111d4af7a7367802 Mon Sep 17 00:00:00 2001
From: huangying11 <huangying11@baidu.com>
Date: Thu, 17 Nov 2022 15:52:09 +0800
Subject: [PATCH] =?UTF-8?q?amis-saas-8092=20improve:=20=E9=95=BF=E6=96=87?=
 =?UTF-8?q?=E6=9C=AC=E8=A1=A8=E8=BE=BE=E5=BC=8F=E5=B1=95=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Change-Id: I6ed6502eb10e9d5c9cf2080471a1297d4a7da012
---
 .../control/_textarea-formula-control.scss    | 39 ++++++++++++-------
 1 file changed, 25 insertions(+), 14 deletions(-)

diff --git a/packages/amis-editor-core/scss/control/_textarea-formula-control.scss b/packages/amis-editor-core/scss/control/_textarea-formula-control.scss
index 78819b930..eeb6cc358 100644
--- a/packages/amis-editor-core/scss/control/_textarea-formula-control.scss
+++ b/packages/amis-editor-core/scss/control/_textarea-formula-control.scss
@@ -48,21 +48,8 @@
       }
 
       .cm-expression {
-        display: inline-block;
         position: relative;
-        padding: 0 5px;
-        border-radius: 3px;
-        color: #fff;
-        margin: 0 1px 1px;
-        background: var(--button-primary-default-bg-color);
-        cursor: pointer;
-
-        &:hover {
-          background: var(--button-primary-hover-bg-color);
-          .expression-popover {
-            display: block;
-          }
-        }
+        display: inline-block;
 
         .expression-popover {
           position: absolute;
@@ -79,6 +66,7 @@
           border: none;
           box-shadow: var(--Tooltip-boxShadow--dark);
           z-index: 10;
+
           .expression-popover-arrow {
             position: absolute;
             display: block;
@@ -107,6 +95,29 @@
           }
         }
       }
+
+      .cm-expression-text {
+        display: inline-block;
+        position: relative;
+        padding: 0 5px;
+        border-radius: 3px;
+        color: #fff;
+        margin: 0 1px 1px;
+        background: var(--button-primary-default-bg-color);
+        cursor: pointer;
+        width: 40px;
+        overflow-x: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        vertical-align: middle;
+
+        &:hover {
+          background: var(--button-primary-hover-bg-color);
+          & ~ .expression-popover {
+            display: block;
+          }
+        }
+      }
     }
 
     &-footer {