diff --git a/paper-card.html b/paper-card.html index 423961f..b6aa3cf 100644 --- a/paper-card.html +++ b/paper-card.html @@ -156,7 +156,9 @@ alt="[[alt]]" placeholder="[[placeholderImage]]" preload="[[preloadImage]]" - fade="[[fadeImage]]"> + fade="[[fadeImage]]" + sizing="[[sizingImage]]" + position="[[positionImage]]">
[[heading]]
@@ -219,6 +221,25 @@ value: null }, + /** + * Sets a sizing option for the image. Valid values are `contain` (full + * aspect ratio of the image is contained within the element and + * letterboxed) or `cover` (image is cropped in order to fully cover the + * bounds of the element), or `null` (default: image takes natural size). + */ + sizingImage: { + type: String, + value: null + }, + /** + * When a sizing option is used (`cover` or `contain`), this determines + * how the image is aligned within the element bounds. + */ + positionImage: { + type: String, + value: null + }, + /** * The z-depth of the card, from 0-5. */ diff --git a/test/basic.html b/test/basic.html index fd84c35..203404e 100644 --- a/test/basic.html +++ b/test/basic.html @@ -154,6 +154,18 @@ assert.strictEqual(img.placeholder, f.placeholderImage); }); + test('sizing properly setup', function() { + assert.strictEqual(img.sizing, null); + f.sizingImage = 'some-sizing'; + assert.strictEqual(img.sizing, f.sizingImage); + }); + + test('position properly setup', function() { + assert.strictEqual(img.position, null); + f.positionImage = 'some-position'; + assert.strictEqual(img.position, f.positionImage); + }); + test('alt properly setup', function() { assert.strictEqual(img.alt, null); f.alt = 'some-text';