refactor(themes): adjusted scss structure for additional themes

Related #4967
This commit is contained in:
Adam Bradley
2016-02-02 10:02:21 -06:00
parent 5aa112a626
commit c2cf3b0636
12 changed files with 244 additions and 29 deletions

View File

@@ -6,29 +6,10 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<!-- using relative paths in order for snapshot e2e tests to also work -->
<link ios-href="../../../bundles/ionic.ios.css" rel="stylesheet">
<link md-href="../../../bundles/ionic.md.css" rel="stylesheet">
<script src="../../../js/es6-shim.min.js"></script>
<script src="../../../js/es6-module-loader.src.js"></script>
<script src="../../../js/system.src.js"></script>
<script src="../../../js/angular2-polyfills.js"></script>
<script src="../../../js/angular2.dev.js"></script>
<script src="../../../js/router.dev.js"></script>
<script src="../../../js/http.dev.js"></script>
<script src="../../../js/web-animations.min.js"></script>
<script src="../../../bundles/ionic.system.js"></script>
<script src="../../../js/Rx.js"></script>
<link id="iosLink" ios-href="../../../bundles/ionic.ios.css" rel="stylesheet">
<link id="mdLink" md-href="../../../bundles/ionic.md.css" rel="stylesheet">
<script>
if (!console.time) {
console.time = console.log;
}
if (!console.timeEnd) {
console.timeEnd = console.log;
}
console.time('script init');
if (location.href.indexOf('snapshot=true') > -1) {
document.documentElement.classList.add('snapshot');
} else {
@@ -42,8 +23,27 @@
} else {
document.dir = 'ltr';
}
// dynamically change the <link>s href so the e2e tests can use dark themes via querystring
if (location.href.indexOf('theme=dark') > -1) {
var link = document.getElementById('iosLink');
link.setAttribute('ios-href', link.getAttribute('ios-href').replace('.css', '.dark.css'));
link = document.getElementById('mdLink');
link.setAttribute('md-href', link.getAttribute('md-href').replace('.css', '.dark.css'));
}
</script>
<script src="../../../js/es6-shim.min.js"></script>
<script src="../../../js/es6-module-loader.src.js"></script>
<script src="../../../js/system.src.js"></script>
<script src="../../../js/angular2-polyfills.js"></script>
<script src="../../../js/angular2.dev.js"></script>
<script src="../../../js/router.dev.js"></script>
<script src="../../../js/http.dev.js"></script>
<script src="../../../js/web-animations.min.js"></script>
<script src="../../../bundles/ionic.system.js"></script>
<script src="../../../js/Rx.js"></script>
<style>
.snapshot body {
/* crop an exact size */
@@ -103,7 +103,6 @@
}
System.import('index.js').then(function(m) {}, console.error.bind(console));
console.timeEnd('script init');
</script>
</body>

View File

@@ -0,0 +1,6 @@
// For E2E dark theme tests
@import "../../ionic/themes/dark.ios.scss";
@import "../../ionic/ionic.ios.scss";

View File

@@ -0,0 +1,6 @@
// For E2E dark theme tests
@import "../../ionic/themes/dark.md.scss";
@import "../../ionic/ionic.md.scss";