Merge pull request #607 from StampyAI/Melissa

CSS
StampyAI · May 1, 2024 · 96ecc18 · 96ecc18
2 parents eb60ebe + fbe0604
commit 96ecc18
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 8 deletions.
diff --git a/app/components/Button/button.css b/app/components/Button/button.css
@@ -33,9 +33,15 @@
   color: var(--colors-teal-800, #146560);
 }
 
+.primary-selected {
+  background: var(--colors-white, #ffffff);
+  color: var(--colors-teal-500, #1d9089);
+  border: 1px solid var(--colors-cool-grey-200, #dfe3e9);
+}
+
 .secondary {
   color: var(--colors-cool-grey-600, #788492) !important;
-  border: 1px solid var(--colors-cool-grey-200, #dfe3e9);
+  border: 1px solid var(--colors-teal-500, #1d9089);
   background: var(--colors-white, #fff);
 }
 

diff --git a/app/components/Chatbot/widgit.css b/app/components/Chatbot/widgit.css
@@ -23,13 +23,14 @@
 
 .settings-container {
   position: absolute;
-  bottom: var(--spacing-16);
-  left: var(--spacing-16);
+  bottom: var(--spacing-32);
+  left: var(--spacing-32);
 }
 
 .settings {
   padding: var(--spacing-32);
-  margin-bottom: var(--spacing-24);
+  margin-bottom: var(--spacing-8);
   flex-direction: column;
-  gap: var(--spacing-24);
+  gap: var(--spacing-16);
+  width: 384px;
 }
diff --git a/app/routes/chat.tsx b/app/routes/chat.tsx
@@ -16,7 +16,7 @@ export default function App() {
 
   const ModeButton = ({name, mode}: {name: string; mode: Mode}) => (
     <Button
-      className={chatSettings.mode === mode ? 'primary-alt' : ''}
+      className={chatSettings.mode === mode ? 'primary-selected' : ''}
       action={() => setChatSettings({...chatSettings, mode})}
     >
       {name}
@@ -51,8 +51,8 @@ export default function App() {
             </div>
           )}
           <SettingsIcon
-            width="32"
-            height="32"
+            width="24"
+            height="24"
             className="pointer"
             onClick={() => setShowSettings((current) => !current)}
           />