fix(ui): standardize tile-based layouts across input, product card, and terminal preview components

This commit is contained in:
2026-04-03 12:37:57 +00:00
parent 23d672040c
commit 42fd0b276e
8 changed files with 132 additions and 138 deletions

View File

@@ -5,8 +5,8 @@ export const renderRichtext = (component: DeesInputRichtext): TemplateResult =>
return html`
<div class="input-wrapper">
${component.label ? html`<label class="label">${component.label}</label>` : ''}
<div class="editor-container ${component.editor?.isFocused ? 'focused' : ''}" style="--min-height: ${component.minHeight}px">
<div class="editor-toolbar">
<dees-tile class="${component.editor?.isFocused ? 'focused' : ''}" style="--min-height: ${component.minHeight}px">
<div slot="header" class="editor-toolbar">
${component.renderToolbar()}
<div class="link-input ${component.showLinkInput ? 'show' : ''}">
<input type="url" placeholder="Enter URL..." @keydown=${component.handleLinkInputKeydown} />
@@ -20,14 +20,14 @@ export const renderRichtext = (component: DeesInputRichtext): TemplateResult =>
<div class="editor-content"></div>
${component.showWordCount
? html`
<div class="editor-footer">
<div slot="footer" class="editor-footer">
<span class="word-count">${component.wordCount} word${component.wordCount !== 1 ? 's' : ''}</span>
</div>
`
: ''}
</div>
</dees-tile>
${component.description ? html`<div class="description">${component.description}</div>` : ''}
</div>
`;
};