https://github.com/ryan-gordon/ionic-dynamic-theming

An practical example of changing the color/theme of your Ionic app at runtime. Written in Typescript
https://github.com/ryan-gordon/ionic-dynamic-theming

ionic ionic3 sass typescript

Last synced: 25 days ago
JSON representation

An practical example of changing the color/theme of your Ionic app at runtime. Written in Typescript

• Host: GitHub
• URL: https://github.com/ryan-gordon/ionic-dynamic-theming
• Owner: Ryan-Gordon
• Created: 2017-12-13T19:17:10.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2017-12-13T19:18:28.000Z (almost 7 years ago)
• Last Synced: 2024-06-13T18:51:24.778Z (5 months ago)
• Topics: ionic, ionic3, sass, typescript
• Language: CSS
• Size: 1.52 MB
• Stars: 1
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Ionic Dynamic Theming 

This repo hold an example of dynamic theming in an ionic app. The technique involves switching between sass files at runtime to change the appearance of the UI.

## Preview

Light Mode: 

![](screenshots/light-theme.png)

Dark Mode: 

![](screenshots/dark-theme.png)

## Installation

* [Download the installer](https://nodejs.org/) for Node.js 6 or greater.

* Install the ionic CLI globally: `npm install -g ionic`

* Clone this repository: `git clone https://github.com/ionic-team/ionic-dynamic-theming.git`.

* Run `npm install` from the project root.

* Run `ionic serve` in a terminal from the project root.

* Profit. :tada:

_Note: You may need to add “sudo” in front of any global commands to install the utilities._

## References

To learn more about Ionic, [visit this webpage](http://ionicframework.com).

To learn more about Typescript, [visit this webpage](https://www.typescriptlang.org)

This repo was inspired by this [article](https://devdactic.com/dynamic-theming-ionic/)