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; z-index: 5;
// 搞点动画 // 搞点动画
transition: width ease-in-out 0.2s; transition: width ease-in-out 0.2s;
transform: translateZ(0); // transform: translateZ(0);
@include panel-sm-content(); @include panel-sm-content();

View File

@ -7,8 +7,9 @@
} }
.ae-TextareaResultBox { .ae-TextareaResultBox {
position: relative;
width: 100%; width: 100%;
height: 100px; height: 100%;
display: block; display: block;
border: 1px solid var(--Form-input-borderColor); border: 1px solid var(--Form-input-borderColor);
border-radius: var(--Form-input-borderRadius); border-radius: var(--Form-input-borderRadius);
@ -24,10 +25,13 @@
} }
&-editor { &-editor {
height: 100%;
& > .CodeMirror { & > .CodeMirror {
height: 100px; height: 100%;
padding-right: 24px;
padding-bottom: 24px;
} }
.cm-field, .cm-expression { .cm-expression {
display: inline-block; display: inline-block;
position: relative; position: relative;
padding: 0 5px; padding: 0 5px;
@ -54,31 +58,12 @@
color: #000; color: #000;
border-radius: 4px; border-radius: 4px;
padding: 0 8px; padding: 0 8px;
background: var(--Tooltip-bg); background: var(--Tooltip-bg);
box-shadow: var(--Tooltip-boxShadow); 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 { &-dropdown {
position: absolute; position: absolute;
bottom: 8px; bottom: 8px;
@ -87,21 +72,35 @@
&-menus { &-menus {
min-width: 60px; min-width: 60px;
right: 0;
left: auto; left: auto;
right: 4px;
} }
&-expression { &-fullscreen {
display: inline-block; position: absolute;
top: 4px;
right: 12px;
cursor: pointer; cursor: pointer;
padding: 0 4px 0 8px; }
margin: 0 1px 1px; }
color: white;
background-color: $editor-active-color; &.is-fullscreen {
border-radius: var(--Form-input-borderRadius); margin: 0 !important;
.icon { position: fixed !important;
margin-left: 2px; top: 0;
width: 8px; 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;
} }
} }
} }