Differentiate chatbot title from other text. (#12)

vectara · Feb 28, 2024 · ff52510 · ff52510
1 parent 6c9d918
commit ff52510
Show file tree

Hide file tree

Showing 5 changed files with 73 additions and 5 deletions.
diff --git a/docs/node_modules/.package-lock.json b/docs/node_modules/.package-lock.json
diff --git a/docs/node_modules/@vectara/react-chatbot b/docs/node_modules/@vectara/react-chatbot
diff --git a/src/components/chatView.scss b/src/components/chatView.scss
@@ -159,9 +159,9 @@ $chatbotPosition: $sizeS;
 
 .vrcbHeader {
   border-bottom: 1px solid $borderColorLight;
-  color: $colorText;
-  font-size: $fontSizeStandard;
-  font-weight: $fontWeightBold;
+  color: $colorSubdued;
+  font-size: $fontSizeSmall;
+  font-weight: $fontWeightStrong;
   gap: 4px;
   padding: 8px;
 

diff --git a/src/vui/styleUtils/_colors.scss b/src/vui/styleUtils/_colors.scss
@@ -1,20 +1,23 @@
 // Semantic colors
 $colorAccent: #551edf !default;
-$colorPrimary: rgb(38, 76, 214) !default;
+$colorPrimary: #264cd6 !default;
 $colorSuccess: #04821f !default;
 $colorWarning: #965a15 !default;
 $colorDanger: #c41535 !default;
 
 // Semantic shades
 $colorAccentLightShade: #eadfff !default;
-$colorPrimaryLightShade: rgb(217, 226, 255) !default;
+$colorPrimaryLightShade: #d9e2ff !default;
+$colorPrimaryLighterShade: #edf5ff !default;
 $colorSuccessLightShade: #e9f2e9 !default;
 $colorWarningLightShade: #f4eee8 !default;
 $colorDangerLightShade: #fae9eb !default;
+$colorDangerLighterShade: #fdeff0 !default;
 
 // Neutral colors
 $colorEmptyShade: #ffffff !default;
 $colorLightShade: #f3f7fb !default;
+$colorMediumLightShade: #e8eff5 !default;
 $colorMediumShade: #cbcdde !default;
 $colorDarkShade: #69707d !default;
 $colorDarkerShade: #2c313a !default;

diff --git a/src/vui/styleUtils/_typography.scss b/src/vui/styleUtils/_typography.scss
@@ -12,6 +12,7 @@ $colorText: $colorDarkerShade;
 $colorSubdued: $colorDarkShade;
 
 $fontWeightNormal: 400;
+$fontWeightStrong: 500;
 $fontWeightBold: 600;
 
 $labelFontSize: $fontSizeStandard;