From cb2921eb07f7ab280e5a5eddd509182c7f055686 Mon Sep 17 00:00:00 2001
From: chunt007 <63367590+chunt007@users.noreply.github.com>
Date: Tue, 4 Feb 2025 21:29:31 -0600
Subject: [PATCH] Update ChatWithMe.ts

Creates the "Chat" logo for the top of this card
---
 src/ChatWithMe.ts | 29 +++++++++++++++++++++++++++--
 1 file changed, 27 insertions(+), 2 deletions(-)

diff --git a/src/ChatWithMe.ts b/src/ChatWithMe.ts
index ced12c1..a7008d0 100644
--- a/src/ChatWithMe.ts
+++ b/src/ChatWithMe.ts
@@ -2,16 +2,39 @@ import { html, TemplateResult } from "lit-html";
 import { DataBrowserContext } from "pane-registry";
 import { NamedNode } from "rdflib";
 import { widgets } from "solid-ui";
+import {
+  fullWidth,
+  heading,
+  paddingSmall,
+  textCenter,
+  textLeft,
+  textGray,
+} from "./baseStyles";
 import { asyncReplace } from "lit-html/directives/async-replace.js";
+import { styleMap } from "lit-html/directives/style-map.js";
+import { ProfilePresentation } from "./presenter";
 import { chatWithMeButtonText, loadingMessage } from "./texts";
 
+const styles = {
+  image: styleMap(fullWidth()),
+  intro: styleMap({ ...textGray(), ...textCenter() }),
+  info: styleMap({ ...paddingSmall(), ...textLeft() }),
+};
+
 export const ChatWithMe = (
   subject: NamedNode,
-  context: DataBrowserContext
+  context: DataBrowserContext,
+  profileBasics: ProfilePresentation
 ): TemplateResult => {
   const logic = context.session.logic;
   const longChatPane = context.session.paneRegistry.byName("long chat");
+  const nameStyle = styleMap({
+    ...heading(),
+    // "text-decoration": "underline",
+  // was "text-decoration-color"
+  color: profileBasics.highlightColor
 
+  });
   async function* chatContainer() {
     const chatContainer = context.dom.createElement("div");
 
@@ -47,5 +70,7 @@ export const ChatWithMe = (
     }
   }
 
-  return html` ${asyncReplace(chatContainer())} `;
+   return html`  <div style=${styles.info}>
+                    <h3 style=${nameStyle}>Chat</h3></div> ${asyncReplace(chatContainer())}`
+};
 };