diff --git a/src/shared/sass/_mixins.scss b/src/shared/sass/_mixins.scss index 371940f5..1c69c636 100644 --- a/src/shared/sass/_mixins.scss +++ b/src/shared/sass/_mixins.scss @@ -111,3 +111,11 @@ @mixin background-opacity($color, $opacity: 0.5) { background: rgba($color, $opacity); } + +// fake content +@mixin fake-content() { + .fake-content { + display: block; + background: $color-A10; + } +} diff --git a/src/strand-dropdown/index.html b/src/strand-dropdown/index.html index d3e584a7..6f845946 100644 --- a/src/strand-dropdown/index.html +++ b/src/strand-dropdown/index.html @@ -332,6 +332,8 @@ dataTestShort = document.querySelector("#dataTestShort"); smallDataTest = document.querySelector("#smallDataTest"); dataTest.data = dataTestHidden.data = dataTestShort.data = smallDataTest.data = dataItems; + // dataTest.data = new Array(100); + // dataTest.data = dataItems; dataTest.value = dataTestHidden.value = 1; // init jQuery test: diff --git a/src/strand-dropdown/strand-dropdown.html b/src/strand-dropdown/strand-dropdown.html index 4b9b6530..04f79faa 100644 --- a/src/strand-dropdown/strand-dropdown.html +++ b/src/strand-dropdown/strand-dropdown.html @@ -56,15 +56,16 @@ index="{{index}}"> diff --git a/src/strand-grid-item/strand-grid-item.scss b/src/strand-grid-item/strand-grid-item.scss index c2e525c4..15e3c29e 100644 --- a/src/strand-grid-item/strand-grid-item.scss +++ b/src/strand-grid-item/strand-grid-item.scss @@ -50,10 +50,7 @@ polyfill-next-selector { content: ':host ._mm_item'; } margin: auto; } -.fake-content { - display: block; - background: $color-A10; -} +@include fake-content(); .right .fake-content { float: right; diff --git a/src/strand-list-item/strand-list-item.html b/src/strand-list-item/strand-list-item.html index a1031e3c..6e3af1f5 100644 --- a/src/strand-list-item/strand-list-item.html +++ b/src/strand-list-item/strand-list-item.html @@ -15,6 +15,9 @@ diff --git a/src/strand-list-item/strand-list-item.js b/src/strand-list-item/strand-list-item.js index bfd77bc6..c6bc7836 100644 --- a/src/strand-list-item/strand-list-item.js +++ b/src/strand-list-item/strand-list-item.js @@ -45,6 +45,16 @@ value: { type: String, value: false + }, + model: { + type: Object, + value: null + }, + randomWidth: { + type: String, + value: function(){ + return this._setRandomWidth(); + } } }, @@ -63,6 +73,12 @@ this.debounce("update-title",this.updateTitle,0); }, + _setRandomWidth: function() { + var n = 0.5; + var width = Math.random() * (1.0 - n) + n; + return String(Math.round(width*100) + "%"); + }, + updateTitle: function() { var m = StrandLib.Measure; var computed = m.textWidth(this, this.textContent); diff --git a/src/strand-list-item/strand-list-item.scss b/src/strand-list-item/strand-list-item.scss index 24d129fc..884df9b2 100644 --- a/src/strand-list-item/strand-list-item.scss +++ b/src/strand-list-item/strand-list-item.scss @@ -64,3 +64,5 @@ :host > ::content .highlight { background: $color-E13; } + +@include fake-content(); \ No newline at end of file