(fix:prompts) design specs

This commit is contained in:
ManishMadan2882
2025-03-13 00:43:56 +05:30
parent 5c7a3a515c
commit 0b3cad152f
2 changed files with 15 additions and 23 deletions

View File

@@ -32,15 +32,14 @@ function AddPrompt({
{t('modals.prompts.addDescription')}
</p>
<div>
<label htmlFor="new-prompt-name" className="sr-only">
Prompt Name
</label>
<Input
placeholder={t('modals.prompts.promptName')}
type="text"
className="h-10 rounded-lg"
className="mb-4"
value={newPromptName}
onChange={(e) => setNewPromptName(e.target.value)}
labelBgClassName="bg-white dark:bg-[#26272E]"
borderVariant="thin"
/>
<div className="relative top-[7px] left-3">
<span className="bg-white px-1 text-xs text-silver dark:bg-[#26272E] dark:text-silver">
@@ -48,7 +47,7 @@ function AddPrompt({
</span>
</div>
<label htmlFor="new-prompt-content" className="sr-only">
Prompt Text
{t('modals.prompts.promptText')}
</label>
<textarea
id="new-prompt-content"
@@ -61,7 +60,7 @@ function AddPrompt({
<div className="mt-6 flex flex-row-reverse">
<button
onClick={handleAddPrompt}
className="rounded-3xl bg-purple-30 px-5 py-2 text-sm text-white transition-all hover:opacity-90"
className="rounded-3xl bg-purple-30 px-5 py-2 text-sm text-white transition-all hover:bg-violets-are-blue disabled:hover:bg-purple-30"
disabled={disableSave}
title={
disableSave && newPromptName ? t('modals.prompts.nameExists') : ''
@@ -97,7 +96,7 @@ function EditPrompt({
return (
<div>
<div className="p-8">
<div className="">
<p className="mb-1 text-xl text-jet dark:text-bright-gray">
{t('modals.prompts.editPrompt')}
</p>
@@ -105,29 +104,22 @@ function EditPrompt({
{t('modals.prompts.editDescription')}
</p>
<div>
<label htmlFor="edit-prompt-name" className="sr-only">
Prompt Name
</label>
<Input
placeholder={t('modals.prompts.promptName')}
type="text"
className="h-10 rounded-lg"
className="mb-4"
value={editPromptName}
onChange={(e) => setEditPromptName(e.target.value)}
labelBgClassName="bg-white dark:bg-charleston-green-2"
borderVariant="thin"
/>
<div className="relative bottom-12 left-3 mt-[-3.00px]">
<span className="bg-white px-1 text-xs text-silver dark:bg-outer-space dark:text-silver">
{t('modals.prompts.promptName')}
</span>
</div>
<div className="relative top-[7px] left-3">
<span className="bg-white px-1 text-xs text-silver dark:bg-outer-space dark:text-silver">
<span className="bg-white px-1 text-xs text-silver dark:bg-charleston-green-2 dark:text-silver">
{t('modals.prompts.promptText')}
</span>
</div>
<label htmlFor="edit-prompt-content" className="sr-only">
Prompt Text
{t('modals.prompts.promptText')}
</label>
<textarea
id="edit-prompt-content"
@@ -139,10 +131,10 @@ function EditPrompt({
</div>
<div className="mt-6 flex flex-row-reverse gap-4">
<button
className={`rounded-3xl bg-purple-30 px-5 py-2 text-sm text-white transition-all ${
className={`rounded-3xl bg-purple-30 disabled:hover:bg-purple-30 hover:bg-violets-are-blue px-5 py-2 text-sm text-white transition-all ${
currentPromptEdit.type === 'public'
? 'cursor-not-allowed opacity-50'
: 'hover:opacity-90'
: ''
}`}
onClick={() => {
handleEditPrompt &&

View File

@@ -132,8 +132,8 @@ export default function Prompts({
return (
<>
<div>
<div className="flex flex-col">
<p className="font-semibold dark:text-bright-gray">
<div className="flex flex-col gap-4">
<p className="font-medium dark:text-bright-gray">
{t('settings.general.prompt')}
</p>
<div className="flex flex-row justify-start items-baseline gap-6">
@@ -165,7 +165,7 @@ export default function Prompts({
/>
<button
className="mt-[24px] rounded-3xl border border-solid border-violets-are-blue px-5 py-3 text-violets-are-blue transition-colors hover:text-white hover:bg-violets-are-blue"
className="rounded-3xl w-20 h-10 text-sm border border-solid border-violets-are-blue text-violets-are-blue transition-colors hover:text-white hover:bg-violets-are-blue"
onClick={() => {
setModalType('ADD');
setModalState('ACTIVE');