update modelname

Author: mykalmax

web/common/src/components/ModelName/ModelName.css

@@ -14,4 +14,6 @@
 
   --color-model-name-copy-icon: var(--color-neutral-600);
   --color-model-name-copy-icon-hover: var(--color-neutral-100);
+  --color-model-name-copy-icon-background: var(--color-neutral-100);
+  --color-model-name-copy-icon-background-hover: var(--color-neutral-200);
 }

web/common/src/components/ModelName/ModelName.tsx

@@ -200,7 +200,7 @@ export const ModelName = React.forwardRef<HTMLDivElement, ModelNameProps>(
             size="2xs"
             variant="transparent"
             text={name}
-            className="ml-2 w-6 hover:text-model-name-copy-icon-hover active:text-model-name-copy-icon-hover"
+            className="ml-2 w-6 hover:text-model-name-copy-icon-hover active:text-model-name-copy-icon-hover bg-model-name-copy-icon-background hover:bg-model-name-copy-icon-background-hover active:bg-model-name-copy-icon-background-hover"
           >
             {copied =>
               copied ? (

web/common/tailwind.base.config.js

@@ -71,6 +71,10 @@ export default {
           model: 'var(--color-model-name-model)',
           'copy-icon': 'var(--color-model-name-copy-icon)',
           'copy-icon-hover': 'var(--color-model-name-copy-icon-hover)',
+          'copy-icon-background':
+            'var(--color-model-name-copy-icon-background)',
+          'copy-icon-background-hover':
+            'var(--color-model-name-copy-icon-background-hover)',
         },
         badge: {
           background: 'var(--color-badge-background)',