extjs 6.0.2 でミックスインのオーバーライドを適切に実行する方法を理解しようとしています。
これは 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 ファイルでそれを上書きしようとしましたが、成功しませんでした...
これは、例に付属する ui です。
@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
);どうすればそれを成し遂げることができますか？