@internetarchive/collection-browser - npm Package Compare versions

Comparing version 0.0.1-alpha.11 to 0.0.1-alpha.12

dist/src/tiles/grid/item-tile.js

@@ -29,11 +29,15 @@ import { __decorate } from "tslib";
         var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-        const imgSrcUrl = `${this.baseNavigationUrl}/services/img/${(_a = this.model) === null || _a === void 0 ? void 0 : _a.collections[0]}`;
-        const itemTitle = ((_b = this.model) === null || _b === void 0 ? void 0 : _b.title) || '';
-        const itemCreator = ((_c = this.model) === null || _c === void 0 ? void 0 : _c.creator) || '-';
+        const collectionName = (_a = this.model) === null || _a === void 0 ? void 0 : _a.collections[0];
+        const collectionUrl = `${this.baseNavigationUrl}/details/${collectionName}`;
+        const imgSrcUrl = `${this.baseNavigationUrl}/services/img/${(_b = this.model) === null || _b === void 0 ? void 0 : _b.collections[0]}`;
+        const itemTitle = ((_c = this.model) === null || _c === void 0 ? void 0 : _c.title) || '';
+        const itemCreator = ((_d = this.model) === null || _d === void 0 ? void 0 : _d.creator) || '-';
         return html `
       <div id="container">
-        <div id="stealth-popup">
-          <div id="collection-thumbnail" style="background-image:url(${imgSrcUrl})"></div>
-          <div id="collection-title-text">${(_d = this.model) === null || _d === void 0 ? void 0 : _d.collections[0]}</div>
-        </div>
+        <a href=${collectionUrl}>
+          <div id="stealth-popup">
+            <div id="collection-thumbnail" style="background-image:url(${imgSrcUrl})"></div>
+            <div id="collection-title-text">${collectionName}</div>
+          </div>
+        </a>
         <div id="title-image-container">
@@ -123,3 +127,6 @@ <h1 id="item-title" title=${itemTitle}>
         background-size: contain;
+        position: relative;
         filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.8));
+        overflow: visible;
+        -webkit-appearance: none;
       }
@@ -131,4 +138,4 @@
         overflow: hidden;
-        filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.8));
         position: relative;
+        box-shadow: 1px 1px 2px 0px;
         display: flex;
@@ -144,4 +151,6 @@ }
         filter: blur(15px);
-        position: absolute;
+        position: relative;
         z-index: 1;
+        overflow: visible;
+        -webkit-appearance: none;
       }
@@ -287,2 +296,8 @@
       }
+
+      a {
+        color: #333;
+        text-decoration: none;
+        display: block;
+      }
     `;
@@ -289,0 +304,0 @@ }

package.json

@@ -6,3 +6,3 @@ {
   "author": "Internet Archive",
-  "version": "0.0.1-alpha.11",
+  "version": "0.0.1-alpha.12",
   "main": "dist/index.js",
@@ -9,0 +9,0 @@ "module": "dist/index.js",

src/tiles/grid/item-tile.ts

@@ -36,2 +36,5 @@ import { css, CSSResultGroup, html, LitElement } from 'lit';
   render() {
+    const collectionName = this.model?.collections[0];
+    const collectionUrl = `${this.baseNavigationUrl}/details/${collectionName}`;
+
     const imgSrcUrl = `${this.baseNavigationUrl}/services/img/${this.model?.collections[0]}`;
@@ -43,6 +46,8 @@ const itemTitle = this.model?.title || '';
       <div id="container">
-        <div id="stealth-popup">
-          <div id="collection-thumbnail" style="background-image:url(${imgSrcUrl})"></div>
-          <div id="collection-title-text">${this.model?.collections[0]}</div>
-        </div>
+        <a href=${collectionUrl}>
+          <div id="stealth-popup">
+            <div id="collection-thumbnail" style="background-image:url(${imgSrcUrl})"></div>
+            <div id="collection-title-text">${collectionName}</div>
+          </div>
+        </a>
         <div id="title-image-container">
@@ -148,3 +153,6 @@ <h1 id="item-title" title=${itemTitle}>
         background-size: contain;
+        position: relative;
         filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.8));
+        overflow: visible;
+        -webkit-appearance: none;
       }
@@ -156,4 +164,4 @@
         overflow: hidden;
-        filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.8));
         position: relative;
+        box-shadow: 1px 1px 2px 0px;
         display: flex;
@@ -169,4 +177,6 @@ }
         filter: blur(15px);
-        position: absolute;
+        position: relative;
         z-index: 1;
+        overflow: visible;
+        -webkit-appearance: none;
       }
@@ -312,4 +322,10 @@
       }
+
+      a {
+        color: #333;
+        text-decoration: none;
+        display: block;
+      }
     `;
   }
 }

No alert changes

Improved metrics

Total package byte prevSize

529868

increased by0.25%

Lines of code

7459

increased by0.38%

No dependency changes