amis2/packages/amis-editor-core/scss/_mixin.scss
yangwei9012 f541968956 merge feat-optimize-4
Change-Id: I8974063a944df31cfcd401f416b69859fa53c04d
2022-07-05 23:12:28 +08:00

98 lines
2.0 KiB
SCSS

@mixin minScrollBar {
&::-webkit-scrollbar {
// display: none;
background-color: transparent;
width: 6px;
overflow: visible;
height: 10px !important;
}
::-webkit-scrollbar-track {
background-color: transparent;
}
&::-webkit-scrollbar-thumb {
width: 6px;
background-color: rgb(92, 95, 102, 0.5); // #babac0;
border-radius: 6px;
border: 4px solid transparent;
&:hover {
background-color: #d4d6d9;
}
}
&::-webkit-scrollbar-button {
display: none;
}
}
@mixin flexBox(
$direction: row,
$justify-content: space-between,
$align-items: center,
$wrap: nowrap
) {
display: flex;
flex-flow: $direction $wrap;
justify-content: $justify-content;
align-items: $align-items;
}
@mixin panel-icon {
fill: var(--primary);
path {
fill: var(--primary);
}
}
@mixin panel-group-bg {
background: #fafafa;
padding: #{px2rem(10px)};
border-radius: #{$Editor-borderRadius};
}
@mixin collapse-header-text {
color: #070c14;
font-weight: 500;
font-size: 12px;
}
@mixin extend-more {
position: relative;
background-color: #f7f7f9;
border-radius: px2rem(2px);
padding: px2rem(12px) px2rem(8px);
&::after {
display: block;
content: '';
height: 12px;
width: 12px;
position: absolute;
top: -6px;
left: 12px;
transform: rotate(45deg);
background-color: #f7f7f9;
}
&.right::after {
right: 12px;
left: auto;
}
}
@mixin panel-sm-content {
--Form-fontSize: #{$Editor-right-panel-font-size};
--ColorPicker-fontSize: var($Editor-right-panel-font-size);
--fontSizeBase: #{$Editor-right-panel-font-size};
--Form-item-fontSize: #{$Editor-right-panel-font-size};
--Button--md-fontSize: #{$Editor-right-panel-font-size};
--Form-input-fontSize: #{$Editor-right-panel-font-size};
--Button-fontSize: #{$Editor-right-panel-font-size};
--Form-input-lineHeight: #{$Editor-right-panel-line-height};
--InputGroup-select-borderColor: #{$Editor-right-panel-border-color};
--Form-input-borderColor: #{$Editor-right-panel-border-color};
}