Discource-C
/
discourse-ai
mirror of https://github.com/discourse/discourse-ai.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: increase gist size, and adjust surrounding elements to accommodate (#900)

This commit is contained in:
Kris 2024-11-07 08:35:05 -05:00 committed by GitHub
parent 1ad5321c09
commit 893fa624e4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 47 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
assets/javascripts/discourse/components/ai-topic-gist.gjs
View File

@ -1,5 +1,6 @@
import Component from "@glimmer/component";
import { service } from "@ember/service";
import bodyClass from "discourse/helpers/body-class";
export default class AiTopicGist extends Component {
@service router;
@ -21,6 +22,7 @@ export default class AiTopicGist extends Component {
<template>
{{#if this.showGist}}
{{bodyClass "--topic-list-with-gist"}}
<div class="ai-topic-gist">
<div class="ai-topic-gist__text">
{{@topic.ai_topic_gist}}

50
assets/stylesheets/modules/summarization/common/ai-summary.scss
View File

@ -224,22 +224,62 @@
line-height: 1.4;
width: 90%;
}
.desktop-view & {
margin-top: 0.15em;
margin-bottom: -0.15em;
}
&__text {
color: var(--primary-high);
text-wrap: pretty;
word-wrap: break-word;
font-size: var(--font-down-1);
max-width: 70ch;
max-width: 65ch;
.visited & {
color: var(--primary-medium);
}
}
}
.--topic-list-with-gist {
.topic-list-item {
.main-link {
.desktop-view & {
padding: 1em 1em 1em 0.67em;
}
font-size: var(--font-up-2);
line-height: var(--line-height-medium);
}
.link-bottom-line {
font-size: var(--font-down-2);
margin-top: 0.25em;
}
.ai-topic-gist {
font-size: var(--font-up-1);
line-height: var(--line-height-large);
margin-top: 0.25em;
margin-bottom: 0.15em;
}
.topic-post-badges {
font-size: var(--font-down-1);
}
}
.mobile-view & {
.topic-list {
.topic-list-item > .topic-list-data {
padding: 1em 0;
}
.topic-item-stats .num.activity {
align-self: end;
margin-bottom: -0.15em; // vertical alignment
}
.pull-left {
padding-top: 0.25em;
}
.right {
margin-left: 3.75em;
}
}
}
}
.ai-gists-dropdown-trigger {
font-size: var(--font-down-1);
color: var(--primary-medium);