Merge pull request langchain-ai#171 from langchain-ai/brace/select-mo…

…del-alert-hotfix fix: Styling improvements to select model alert
vSpaceWallet · Oct 31, 2024 · a64ad58 · a64ad58
2 parents 2b0d18b + f690e9f
commit a64ad58
Showing 1 changed file with 10 additions and 10 deletions.
diff --git a/src/components/chat-interface/model-selector.tsx b/src/components/chat-interface/model-selector.tsx
@@ -83,13 +83,16 @@ const AlertNewModelSelectorFeature = ({
         >
           <div className="relative p-[0px] rounded-lg bg-gradient-to-r from-pink-500/50 via-purple-500/50 to-pink-500/50 animate-gradient-xy shadow-[0_0_25px_rgba(236,72,153,0.3)] before:absolute before:inset-0 before:rounded-lg before:p-[12px] before:bg-gradient-to-r before:from-pink-500/20 before:via-purple-500/20 before:to-pink-500/20 before:blur-xl before:-z-10 before:animate-gradient-xy-enhanced">
             <Alert className="max-w-xl bg-white rounded-lg hover:bg-gray-50 transition-colors duration-300 ease-in-out">
-              <div className="flex justify-between items-center mb-2">
-                <NextImage
-                  alt="Model icon"
-                  src={LLMIcon}
-                  width={16}
-                  height={16}
-                />
+              <AlertTitle className="flex justify-between items-center">
+                <div className="flex items-center justify-start gap-1">
+                  <NextImage
+                    alt="Model icon"
+                    src={LLMIcon}
+                    width={16}
+                    height={16}
+                  />
+                  <TighterText>Customize your LLM model!</TighterText>
+                </div>
                 <TooltipIconButton
                   tooltip="Close alert"
                   variant="ghost"
@@ -99,9 +102,6 @@ const AlertNewModelSelectorFeature = ({
                 >
                   <X className="w-4 h-4 text-gray-600" />
                 </TooltipIconButton>
-              </div>
-              <AlertTitle>
-                <TighterText>Customize your LLM model!</TighterText>
               </AlertTitle>
               <AlertDescription className="inline-flex items-center gap-1 flex-wrap mt-2">
                 <p>