Skip to content
BranchesTags

Repository files navigation

The best place to start with Ionic is our documentation page.

Note: Ionic is Alpha software and currently best supports iOS 6+ and Android 4.1+ (though we are working on Android performance improvements). Ionic is changing quickly as we work towards the beta.

What is Ionic?

Ionic is the open source HTML5 Mobile Framework for building amazing, cross-platform hybrid native apps with HTML, JavaScript, and CSS.

We built Ionic because we wanted a framework that focused on building hybrid native apps, rather than mobile websites. We wanted this framework to be obsessive about great design and performance. A framework that left the past behind and focused on the future where mobile devices could make HTML5 feel native.

It's important to realize that Ionic is not a replacement for frameworks used for building mobile web apps. There are a lot of great solutions that work well for websites, like jQuery Mobile.

Ionic is also not a good solution if you need to support older generation devices. Our compatibilitystarts at iOS 6 and Android 4.1. We will never support versions earlier than those. This is a framework for the future. Learn more, Where does the Ionic Framework fit in?

Quick Start

To start using ionic, you have two options: copy over the built JS and CSS files, or use the ionic tool (ionic-cli) which can be installed through npm:

$ sudo npm install -g ionic

Then, you can start a new ionic project by running:

$ ionic start myproject

Manual Start

The source files are in the dist/ folder. You can just grab the dist/js/ionic.js, dist/js/ionic-angular.js, and dist/ionic.css files and you'll be good to go. For most cases, you'll need AngularJS as well, which we bundle a current 1.2.x version in dist/js/angular.

Running examples

You will first have to install dependencies by running:

npm install

Make sure that you have npm already installed.

Ionic comes with many interesting examples showing the power of the framework. To check them out, navigate into the source folder, and start a web server. The easiest way is to use Python:

python -m SimpleHTTPServer 8000
node_modules/grunt-cli/bin/grunt watch
http://localhost:8000/examples/starters/
http://localhost:8000/test/

Community

Authors

Max Lynch

Ben Sperry

Adam Bradley

LICENSE

Ionic is licensed under the MIT Open Source license. For more information, see the LICENSE file in this repository.

About

Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5

ionicframework.com/

Resources

Readme
License

Contributing

Contributing
Activity
Custom properties

Stars

0 stars

Watchers

4 watching

Forks

0 forks
Report repository

Releases

Packages

Contributors

, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all 
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
GitHub - layanglayangmobile/ionic: Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5 · GitHub
Skip to content
BranchesTags
Repository files navigation
The best place to start with Ionic is our documentation page.
Note: Ionic is Alpha software and currently best supports iOS 6+ and Android 4.1+ (though we are working on Android performance improvements). Ionic is changing quickly as we work towards the beta.
What is Ionic?
Ionic is the open source HTML5 Mobile Framework for building amazing, cross-platform hybrid native apps with HTML, JavaScript, and CSS.
We built Ionic because we wanted a framework that focused on building hybrid native apps, rather than mobile websites. We wanted this framework to be obsessive about great design and performance. A framework that left the past behind and focused on the future where mobile devices could make HTML5 feel native.
It's important to realize that Ionic is not a replacement for frameworks used for building mobile web apps. There are a lot
of great solutions that work well for websites, like jQuery Mobile.
Ionic is also not a good solution if you need to support older generation devices. Our compatibilitystarts at iOS 6 and Android 4.1. We will never support versions earlier than those. This is a framework for the future. Learn more, Where does the Ionic Framework fit in?
Quick Start
To start using ionic, you have two options: copy over the built JS and CSS files, or
use the ionic tool (ionic-cli) which can be installed through npm:
$ sudo npm install -g ionic
Then, you can start a new ionic project by running:
$ ionic start myproject
Manual Start
The source files are in the dist/ folder. You can just grab the dist/js/ionic.js, dist/js/ionic-angular.js, and dist/ionic.css files and
you'll be good to go. For most cases, you'll need AngularJS as well, which we bundle a current 1.2.x version in dist/js/angular.
Running examples
You will first have to install dependencies by running:
npm install

Make sure that you have npm already installed.
Ionic comes with many interesting examples showing the power of the framework. To
check them out, navigate into the source folder, and start a web server. The easiest
way is to use Python:
python -m SimpleHTTPServer 8000
node_modules/grunt-cli/bin/grunt watch
http://localhost:8000/examples/starters/
http://localhost:8000/test/

Community
Authors
Max Lynch
Ben Sperry
Adam Bradley
LICENSE
Ionic is licensed under the MIT Open Source license. For more information, see the LICENSE file in this repository.
About
Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5
ionicframework.com/
Resources
Readme
License
Contributing
Contributing
Activity
Custom properties
Stars
0 stars
Watchers
4 watching
Forks
0 forks
Report repository
Releases
Packages
Contributors

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Force GitHub README to respect dark mode
(function() {
var style = document.createElement('style');
style.textContent = '
.markdown-body {
color-scheme: dark light;
}
.markdown-body pre { background: #161b22 !important; }
.markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }
.markdown-body table th, .markdown-body table td { border-color: #30363d !important; }
.markdown-body img { background: #0d1117; }
.markdown-body blockquote { border-left-color: #8b949e; }
.markdown-body hr { border-color: #30363d; }
';
document.head.appendChild(style);
})();
}
} catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
GitHub - layanglayangmobile/ionic: Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5 · GitHub
Skip to content
BranchesTags
Repository files navigation
The best place to start with Ionic is our documentation page.
Note: Ionic is Alpha software and currently best supports iOS 6+ and Android 4.1+ (though we are working on Android performance improvements). Ionic is changing quickly as we work towards the beta.
What is Ionic?
Ionic is the open source HTML5 Mobile Framework for building amazing, cross-platform hybrid native apps with HTML, JavaScript, and CSS.
We built Ionic because we wanted a framework that focused on building hybrid native apps, rather than mobile websites. We wanted this framework to be obsessive about great design and performance. A framework that left the past behind and focused on the future where mobile devices could make HTML5 feel native.
It's important to realize that Ionic is not a replacement for frameworks used for building mobile web apps. There are a lot
of great solutions that work well for websites, like jQuery Mobile.
Ionic is also not a good solution if you need to support older generation devices. Our compatibilitystarts at iOS 6 and Android 4.1. We will never support versions earlier than those. This is a framework for the future. Learn more, Where does the Ionic Framework fit in?
Quick Start
To start using ionic, you have two options: copy over the built JS and CSS files, or
use the ionic tool (ionic-cli) which can be installed through npm:
$ sudo npm install -g ionic
Then, you can start a new ionic project by running:
$ ionic start myproject
Manual Start
The source files are in the dist/ folder. You can just grab the dist/js/ionic.js, dist/js/ionic-angular.js, and dist/ionic.css files and
you'll be good to go. For most cases, you'll need AngularJS as well, which we bundle a current 1.2.x version in dist/js/angular.
Running examples
You will first have to install dependencies by running:
npm install

Make sure that you have npm already installed.
Ionic comes with many interesting examples showing the power of the framework. To
check them out, navigate into the source folder, and start a web server. The easiest
way is to use Python:
python -m SimpleHTTPServer 8000
node_modules/grunt-cli/bin/grunt watch
http://localhost:8000/examples/starters/
http://localhost:8000/test/

Community
Authors
Max Lynch
Ben Sperry
Adam Bradley
LICENSE
Ionic is licensed under the MIT Open Source license. For more information, see the LICENSE file in this repository.
About
Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5
ionicframework.com/
Resources
Readme
License
Contributing
Contributing
Activity
Custom properties
Stars
0 stars
Watchers
4 watching
Forks
0 forks
Report repository
Releases
Packages
Contributors

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Highlight search terms from Google/DuckDuckGo/Bing referrer
(function() {
var ref = document.referrer;
var terms = [];
if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {
var url = new URL(ref);
var q = url.searchParams.get('q') || url.searchParams.get('p');
if (q) {
terms = q.split(/\s+/).filter(function(t) { return t.length > 2; });
}
}
if (terms.length === 0) return;
var style = document.createElement('style');
style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';
document.head.appendChild(style);
function highlight(node) {
if (node.nodeType === 3) { // text node
var text = node.textContent;
var found = false;
terms.forEach(function(term) {
var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi');
if (regex.test(text)) {
found = true;
var frag = document.createDocumentFragment();
var parts = text.split(regex);
parts.forEach(function(part, i) {
if (i % 2 === 0) {
frag.appendChild(document.createTextNode(part));
} else {
var span = document.createElement('span');
span.className = 'userscript-highlight';
span.textContent = part;
frag.appendChild(span);
}
});
node.parentNode.replaceChild(frag, node);
}
});
} else if (node.nodeType === 1 && node.childNodes) { // element
var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];
if (!skipTags.includes(node.tagName)) {
Array.from(node.childNodes).forEach(highlight);
}
}
}
highlight(document.body);
// Re-highlight on dynamic content
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(m) {
m.addedNodes.forEach(function(node) {
if (node.nodeType === 1 || node.nodeType === 3) highlight(node);
});
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
GitHub - layanglayangmobile/ionic: Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5 · GitHub
Skip to content
BranchesTags
Repository files navigation
The best place to start with Ionic is our documentation page.
Note: Ionic is Alpha software and currently best supports iOS 6+ and Android 4.1+ (though we are working on Android performance improvements). Ionic is changing quickly as we work towards the beta.
What is Ionic?
Ionic is the open source HTML5 Mobile Framework for building amazing, cross-platform hybrid native apps with HTML, JavaScript, and CSS.
We built Ionic because we wanted a framework that focused on building hybrid native apps, rather than mobile websites. We wanted this framework to be obsessive about great design and performance. A framework that left the past behind and focused on the future where mobile devices could make HTML5 feel native.
It's important to realize that Ionic is not a replacement for frameworks used for building mobile web apps. There are a lot
of great solutions that work well for websites, like jQuery Mobile.
Ionic is also not a good solution if you need to support older generation devices. Our compatibilitystarts at iOS 6 and Android 4.1. We will never support versions earlier than those. This is a framework for the future. Learn more, Where does the Ionic Framework fit in?
Quick Start
To start using ionic, you have two options: copy over the built JS and CSS files, or
use the ionic tool (ionic-cli) which can be installed through npm:
$ sudo npm install -g ionic
Then, you can start a new ionic project by running:
$ ionic start myproject
Manual Start
The source files are in the dist/ folder. You can just grab the dist/js/ionic.js, dist/js/ionic-angular.js, and dist/ionic.css files and
you'll be good to go. For most cases, you'll need AngularJS as well, which we bundle a current 1.2.x version in dist/js/angular.
Running examples
You will first have to install dependencies by running:
npm install

Make sure that you have npm already installed.
Ionic comes with many interesting examples showing the power of the framework. To
check them out, navigate into the source folder, and start a web server. The easiest
way is to use Python:
python -m SimpleHTTPServer 8000
node_modules/grunt-cli/bin/grunt watch
http://localhost:8000/examples/starters/
http://localhost:8000/test/

Community
Authors
Max Lynch
Ben Sperry
Adam Bradley
LICENSE
Ionic is licensed under the MIT Open Source license. For more information, see the LICENSE file in this repository.
About
Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5
ionicframework.com/
Resources
Readme
License
Contributing
Contributing
Activity
Custom properties
Stars
0 stars
Watchers
4 watching
Forks
0 forks
Report repository
Releases
Packages
Contributors

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Strip utm_, fbclid, gclid, etc. from all links on page
(function() {
var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',
'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',
'ref', 'ref_src', 'source', 'medium', 'campaign'];
function cleanUrl(url) {
try {
var u = new URL(url, window.location.origin);
var changed = false;
trackingParams.forEach(function(p) {
if (u.searchParams.has(p)) {
u.searchParams.delete(p);
changed = true;
}
});
return changed ? u.toString() : url;
} catch (e) {
return url;
}
}
function cleanLinks() {
document.querySelectorAll('a[href]').forEach(function(a) {
var clean = cleanUrl(a.href);
if (clean !== a.href) a.href = clean;
});
}
cleanLinks();
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(m) {
m.addedNodes.forEach(function(node) {
if (node.nodeType === 1) {
if (node.tagName === 'A') cleanLinks();
node.querySelectorAll('a[href]').forEach(function(a) {
var clean = cleanUrl(a.href);
if (clean !== a.href) a.href = clean;
});
}
});
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); }
})();
(function(){
try {
var __m = "youtube.com";
var __re = new RegExp('^' + "youtube\\.com" + '
GitHub - layanglayangmobile/ionic: Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5 · GitHub
Skip to content
BranchesTags
Repository files navigation
The best place to start with Ionic is our documentation page.
Note: Ionic is Alpha software and currently best supports iOS 6+ and Android 4.1+ (though we are working on Android performance improvements). Ionic is changing quickly as we work towards the beta.
What is Ionic?
Ionic is the open source HTML5 Mobile Framework for building amazing, cross-platform hybrid native apps with HTML, JavaScript, and CSS.
We built Ionic because we wanted a framework that focused on building hybrid native apps, rather than mobile websites. We wanted this framework to be obsessive about great design and performance. A framework that left the past behind and focused on the future where mobile devices could make HTML5 feel native.
It's important to realize that Ionic is not a replacement for frameworks used for building mobile web apps. There are a lot
of great solutions that work well for websites, like jQuery Mobile.
Ionic is also not a good solution if you need to support older generation devices. Our compatibilitystarts at iOS 6 and Android 4.1. We will never support versions earlier than those. This is a framework for the future. Learn more, Where does the Ionic Framework fit in?
Quick Start
To start using ionic, you have two options: copy over the built JS and CSS files, or
use the ionic tool (ionic-cli) which can be installed through npm:
$ sudo npm install -g ionic
Then, you can start a new ionic project by running:
$ ionic start myproject
Manual Start
The source files are in the dist/ folder. You can just grab the dist/js/ionic.js, dist/js/ionic-angular.js, and dist/ionic.css files and
you'll be good to go. For most cases, you'll need AngularJS as well, which we bundle a current 1.2.x version in dist/js/angular.
Running examples
You will first have to install dependencies by running:
npm install

Make sure that you have npm already installed.
Ionic comes with many interesting examples showing the power of the framework. To
check them out, navigate into the source folder, and start a web server. The easiest
way is to use Python:
python -m SimpleHTTPServer 8000
node_modules/grunt-cli/bin/grunt watch
http://localhost:8000/examples/starters/
http://localhost:8000/test/

Community
Authors
Max Lynch
Ben Sperry
Adam Bradley
LICENSE
Ionic is licensed under the MIT Open Source license. For more information, see the LICENSE file in this repository.
About
Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5
ionicframework.com/
Resources
Readme
License
Contributing
Contributing
Activity
Custom properties
Stars
0 stars
Watchers
4 watching
Forks
0 forks
Report repository
Releases
Packages
Contributors

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Auto-enable theater mode on YouTube
(function() {
function tryTheater() {
var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]');
if (btn && !btn.classList.contains('activated')) {
btn.click();
}
}
// Try immediately
tryTheater();
// Try after navigation (SPA)
var lastUrl = location.href;
setInterval(function() {
if (location.href !== lastUrl) {
lastUrl = location.href;
setTimeout(tryTheater, 500);
}
}, 1000);
// Also try on player load
var observer = new MutationObserver(tryTheater);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
GitHub - layanglayangmobile/ionic: Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5 · GitHub
Skip to content
BranchesTags
Repository files navigation
The best place to start with Ionic is our documentation page.
Note: Ionic is Alpha software and currently best supports iOS 6+ and Android 4.1+ (though we are working on Android performance improvements). Ionic is changing quickly as we work towards the beta.
What is Ionic?
Ionic is the open source HTML5 Mobile Framework for building amazing, cross-platform hybrid native apps with HTML, JavaScript, and CSS.
We built Ionic because we wanted a framework that focused on building hybrid native apps, rather than mobile websites. We wanted this framework to be obsessive about great design and performance. A framework that left the past behind and focused on the future where mobile devices could make HTML5 feel native.
It's important to realize that Ionic is not a replacement for frameworks used for building mobile web apps. There are a lot
of great solutions that work well for websites, like jQuery Mobile.
Ionic is also not a good solution if you need to support older generation devices. Our compatibilitystarts at iOS 6 and Android 4.1. We will never support versions earlier than those. This is a framework for the future. Learn more, Where does the Ionic Framework fit in?
Quick Start
To start using ionic, you have two options: copy over the built JS and CSS files, or
use the ionic tool (ionic-cli) which can be installed through npm:
$ sudo npm install -g ionic
Then, you can start a new ionic project by running:
$ ionic start myproject
Manual Start
The source files are in the dist/ folder. You can just grab the dist/js/ionic.js, dist/js/ionic-angular.js, and dist/ionic.css files and
you'll be good to go. For most cases, you'll need AngularJS as well, which we bundle a current 1.2.x version in dist/js/angular.
Running examples
You will first have to install dependencies by running:
npm install

Make sure that you have npm already installed.
Ionic comes with many interesting examples showing the power of the framework. To
check them out, navigate into the source folder, and start a web server. The easiest
way is to use Python:
python -m SimpleHTTPServer 8000
node_modules/grunt-cli/bin/grunt watch
http://localhost:8000/examples/starters/
http://localhost:8000/test/

Community
Authors
Max Lynch
Ben Sperry
Adam Bradley
LICENSE
Ionic is licensed under the MIT Open Source license. For more information, see the LICENSE file in this repository.
About
Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5
ionicframework.com/
Resources
Readme
License
Contributing
Contributing
Activity
Custom properties
Stars
0 stars
Watchers
4 watching
Forks
0 forks
Report repository
Releases
Packages
Contributors

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Remove or un-stick sticky/fixed headers that block content
(function() {
function unstick() {
document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) {
if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {
el.style.position = 'static';
el.style.top = 'auto';
el.style.zIndex = 'auto';
}
});
}
unstick();
var observer = new MutationObserver(unstick);
observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });
})();
}
} catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
GitHub - layanglayangmobile/ionic: Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5 · GitHub
Skip to content
BranchesTags
Repository files navigation
The best place to start with Ionic is our documentation page.
Note: Ionic is Alpha software and currently best supports iOS 6+ and Android 4.1+ (though we are working on Android performance improvements). Ionic is changing quickly as we work towards the beta.
What is Ionic?
Ionic is the open source HTML5 Mobile Framework for building amazing, cross-platform hybrid native apps with HTML, JavaScript, and CSS.
We built Ionic because we wanted a framework that focused on building hybrid native apps, rather than mobile websites. We wanted this framework to be obsessive about great design and performance. A framework that left the past behind and focused on the future where mobile devices could make HTML5 feel native.
It's important to realize that Ionic is not a replacement for frameworks used for building mobile web apps. There are a lot
of great solutions that work well for websites, like jQuery Mobile.
Ionic is also not a good solution if you need to support older generation devices. Our compatibilitystarts at iOS 6 and Android 4.1. We will never support versions earlier than those. This is a framework for the future. Learn more, Where does the Ionic Framework fit in?
Quick Start
To start using ionic, you have two options: copy over the built JS and CSS files, or
use the ionic tool (ionic-cli) which can be installed through npm:
$ sudo npm install -g ionic
Then, you can start a new ionic project by running:
$ ionic start myproject
Manual Start
The source files are in the dist/ folder. You can just grab the dist/js/ionic.js, dist/js/ionic-angular.js, and dist/ionic.css files and
you'll be good to go. For most cases, you'll need AngularJS as well, which we bundle a current 1.2.x version in dist/js/angular.
Running examples
You will first have to install dependencies by running:
npm install

Make sure that you have npm already installed.
Ionic comes with many interesting examples showing the power of the framework. To
check them out, navigate into the source folder, and start a web server. The easiest
way is to use Python:
python -m SimpleHTTPServer 8000
node_modules/grunt-cli/bin/grunt watch
http://localhost:8000/examples/starters/
http://localhost:8000/test/

Community
Authors
Max Lynch
Ben Sperry
Adam Bradley
LICENSE
Ionic is licensed under the MIT Open Source license. For more information, see the LICENSE file in this repository.
About
Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5
ionicframework.com/
Resources
Readme
License
Contributing
Contributing
Activity
Custom properties
Stars
0 stars
Watchers
4 watching
Forks
0 forks
Report repository
Releases
Packages
Contributors

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Universal Dark Mode - works on any site
(function() {
var enabled = true;
function applyDarkMode() {
if (!enabled) return;
// Create style element if it doesn't exist
var style = document.getElementById('universal-dark-mode-style');
if (!style) {
style = document.createElement('style');
style.id = 'universal-dark-mode-style';
document.head.appendChild(style);
}
// Dark mode CSS - inverts colors but preserves images/video
style.textContent = '
/* Invert everything except media */
html {
filter: invert(1) hue-rotate(180deg) !important;
background: #1a1a2e !important;
}
/* Restore images, videos, iframes, canvas */
img, video, iframe, canvas, svg, picture, [style*="background-image"] {
filter: invert(1) hue-rotate(180deg) !important;
}
/* Preserve specific elements that should not be inverted */
.no-dark-mode, .no-dark-mode *,
[data-theme="light"], [data-theme="light"],
.ace_editor, .ace_editor *,
.CodeMirror, .CodeMirror *,
.monaco-editor, .monaco-editor *,
.markdown-body pre, .markdown-body pre *,
.highlight, .highlight *,
pre code, pre code * {
filter: none !important;
}
/* Fix common UI elements */
.modal, .popup, .dropdown-menu, .tooltip, .popover {
filter: invert(1) hue-rotate(180deg) !important;
background: #2d2d44 !important;
border-color: #444 !important;
}
/* Scrollbars */
::-webkit-scrollbar { background: #1a1a2e !important; }
::-webkit-scrollbar-thumb { background: #444 !important; }
::-webkit-scrollbar-thumb:hover { background: #555 !important; }
/* Selection */
::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }
::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }
';
}
function removeDarkMode() {
var style = document.getElementById('universal-dark-mode-style');
if (style) style.remove();
}
// Toggle with Alt+Shift+D
document.addEventListener('keydown', function(e) {
if (e.altKey && e.shiftKey && e.key === 'D') {
e.preventDefault();
enabled = !enabled;
if (enabled) {
applyDarkMode();
console.log('[Universal Dark Mode] Enabled');
} else {
removeDarkMode();
console.log('[Universal Dark Mode] Disabled');
}
}
});
// Apply on load
applyDarkMode();
// Re-apply on dynamic content
var observer = new MutationObserver(function(mutations) {
if (enabled && !document.getElementById('universal-dark-mode-style')) {
applyDarkMode();
}
});
observer.observe(document.head, { childList: true });
console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');
})();
}
} catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); }
})();
})();
GitHub - layanglayangmobile/ionic: Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5 · GitHub
Skip to content
BranchesTags
Repository files navigation
The best place to start with Ionic is our documentation page.
Note: Ionic is Alpha software and currently best supports iOS 6+ and Android 4.1+ (though we are working on Android performance improvements). Ionic is changing quickly as we work towards the beta.
What is Ionic?
Ionic is the open source HTML5 Mobile Framework for building amazing, cross-platform hybrid native apps with HTML, JavaScript, and CSS.
We built Ionic because we wanted a framework that focused on building hybrid native apps, rather than mobile websites. We wanted this framework to be obsessive about great design and performance. A framework that left the past behind and focused on the future where mobile devices could make HTML5 feel native.
It's important to realize that Ionic is not a replacement for frameworks used for building mobile web apps. There are a lot
of great solutions that work well for websites, like jQuery Mobile.
Ionic is also not a good solution if you need to support older generation devices. Our compatibilitystarts at iOS 6 and Android 4.1. We will never support versions earlier than those. This is a framework for the future. Learn more, Where does the Ionic Framework fit in?
Quick Start
To start using ionic, you have two options: copy over the built JS and CSS files, or
use the ionic tool (ionic-cli) which can be installed through npm:
$ sudo npm install -g ionic
Then, you can start a new ionic project by running:
$ ionic start myproject
Manual Start
The source files are in the dist/ folder. You can just grab the dist/js/ionic.js, dist/js/ionic-angular.js, and dist/ionic.css files and
you'll be good to go. For most cases, you'll need AngularJS as well, which we bundle a current 1.2.x version in dist/js/angular.
Running examples
You will first have to install dependencies by running:
npm install

Make sure that you have npm already installed.
Ionic comes with many interesting examples showing the power of the framework. To
check them out, navigate into the source folder, and start a web server. The easiest
way is to use Python:
python -m SimpleHTTPServer 8000
node_modules/grunt-cli/bin/grunt watch
http://localhost:8000/examples/starters/
http://localhost:8000/test/

Community
Authors
Max Lynch
Ben Sperry
Adam Bradley
LICENSE
Ionic is licensed under the MIT Open Source license. For more information, see the LICENSE file in this repository.
About
Advanced HTML5 Mobile App Framework. A beautiful front-end framework for developing hybrid mobile apps in HTML5
ionicframework.com/
Resources
Readme
License
Contributing
Contributing
Activity
Custom properties
Stars
0 stars
Watchers
4 watching
Forks
0 forks
Report repository
Releases
Packages
Contributors