135 lines
2.9 KiB
Plaintext
135 lines
2.9 KiB
Plaintext
|
|
@cellEditorHeight: 30px;
|
|
@cellEditorExpandedHeight: 70px;
|
|
@contentBackColor: #fff;
|
|
@gray-light: #f1f1f1;
|
|
@gray-darker: #848484; //rgb(132, 132, 132)
|
|
@statusBarBorderColor: #cbcbcb;
|
|
|
|
#idx-celleditor {
|
|
box-sizing: border-box;
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
display: flex;
|
|
z-index: 5001;
|
|
|
|
height: @cellEditorHeight;
|
|
min-height: @cellEditorHeight;
|
|
background-color: @contentBackColor;
|
|
|
|
&.expanded {
|
|
min-height: @cellEditorExpandedHeight;
|
|
//height: @cellEditorExpandedHeight;
|
|
transition: min-height .1s;
|
|
}
|
|
|
|
&:after {
|
|
content: '';
|
|
position: absolute;
|
|
// background-color: @border-regular-control;
|
|
background-color: @background-menu-divider;
|
|
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 {
|
|
display: inline-flex;
|
|
// background-color: var(--f7-navbar-bg-color);
|
|
// background-color: @fill-white;
|
|
|
|
// .md & {
|
|
// background-color: @gray-light;
|
|
// }
|
|
}
|
|
|
|
#idx-cell-name {
|
|
display: inline-block;
|
|
width: 90px;
|
|
padding: 0 4px;
|
|
border: 0 none;
|
|
line-height: 30px;
|
|
//font-size: 17px;
|
|
text-align: center;
|
|
|
|
color: @text-normal;
|
|
|
|
&[disabled] {
|
|
color: @gray-darker;
|
|
opacity: 0.5;
|
|
}
|
|
}
|
|
|
|
.phone & {
|
|
#idx-cell-name {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
#idx-btn-function {
|
|
height: @cellEditorHeight;
|
|
line-height: @cellEditorHeight;
|
|
padding: 0 10px;
|
|
}
|
|
|
|
#idx-cell-content {
|
|
padding: 3px 3px;
|
|
line-height: 1.428571429;
|
|
// color: #000;
|
|
color: @text-normal;
|
|
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: solid 1px @brandColor;
|
|
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);
|
|
}
|
|
}
|
|
}
|
|
|
|
.ce-group {
|
|
background-color: @background-secondary;
|
|
}
|
|
|
|
.group--content {
|
|
position: relative;
|
|
.hairline(left, @background-menu-divider);
|
|
}
|
|
}
|