lxm_front/eruda
1
0
Fork 0
mirror of synced 2025-12-12 09:41:28 +08:00
Code Issues Projects Releases Wiki Activity

Fix: Css custom properties #33

Browse Source
This commit is contained in:
surunzi
2017-09-20 13:17:18 +08:00
parent ea47897c13
commit 91375c6aab
4 changed files with 60 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
package.json
View File

@@ -14,13 +14,20 @@
"utilDoc": "eustia doc src/lib/util.js -f md -o doc/UTIL_API.md -t \"Eruda Util Documentation\"" "utilDoc": "eustia doc src/lib/util.js -f md -o doc/UTIL_API.md -t \"Eruda Util Documentation\""
}, },
"eustia": { "eustia": {
"files": "src/**/*.es6", "eruda": {
"ignore": "**/Info/defInfo.es6", "files": "src/**/*.es6",
"output": "src/lib/util.js", "ignore": "**/Info/defInfo.es6",
"exclude": [ "output": "src/lib/util.js",
"createCfg" "exclude": [
], "createCfg"
"format": "commonjs" ],
"format": "commonjs"
},
"test": {
"files": ["test/**/*.js", "test/**/*.html"],
"output": "test/util.js",
"format": "global"
}
}, },
"repository": { "repository": {
"type": "git", "type": "git",

3
src/Elements/Elements.es6
View File

@@ -355,6 +355,9 @@ let regColor = /rgba?\((.*?)\)/g,
function processStyleRule(val) function processStyleRule(val)
{ {
// For css custom properties, val is unable to retrieved.
val = util.toStr(val);
return val.replace(regColor, '<span class="eruda-style-color" style="background-color: $&"></span>$&') return val.replace(regColor, '<span class="eruda-style-color" style="background-color: $&"></span>$&')
.replace(regCssUrl, (match, url) => `url("${wrapLink(url)}")`); .replace(regCssUrl, (match, url) => `url("${wrapLink(url)}")`);
} }

8
test/manual.html
View File

@@ -7,6 +7,7 @@
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<script src="assets/eruda.js"></script> <script src="assets/eruda.js"></script>
<script src="boot.js"></script> <script src="boot.js"></script>
<script src="util.js"></script>
</head> </head>
<body> <body>
<header>Manual Test</header> <header>Manual Test</header>
@@ -24,6 +25,9 @@
<li> <li>
<a href="#" id="issue31">#31</a> <a href="#" id="issue31">#31</a>
</li> </li>
<li>
<a href="#" id="issue33">#33</a>
</li>
</ul> </ul>
</nav> </nav>
<script> <script>
@@ -76,6 +80,10 @@
{ {
addEventListener('resize', function () {}); addEventListener('resize', function () {});
}); });
addClickEvent('issue33', function ()
{
_.evalCss(':root {--test: 10px;}');
});
</script> </script>
<script>boot();</script> <script>boot();</script>
</body> </body>

35
test/util.js Normal file
View File

@@ -0,0 +1,35 @@
// Built by eustia.
window._ = (function()
{
var _ = {};
if (typeof window === 'object' && window._) _ = window._;
/* ------------------------------ evalCss ------------------------------ */
_.evalCss = (function ()
{
var mark = [];
function exports(css)
{
for (var i = 0, len = mark.length; i < len; i++)
{
if (mark[i] === css) return;
}
mark.push(css);
var container = exports.container || document.head,
style = document.createElement('style');
style.type = 'text/css';
style.textContent = css;
container.appendChild(style);
}
return exports;
})();
return _;
})();