diff --git a/src/add-ns/_ns-files/__sourceDir__/app.css b/src/add-ns/_ns-files/__sourceDir__/app.css index d23504c..d7432a1 100644 --- a/src/add-ns/_ns-files/__sourceDir__/app.css +++ b/src/add-ns/_ns-files/__sourceDir__/app.css @@ -1,12 +1,5 @@ -/* -In NativeScript, the app.css file is where you place CSS rules that -you would like to apply to your entire application. Check out -http://docs.nativescript.org/ui/styling for a full list of the CSS -selectors and properties you can use to style UI components. +@import "~@nativescript/theme/css/core.css"; +@import "~@nativescript/theme/css/blue.css"; -/* -In many cases you may want to use the NativeScript core theme instead -of writing your own CSS rules. For a full list of class names in the theme -refer to http://docs.nativescript.org/ui/theme. -*/ -@import '~nativescript-theme-core/css/core.light.css'; +/* Place any CSS rules you want to apply on both iOS and Android here. +This is where the vast majority of your CSS code goes. */ \ No newline at end of file diff --git a/src/add-ns/index.ts b/src/add-ns/index.ts index 7c0f35a..fe0221a 100644 --- a/src/add-ns/index.ts +++ b/src/add-ns/index.ts @@ -363,7 +363,7 @@ const addDependencies = () => (tree: Tree, context: SchematicContext) => { // @UPGRADE: Update all versions whenever {N} version updates const depsToAdd = { 'nativescript-angular': '~8.20.0', - 'nativescript-theme-core': '~1.0.4', + '@nativescript/theme': '~2.2.0', 'reflect-metadata': '~0.1.12', 'tns-core-modules': '~6.2.0', 'tslib': '1.10.0', diff --git a/src/add-ns/index_spec.ts b/src/add-ns/index_spec.ts index 13af8a3..72fec33 100644 --- a/src/add-ns/index_spec.ts +++ b/src/add-ns/index_spec.ts @@ -78,7 +78,7 @@ describe('Add {N} schematic', () => { const { dependencies, devDependencies } = packageJson; expect(dependencies).toBeDefined(); expect(dependencies['nativescript-angular']).toBeDefined(); - expect(dependencies['nativescript-theme-core']).toBeDefined(); + expect(dependencies['@nativescript/theme']).toBeDefined(); expect(dependencies['tns-core-modules']).toBeDefined(); expect(dependencies['reflect-metadata']).toBeDefined(); diff --git a/src/ng-new/application/_files/__sourcedir__/home/home.component.html b/src/ng-new/application/_files/__sourcedir__/home/home.component.html index 35a8082..737bfbe 100644 --- a/src/ng-new/application/_files/__sourcedir__/home/home.component.html +++ b/src/ng-new/application/_files/__sourcedir__/home/home.component.html @@ -1,6 +1,6 @@ class="p-20"<% } %>> - + diff --git a/src/ng-new/application/_files/package.json b/src/ng-new/application/_files/package.json index c6ef8e6..7ebb46a 100644 --- a/src/ng-new/application/_files/package.json +++ b/src/ng-new/application/_files/package.json @@ -16,7 +16,7 @@ "@angular/platform-browser-dynamic": "~8.2.0", "@angular/router": "~8.2.0", "nativescript-angular": "~8.20.0",<% if(theme) { %> - "nativescript-theme-core": "~1.0.4", + "@nativescript/theme": "~2.2.0", <% } %>"reflect-metadata": "~0.1.12", "rxjs": "~6.4.0", "tns-core-modules": "~6.2.0", diff --git a/src/ng-new/shared/_files/package.json b/src/ng-new/shared/_files/package.json index 44baefc..1a350c1 100644 --- a/src/ng-new/shared/_files/package.json +++ b/src/ng-new/shared/_files/package.json @@ -29,7 +29,7 @@ "@angular/router": "~8.2.0", "core-js": "^2.6.9", "nativescript-angular": "~8.20.0",<% if(theme) { %> - "nativescript-theme-core": "~1.0.4", + "@nativescript/theme": "~2.2.0", <% } %>"reflect-metadata": "~0.1.12", "rxjs": "~6.4.0", "tns-core-modules": "~6.2.0", diff --git a/src/styling/_css-files/app.css b/src/styling/_css-files/app.css index 666bb56..9ca7db6 100644 --- a/src/styling/_css-files/app.css +++ b/src/styling/_css-files/app.css @@ -1,3 +1,4 @@ <% if (theme) { %> -@import '~nativescript-theme-core/css/core.light.css'; +@import '~@nativescript/theme/css/core.css'; +@import '~@nativescript/theme/css/blue.css'; <% } %> \ No newline at end of file diff --git a/src/styling/_scss-files/_app-variables.scss b/src/styling/_scss-files/_app-variables.scss deleted file mode 100644 index 1082ea7..0000000 --- a/src/styling/_scss-files/_app-variables.scss +++ /dev/null @@ -1,8 +0,0 @@ -<% if (theme) { %> -// Import the theme’s variables. If you’re using a color scheme -// other than “light”, switch the path to the alternative scheme, -// for example '~nativescript-theme-core/scss/dark'. -@import '~nativescript-theme-core/scss/light'; -<% } %> -// Place any custom variables here. For example: -// $page-content-placeholder-font-size: 20; diff --git a/src/styling/_scss-files/app.android.scss b/src/styling/_scss-files/app.android.scss index f46ca72..5216271 100644 --- a/src/styling/_scss-files/app.android.scss +++ b/src/styling/_scss-files/app.android.scss @@ -1,10 +1,3 @@ -// Import app variables -@import 'app-variables'; -<% if (theme) { %> -// Import the theme’s main ruleset - both index and platform specific. -@import '~nativescript-theme-core/scss/index'; -@import '~nativescript-theme-core/scss/platforms/index.android'; -<% } %> // Import common styles @import 'app-common'; diff --git a/src/styling/_scss-files/app.ios.scss b/src/styling/_scss-files/app.ios.scss index 5b85fbc..93aa9c2 100644 --- a/src/styling/_scss-files/app.ios.scss +++ b/src/styling/_scss-files/app.ios.scss @@ -1,10 +1,3 @@ -// Import app variables -@import 'app-variables'; -<% if (theme) { %> -// Import the theme’s main ruleset - both index and platform specific. -@import '~nativescript-theme-core/scss/index'; -@import '~nativescript-theme-core/scss/platforms/index.ios'; -<% } %> // Import common styles @import 'app-common'; diff --git a/src/styling/index_spec.ts b/src/styling/index_spec.ts index 36fd532..446dc26 100644 --- a/src/styling/index_spec.ts +++ b/src/styling/index_spec.ts @@ -65,7 +65,7 @@ describe('Styling Schematic', () => { expect(getFileContent(tree, stylingFile)) .not - .toMatch(new RegExp('@import "~nativescript-theme-core/css/core.light.css";')); + .toMatch(new RegExp('@import "~@nativescript/theme/css/core.css";')); }); }); @@ -85,7 +85,7 @@ describe('Styling Schematic', () => { expect(tree.exists(`${appPath}/${sourceDir}/app.android.scss`)); expect(tree.exists(`${appPath}/${sourceDir}/app.ios.scss`)); expect(tree.exists(`${appPath}/${sourceDir}/_app-common.scss`)); - expect(tree.exists(`${appPath}/${sourceDir}/_app-variables.scss`)); + expect(tree.exists(`${appPath}/${sourceDir}/_app-variables.scss`)).toBe(false); }); it('should add scss dependencies to package.json', () => { @@ -109,21 +109,11 @@ describe('Styling Schematic', () => { expect(getFileContent(tree, `${appPath}/${sourceDir}/app.android.scss`)) .not - .toMatch(new RegExp('@import \'~nativescript-theme-core/scss/index\';')); - expect(getFileContent(tree, `${appPath}/${sourceDir}/app.android.scss`)) - .not - .toMatch(new RegExp('@import \'~nativescript-theme-core/scss/platforms/index.android\';')); + .toMatch(new RegExp('@import "~@nativescript/theme/css/core.css;')); expect(getFileContent(tree, `${appPath}/${sourceDir}/app.ios.scss`)) .not - .toMatch(new RegExp('@import \'~nativescript-theme-core/scss/index\';')); - expect(getFileContent(tree, `${appPath}/${sourceDir}/app.ios.scss`)) - .not - .toMatch(new RegExp('@import \'~nativescript-theme-core/scss/platforms/index.ios\';')); - - expect(getFileContent(tree, `${appPath}/${sourceDir}/_app-variables.scss`)) - .not - .toMatch(new RegExp('@import \'~nativescript-theme-core/scss/light\';')); + .toMatch(new RegExp('@import "~@nativescript/theme/css/core.css";')); }); }); });