You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@weex.apache.org by so...@apache.org on 2017/04/13 02:32:09 UTC

[15/23] incubator-weex git commit: * [html5] fix merging mutiple css declaration for same classes.

* [html5] fix merging mutiple css declaration for same classes.


Project: http://git-wip-us.apache.org/repos/asf/incubator-weex/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-weex/commit/66e69b35
Tree: http://git-wip-us.apache.org/repos/asf/incubator-weex/tree/66e69b35
Diff: http://git-wip-us.apache.org/repos/asf/incubator-weex/diff/66e69b35

Branch: refs/heads/0.12-dev
Commit: 66e69b35c88407b2d9ef7d760ebc845dbf203dca
Parents: 9bf25f4
Author: MrRaindrop <te...@gmail.com>
Authored: Tue Apr 11 12:22:46 2017 +0800
Committer: MrRaindrop <te...@gmail.com>
Committed: Tue Apr 11 12:22:46 2017 +0800

----------------------------------------------------------------------
 html5/render/vue/core/style.js            |  9 +++++-
 html5/test/render/vue/data/css/head13.css | 25 ++++++++++++++++
 html5/test/render/vue/data/head-css.js    |  1 +
 html5/test/render/vue/data/head-map.js    | 40 ++++++++++++++++++++++----
 4 files changed, 68 insertions(+), 7 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/66e69b35/html5/render/vue/core/style.js
----------------------------------------------------------------------
diff --git a/html5/render/vue/core/style.js b/html5/render/vue/core/style.js
index d5b5d83..341a5f6 100644
--- a/html5/render/vue/core/style.js
+++ b/html5/render/vue/core/style.js
@@ -67,7 +67,7 @@ export function getHeadStyleMap () {
       }
       Array.from(rules).forEach(rule => {
         const selector = rule.selectorText || ''
-        pre[selector] = trimComment(rule.cssText).split(';')
+        const styleObj = trimComment(rule.cssText).split(';')
           .reduce((styleObj, statement) => {
             statement = statement.trim()
             if (statement && statement.indexOf('/*') <= -1) {
@@ -76,6 +76,13 @@ export function getHeadStyleMap () {
             }
             return styleObj
           }, {})
+        const res = pre[selector]
+        if (!res) {
+          pre[selector] = styleObj
+        }
+        else {
+          extend(pre[selector], styleObj)
+        }
       })
       /**
        * remove this styleSheet node since it's in the styleMap already. And this style

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/66e69b35/html5/test/render/vue/data/css/head13.css
----------------------------------------------------------------------
diff --git a/html5/test/render/vue/data/css/head13.css b/html5/test/render/vue/data/css/head13.css
new file mode 100644
index 0000000..6cf748c
--- /dev/null
+++ b/html5/test/render/vue/data/css/head13.css
@@ -0,0 +1,25 @@
+.row[data-v-0dad7305] {
+  flex-direction: row;
+}
+.result[data-v-0dad7305] {
+  text-align: right;
+  background-color: #666;
+  font-size: 40px;
+  color: white;
+}
+.btn[data-v-0dad7305] {
+  flex: 1;
+  text-align: center;
+  background-color: #eee;
+  font-size: 36px;
+}
+.btn[data-v-0dad7305], .result[data-v-0dad7305] {
+  height: 100px;
+  padding: 30px;
+  margin: 5px;
+}
+.btn-operator[data-v-0dad7305] {
+  background-color: #669;
+  font-size: 40px;
+  color: white;
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/66e69b35/html5/test/render/vue/data/head-css.js
----------------------------------------------------------------------
diff --git a/html5/test/render/vue/data/head-css.js b/html5/test/render/vue/data/head-css.js
index ca4aca6..28231b0 100644
--- a/html5/test/render/vue/data/head-css.js
+++ b/html5/test/render/vue/data/head-css.js
@@ -10,3 +10,4 @@ import './css/head9.css'
 import './css/head10.css'
 import './css/head11.css'
 import './css/head12.css'
+import './css/head13.css'

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/66e69b35/html5/test/render/vue/data/head-map.js
----------------------------------------------------------------------
diff --git a/html5/test/render/vue/data/head-map.js b/html5/test/render/vue/data/head-map.js
index cde66c9..238d18d 100644
--- a/html5/test/render/vue/data/head-map.js
+++ b/html5/test/render/vue/data/head-map.js
@@ -1,5 +1,5 @@
 export default {
-  /*// 1 /////////////////////////////////////////////////*/
+  /*// head1.css /////////////////////////////////////////////////*/
   ".wrapper[data-v-67763bae]": {
     "width": "375px",
     "overflow": "hidden"
@@ -35,7 +35,7 @@ export default {
     "bottom": "0"
   },
 
-  /*// 2 /////////////////////////////////////////////////*/
+  /*// head2.css /////////////////////////////////////////////////*/
   ".wrapper[data-v-16194ed9]": {
     "color": "#353535"
   },
@@ -46,7 +46,7 @@ export default {
     "width": "375px"
   },
 
-  /*// 3 /////////////////////////////////////////////////*/
+  /*// head3.css /////////////////////////////////////////////////*/
   ".wrapper[data-v-6acf469e]": {
     "background-color": "transparent",
     "-webkit-box-pack": "center",
@@ -70,7 +70,7 @@ export default {
     "flex-direction": "row"
   },
 
-  /*// 4 /////////////////////////////////////////////////*/
+  /*// head4.css /////////////////////////////////////////////////*/
   ".item[data-v-553d6ea0]": {
     "width": "178px",
     "height": "118px",
@@ -126,7 +126,7 @@ export default {
     "top": "76px"
   },
 
-  /*// 5 /////////////////////////////////////////////////*/
+  /*// head5.css /////////////////////////////////////////////////*/
   ".wrapper[data-v-2c9fb3eb]": {
     "background-color": "transparent"
   },
@@ -243,5 +243,33 @@ export default {
     "color": "#E71A17",
     "font-size": "15px",
     "font-weight": "bold"
+  },
+
+  /*// head13.css /////////////////////////////////////////////////*/
+  ".row[data-v-0dad7305]": {
+    "flex-direction": "row"
+  },
+  ".result[data-v-0dad7305]": {
+    "text-align": "right",
+    "background-color": "#666",
+    "font-size": "40px",
+    "color": "white",
+    "height": "100px",
+    "padding": "30px",
+    "margin": "5px"
+  },
+  ".btn[data-v-0dad7305]": {
+    "flex": "1",
+    "text-align": "center",
+    "background-color": "#eee",
+    "font-size": "36px",
+    "height": "100px",
+    "padding": "30px",
+    "margin": "5px"
+  },
+  ".btn-operator[data-v-0dad7305]": {
+    "background-color": "#669",
+    "font-size": "40px",
+    "color": "white"
   }
-}
\ No newline at end of file
+}