1

I created custom theme by theming system guide, but don't know how to use new theme in my project. I am not using mvc, mvvm. In my project i connect extjs files in this way:

<link rel="stylesheet" type="text/css" href="http://localhost/ext-6.0.0/build/classic/theme-neptune/resources/theme-neptune-all.css">
<script type="text/javascript" src="http://localhost/ext-6.0.0/build/ext-all.js"></script>
<script type="text/javascript" src="http://localhost/ext-6.0.0/build/classic/theme-neptune/theme-neptune.js"></script>

How can i add my new theme to project?

After command 'sencha pakcage build' i get an error: sencha pakcage build error

Improve this question
3
  • 1
    You need to build the theme (sencha package build), then include the css and js files. Commented Nov 13, 2015 at 4:41
  • Can i use custom theme built in version 6.0.0 with extjs 4.1.1 application ? Commented Nov 24, 2015 at 6:53
  • 2
    No, you can't. Themes + framework versions have to go together. Commented Nov 24, 2015 at 8:53

3 Answers 3

Reset to default
2

You should build your project using sencha command: sencha generate app -ext -classic MyApp MyApp

Build the theming following the tutorial

change your app.json to point to your custom theme and then run a

sencha app build

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

Add toolkit property to the app.json file.

"toolkit": "classic", // or modern

Suggestion from this post.

Improve this answer

Comments

0

Here is how to create and use your own theme:

  1. Create new workspace using specific framework version without project files:

    sencha -sdk E:\Distr\ExtJS\ext-7.6.0 generate workspace myWorkspace

    this will create myTheme directory in current root;

  2. chdir ./myWorkspace/ext/

  3. Create new theme (files will appear in./ext/packages/) using theme-triton as primary template:

    sencha -sdk E:\Distr\ExtJS\ext-7.6.0 generate theme --extend theme-triton myTheme

  4. Edit some things due to sencha guide, for example create ./ext/packages/local/myTheme/sass/var/Component.scss and put $base-color : #1169de This will change main app color;

  5. Build all css: ./ext\packages\myTheme> sencha package build

  6. Copy ready theme files (also dirs and scss source files, they come together) from ./ext/packages/myTheme/build/ to your project;

  7. If you have created you project by your own, without senchacmd, put this css link to index.html: <link rel="stylesheet" type="text/css" href="yourPath/myTheme/resources/myTheme-all.css" />

Some additional information can be found on Sencha guide here.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.