nativescript-theme-core - npm Package Compare versions

Comparing version 2.0.17 to 2.0.18

CHANGELOG.md

		@@ -0,1 +1,16 @@
		<a name="2.0.18 beta"></a>
		## [2.0.18 beta](https://github.com/NativeScript/theme/compare/v2.0.17...v2.0.18) (2019-09-12)

		### Features

		* Apply a default skin over the Core theme, similar to core in 1.x
		* Add styling for custom ActionBar (GridLayout, Label and Buttons in the TitleView), check the example

		### Fixes

		* Fix some issues in the app
		* Move all colorization in the skins
		* Fix some issues in Slider, SearchBar, SegmentedBar
		* Fix the aqua accent

		<a name="2.0.17 beta"></a>
		@@ -2,0 +17,0 @@ ## [2.0.17 beta](https://github.com/NativeScript/theme/compare/v2.0.16...v2.0.17) (2019-09-06)

package.json

		{
		"name": "nativescript-theme-core",
		"version": "2.0.17",
		"version": "2.0.18",
		"description": "Telerik NativeScript Core Theme",
		@@ -5,0 +5,0 @@ "main": "index",

README.md

		@@ -9,2 +9,3 @@ # NativeScript Theme: Core V2
		- [Usage](#usage)
		- [Usage before NativeScript 6.1](#usage-before-nativescript-61)
		- [Changing Core Theme](#changing-core-theme)
		@@ -26,38 +27,62 @@ - [More Root Classes](#more-root-classes)

		* The theme is now applied using Element selectors, if you need the old classes approach - it has moved to .compat CSS/SCSS files, e.g. `core.compat.css` and `blue.compat.css`.
		* Theme 2.0 beta requires some JavaScript to be loaded which helps with the styling.
		* The theme requires 2 files to be loaded - the core theme and a skin on top of it. Read [Usage](#usage) for more info.
		* The theme is now applied using Element selectors, if you need the old classes approach - it has moved to
		.compat CSS/SCSS files, e.g. `core.compat.css` and `blue.compat.css`.
		* Theme 2.0 beta requires some JavaScript to be loaded for {N} before 6.1 which helps with the styling.
		* Theme 2.0 replaces node-sass with sass which is more up to date feature-wise and doesn't have a native dependency.
		It does still work with node-sass though.

		## Usage

		The core theme supports light and dark core styling and skins on top of that. In order to use the 2.0 beta theme,
		you will also need to include a small JS file in your project:
		The core theme supports light and dark core styling and skins on top of that. To load the core theme styling, just
		load the core CSS (the default skin was added in 2.0.18):

		```javascript
		import "nativescript-theme-core";
		```css
		@import "~nativescript-theme-core/css/core.css";
		```

		This JS takes care of updating several classes on the app root elements, until their
		[inclusion in tns-core-modules](https://github.com/NativeScript/NativeScript/issues/7313).
		or alternatively SCSS:

		To load the theme styling, just load the core and skin CSS:
		```scss
		@import "~nativescript-theme-core/core";
		```

		If you want, you can choose from several different skins. To do that, you can include a second CSS/SCC file just after
		you load the core CSS/SCSS (if you use Theme 2.017 or earlier, you will have to include both files for the styling
		to work.

		```css
		@import "~nativescript-theme-core/css/core.css";
		@import "~nativescript-theme-core/css/blue.css";
		@import "~nativescript-theme-core/css/core.css";
		@import "~nativescript-theme-core/css/blue.css";
		```

		or alternatively SCSS:
		or

		```scss
		@import "~nativescript-theme-core/core";
		@import "~nativescript-theme-core/blue";
		@import "~nativescript-theme-core/core";
		@import "~nativescript-theme-core/blue";
		```

		Here is the old list of Theme skins - the first two are now the Core default Light and Dark skins, the rest are
		all the Light skins available, listed by name.

		![Multiple Platforms](http://docs.nativescript.org/img/theme/color-schemes-all.png)

		The theme will style your application using Element selectors - you don't need to add CSS classes on every element you
		need to style.

		Additionally, if you need to create you own skin, you can start from the core theme - it includes the sizing and
		initial styling of the components without colorizing them too much.
		Additionally, if you need to create you own skin, you can start just from the core theme - it includes the sizing and
		initial styling of the components.

		## Usage before NativeScript 6.1

		In order to use the 2.0 beta theme before {N} 6.1, you will also need to include a small JS file in your project:

		```javascript
		import "nativescript-theme-core";
		```

		This JS takes care of updating several classes on the app root elements, something that got
		[included in tns-core-modules](https://github.com/NativeScript/NativeScript/issues/7313) in {N} 6.1.

		## Setting Dark or Light mode
		@@ -179,4 +204,5 @@

		Since 2.0.17 beta, the Theme now exports all its internal variables to CSS ones. This is also done for Kendo based skins.
		You can use them to inherit your styles from the Theme. A list of the supported CSS variables follows:
		Since 2.0.17 beta, the Theme now exports all its internal variables to CSS ones in the .ns-root class.
		This is also done for Kendo based skins. You can use them to inherit your styles from the Theme.
		A list of the supported CSS variables follows:

		@@ -212,2 +238,10 @@ \| Simple Colors \| Constants \| Light Colors \| Dark Colors \|

		Use them like this:

		```css
		.my-accented-class {
		color: var(--light-accent);
		}
		```

		For now these CSS variables are not used internally, so changing them won't change the look of your skin. This is planned
		@@ -263,4 +297,4 @@ for after HSL color support comes in NativeScript 6.2.
		```scss
		@import "~nativescript-theme-core/core.compat";
		@import "~nativescript-theme-core/blue.compat";
		@import "~nativescript-theme-core/core.compat";
		@import "~nativescript-theme-core/blue.compat";
		```
		@@ -279,6 +313,9 @@
		* Firstly, we want to gather feedback from the community and create a theme that is useful and if possible - beautiful.
		* Secondly, the theme needs the classes inside the core modules to work properly without loading additional JavaScript.
		* And thirdly - {N} core modules should have a way to propagate OS theme changes inside the app, so that it can act accordingly.
		* Secondly, the theme needs the classes inside the core modules to work properly without loading additional JavaScript
		(this is now released with {N} 6.1).
		* And thirdly - {N} core modules should have a way to propagate OS theme changes inside the app, so that it can act accordingly
		(planned for {N} 6.2).

		Hopefully these can be achieved until {N} 6.1.
		The theme is relatively stable, try the latest version [![npm](https://img.shields.io/npm/v/nativescript-theme-core?label=%20&style=flat-square)](https://www.npmjs.com/package/nativescript-theme-core)
		and report if you notice problems.

		@@ -285,0 +322,0 @@ ## Screenshots

css/aqua.compat.css