amis-saas-6892 fix: 长文本公式输入框支持全屏

Change-Id: Ia0998f0baeaa4c9e4f359e6b87b77fbb4226d953
This commit is contained in:
igrowp 2022-10-26 16:37:19 +08:00
parent 35c05ef045
commit afc636edff
2 changed files with 34 additions and 35 deletions

View File

@ -16,7 +16,7 @@ $tooltip-bottom: '[data-tooltip][data-position=' bottom ']:hover:after';
z-index: 5;
// 搞点动画
transition: width ease-in-out 0.2s;
transform: translateZ(0);
// transform: translateZ(0);
@include panel-sm-content();

View File

@ -7,8 +7,9 @@
}
.ae-TextareaResultBox {
position: relative;
width: 100%;
height: 100px;
height: 100%;
display: block;
border: 1px solid var(--Form-input-borderColor);
border-radius: var(--Form-input-borderRadius);
@ -24,10 +25,13 @@
}
&-editor {
height: 100%;
& > .CodeMirror {
height: 100px;
height: 100%;
padding-right: 24px;
padding-bottom: 24px;
}
.cm-field, .cm-expression {
.cm-expression {
display: inline-block;
position: relative;
padding: 0 5px;
@ -54,31 +58,12 @@
color: #000;
border-radius: 4px;
padding: 0 8px;
background: var(--Tooltip-bg);
box-shadow: var(--Tooltip-boxShadow);
}
}
}
&-content {
position: relative;
width: 100%;
min-height: 100%;
}
&-input {
width: 100%;
min-height: 100%;
display: inline-block;
padding: var(--Form-input-paddingY) var(--Form-input-paddingX);
/* 避免和 btn 重叠 */
padding-right: calc(var(--Form-input-paddingX) + var(--Form-fontSize));
&:focus-visible {
outline: none;
}
}
&-dropdown {
position: absolute;
bottom: 8px;
@ -87,21 +72,35 @@
&-menus {
min-width: 60px;
right: 0;
left: auto;
right: 4px;
}
&-expression {
display: inline-block;
&-fullscreen {
position: absolute;
top: 4px;
right: 12px;
cursor: pointer;
padding: 0 4px 0 8px;
margin: 0 1px 1px;
color: white;
background-color: $editor-active-color;
border-radius: var(--Form-input-borderRadius);
.icon {
margin-left: 2px;
width: 8px;
}
}
&.is-fullscreen {
margin: 0 !important;
position: fixed !important;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 2147483630 !important;
width: auto !important;
height: auto !important;
.ae-TextareaResultBox {
height: 100% !important;
&-dropdown {
bottom: 60px;
}
&-menus {
right: 10px;
}
}
}