2016-07-12 8 views
0

新しいカスタムテーマを作成せずにExt JSのテーマのベースコードを変更することはできますか?テーマの基本色を変更する - Ext JS 6

ある場合は、これを行う方法を教えてください。

ありがとうございます。

答えて

3

アプリケーションがSencha Cmdによって構築されている場合は、ケーキとして簡単です。

appディレクトリから、Application.jsのjavascriptソースコードを使用して、..\sass\srcにナビゲートしてください。代わりに、元ブルーの、

$base-color: dynamic(#fc0) 

コールsencha app build production、あなたのアプリケーションは、今、私が見つけることができる最悪の黄色を使用していることがわかります:

は今含まれているファイルApplication.scssを作成します。

(私はトリトンをテーマにしたアプリケーションに対してテストしている彼らは、変更ベースカラーに影響されない背景画像に依存しているため、グレー、古典的なテーマとしたいくつかの問題があります。)

+0

これは本当に正しい方法ですが、これは技術的にカスタムテーマを作成しています... –

+0

色を変更するためにいくつかのテーマで微調整が必​​要ですが、これはうまくいきます。ありがとう! – Luli

0

アレキサンダーの答えが正しいですか1つは永続的な変更です。アドホックスタイルの変更が必要な場合は、Ext.util.CSSクラスとそのメソッドupdateRuleをご覧ください。これにより、CSSクラスのスタイルを個別に変更できます。ベース色は多くの異なる場所で使用され、より明るい/より暗いバリエーションでも使用されるため、これには少しの手間が必要です。

swapStyleSheetを使用すると、テーマ全体またはテーマオーバーライドのバリエーションを変更できます。

+0

これは、他の色やコンポーネントをカスタマイズする方法のようです。私は、 "build \ development \ [appname] \ classic \ resources \ [appname] -all.css"からCSSクラス名を取得しています。私はそれを正しくやっていますか? – Luli

+0

ブラウザのdev-toolsインスペクタを使用して、変更するCSSを探します。 'Ext.util.CSS.updateRule( '.x-window-header-default-top'、 'background-color'、 'yellow')' –

+0

本当に特別なケースです。通常、あなたは常にあなたのテーマをAlexander複数のカスタムテーマを記述または作成します。 –

関連する問題