Skip to content

Commit 50546f5

Browse files
brandyscarneybrandyscarney
authored
feat(theming): update dark mode guide with new dark theme files and playgrounds (#3384)
1 parent 388c0e1 commit 50546f5

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

62 files changed

+1666
-1053
lines changed

‎docs/theming/css-variables.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -31,12 +31,12 @@ When using the Ionic CLI to start an Angular project, the `src/theme/variables.s
3131
}
3232

3333
/* Set text color of the entire app for iOS only */
34-
.ios {
34+
:root.ios {
3535
--ion-text-color: #000;
3636
}
3737

3838
/* Set text color of the entire app for Material Design only */
39-
.md {
39+
:root.md {
4040
--ion-text-color: #222;
4141
}
4242
```

‎docs/theming/dark-mode.md

+508-119
Large diffs are not rendered by default.

‎static/code/stackblitz/v8/angular/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"dependencies": {
3-
"@ionic/angular": "7.6.2-dev.11704998705.1e1f9850",
4-
"@ionic/core": "7.6.2-dev.11704998705.1e1f9850",
3+
"@ionic/angular": "7.6.2-dev.11705355381.14b22962",
4+
"@ionic/core": "7.6.2-dev.11705355381.14b22962",
55
"@angular/platform-browser-dynamic": "17.0.4"
66
}
77
}

‎static/code/stackblitz/v8/angular/styles.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828
/**
2929
* Ionic Dark Theme
3030
* -----------------------------------------------------
31-
* For more info, please see:
31+
* For more information, please see:
3232
* https://ionicframework.com/docs/theming/dark-mode
3333
*/
3434

‎static/code/stackblitz/v8/html/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<html>
22

33
<head>
4-
<link rel="stylesheet" type="text/css" href="https://cdn.skypack.dev/@ionic/core@7.6.2-dev.11704998705.1e1f9850/css/core.css" />
5-
<link rel="stylesheet" type="text/css" href="https://cdn.skypack.dev/@ionic/core@7.6.2-dev.11704998705.1e1f9850/css/ionic.bundle.css" />
4+
<link rel="stylesheet" type="text/css" href="https://cdn.skypack.dev/@ionic/core@7.6.2-dev.11705355381.14b22962/css/core.css" />
5+
<link rel="stylesheet" type="text/css" href="https://cdn.skypack.dev/@ionic/core@7.6.2-dev.11705355381.14b22962/css/ionic.bundle.css" />
66
</head>
77

88
<body>

‎static/code/stackblitz/v8/html/index.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import '@ionic/core/css/display.css';
2121
/**
2222
* Ionic Dark Theme
2323
* -----------------------------------------------------
24-
* For more info, please see:
24+
* For more information, please see:
2525
* https://ionicframework.com/docs/theming/dark-mode
2626
*/
2727

‎static/code/stackblitz/v8/html/index.withContent.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<html>
22

33
<head>
4-
<link rel="stylesheet" type="text/css" href="https://cdn.skypack.dev/@ionic/core@7.6.2-dev.11704998705.1e1f9850/css/core.css" />
5-
<link rel="stylesheet" type="text/css" href="https://cdn.skypack.dev/@ionic/core@7.6.2-dev.11704998705.1e1f9850/css/ionic.bundle.css" />
4+
<link rel="stylesheet" type="text/css" href="https://cdn.skypack.dev/@ionic/core@7.6.2-dev.11705355381.14b22962/css/core.css" />
5+
<link rel="stylesheet" type="text/css" href="https://cdn.skypack.dev/@ionic/core@7.6.2-dev.11705355381.14b22962/css/ionic.bundle.css" />
66
</head>
77

88
<body>

‎static/code/stackblitz/v8/html/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
22
"dependencies": {
3-
"@ionic/core": "7.6.2-dev.11704998705.1e1f9850"
3+
"@ionic/core": "7.6.2-dev.11705355381.14b22962"
44
}
55
}

‎static/code/stackblitz/v8/react/app.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import '@ionic/react/css/display.css';
2020
/**
2121
* Ionic Dark Theme
2222
* -----------------------------------------------------
23-
* For more info, please see:
23+
* For more information, please see:
2424
* https://ionicframework.com/docs/theming/dark-mode
2525
*/
2626

‎static/code/stackblitz/v8/react/app.withContent.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import '@ionic/react/css/display.css';
2020
/**
2121
* Ionic Dark Theme
2222
* -----------------------------------------------------
23-
* For more info, please see:
23+
* For more information, please see:
2424
* https://ionicframework.com/docs/theming/dark-mode
2525
*/
2626

‎static/code/stackblitz/v8/react/package-lock.json

+18-18
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎static/code/stackblitz/v8/react/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6-
"@ionic/react": "7.6.2-dev.11704998705.1e1f9850",
7-
"@ionic/react-router": "7.6.2-dev.11704998705.1e1f9850",
6+
"@ionic/react": "7.6.2-dev.11705355381.14b22962",
7+
"@ionic/react-router": "7.6.2-dev.11705355381.14b22962",
88
"@types/node": "^20.0.0",
99
"@types/react": "^18.0.9",
1010
"@types/react-dom": "^18.0.4",

‎static/code/stackblitz/v8/vue/main.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ import '@ionic/vue/css/display.css';
2222
/**
2323
* Ionic Dark Theme
2424
* -----------------------------------------------------
25-
* For more info, please see:
25+
* For more information, please see:
2626
* https://ionicframework.com/docs/theming/dark-mode
2727
*/
2828

‎static/code/stackblitz/v8/vue/package-lock.json

+18-18
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎static/code/stackblitz/v8/vue/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@
88
"preview": "vite preview"
99
},
1010
"dependencies": {
11-
"@ionic/vue": "7.6.2-dev.11704998705.1e1f9850",
12-
"@ionic/vue-router": "7.6.2-dev.11704998705.1e1f9850",
11+
"@ionic/vue": "7.6.2-dev.11705355381.14b22962",
12+
"@ionic/vue-router": "7.6.2-dev.11705355381.14b22962",
1313
"vue": "^3.2.25",
1414
"vue-router": "4.2.5"
1515
},

0 commit comments

Comments
 (0)