Fix styles in deploy new agent section (#4838)

* redhat7 version * styles deploy new agent section * rearranged styles * rearranged styles * CHANGELOG
wazuh · Nov 10, 2022 · 6fb45d5 · 6fb45d5
1 parent a4617d3
commit 6fb45d5
Show file tree

Hide file tree

Showing 6 changed files with 34 additions and 36 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -33,7 +33,7 @@ commands of Start the agent in the deploy new agent section [#4458](https://gith
 - Improved the message displayed when there is a versions mismatch between the Wazuh API and the Wazuh APP [#4529](https://github.com/wazuh/wazuh-kibana-app/pull/4529)
 - Changed the endpoint that updates the plugin configuration to support multiple settings. [#4501](https://github.com/wazuh/wazuh-kibana-app/pull/4501)
 - Allowed to upload an image for the `customization.logo.*` settings in `Settings/Configuration` [#4504](https://github.com/wazuh/wazuh-kibana-app/pull/4504)
-- Fixed the OS styles and their versions. [#4832](https://github.com/wazuh/wazuh-kibana-app/pull/4832)
+- Fixed the agents wizard OS styles and their versions. [#4832](https://github.com/wazuh/wazuh-kibana-app/pull/4832) [#4838](https://github.com/wazuh/wazuh-kibana-app/pull/4838/files)
 
 ### Fixed
 

diff --git a/public/controllers/agent/components/agents-preview.scss b/public/controllers/agent/components/agents-preview.scss
@@ -32,9 +32,6 @@
   padding-bottom: 12px;
 }
 
-.p-30 {
-}
-
 .loading-chart-xl {
   display: block;
   text-align: center;
@@ -102,4 +99,4 @@
   .euiListGroupItem__label{
     white-space: normal;
   }
-}
+}
diff --git a/public/controllers/agent/components/register-agent.js b/public/controllers/agent/components/register-agent.js
@@ -42,6 +42,7 @@ import { UI_ERROR_SEVERITIES } from '../../../react-services/error-orchestrator/
 import { getErrorOrchestrator } from '../../../react-services/common-services';
 import { webDocumentationLink } from '../../../../common/services/web_documentation';
 import { architectureButtons, architectureButtonsi386, architecturei386Andx86_64, versionButtonsRaspbian, versionButtonsSuse, versionButtonsOracleLinux, versionButtonFedora, architectureButtonsSolaris, architectureButtonsWithPPC64LE, architectureButtonsOpenSuse, architectureButtonsAix, architectureButtonsHpUx, versionButtonAmazonLinux, versionButtonsRedHat, versionButtonsCentos, architectureButtonsMacos, osButtons, versionButtonsDebian, versionButtonsUbuntu, versionButtonsWindows, versionButtonsMacOS, versionButtonsOpenSuse, versionButtonsSolaris, versionButtonsAix, versionButtonsHPUX } from '../wazuh-config'
+import './register-agent.scss'
 
 export const RegisterAgent = withErrorBoundary(
 
@@ -1039,7 +1040,7 @@ export const RegisterAgent = withErrorBoundary(
             options={options}
             idSelected={idSelected}
             onChange={onChange}
-            className={'flex'} />
+            className={'wz-flex'} />
         )
       }
 
@@ -1052,24 +1053,24 @@ export const RegisterAgent = withErrorBoundary(
               options={options}
               idSelected={idSelected}
               onChange={onChange}
-              className={'flex'}
+              className={'wz-flex'}
             />
-            {this.state.selectedVersion == 'solaris10' || this.state.selectedVersion == 'solaris11' ? <EuiCallOut color="warning" className='message' iconType="iInCircle" title={
+            {this.state.selectedVersion == 'solaris10' || this.state.selectedVersion == 'solaris11' ? <EuiCallOut color="warning" className='wz-callout-message' iconType="iInCircle" title={
               <span>
                 Might require some extra installation <EuiLink target="_blank" href={webDocumentationLink('installation-guide/wazuh-agent/wazuh-agent-package-solaris.html', appVersionMajorDotMinor)}>steps</EuiLink>.
               </span>
             }>
-            </EuiCallOut> : this.state.selectedVersion == '6.1 TL9' ? <EuiCallOut color="warning" className='message' iconType="iInCircle" title={
+            </EuiCallOut> : this.state.selectedVersion == '6.1 TL9' ? <EuiCallOut color="warning" className='wz-callout-message' iconType="iInCircle" title={
               <span>
                 Might require some extra installation <EuiLink target="_blank" href={webDocumentationLink('installation-guide/wazuh-agent/wazuh-agent-package-aix.html', appVersionMajorDotMinor)}>steps</EuiLink>.
               </span>
             }>
-            </EuiCallOut> : this.state.selectedVersion == '11.31' ? <EuiCallOut color="warning" className='message' iconType="iInCircle" title={
+            </EuiCallOut> : this.state.selectedVersion == '11.31' ? <EuiCallOut color="warning" className='wz-callout-message' iconType="iInCircle" title={
               <span>
                 Might require some extra installation <EuiLink target="_blank" href={webDocumentationLink('installation-guide/wazuh-agent/wazuh-agent-package-hpux.html', appVersionMajorDotMinor)}>steps</EuiLink>.
               </span>
             }>
-            </EuiCallOut> : this.state.selectedVersion == 'debian7' || this.state.selectedVersion == 'debian8' || this.state.selectedVersion == 'debian9' || this.state.selectedVersion == 'debian10' ? <EuiCallOut color="warning" className='message' iconType="iInCircle" title={
+            </EuiCallOut> : this.state.selectedVersion == 'debian7' || this.state.selectedVersion == 'debian8' || this.state.selectedVersion == 'debian9' || this.state.selectedVersion == 'debian10' ? <EuiCallOut color="warning" className='wz-callout-message' iconType="iInCircle" title={
               <span>
                 Might require some extra installation <EuiLink target="_blank" href={webDocumentationLink('installation-guide/wazuh-agent/wazuh-agent-package-linux.html', appVersionMajorDotMinor)}>steps</EuiLink>.
               </span>

diff --git a/public/controllers/agent/components/register-agent.scss b/public/controllers/agent/components/register-agent.scss
@@ -0,0 +1,14 @@
+.registerAgent{
+  min-height: calc(100vh - 100px);
+  background: #fafbfd;
+  .euiButtonGroup__buttons {
+    display: grid;
+    grid-template-columns: repeat(5, 1fr);
+    grid-gap: 10px;
+    padding: 0 3px;
+    box-shadow: none;
+  }
+  .euiButtonGroup--medium .euiButtonGroupButton:not(:first-child), .euiButtonGroup--small .euiButtonGroupButton:not(:first-child) {
+      margin-left: 0 !important;
+  }
+}
diff --git a/public/styles/common.scss b/public/styles/common.scss
@@ -1802,4 +1802,14 @@ iframe.width-changed {
   .euiButtonEmpty__text {
     font-size: 0.8rem;
   }
-} 
+}
+
+.wz-flex {
+    display: flex;
+}
+
+.wz-callout-message {
+    margin-top: 10px;
+    display: flex;
+    flex-direction: row;
+}
diff --git a/public/styles/component.scss b/public/styles/component.scss
@@ -119,27 +119,3 @@ kbn-dis doc-table .kbnDocViewer__warning {
 .header__breadcrumbsWithExtensionContainer .header__breadcrumbsAppendExtension {
     flex-grow: 0;
 }
-
-.flex {
-    display: flex;
-}
-
-.euiButtonGroup__buttons {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    grid-template-columns: repeat(5, 1fr);
-    grid-gap: 10px;
-    padding: 0 3px;
-    box-shadow: none;
-}
-
-.message {
-    margin-top: 10px;
-    display: flex;
-    flex-direction: row;
-}
-
-.euiButtonGroup--medium .euiButtonGroupButton:not(:first-child), .euiButtonGroup--small .euiButtonGroupButton:not(:first-child) {
-    margin-left: 0 !important;
-
-}