Skip to content
This repository was archived by the owner on Feb 24, 2021. It is now read-only.

Commit 97d9a33

Browse files
authored
feat: change meta theme-color based on theme #669 (#671)
1 parent 9000f2e commit 97d9a33

File tree

2 files changed

+48
-35
lines changed

2 files changed

+48
-35
lines changed

Diff for: src/App.vue

+11
Original file line numberDiff line numberDiff line change
@@ -113,6 +113,15 @@ export default {
113113
this.status = status
114114
this.statusColor = color
115115
},
116+
changeThemeColor: function () {
117+
var metaThemeColor = document.querySelector('meta[name=theme-color]')
118+
var metaThemeColor2 = document.querySelector(
119+
'meta[name=msapplication-TileColor]'
120+
)
121+
122+
metaThemeColor.setAttribute('content', this.dark ? '#000' : '#fff')
123+
metaThemeColor2.setAttribute('content', this.dark ? '#000' : '#fff')
124+
},
116125
importFile: function (ext, callback) {
117126
var self = this
118127
// Check for the various File API support.
@@ -214,6 +223,7 @@ export default {
214223
else localStorage.removeItem('dark')
215224
216225
this.$vuetify.theme.dark = v
226+
this.changeThemeColor()
217227
}
218228
},
219229
beforeMount () {
@@ -247,6 +257,7 @@ export default {
247257
}
248258
249259
this.dark = !!localStorage.getItem('dark')
260+
this.changeThemeColor()
250261
},
251262
beforeDestroy () {
252263
if (this.socket) this.socket.close()

Diff for: views/index.ejs

+37-35
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,41 @@
11
<!DOCTYPE html>
22
<html>
3-
<head>
4-
<meta charset="utf-8">
5-
<meta name="viewport" content="width=device-width,initial-scale=1.0">
6-
<title><%= config.title %></title>
7-
<base href="<%= config.base %>" />
8-
<meta name=mobile-web-app-capable content=yes>
9-
<meta name=theme-color content=#fff>
10-
<meta name=application-name content="Zwave To MQTT">
11-
<meta name=apple-mobile-web-app-capable content=yes>
12-
<meta name=apple-mobile-web-app-status-bar-style content=black-translucent>
13-
<meta name=apple-mobile-web-app-title content="Zwave To MQTT">
143

15-
<link rel="apple-touch-icon" sizes="180x180" href="<%= config.base %>static/favicons/apple-touch-icon.png">
16-
<link rel="icon" type="image/png" sizes="32x32" href="<%= config.base %>static/favicons/favicon-32x32.png">
17-
<link rel="icon" type="image/png" sizes="16x16" href="<%= config.base %>static/favicons/favicon-16x16.png">
18-
<link rel="manifest" href="<%= config.base %>static/favicons/site.webmanifest">
19-
<link rel="mask-icon" href="<%= config.base %>static/favicons/safari-pinned-tab.svg" color="#5bbad5">
20-
<meta name="msapplication-TileColor" content="#ffffff">
21-
<meta name="theme-color" content="#ffffff">
22-
<!-- For serving the index via express -->
23-
<% if (typeof cssFiles !== 'undefined') { %>
24-
<% for ( let css of cssFiles ){ %>
25-
<link rel="stylesheet" href="<%= config.base %><%= css %>">
26-
<% } %>
27-
<% } %>
28-
</head>
29-
<body>
30-
<div id="app"></div>
31-
<!-- For serving the index via express -->
32-
<% if (typeof jsFiles !== 'undefined') { %>
33-
<% for ( let src of jsFiles ){ %>
34-
<script src="<%= config.base %><%= src %>"></script>
35-
<% } %>
36-
<% } %>
37-
<!-- built files will be auto injected -->
38-
</body>
4+
<head>
5+
<meta charset="utf-8">
6+
<meta name="viewport" content="width=device-width,initial-scale=1.0">
7+
<title><%= config.title %></title>
8+
<base href="<%= config.base %>" />
9+
<meta name=mobile-web-app-capable content=yes>
10+
<meta name=application-name content="Zwave To MQTT">
11+
<meta name=apple-mobile-web-app-capable content=yes>
12+
<meta name=apple-mobile-web-app-status-bar-style content=black-translucent>
13+
<meta name=apple-mobile-web-app-title content="Zwave To MQTT">
14+
15+
<link rel="apple-touch-icon" sizes="180x180" href="<%= config.base %>static/favicons/apple-touch-icon.png">
16+
<link rel="icon" type="image/png" sizes="32x32" href="<%= config.base %>static/favicons/favicon-32x32.png">
17+
<link rel="icon" type="image/png" sizes="16x16" href="<%= config.base %>static/favicons/favicon-16x16.png">
18+
<link rel="manifest" href="<%= config.base %>static/favicons/site.webmanifest">
19+
<link rel="mask-icon" href="<%= config.base %>static/favicons/safari-pinned-tab.svg" color="#5bbad5">
20+
<meta name="msapplication-TileColor" content="#ffffff">
21+
<meta name="theme-color" content="#ffffff">
22+
<!-- For serving the index via express -->
23+
<% if (typeof cssFiles !== 'undefined') { %>
24+
<% for ( let css of cssFiles ){ %>
25+
<link rel="stylesheet" href="<%= config.base %><%= css %>">
26+
<% } %>
27+
<% } %>
28+
</head>
29+
30+
<body>
31+
<div id="app"></div>
32+
<!-- For serving the index via express -->
33+
<% if (typeof jsFiles !== 'undefined') { %>
34+
<% for ( let src of jsFiles ){ %>
35+
<script src="<%= config.base %><%= src %>"></script>
36+
<% } %>
37+
<% } %>
38+
<!-- built files will be auto injected -->
39+
</body>
40+
3941
</html>

0 commit comments

Comments
 (0)