我试图了解如何在 extjs 6.0.2 上正确执行 mixin 的覆盖。
这是 RTL 上的导航面板,它取自 extjs 6 附带的响应式管理仪表板示例。
我需要翻转以下类边距值以使其在 RTL 上正确:
.x-treelist-navigation .x-treelist-item-text {
color: #adb3b8;
margin-left: 50px;
margin-right: 24px;
font-size: 14px;
line-height: 64px;
}
我试图创建一个主题,也试图在应用程序主 scss 文件上覆盖它但没有成功......
这是示例附带的用户界面:
@include treelist-ui(
$ui: 'navigation',
$padding: 0 10px,
// Black-ish background color
$background-color: $panel-navigation-background-color,
$toolstrip-background-color: #32404e,
$tool-float-indicator-color: $panel-header-background-color,
$tool-float-indicator-width: 5px,
$tool-indicator-selected-color: $panel-header-background-color,
$tool-indicator-selected-width: 5px,
$tool-selected-background-color: mix(white, $panel-navigation-background-color, 10%),
//$tool-selected-color: #fff,
//$tool-selected-background-color: $panel-header-background-color,
// Darker background for expanded subtrees
$item-expanded-background-color: #2c3845,
// Taller line height
$item-line-height : $panel-navigation-item-line-height,
$row-over-background-color: mix(white, $panel-navigation-background-color, 5%),
$row-selected-background-color: mix(white, $panel-navigation-background-color, 10%),
// Off-white text
$item-icon-color: $panel-navigation-item-text-color,
$item-expander-color: #fff,
$item-text-color: #ADB3B8,
// Brighter when hovered
$item-icon-over-color: #fff,
$item-expander-over-color: #fff,
$item-text-over-color: mix(white, $panel-navigation-item-text-color, 50%),
$item-text-font-size: 14px,
// Various sizes for the pieces:
$item-icon-font-size: 18px,
$item-icon-width: 44px,
$item-expander-font-size: 16px,
$item-expander-width: 24px,
// Style the "row indicator" (the vertical stripe on the left edge):
$row-indicator-width: 5px,
$row-indicator-selected-color: $panel-header-background-color,
$row-indicator-selected-over-color: lighten($panel-header-background-color, 7%),
$row-indicator-over-color: transparent
);
我怎样才能完成它?