80 lines
1.8 KiB
Plaintext
80 lines
1.8 KiB
Plaintext
|
|
||
|
@cellEditorHeight: 30px;
|
||
|
@cellEditorExpandedHeight: 70px;
|
||
|
@contentBackColor: #fff;
|
||
|
@gray-light: #f1f1f1;
|
||
|
|
||
|
#idx-celleditor {
|
||
|
display: flex;
|
||
|
|
||
|
height: @cellEditorHeight;
|
||
|
min-height: @cellEditorHeight;
|
||
|
background-color: @contentBackColor;
|
||
|
|
||
|
&.expanded {
|
||
|
min-height: @cellEditorExpandedHeight;
|
||
|
//height: @cellEditorExpandedHeight;
|
||
|
transition: min-height .1s;
|
||
|
}
|
||
|
|
||
|
&:after {
|
||
|
content: '';
|
||
|
position: absolute;
|
||
|
background-color: var(--f7-navbar-border-color, var(--f7-bars-border-color));
|
||
|
display: block;
|
||
|
z-index: 15;
|
||
|
top: auto;
|
||
|
right: auto;
|
||
|
bottom: 0;
|
||
|
left: 0;
|
||
|
height: 1px;
|
||
|
width: 100%;
|
||
|
transform-origin: 50% 100%;
|
||
|
transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
|
||
|
}
|
||
|
|
||
|
#box-cell-name {
|
||
|
background-color: var(--f7-navbar-bg-color);
|
||
|
}
|
||
|
|
||
|
#ce-cell-content {
|
||
|
padding: 3px 3px;
|
||
|
line-height: 1.428571429;
|
||
|
color: #000;
|
||
|
vertical-align: middle;
|
||
|
background-color: @contentBackColor;
|
||
|
min-height: @cellEditorHeight;
|
||
|
height: 100%;
|
||
|
width: 100%;
|
||
|
}
|
||
|
|
||
|
.caret {
|
||
|
&::after {
|
||
|
content: '';
|
||
|
position: absolute;
|
||
|
top: 8px;
|
||
|
left: 6px;
|
||
|
width: 8px;
|
||
|
height: 8px;
|
||
|
background-color: transparent;
|
||
|
border: solid 1px black;
|
||
|
border-bottom: none;
|
||
|
border-right: none;
|
||
|
|
||
|
transition: transform 0.2s ease;
|
||
|
transform: rotate(-135deg);
|
||
|
}
|
||
|
|
||
|
width: 30px;
|
||
|
height: 16px;
|
||
|
}
|
||
|
|
||
|
&.expanded {
|
||
|
.caret {
|
||
|
&::after {
|
||
|
transform: rotate(45deg) translate(3px, 3px);
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|