@internetarchive/ia-topnav 1.1.37-alpha.0 → 1.1.37-alpha2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@internetarchive/ia-topnav",
-  "version": "1.1.37-alpha.0",
+  "version": "1.1.37-alpha2",
   "description": "Top nav for Internet Archive",
   "license": "AGPL-3.0-only",
   "main": "index.js",
@@ -18,8 +18,7 @@
     "format:prettier": "prettier \"**/*.js\" --write --ignore-path .gitignore",
     "lint": "npm run lint:eslint",
     "format": "npm run format:eslint && npm run format:prettier",
-    "test": "ulimit -v unlimited;  web-test-runner  'test/**/*.test.js' --node-resolve --coverage --puppeteer",
-    "publish:alpha": "npm run test && npm version prerelease --preid alpha --no-git-tag-version && npm publish --tag alpha"
+    "test": "ulimit -v unlimited;  web-test-runner  'test/**/*.test.js' --node-resolve --coverage --puppeteer"
   },
   "dependencies": {
     "@internetarchive/ia-wayback-search": "^0.2.3"

package/src/assets/img/icons.js

@@ -8,7 +8,6 @@ import search from './icon-search.js';
 import software from './icon-software.js';
 import texts from './icon-texts.js';
 import upload from './icon-upload.js';
-import uploadUnpadded from './icon-upload-unpadded.js';
 import user from './icon-user.js';
 import video from './icon-video.js';
 import web from './icon-web.js';
@@ -24,7 +23,6 @@ export default {
   software,
   texts,
   upload,
-  uploadUnpadded,
   user,
   video,
   web,

package/src/data/menus.js

@@ -524,7 +524,6 @@ export function buildTopNavMenus(userid = '___USERID___', localLinks = true, way
         url: `${prefix}/create`,
         title: 'Upload files',
         analyticsEvent: 'UserUpload',
-        class: 'mobile-upload',
       },
       {
         url: `${prefix}/details/@${userid}`,

package/src/dropdown-menu.js

@@ -1,9 +1,7 @@
 import { html, nothing } from 'https://offshoot.prod.archive.org/lit.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
 import TrackedElement from './tracked-element.js';
 import dropdownMenuCSS from './styles/dropdown-menu.js';
 import formatUrl from './lib/formatUrl.js';
-import icons from './assets/img/icons.js';
 
 class DropdownMenu extends TrackedElement {
   static get styles() {
@@ -57,10 +55,8 @@ class DropdownMenu extends TrackedElement {
     const calloutText = this.config.callouts?.[link.title];
     return html`<a
       href="${formatUrl(link.url, this.baseHost)}"
-      class="${ifDefined(link.class)}"
       @click=${this.trackClick}
       data-event-click-tracking="${this.config.eventCategory}|Nav${link.analyticsEvent}"
-      ${link.class === 'mobile-upload' ? icons.uploadUnpadded : nothing}
       aria-label=${calloutText ? `New feature: ${link.title}` : nothing}>
         ${link.title}
         ${calloutText ? html`<span class="callout" aria-hidden="true">${calloutText}</span>` : nothing}

package/src/styles/dropdown-menu.js

@@ -3,6 +3,7 @@ import { css } from 'https://offshoot.prod.archive.org/lit.js';
 export default css`
   .nav-container {
     position: relative;
+    z-index: 4;
   }
 
   nav {
@@ -76,16 +77,6 @@ export default css`
     color: #2c2c2c;
     font-size: 1.4rem;
     font-weight: bold;
-  
-  a.mobile-upload {
-    display: flex;
-    justify-content: left;
-    align-items: center;
-  }
-  
-  a.mobile-upload svg {
-    fill: #fff;
-    margin-right: 10px;
   }
 
   @media (min-width: 890px) {
@@ -156,9 +147,5 @@ export default css`
       opacity: 1;
       overflow: visible;
     }
-
-    a.mobile-upload {
-      display: none;
-    }
   }
 `;

package/src/styles/ia-topnav.js

@@ -69,7 +69,7 @@ export default css`
     right: 0;
     bottom: 0;
     left: 0;
-    z-index: 0;
+    z-index: 3;
   }
   #close-layer.visible {
     display: block;
@@ -77,12 +77,14 @@ export default css`
 
   .topnav {
     position: relative;
-    z-index: 3;
   }
 
   @media (max-width: 889px) {
     desktop-subnav {
       display: none;
     }
+    .topnav {
+      z-index: 4;
+    }
   }
 `;

package/src/styles/nav-search.js

@@ -37,7 +37,7 @@ export default css`
     right: 4rem;
     bottom: 0;
     left: 4rem;
-    z-index: 3;
+    z-index: 4;
     padding: 0.5rem 0.2rem;
     border-radius: 1rem 1rem 0 0;
     background: var(--searchActiveBg);

package/src/styles/primary-nav.js

@@ -201,7 +201,6 @@ export default css`
 
     nav {
       display: block;
-      z-index: 3;
       height: 5rem;
       padding-right: 1.5rem;
     }
@@ -274,6 +273,8 @@ export default css`
     nav-search {
       float: right;
       margin-left: 1rem;
+      z-index: 4;
+      position: inherit;
     }
 
     login-button {

package/src/styles/search-menu.js

@@ -3,6 +3,7 @@ import { css } from 'https://offshoot.prod.archive.org/lit.js';
 export default css`
   .menu-wrapper {
     position: relative;
+    z-index: 4;
   }
 
   button:focus,

package/test/primary-nav.test.js

@@ -44,6 +44,18 @@ describe('<primary-nav>', () => {
     expect(el.shadowRoot.querySelector('nav-search')).to.equal(null);
   });
 
+  it('truncates a long screenname', async () => {
+    const el = await fixture(component({
+      baseHost: 'archive.org',
+      username: 'boop',
+      screenName: 'somesuperlongscreenname'
+    }));
+
+    const usernameSpan = el.shadowRoot.querySelector('.username');
+
+    expect(usernameSpan.innerText).to.equal('somesuper…');
+  });
+
   it('opens a slot with `secondIdentitySlotMode`', async () => {
     const el = await fixture(component({
       baseHost: 'archive.org',

package/src/assets/img/icon-upload-unpadded.js

@@ -1,15 +0,0 @@
-import { html } from 'https://offshoot.prod.archive.org/lit.js';
-
-export default html`
-  <svg
-    height="14"
-    width="14"
-    viewBox="8 8 24 24"
-    xmlns="http://www.w3.org/2000/svg"
-    aria-labelledby="uploadTitleID uploadDescID"
-  >
-    <title id="uploadTitleID">Upload icon</title>
-    <desc id="uploadDescID">An illustration of a horizontal line over an up pointing arrow.</desc>
-    <path class="fill-color" d="m20 12.8 8 10.4h-4.8v8.8h-6.4v-8.8h-4.8zm12-4.8v3.2h-24v-3.2z" fill-rule="evenodd"/>
-  </svg>
-`;