Changed HTML to use djlint
This commit is contained in:
@@ -1,170 +1,215 @@
|
||||
<div class="dropdown is-up is-right" id="settings-dropdown">
|
||||
<div class="dropdown-trigger">
|
||||
<button class="button is-small {% if not AnyExists %} is-danger{% endif %} to-reduce-opacity"
|
||||
aria-haspopup="true" aria-controls="dropdown-menu3"
|
||||
<div class="dropdown-trigger">
|
||||
<button class="button is-small {% if not AnyExists %}is-danger{% endif %} to-reduce-opacity"
|
||||
aria-haspopup="true"
|
||||
aria-controls="dropdown-menu3"
|
||||
onclick="this.parentElement.parentElement.classList.toggle('is-active')">
|
||||
<span class="icon"><i class="fa-solid fa-bars"></i></i></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="dropdown-menu" id="dropdown-menu3" role="menu">
|
||||
<div class="dropdown-content">
|
||||
<div class="dropdown-item">
|
||||
<div class="field">
|
||||
<form id="api-keys-form" hx-post="/addKeys" hx-trigger="submit" hx-target="#api-keys-status">
|
||||
<div class="field has-addons is-hidden" id="openai-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if OpenaiExists %}is-success{% endif %}" type="text"
|
||||
{%if not IsLogin %}disabled{% endif %} placeholder="OpenAI API key"
|
||||
name="openai_key" autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="anthropic-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if AnthropicExists %}is-success{% endif %}" type="text"
|
||||
{% if not IsLogin %}disabled{% endif %} placeholder="Anthropic API key"
|
||||
name="anthropic_key" autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="mistral-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if MistralExists %}is-success{% endif %}" type="text"
|
||||
{%if not IsLogin %}disabled{% endif %} placeholder="Mistral API key"
|
||||
name="mistral_key" autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="groq-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if GroqExists %}is-success{% endif %}" type="text"
|
||||
placeholder="Groq API key" {%if not IsLogin %}disabled{% endif %} name="groq_key"
|
||||
autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="gemini-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if GoogleExists %}is-success{% endif %}" type="text"
|
||||
placeholder="Google API key" name="google_key" autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="nim-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if NimExists %}is-success{% endif %}" type="text"
|
||||
placeholder="NIM API key" name="nim_key" autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="perplexity-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if PerplexityExists %}is-success{% endif %}" type="text"
|
||||
placeholder="Perplexity API key" name="perplexity_key" autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="fireworks-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if FireworksExists %}is-success{% endif %}" type="text"
|
||||
placeholder="Fireworks API key" name="fireworks_key" autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="goose-field"
|
||||
title="GooseAI chat API will be available soon">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if GooseaiExists %}is-success{% endif %}" type="text"
|
||||
{%if not IsLogin %}disabled{% endif %} placeholder="Gooseai API key"
|
||||
name="goose_key" autocomplete="off" disabled>
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons" id="save-field">
|
||||
<p class="control">
|
||||
<button disabled id="save-keys-button" type="submit" class="button is-small">
|
||||
<span class="icon is-small">
|
||||
<i class="fas fa-check"></i>
|
||||
</span>
|
||||
<span>Save keys</span>
|
||||
</button>
|
||||
</p>
|
||||
<p class="control">
|
||||
<button id="toggle-keys-button" type="button"
|
||||
class="button is-small {% if not AnyExists %}is-danger{% endif %}">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-chevron-down"></i>
|
||||
</span>
|
||||
</button>
|
||||
</p>
|
||||
</div>
|
||||
</form>
|
||||
<p id="api-keys-status"></p>
|
||||
</div>
|
||||
{% if isBasic or isPremium %}
|
||||
<a class="button is-small mt-1" href="{{ StripeSubLink }}" target="_blank">
|
||||
<span class="icon is-small" {% if isPremium %}style="color: #b00202" {%else%}style="color: #126d0f"
|
||||
{% endif %}>
|
||||
<i class="fa-solid fa-heart"></i>
|
||||
</span>
|
||||
<span>Manage subscription</span>
|
||||
</a>
|
||||
{% else %}
|
||||
<a class="button is-small mt-1" hx-get="/pricingTable" hx-target="#chat-container" hx-swap="outerHTML"
|
||||
hx-trigger="click">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-heart"></i>
|
||||
</span>
|
||||
<span>Subscribe to JADE</span>
|
||||
</a>
|
||||
{% endif %}
|
||||
<a class="button is-small mt-1" hx-get="/generateTermAndService" hx-target="#chat-container"
|
||||
hx-swap="outerHTML" hx-trigger="click">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-regular fa-file-lines"></i>
|
||||
</span>
|
||||
<span>Terms and conditions</span>
|
||||
</a>
|
||||
<a class="button is-small mt-1" hx-get="/help" hx-target="#chat-container" hx-swap="outerHTML"
|
||||
hx-trigger="click">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-info"></i>
|
||||
</span>
|
||||
<span>Help</span>
|
||||
</a>
|
||||
<a class="button is-small mt-1" href="https://www.bouvai.com/contact">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-address-card"></i>
|
||||
</span>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
<a class="button is-small mt-1" href="/signout">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-right-from-bracket"></i>
|
||||
</span>
|
||||
<span>Sign out</span>
|
||||
</a>
|
||||
<span class="icon"><i class="fa-solid fa-bars"></i></i></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="dropdown-menu" id="dropdown-menu3" role="menu">
|
||||
<div class="dropdown-content">
|
||||
<div class="dropdown-item">
|
||||
<div class="field">
|
||||
<form id="api-keys-form"
|
||||
hx-post="/addKeys"
|
||||
hx-trigger="submit"
|
||||
hx-target="#api-keys-status">
|
||||
<div class="field has-addons is-hidden" id="openai-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if OpenaiExists %}is-success{% endif %}"
|
||||
type="text"
|
||||
{% if not IsLogin %}disabled{% endif %}
|
||||
placeholder="OpenAI API key"
|
||||
name="openai_key"
|
||||
autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="anthropic-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if AnthropicExists %}is-success{% endif %}"
|
||||
type="text"
|
||||
{% if not IsLogin %}disabled{% endif %}
|
||||
placeholder="Anthropic API key"
|
||||
name="anthropic_key"
|
||||
autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="mistral-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if MistralExists %}is-success{% endif %}"
|
||||
type="text"
|
||||
{% if not IsLogin %}disabled{% endif %}
|
||||
placeholder="Mistral API key"
|
||||
name="mistral_key"
|
||||
autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="groq-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if GroqExists %}is-success{% endif %}"
|
||||
type="text"
|
||||
placeholder="Groq API key"
|
||||
{% if not IsLogin %}disabled{% endif %}
|
||||
name="groq_key"
|
||||
autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="gemini-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if GoogleExists %}is-success{% endif %}"
|
||||
type="text"
|
||||
placeholder="Google API key"
|
||||
name="google_key"
|
||||
autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="nim-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if NimExists %}is-success{% endif %}"
|
||||
type="text"
|
||||
placeholder="NIM API key"
|
||||
name="nim_key"
|
||||
autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="perplexity-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if PerplexityExists %}is-success{% endif %}"
|
||||
type="text"
|
||||
placeholder="Perplexity API key"
|
||||
name="perplexity_key"
|
||||
autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden" id="fireworks-field">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if FireworksExists %}is-success{% endif %}"
|
||||
type="text"
|
||||
placeholder="Fireworks API key"
|
||||
name="fireworks_key"
|
||||
autocomplete="off">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons is-hidden"
|
||||
id="goose-field"
|
||||
title="GooseAI chat API will be available soon">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if GooseaiExists %}is-success{% endif %}"
|
||||
type="text"
|
||||
{% if not IsLogin %}disabled{% endif %}
|
||||
placeholder="Gooseai API key"
|
||||
name="goose_key"
|
||||
autocomplete="off"
|
||||
disabled>
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-lock"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons" id="save-field">
|
||||
<p class="control">
|
||||
<button disabled id="save-keys-button" type="submit" class="button is-small">
|
||||
<span class="icon is-small">
|
||||
<i class="fas fa-check"></i>
|
||||
</span>
|
||||
<span>Save keys</span>
|
||||
</button>
|
||||
</p>
|
||||
<p class="control">
|
||||
<button id="toggle-keys-button"
|
||||
type="button"
|
||||
class="button is-small {% if not AnyExists %}is-danger{% endif %}">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-chevron-down"></i>
|
||||
</span>
|
||||
</button>
|
||||
</p>
|
||||
</div>
|
||||
</form>
|
||||
<p id="api-keys-status"></p>
|
||||
</div>
|
||||
{% if isBasic or isPremium %}
|
||||
<a class="button is-small mt-1"
|
||||
href="{{ StripeSubLink }}"
|
||||
target="_blank">
|
||||
<span class="icon is-small"
|
||||
{% if isPremium %}style="color: #b00202" {% else %}style="color: #126d0f" {% endif %}>
|
||||
<i class="fa-solid fa-heart"></i>
|
||||
</span>
|
||||
<span>Manage subscription</span>
|
||||
</a>
|
||||
{% else %}
|
||||
<a class="button is-small mt-1"
|
||||
hx-get="/pricingTable"
|
||||
hx-target="#chat-container"
|
||||
hx-swap="outerHTML"
|
||||
hx-trigger="click">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-heart"></i>
|
||||
</span>
|
||||
<span>Subscribe to JADE</span>
|
||||
</a>
|
||||
{% endif %}
|
||||
<a class="button is-small mt-1"
|
||||
hx-get="/generateTermAndService"
|
||||
hx-target="#chat-container"
|
||||
hx-swap="outerHTML"
|
||||
hx-trigger="click">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-regular fa-file-lines"></i>
|
||||
</span>
|
||||
<span>Terms and conditions</span>
|
||||
</a>
|
||||
<a class="button is-small mt-1"
|
||||
hx-get="/help"
|
||||
hx-target="#chat-container"
|
||||
hx-swap="outerHTML"
|
||||
hx-trigger="click">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-info"></i>
|
||||
</span>
|
||||
<span>Help</span>
|
||||
</a>
|
||||
<a class="button is-small mt-1" href="https://www.bouvai.com/contact">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-address-card"></i>
|
||||
</span>
|
||||
<span>Contact</span>
|
||||
</a>
|
||||
<a class="button is-small mt-1" href="/signout">
|
||||
<span class="icon is-small">
|
||||
<i class="fa-solid fa-right-from-bracket"></i>
|
||||
</span>
|
||||
<span>Sign out</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
Reference in New Issue
Block a user