Clean up some of the design of agents, inspired by dicussion #792

This commit is contained in:
sabaimran 2024-06-03 12:52:07 +05:30
parent 8cdab5f31a
commit 4679f07336

View file

@ -13,11 +13,10 @@
<!--Add Header Logo and Nav Pane--> <!--Add Header Logo and Nav Pane-->
{% import 'utils.html' as utils %} {% import 'utils.html' as utils %}
{{ utils.heading_pane(user_photo, username, is_active, has_documents) }} {{ utils.heading_pane(user_photo, username, is_active, has_documents) }}
<!-- {{ agents }} -->
<div id="agents-list"> <div id="agents-list">
<div id="agents-header"> <div id="agents-header">
<h1 id="agents-list-title">Agents</h1> <h1 id="agents-list-title">Chat with an Agent</h1>
<!-- <div id="create-agent"> <!-- <div id="create-agent">
<a href="/agents/create"><svg class="new-convo-button" viewBox="0 0 35 35" fill="#000000" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg"> <a href="/agents/create"><svg class="new-convo-button" viewBox="0 0 35 35" fill="#000000" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
<path d="M16 0c-8.836 0-16 7.163-16 16s7.163 16 16 16c8.837 0 16-7.163 16-16s-7.163-16-16-16zM16 30.032c-7.72 0-14-6.312-14-14.032s6.28-14 14-14 14 6.28 14 14-6.28 14.032-14 14.032zM23 15h-6v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1v6h-6c-0.552 0-1 0.448-1 1s0.448 1 1 1h6v6c0 0.552 0.448 1 1 1s1-0.448 1-1v-6h6c0.552 0 1-0.448 1-1s-0.448-1-1-1z"></path> <path d="M16 0c-8.836 0-16 7.163-16 16s7.163 16 16 16c8.837 0 16-7.163 16-16s-7.163-16-16-16zM16 30.032c-7.72 0-14-6.312-14-14.032s6.28-14 14-14 14 6.28 14 14-6.28 14.032-14 14.032zM23 15h-6v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1v6h-6c-0.552 0-1 0.448-1 1s0.448 1 1 1h6v6c0 0.552 0.448 1 1 1s1-0.448 1-1v-6h6c0.552 0 1-0.448 1-1s-0.448-1-1-1z"></path>
@ -36,13 +35,19 @@
<a href="/agent/{{ agent.slug }}"> <a href="/agent/{{ agent.slug }}">
<h2>{{ agent.name }}</h2> <h2>{{ agent.name }}</h2>
</a> </a>
<p>{{ agent.personality }}</p>
</div> </div>
<div class="agent-info"> <div class="agent-info">
<button onclick="openChat('{{ agent.slug }}')"> <button onclick="openChat('{{ agent.slug }}')">
<img class="send-icon" src="/static/assets/icons/send.svg" alt="Chat"> <img class="send-icon" src="/static/assets/icons/send.svg" alt="Chat">
</button> </button>
</div> </div>
<div class="agent-personality">
<a href="/agent/{{ agent.slug }}">
<p>
{{ agent.personality }}
</p>
</a>
</div>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
@ -70,10 +75,15 @@
margin: 0; margin: 0;
} }
.agent-info p { .agent-personality p {
height: 50px; white-space: inherit;
overflow: auto; overflow: hidden;
margin: 0px; height: 100px;
}
div.agent-personality {
text-align: left;
grid-column: span 3;
} }
div.agent-info { div.agent-info {
@ -145,9 +155,9 @@
gap: 20px; gap: 20px;
align-items: center; align-items: center;
padding: 20px; padding: 20px;
background-color: var(--frosted-background-color);
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
border-radius: 8px; border-radius: 8px;
background: linear-gradient(18.48deg,rgba(252, 213, 87, 0.25) 2.76%,rgba(197, 0, 0, 0) 17.23%),linear-gradient(200.6deg,rgba(244, 229, 68, 0.25) 4.13%,rgba(230, 26, 26, 0) 20.54%);
} }
div.agent-info { div.agent-info {