Adjustments to improve overall styling of config page, email template

This commit is contained in:
sabaimran
2024-05-01 14:19:47 +05:30
parent 28578310d1
commit 7fd57d737e
4 changed files with 13 additions and 14 deletions

View File

@@ -1509,7 +1509,7 @@
#chat-input {
font-family: var(--font-family);
font-size: small;
height: 36px;
height: 48px;
border-radius: 16px;
resize: none;
overflow-y: hidden;

View File

@@ -11,20 +11,18 @@
</a>
<div class="calls-to-action" style="margin-top: 20px;">
<div>
<h1 style="color: #333; font-size: large; font-weight: bold; margin: 0; line-height: 1.5; background-color: #fee285; padding: 8px; box-shadow: 6px 6px rgba(0, 0, 0, 1.5);">Your Open, Personal AI</h1>
<p style="color: #333; font-size: medium; margin-top: 20px; padding: 0; line-height: 1.5;">Hey {{name}}! </p>
<p style="color: #333; font-size: medium; margin-top: 20px; padding: 0; line-height: 1.5;">I've shared your automation results below:</p>
<h1 style="color: #333; font-size: large; font-weight: bold; margin: 0; line-height: 1.5; background-color: #fee285; padding: 8px; box-shadow: 6px 6px rgba(0, 0, 0, 1.5);">Your Automation, From Your Personal AI</h1>
<div style="display: grid; grid-template-columns: 1fr 1fr; grid-gap: 12px; margin-top: 20px;">
<div style="border: 1px solid black; border-radius: 8px; padding: 8px; box-shadow: 6px 6px rgba(0, 0, 0, 1.0); margin-top: 20px;">
<a href="https://app.khoj.dev/config#tasks" style="text-decoration: none; text-decoration: underline dotted;">
<a href="https://app.khoj.dev/automations" style="text-decoration: none; text-decoration: underline dotted;">
<h3 style="color: #333; font-size: large; margin: 0; padding: 0; line-height: 2.0; background-color: #b8f1c7; padding: 8px; ">{{subject}}</h3>
</a>
<p style="color: #333; font-size: medium; margin-top: 20px; padding: 0; line-height: 1.5;">{{result}}</p>
</div>
</div>
<p style="color: #333; font-size: medium; margin-top: 20px; padding: 0; line-height: 1.5;">The automation query I ran on your behalf: {{query}}</p>
<p style="color: #333; font-size: medium; margin-top: 20px; padding: 0; line-height: 1.5;">You can view, delete your automations via <a href="https://app.khoj.dev/configure#tasks">the settings page</a></p>
<p style="color: #333; font-size: medium; margin-top: 20px; padding: 0; line-height: 1.5;">The automation I ran on your behalf: {{query}}</p>
<p style="color: #333; font-size: medium; margin-top: 20px; padding: 0; line-height: 1.5;">You can manage your automations via <a href="https://app.khoj.dev/automations">the settings page</a>.</p>
</div>
</div>
<p style="color: #333; font-size: large; margin-top: 20px; padding: 0; line-height: 1.5;">- Khoj</p>

View File

@@ -2164,7 +2164,7 @@ To get started, just start typing below. You can also type / to see a list of co
#chat-input {
font-family: var(--font-family);
font-size: medium;
height: 36px;
height: 48px;
border-radius: 16px;
resize: none;
overflow-y: hidden;

View File

@@ -5,14 +5,14 @@
<h2 class="section-title">
<img class="card-icon" src="/static/assets/icons/automation.svg?v={{ khoj_version }}" alt="Automate">
<span class="card-title-text">Automate</span>
<!-- <div class="instructions">
<a href="https://docs.khoj.dev/features/automations">ⓘ Help</a>
</div> -->
<div class="instructions">
You can automate queries to run on a schedule using Khoj's automations. Results will be sent straight to your inbox.
</div>
</h2>
<div class="section-body">
<button id="create-automation-button" type="button" class="positive-button">
<img class="automation-action-icon" src="/static/assets/icons/new.svg" alt="Automations">
<span id="create-automation-button-text">Create</span>
<span id="create-automation-button-text">Build</span>
</button>
<div id="automations" class="section-cards"></div>
</div>
@@ -27,6 +27,8 @@
width: 100%;
height: 100%;
grid-template-rows: none;
background-color: var(--frosted-background-color);
padding: 12px;
}
#create-automation-button {
width: auto;
@@ -60,10 +62,9 @@
}
div.new-automation {
background-color: #f9f9f9;
background-color: var(--frosted-background-color);
border-radius: 10px;
box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
padding: 20px;
margin-bottom: 20px;
transition: box-shadow 0.3s ease, transform 0.3s ease;
}