add overtitle

dfinity · Dec 14, 2023 · 814bc48 · 814bc48
1 parent 0b16f0e
commit 814bc48
Show file tree

Hide file tree

Showing 6 changed files with 26 additions and 10 deletions.
diff --git a/src/frontend/assets/icons/unwnowndapp.png b/src/frontend/assets/icons/unwnowndapp.png
diff --git a/src/frontend/src/flows/dappsExplorer/dapps.ts b/src/frontend/src/flows/dappsExplorer/dapps.ts
@@ -43,6 +43,10 @@ export class KnownDapp {
     return this.descr.oneLiner;
   }
 
+  public set oneLiner(oneLiner: string | undefined) {
+    this.descr.oneLiner = oneLiner;
+  }
+
   public get website(): string | undefined {
     return this.descr.website;
   }

diff --git a/src/frontend/src/flows/dappsExplorer/index.ts b/src/frontend/src/flows/dappsExplorer/index.ts
@@ -62,12 +62,10 @@ const dappsExplorerTemplate = ({
 
 export const dappsExplorerPage = renderPage(dappsExplorerTemplate);
 
-export const dappTemplate = ({
-  logoSrc,
-  name,
-  oneLiner,
-  oneLinerAboveTitle = false,
-}: KnownDapp & { oneLinerAboveTitle?: boolean }): TemplateResult => {
+export const dappTemplate = (
+  { logoSrc, name, oneLiner }: KnownDapp,
+  oneLinerAboveTitle = false
+): TemplateResult => {
   return html`
     <div class="c-action-list__icon" aria-hidden="true">
       <img src=${logoSrc} alt=${name} loading="lazy" />

diff --git a/src/frontend/src/flows/verifiableCredentials/allowCredentials.json b/src/frontend/src/flows/verifiableCredentials/allowCredentials.json
@@ -2,6 +2,7 @@
   "en": {
     "title": "Approve information sharing",
     "allow_start": "Allow verifying credential",
+    "label_ii_input": "Your Internet Identity",
     "allow_sep_with": "with",
     "cancel": "Cancel",
     "allow": "Allow",

diff --git a/src/frontend/src/flows/verifiableCredentials/allowCredentials.ts b/src/frontend/src/flows/verifiableCredentials/allowCredentials.ts
@@ -23,6 +23,7 @@ const getOrigin = (
   oneLiner: string
 ): KnownDapp => {
   let foundDapp = dapplist.find((dapp) => dapp.hasOrigin(origin));
+
   if (!foundDapp) {
     foundDapp = new KnownDapp({
       name: "Unknown Dapp",
@@ -31,6 +32,8 @@ const getOrigin = (
       oneLiner: oneLiner,
     });
   }
+  console.log("one liner", oneLiner);
+  foundDapp.oneLiner = oneLiner;
   return foundDapp;
 };
 
@@ -70,12 +73,16 @@ const allowCredentialsTemplate = ({
     consentMessage.send(unsafeHTML(sanitized));
   })();
 
-  const originDapp = getOrigin(providerOrigin, knownDapps, `${copy.issued_by}`);
+  const originDapp = getOrigin(
+    providerOrigin,
+    knownDapps,
+    copy.issued_by as string
+  );
 
   const relyingDapp = getOrigin(
     relyingOrigin,
     knownDapps,
-    `${copy.relying_party}`
+    copy.relying_party as string
   );
 
   const slot = html`
@@ -93,8 +100,8 @@ const allowCredentialsTemplate = ({
     ${anchorInput.template}
     <h2 class="c-card__label l-stack">${copy.allow_start}</h2>
     <ul class="c-action-list">
-      <li class="c-action-list__item">${dappTemplate(originDapp)}</li>
-      <li class="c-action-list__item">${dappTemplate(relyingDapp)}</li>
+      <li class="c-action-list__item">${dappTemplate(originDapp, true)}</li>
+      <li class="c-action-list__item">${dappTemplate(relyingDapp, true)}</li>
     </ul>
 
     <div class="c-button-group">

diff --git a/src/frontend/src/styles/main.css b/src/frontend/src/styles/main.css
@@ -2541,6 +2541,12 @@ a.c-action-list__item {
   justify-content: center;
 }
 
+.c-action-list__label--inverted {
+  flex-direction: column-reverse;
+  align-items: flex-start;
+  justify-content: center;
+}
+
 .c-action-list__action {
   cursor: pointer;
   color: var(--rc-text);