From 5f19e3fb0e98f29c824cc0ef746a4717894ff536 Mon Sep 17 00:00:00 2001
From: guy <guy@finereport.com>
Date: Wed, 19 Oct 2022 19:13:13 +0800
Subject: [PATCH 1/3] update

---
 examples/useContext.html | 28 ++++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)
diff --git a/examples/useContext.html b/examples/useContext.html
index 56c78b2ce..2e736c377 100644
--- a/examples/useContext.html
+++ b/examples/useContext.html
@@ -5,8 +5,14 @@
     <!-- <link rel="stylesheet" type="text/css" href="../dist/2.0/fineui.min.css"/>
     <script src="../dist/2.0/fineui.js"></script> -->
     <link rel="stylesheet" type="text/css" href="http://fanruan.design/fineui/2.0/fineui.min.css"/>
-    <script src="http://fanruan.design/fineui/2.0/fineui.min.js"></script>
+    <!-- <script src="http://fanruan.design/fineui/2.0/fineui.min.js"></script> -->
+    <script src="http://localhost:9001/fineui.js"></script>
 </head>
+<style>
+.my-parent {
+    --css-scale: 1;
+}
+</style>
 <body>
 <div id="wrapper"></div>
 <script>
@@ -14,7 +20,8 @@
     var Model = BI.inherit(BI.Model, {
         state: function () {
             return {
-                expand: false
+                expand: false,
+                cssScale: 2.0
             };
         },
         childContext: ["text"],
@@ -33,6 +40,18 @@
     });
     BI.model("demo.model", Model);
 
+    var oldFormat = BI.pixFormat;
+    BI.pixFormat = function (pix, border) {
+        var context = BI.useContext("cssScale");
+        if (!context) {
+            return oldFormat.apply(this, arguments);
+        }
+        if (!BI.isNumber(pix)) {
+            return pix;
+        }
+        return `calc(var(--css-scale) * ${pix}px - ${border || 0}})`;
+    }
+
     var Child = BI.inherit(BI.Widget, {
         render: function () {
             var label;
@@ -45,6 +64,7 @@
             // });
             return {
                 type: "bi.label",
+                height: 30,
                 ref: function (_ref) {
                     label = _ref;
                 },
@@ -60,6 +80,9 @@
     BI.shortcut("demo.child", Child);
 
     var Widget = BI.inherit(BI.Widget, {
+        props: {
+            baseCls: "my-parent"
+        },
         _store: function () {
             return BI.Models.getModel("demo.model");
         },
@@ -67,6 +90,7 @@
             var child;
             var store = BI.useStore();
             return function () {
+                this.element[0].style.setProperty('--css-scale', store.model.cssScale);
                 return {
                     type: "bi.vertical",
                     vgap: 20,

From ea20dd6f37837d69aaaf239c8740bfef38978b4f Mon Sep 17 00:00:00 2001
From: guy <guy@finereport.com>
Date: Wed, 19 Oct 2022 19:24:40 +0800
Subject: [PATCH 2/3] =?UTF-8?q?KERNEL-13158:=20=E5=86=99=E4=B8=AA=E7=AE=80?=
 =?UTF-8?q?=E5=8D=95demo?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 examples/useContext.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/examples/useContext.html b/examples/useContext.html
index 2e736c377..e7213e10d 100644
--- a/examples/useContext.html
+++ b/examples/useContext.html
@@ -49,8 +49,8 @@
         if (!BI.isNumber(pix)) {
             return pix;
         }
-        return `calc(var(--css-scale) * ${pix}px - ${border || 0}})`;
-    }
+        return "calc(var(--css-scale) * " + pix + "px)";
+    };
 
     var Child = BI.inherit(BI.Widget, {
         render: function () {

From 9b579fe9cf2952932551b125268f7d1dc58d7117 Mon Sep 17 00:00:00 2001
From: guy <guy@finereport.com>
Date: Wed, 19 Oct 2022 19:25:15 +0800
Subject: [PATCH 3/3] update

---
 examples/useContext.html | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/examples/useContext.html b/examples/useContext.html
index e7213e10d..a82442a72 100644
--- a/examples/useContext.html
+++ b/examples/useContext.html
@@ -5,8 +5,7 @@
     <!-- <link rel="stylesheet" type="text/css" href="../dist/2.0/fineui.min.css"/>
     <script src="../dist/2.0/fineui.js"></script> -->
     <link rel="stylesheet" type="text/css" href="http://fanruan.design/fineui/2.0/fineui.min.css"/>
-    <!-- <script src="http://fanruan.design/fineui/2.0/fineui.min.js"></script> -->
-    <script src="http://localhost:9001/fineui.js"></script>
+    <script src="http://fanruan.design/fineui/2.0/fineui.min.js"></script>
 </head>
 <style>
 .my-parent {
