Use class directive
This commit is contained in:
parent
c2180589ac
commit
aa521d5a19
|
@ -17,7 +17,7 @@
|
|||
<strong>private</strong>. You can also close the browser tab and come back later to continue the conversation.
|
||||
</div>
|
||||
</article>
|
||||
<article class="message {!apiKey ? 'is-danger' : 'is-warning'}">
|
||||
<article class="message" class:is-danger={!apiKey} class:is-warning={apiKey}>
|
||||
<div class="message-body">
|
||||
Set your OpenAI API key below:
|
||||
|
||||
|
@ -28,7 +28,7 @@
|
|||
}}
|
||||
>
|
||||
<p class="control is-expanded">
|
||||
<input aria-label="OpenAI API key" type="password" class="input {!apiKey ? 'is-danger' : ''}" value={apiKey} />
|
||||
<input aria-label="OpenAI API key" type="password" class="input" class:is-danger={!apiKey} value={apiKey} />
|
||||
</p>
|
||||
<p class="control">
|
||||
<button class="button is-info" type="submit">Save</button>
|
||||
|
|
|
@ -19,9 +19,9 @@
|
|||
<li>
|
||||
<a
|
||||
href={"#"}
|
||||
class="panel-block {!apiKey ? 'is-disabled' : ''} {activeChatId === chat.id
|
||||
? 'has-background-light'
|
||||
: ''}"
|
||||
class="panel-block"
|
||||
class:is-disabled={!apiKey}
|
||||
class:has-background-light={activeChatId === chat.id}
|
||||
on:click|preventDefault={() => (activeChatId = chat.id)}>{chat.name || `Chat ${chat.id}`}</a
|
||||
>
|
||||
</li>
|
||||
|
@ -35,7 +35,9 @@
|
|||
<li>
|
||||
<a
|
||||
href={"#"}
|
||||
class="panel-block {!apiKey ? 'is-disabled' : ''} {activeChatId ? '' : 'has-background-light'}"
|
||||
class="panel-block"
|
||||
class:is-disabled={!apiKey}
|
||||
class:has-background-light={!activeChatId}
|
||||
on:click|preventDefault={() => {
|
||||
activeChatId = null;
|
||||
}}><span class="greyscale mr-2">🔑</span> API key</a
|
||||
|
@ -44,7 +46,8 @@
|
|||
<li>
|
||||
<a
|
||||
href={"#"}
|
||||
class="panel-block {!apiKey ? 'is-disabled' : ''}"
|
||||
class="panel-block"
|
||||
class:is-disabled={!apiKey}
|
||||
on:click|preventDefault={() => {
|
||||
activeChatId = addChat();
|
||||
}}><span class="greyscale mr-2">➕</span> New chat</a
|
||||
|
@ -53,7 +56,8 @@
|
|||
<li>
|
||||
<a
|
||||
href={"#"}
|
||||
class="panel-block {!apiKey ? 'is-disabled' : ''}"
|
||||
class="panel-block"
|
||||
class:is-disabled={!apiKey}
|
||||
on:click|preventDefault={() => {
|
||||
clearChats();
|
||||
activeChatId = null;
|
||||
|
|
Loading…
Reference in New Issue