style

apps/remix-ide/src/app/components/popup-panel.tsx

@@ -97,14 +97,14 @@ export class PopupPanel extends AbstractPanel {
           bottom: '2rem',
           right: '3.5rem',
           zIndex: 200,
-          boxShadow: '3px 3px var(--secondary), -0.1em 0 1.4em var(--secondary)'
+          boxShadow: "0 1px 7px var(--secondary)"
         }}
         data-id="popupPanelPluginsContainer"
       >
         <div className='d-flex flex-column'>
           <RemixPluginPanel
             header={
-              <span id='popupPanelToggle' className='pb-2 d-flex flex-row'>
+              <span id='popupPanelToggle' className='d-flex flex-row'>
                 <button
                   className='btn fas fa-angle-double-down'
                   onClick={async () => {

apps/remix-ide/src/app/plugins/electron/remixAIDesktopPlugin.tsx

@@ -10,7 +10,7 @@ const desktop_profile = {
   description: 'RemixAI provides AI services to Remix IDE Desktop.',
   documentation: 'https://remix-ide.readthedocs.io/en/latest/remixai.html',
   icon: 'assets/img/remix-logo-blue.png',
-  methods: ['initializeModelBackend', 'code_completion', 'code_insertion', 'code_generation', 'code_explaining', 'error_explaining', 'solidity_answer', 'toggle'],
+  methods: ['initializeModelBackend', 'code_completion', 'code_insertion', 'code_generation', 'code_explaining', 'error_explaining', 'solidity_answer'],
 }
 
 export class remixAIDesktopPlugin extends ElectronPlugin {

apps/remix-ide/src/app/plugins/remixAIPlugin.tsx

@@ -18,7 +18,7 @@ const profile = {
     "solidity_answer", "code_explaining",
     "code_insertion", "error_explaining",
     "initialize", 'chatPipe', 'ProcessChatRequestBuffer',
-    'isChatRequestPending', 'toggle'],
+    'isChatRequestPending'],
   events: [],
   icon: 'assets/img/remix-logo-blue.png',
   description: 'RemixAI provides AI services to Remix IDE.',
@@ -224,7 +224,7 @@ export class RemixAIPlugin extends ViewPlugin {
   render() {
     return <div
       id='ai-view'
-      className='pb-2 mb-2 h-100 d-flex'
+      className='h-100 d-flex'
       data-id='aichat-view'
       style={{
         minHeight: 'max-content',

apps/remixdesktop/src/plugins/remixAIDektop.ts

@@ -32,7 +32,7 @@ const clientProfile: Profile = {
   description: 'RemixAI provides AI services to Remix IDE Desktop.',
   kind: '',
   documentation: 'https://remix-ide.readthedocs.io/en/latest/remixai.html',
-  methods: ['initializeModelBackend', 'code_completion', 'code_insertion', 'code_generation', 'code_explaining', 'error_explaining', 'solidity_answer', 'toggle']
+  methods: ['initializeModelBackend', 'code_completion', 'code_insertion', 'code_generation', 'code_explaining', 'error_explaining', 'solidity_answer']
 }
 
 class RemixAIDesktopPluginClient extends ElectronBasePluginClient {

libs/remix-ui/remix-ai/src/lib/components/RemixAI.tsx

@@ -9,7 +9,7 @@ export const RemixAITab = (props: IRemixAITab) => {
 
   return (
     <>
-      <div id="remixAITab" className="h-100 w-100 px-2 pb-1">
+      <div id="remixAITab" className="mx-2 h-100 w-100 px-0">
         <div className='h-100'>
           <Default plugin={props.plugin}></Default>
         </div>

libs/remix-ui/remix-ai/src/lib/components/color.css

@@ -16,6 +16,14 @@
   overflow-y: hidden;
 }
 
+.nlux-comp-composer {
+  line-height: normal;
+}
+
+.nlux-comp-composer>textarea  {
+  padding: 10px !important
+}
+
 .nlux-comp-conversationStarters {
   width: auto !important;
   padding: 0px !important
@@ -26,7 +34,6 @@
   border-color: var(--text-background) !important;
 }
 
-
 .nlux-theme-remix_ai_theme {
 
     /* Override top-level chat room colors */
@@ -61,9 +68,6 @@
     --nlux-cvStrt--brdrWd: 0;
     --nlux-cvStrt--brdClr: var(--light);
     --nlux-cvStrt--brdrWd: 'hidden';
-    --nlux-comp-composer > textarea {padding: 8px;}
-
-
 
     /* Override input colors */
     --nlux-PromptInput--BackgroundColor: var(--light);
@@ -74,10 +78,10 @@
     --nlux-Composer--Gap: 0;
 
     /* Override submit button colors */
-    --nlux-SubmitButton--BackgroundColor: var(--light);
+    --nlux-SubmitButton--BackgroundColor: var(--primary);
-    --nlux-SubmitButton-Active--BackgroundColor:var(--light);
+    --nlux-SubmitButton-Active--BackgroundColor:var(--primary);
     --nlux-SubmitButton-Disabled--BackgroundColor: var(--dark);
-    --nlux-SubmitButton-Active--TextColor: var(--primary);
+    --nlux-SubmitButton-Active--TextColor: var(--white);
     --nlux-SubmitButton-Disabled--TextColor: var(--text);
 
     /** Inline code in markdown */
@@ -110,4 +114,6 @@
     /* Override icon for the send button */
     --nlux-send-icon: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M0 256a256 256 0 1 0 512 0A256 256 0 1 0 0 256zM297 385c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l71-71L120 280c-13.3 0-24-10.7-24-24s10.7-24 24-24l214.1 0-71-71c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0L409 239c9.4 9.4 9.4 24.6 0 33.9L297 385z"/></svg>');
 
+    --nlux-comp-composer > textarea {padding: 10px;};
+
 }

libs/remix-ui/remix-ai/src/lib/components/personas.tsx

@@ -1,8 +1,8 @@
 import { PersonaOptions, UserPersona } from '@nlux/react';
 
 export const user: UserPersona = {
-  name: 'Pipper',
+  name: 'Remi',
   avatar: 'assets/img/remix-logo-blue.png'
 };
 
-export const assistantAvatar = 'assets/img/remi-prof.webp';
+export const assistantAvatar = 'assets/img/aiLogo.svg'

libs/remix-ui/statusbar/src/lib/components/aiStatus.tsx

@@ -49,20 +49,32 @@ export default function AIStatus(props: AIStatusProps) {
           {copilotActive === false ? 'RemixAI Copilot (disabled)' : 'RemixAI Copilot (enabled)'}
         </span>
       </CustomTooltip>
+      <CustomTooltip
+        tooltipText={"Ask RemixAI for help!"}
+      >
         <div className="d-flex text-sm flex-row pr-2 text-white justify-content-center align-items-center">
+          <style>{`
+            button.fa-robot:focus {
+              outline: none;
+              box-shadow: none;
+            }
+            button.fa-robot:hover {
+              border-color: var(--info)
+            }
+          `}</style>
           <button
             style={{
               position: 'absolute',
               bottom: '0.7rem',
-            right: '0.3rem',
+              right: '0.1rem',
               height: '3rem',
               width: '3rem',
               borderRadius: '50%',
               color: 'var(--ai)',
-            boxShadow: '3px 3px var(--secondary), -0.1em 0 1.4em var(--secondary)'
+              boxShadow: "0 1px 7px var(--secondary)"
             }}
             data-id="aiStatusButton"
-          className='p-1 alert alert-info border border-info fa-solid fa-message-bot'
+            className='h3 p-1 alert alert-info fal fa-robot'
             onClick={async () => {
               appContext.appStateDispatch({
                 type: appActionTypes.setShowPopupPanel,
@@ -70,9 +82,9 @@ export default function AIStatus(props: AIStatusProps) {
               })
             }}
           >
-
           </button>
         </div>
+      </CustomTooltip>
     </div>
   )
 }

libs/remix-ui/statusbar/src/lib/components/scamDetails.tsx

@@ -26,7 +26,7 @@ export default function ScamDetails ({ refs, floatStyle, scamAlerts }: ScamDetai
         height: '6rem',
         transform: 'translate(88.5px, -80px)',
         willChange: 'transform',
-        boxShadow: '3px 3px var(--secondary), -0.1em 0 1.4em var(--secondary)'
+        boxShadow: "0 1px 7px var(--secondary)"
       } }
       className="p-1 pb-0 mb-1 d-flex alert alert-warning border border-warning"
     >