n20-common-lib 3.2.8 → 3.2.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/utils/theme.js +11 -5
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "n20-common-lib",
3
- "version": "3.2.8",
3
+ "version": "3.2.9",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "serve": "vue-cli-service serve",
@@ -2,20 +2,26 @@ export function setTheme(val) {
2
2
  if (!val) return
3
3
 
4
4
  var links = document.querySelectorAll('link[rel="stylesheet"]')
5
- var link, newLink, nextEl, pEl
5
+ var link, newLink
6
6
  links.forEach(function (el) {
7
7
  if (el.href && el.href.indexOf('/theme/') !== -1) {
8
8
  link = el
9
9
  }
10
10
  })
11
11
  if (link) {
12
- pEl = link.parentNode
13
- nextEl = link.nextElementSibling
14
-
15
12
  newLink = document.createElement('link')
16
13
  newLink.href = link.href.replace(/\/[^/]+$/, '/' + val + '.css')
17
14
  newLink.rel = 'stylesheet'
18
- nextEl ? pEl.insertBefore(newLink, nextEl) : pEl.appendChild(newLink)
15
+
16
+ /*
17
+ * 将主题 <link> 追加到 <head> 末尾,确保它位于所有 <style> 标签之后。
18
+ *
19
+ * rootvar.scss 编译后会把 :root 变量(默认蓝色)打入 <style> 标签,
20
+ * 主题 CSS 也使用 :root 选择器(相同特异性)。
21
+ * CSS 层叠规则:同特异性时,DOM 中后出现的规则胜出。
22
+ * 因此将主题 <link> 放在最后,即可让它覆盖 <style> 标签中的默认值。
23
+ */
24
+ document.head.appendChild(newLink)
19
25
 
20
26
  newLink.addEventListener('load', function () {
21
27
  link.setAttribute('disabled', 'disabled')