Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(110)

Unified Diff: third_party/polymer/v1_0/components-chromium/iron-list/iron-list.html

Issue 1901343004: [Polymer] update third_party polymer (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: new pull Created 4 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/polymer/v1_0/components-chromium/iron-list/iron-list.html
diff --git a/third_party/polymer/v1_0/components-chromium/iron-list/iron-list.html b/third_party/polymer/v1_0/components-chromium/iron-list/iron-list.html
index 681523e7e913ae146358d02d3b61f27b07f43444..92bdbd36ec4f1bda885353e27dde019c74c51dce 100644
--- a/third_party/polymer/v1_0/components-chromium/iron-list/iron-list.html
+++ b/third_party/polymer/v1_0/components-chromium/iron-list/iron-list.html
@@ -75,6 +75,13 @@ bound from the model object provided to the template scope):
</template>
```
+### Grid layout
+
+`iron-list` supports a grid layout in addition to linear layout by setting
+the `grid` attribute. In this case, the list template item must have both fixed
+width and height (e.g. via CSS). Based on this, the number of items
+per row are determined automatically based on the size of the list viewport.
+
### Accessibility
`iron-list` automatically manages the focus state for the items. It also provides
@@ -136,6 +143,7 @@ will only render 20.
@demo demo/selection.html Items selection
@demo demo/collapse.html Collapsable items
@demo demo/scroll-threshold.html Scroll thesholds
+@demo demo/grid.html Grid layout
@demo demo/basic.html Basic list
-->
@@ -159,9 +167,13 @@ will only render 20.
position: relative;
}
- #items > ::content > * {
+ :host(:not([grid])) #items > ::content > * {
width: 100%;
+ };
+
+ #items > ::content > * {
box-sizing: border-box;
+ margin: 0;
position: absolute;
top: 0;
will-change: transform;

Powered by Google App Engine
This is Rietveld 408576698