Fixed CSS for the "Send to chat" feature

system/scripts/helpers.js

@@ -490,11 +490,13 @@ export class HelpersL5r5e {
      * @return {Promise<*>}
      */
     static async sendToChat(object) {
+        // Get the html
         const tpl = await object.renderTextTemplate();
         if (!tpl) {
             return;
         }
 
+        // Create the link
         let link = null;
         if (object.data.flags.core?.sourceId) {
             link = object.data.flags.core?.sourceId.replace(/(\w+)\.(.+)/, "@$1[$2]");
@@ -504,8 +506,9 @@ export class HelpersL5r5e {
             link = object.link;
         }
 
+        // Send to Chat
         return ChatMessage.create({
-            content: (link ? link + `<br>` : "") + tpl,
+            content: `<div class="l5r5e-chat-item">${tpl}${link ? `<hr>` + link : ""}</div>`,
         });
     }
 }

system/styles/scss/ui.scss

@@ -208,9 +208,9 @@ button {
     .whisper,
     #chat-controls .roll-type-select,
     .header-search input {
-        background: transparent url("../assets/ui/chat-texture.webp") no-repeat;
+        background: transparent url("../assets/ui/chat-texture.webp") repeat-y;
         &:focus {
-            background: #f0f0e0 url("../assets/ui/chat-texture.webp") no-repeat;
+            background: #f0f0e0 url("../assets/ui/chat-texture.webp") repeat-y;
         }
     }
     .header-search input[name="search"] {
@@ -725,3 +725,36 @@ button {
         padding: 0;
     }
 }
+
+// Send to chat
+.l5r5e-chat-item {
+    color: $black-light;
+    font-size: 0.8rem;
+
+    * {
+        color: $black-light;
+    }
+    h2 {
+        font-size: 1.1rem;
+    }
+    section > ul {
+        display: flex;
+        flex-flow: row wrap;
+        padding: 0.25rem 0 0.25rem 1rem;
+        li {
+            flex: 100%;
+            padding: 1px !important;
+            margin: 0;
+            border: 0 none !important;
+            list-style-type: square;
+        }
+    }
+    .card-header img {
+        display: inline-block;
+        background: transparent;
+        border: 0 none;
+        width: 20px;
+        margin: 0;
+        padding: 0;
+    }
+}

system/templates/journal/journal-text.html

@@ -1,10 +1,16 @@
 <div class="{{cssClass}}" data-actor-id="{{actor.data._id}}" data-item-id="{{data._id}}">
     <header class="card-header">
         <h2 class="item-name">
-            {{#if data.img}}<img src="{{data.img}}" title="{{data.name}}" />{{/if}} {{data.name}}
+            {{#ifCond data.img '&&' data.content}}<img src="{{data.img}}" title="{{data.name}}" />{{/ifCond}} {{data.name}}
         </h2>
     </header>
     <section class="sheet-body">
-        <p>{{{data.content}}}</p>
+        <p>
+            {{#if data.content}}
+                {{{data.content}}}
+            {{else}}
+                {{#if data.img}}<img src="{{data.img}}" title="{{data.name}}" />{{/if}}
+            {{/if}}
+        </p>
     </section>
 </div>