QA fixes to align with the new borealis theme (elastic#204080)

## Summary Fixes elastic/search-team#8647 * ~Updates non-status colors on badges and panels that were using `success` to `accentSecondary`~. Some badges remain as `success`, changed non-status badges to `primary` * New guidance requests that buttons are changed to either `text` or `primary` rather than using `accentSecondary` * Changes serverless welcome banner background to match stack * Updates search labs banner to use right color <-- Background uses `accentSecondary` and keeps `success` button [(Slack thread](https://elastic.slack.com/archives/C7QC1JV6F/p1734103814782069)) * Adds border around code blocks so it is visible in dark mode. | | | |--------|--------| | **Notebooks button:** | ![CleanShot 2024-12-13 at 09 27 37@2x](https://github.com/user-attachments/assets/1e1aeb27-12d3-4a20-829a-6e4720e8dedf) ![CleanShot 2024-12-13 at 09 28 21@2x](https://github.com/user-attachments/assets/2dfb97f0-10f4-4b7c-8b92-19c6e937b341) | | **Getting started Connection details:** | ![CleanShot 2024-12-16 at 09 53 56@2x](https://github.com/user-attachments/assets/1404901e-2079-4046-918e-754d8e49e750) | | **Welcome banner on Serverless: Removes primary background** | ![CleanShot 2024-12-13 at 09 37 56@2x](https://github.com/user-attachments/assets/99243bd6-75b0-4cd2-8f74-f1d00af3ad07) | | **Search labs banner:** | ![CleanShot 2024-12-16 at 09 14 11@2x](https://github.com/user-attachments/assets/d0c43e88-87a9-4929-994a-ac053ec0024a) ![CleanShot 2024-12-16 at 09 13 04@2x](https://github.com/user-attachments/assets/31d9b2b3-9ce9-4292-8f85-19a6dd31c9b2) | | **Borders in dark mode for code blocks** | ![CleanShot 2024-12-13 at 09 48 27@2x](https://github.com/user-attachments/assets/f3a002c4-bf3e-4d33-bce5-862477db073c) | | Crawler updates | ![CleanShot 2024-12-16 at 15 16 04@2x](https://github.com/user-attachments/assets/93c9e7e7-7009-4f2a-9b0b-0b127a5979bf) ![CleanShot 2024-12-16 at 15 16 51@2x](https://github.com/user-attachments/assets/f71f1f38-7e66-4cf5-8ec1-a67fe9dbf9f5) ![CleanShot 2024-12-16 at 15 24 15@2x](https://github.com/user-attachments/assets/62cc7a28-94cc-437c-b149-3ca79d334bb0) | | Pipelines callouts, badges, and buttons | ![CleanShot 2024-12-16 at 15 25 12@2x](https://github.com/user-attachments/assets/d02efa40-71d8-4140-9170-07e135b78d24) ![CleanShot 2024-12-16 at 15 25 46@2x](https://github.com/user-attachments/assets/f7ba21e3-acc8-4513-bca0-5cbb4c6ce06c) | --------- Co-authored-by: kibanamachine <[email protected]>
animehart · Dec 17, 2024 · 42f94e2 · 42f94e2
1 parent e529a89
commit 42f94e2
Show file tree

Hide file tree

Showing 13 changed files with 19 additions and 25 deletions.
diff --git a/packages/kbn-search-api-panels/components/cloud_details.tsx b/packages/kbn-search-api-panels/components/cloud_details.tsx
@@ -97,7 +97,7 @@ export const CloudDetailsPanel = ({
             </EuiFlexItem>
             <EuiFlexItem grow={false}>
               <span>
-                <EuiBadge color="success">
+                <EuiBadge color="accent">
                   <FormattedMessage
                     id="searchApiPanels.cloudIdDetails.elasticsearchEndpoint.recommendedBadge"
                     defaultMessage="Recommended"

diff --git a/...index/crawler/crawler_domain_detail/authentication_panel/authentication_panel_actions.tsx b/...index/crawler/crawler_domain_detail/authentication_panel/authentication_panel_actions.tsx
@@ -61,7 +61,7 @@ export const AuthenticationPanelActions: React.FC = () => {
   ) : currentAuth === null ? (
     <EuiButton
       data-telemetry-id="entSearchContent-crawler-domainDetail-authentication-addCredentials"
-      color="success"
+      color="primary"
       iconType="plusInCircle"
       size="s"
       onClick={() => enableEditing(currentAuth)}

diff --git a/...rprise_search_content/components/search_index/crawler/domain_management/domains_panel.tsx b/...rprise_search_content/components/search_index/crawler/domain_management/domains_panel.tsx
@@ -47,7 +47,7 @@ export const DomainsPanel: React.FC = () => {
             data-telemetry-id="entSearchContent-crawler-domainManagement-addDomain-addDomain"
             onClick={openFlyout}
             size="s"
-            color="success"
+            color="primary"
             iconType="plusInCircle"
           >
             {i18n.translate('xpack.enterpriseSearch.crawler.addDomainFlyout.openButtonLabel', {

diff --git a/...search_content/components/search_index/pipelines/ml_inference/add_ml_inference_button.tsx b/...search_content/components/search_index/pipelines/ml_inference/add_ml_inference_button.tsx
@@ -79,7 +79,7 @@ const AddButton: React.FC<{
   <EuiButton
     fullWidth
     data-telemetry-id={`entSearchContent-${ingestionMethod}-pipelines-addInferencePipeline`}
-    color={disabled ? undefined : 'success'}
+    color={disabled ? undefined : 'primary'}
     disabled={disabled}
     iconType={disabled ? 'lock' : 'plusInCircle'}
     onClick={onClick}

diff --git a/...nt/components/search_index/pipelines/ml_inference/text_expansion_callout/deploy_model.tsx b/...nt/components/search_index/pipelines/ml_inference/text_expansion_callout/deploy_model.tsx
@@ -38,20 +38,20 @@ export const DeployModel = ({
   const { createTextExpansionModel } = useActions(TextExpansionCalloutLogic);
 
   return (
-    <EuiCallOut color="success">
+    <EuiCallOut color="primary">
       <EuiFlexGroup direction="column" gutterSize="s">
         <EuiFlexItem>
           <EuiFlexGroup direction="row" gutterSize="s" alignItems="center">
             <EuiFlexItem grow={false}>
-              <EuiBadge color="success">
+              <EuiBadge color="primary">
                 <FormattedMessage
                   id="xpack.enterpriseSearch.content.index.pipelines.textExpansionCallOut.titleBadge"
                   defaultMessage="New"
                 />
               </EuiBadge>
             </EuiFlexItem>
             <EuiFlexItem grow>
-              <EuiText color="success" size="xs">
+              <EuiText color="primary" size="xs">
                 <h3>
                   {i18n.translate(
                     'xpack.enterpriseSearch.content.index.pipelines.textExpansionCallOut.title',
@@ -87,7 +87,7 @@ export const DeployModel = ({
               >
                 <EuiFlexItem grow={false}>
                   <EuiButton
-                    color="success"
+                    color="primary"
                     data-telemetry-id={`entSearchContent-${ingestionMethod}-pipelines-textExpansionCallOut-deployModel`}
                     disabled={isCreateButtonDisabled}
                     iconType="launch"

diff --git a/...ic/applications/enterprise_search_content/components/search_index/pipelines/pipelines.tsx b/...ic/applications/enterprise_search_content/components/search_index/pipelines/pipelines.tsx
@@ -190,7 +190,7 @@ export const SearchIndexPipelines: React.FC = () => {
               hasIndexIngestionPipeline ? (
                 <EuiFlexGroup alignItems="center" gutterSize="xs" justifyContent="center">
                   <EuiFlexItem grow={false}>
-                    <EuiBadge color="success">
+                    <EuiBadge color="accent">
                       {i18n.translate(
                         'xpack.enterpriseSearch.content.indices.pipelines.ingestionPipeline.customBadge',
                         { defaultMessage: 'Custom' }

diff --git a/...ns/enterprise_search/public/applications/shared/search_labs_banner/search_labs_banner.tsx b/...ns/enterprise_search/public/applications/shared/search_labs_banner/search_labs_banner.tsx
@@ -36,10 +36,11 @@ export const SearchLabsBanner: React.FC = () => {
     <EuiPanel
       hasBorder
       hasShadow
-      color="success"
+      color="accentSecondary"
       css={css`
         background-image: url(${backgroundImagePath});
         background-repeat: no-repeat;
+        background-size: cover;
       `}
     >
       <SearchLabsLogo

diff --git a/..._search/public/applications/shared/tables/inline_editable_table/inline_editable_table.tsx b/..._search/public/applications/shared/tables/inline_editable_table/inline_editable_table.tsx
@@ -140,7 +140,7 @@ export const InlineEditableTableContents = <Item extends ItemWithAnID>({
             iconType="plusInCircle"
             disabled={isEditing}
             onClick={editNewItem}
-            color="success"
+            color="primary"
             data-test-subj="inlineEditableTableActionButton"
           >
             {addButtonText ||

diff --git a/...ns/vector_search/components/dev_tools_console_code_block/dev_tools_console_code_block.tsx b/...ns/vector_search/components/dev_tools_console_code_block/dev_tools_console_code_block.tsx
@@ -39,7 +39,7 @@ export const DevToolsConsoleCodeBlock: React.FC<DevToolsConsoleCodeBlockProps> =
 
   return (
     <EuiThemeProvider colorMode="dark">
-      <EuiPanel hasShadow={false}>
+      <EuiPanel hasShadow={false} hasBorder>
         <EuiFlexGroup direction="column" gutterSize="xs">
           <EuiFlexGroup
             direction="rowReverse"

diff --git a/...agement/public/application/sections/home/index_list/details_page/semantic_text_banner.tsx b/...agement/public/application/sections/home/index_list/details_page/semantic_text_banner.tsx
@@ -57,10 +57,10 @@ export function SemanticTextBanner({
 
   return isSemanticTextBannerDisplayable && isSemanticTextEnabled ? (
     <>
-      <EuiPanel color="success" data-test-subj="indexDetailsMappingsSemanticTextBanner">
+      <EuiPanel color="accentSecondary" data-test-subj="indexDetailsMappingsSemanticTextBanner">
         <EuiFlexGroup>
           <EuiFlexItem>
-            <EuiText size="m" color="success">
+            <EuiText size="m" color="primary">
               {isPlatinumLicense ? platinumLicenseMessage : defaultLicenseMessage}
             </EuiText>
           </EuiFlexItem>

diff --git a/x-pack/plugins/search_notebooks/public/components/notebooks_button.tsx b/x-pack/plugins/search_notebooks/public/components/notebooks_button.tsx
@@ -30,7 +30,7 @@ export const SearchNotebooksButton = ({
   if (activeView) {
     return (
       <EuiButton
-        color="success"
+        color="primary"
         fill
         onClick={onClick}
         size="s"
@@ -47,7 +47,7 @@ export const SearchNotebooksButton = ({
   }
   return (
     <EuiButtonEmpty
-      color="success"
+      color="primary"
       onClick={onClick}
       size="s"
       iconType="documentation"

diff --git a/x-pack/plugins/serverless_search/public/application/components/overview.scss b/x-pack/plugins/serverless_search/public/application/components/overview.scss
@@ -1,7 +1,3 @@
-.serverlessSearchHeaderSection {
-  background-color: $euiColorPrimary;
-}
-
 .serverlessSearchHeaderSection > div {
   padding-bottom: 0;
   padding-top: 0;
@@ -13,4 +9,4 @@
 
 .serverlessSearchCloudDetailsCopyPanel {
   word-break: break-all;
-}
+}
diff --git a/x-pack/plugins/serverless_search/public/application/components/overview.tsx b/x-pack/plugins/serverless_search/public/application/components/overview.tsx
@@ -14,7 +14,6 @@ import {
   EuiIcon,
   EuiPageTemplate,
   EuiPanel,
-  EuiText,
   EuiBadge,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
@@ -96,9 +95,7 @@ export const ElasticsearchOverview = () => {
   return (
     <EuiPageTemplate offset={0} grow restrictWidth data-test-subj="svlSearchOverviewPage">
       <EuiPageTemplate.Section alignment="top" className="serverlessSearchHeaderSection">
-        <EuiText color="ghost">
-          <WelcomeBanner user={user} assetBasePath={assetBasePath} />
-        </EuiText>
+        <WelcomeBanner user={user} assetBasePath={assetBasePath} />
       </EuiPageTemplate.Section>
       <EuiPageTemplate.Section
         color="subdued"