refactor: remove separator line and adjust margins

newrelic · Dec 7, 2023 · 91f9d3d · 91f9d3d
1 parent b694838
commit 91f9d3d
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 49 deletions.
diff --git a/nerdlets/status-page-dashboard/main-page.js b/nerdlets/status-page-dashboard/main-page.js
@@ -737,36 +737,33 @@ export default class StatusPagesDashboard extends React.PureComponent {
             placeholder="https://myservice.com/logo.png"
           />
 
-          <div className="proxy-info">
-            <hr className="hr-sep" />
-            {['nrql', 'workload', ''].includes(providerName.inputValue) ? (
-              ''
-            ) : (
-              <>
-                <div className="select-container">
-                  <Checkbox
-                    className="cors-checkbox"
-                    onChange={this.handleCORSChange}
-                    label="Host requires CORS proxy"
-                    defaultChecked={hostRequiresProxy}
+          {['nrql', 'workload'].includes(providerName.inputValue) ? (
+            ''
+          ) : (
+            <div className="select-container">
+              <Checkbox
+                className="cors-checkbox"
+                onChange={this.handleCORSChange}
+                label="Host requires CORS proxy"
+                defaultChecked={hostRequiresProxy}
+              />
+              {hostRequiresProxy && (
+                <>
+                  <label>
+                    CORS proxy address
+                    <span className="mandatory"> * </span>
+                  </label>
+                  <TextFieldWrapper
+                    onChange={(event) => {
+                      this.updateInputValue(event, 'corsProxyAddress');
+                    }}
+                    value={corsProxyAddress.inputValue}
+                    validationText={corsProxyAddress.validationText}
                   />
-                </div>
-                {hostRequiresProxy && (
-                  <div className="select-container">
-                    <TextFieldWrapper
-                      label="CORS proxy address"
-                      onChange={(event) => {
-                        this.updateInputValue(event, 'corsProxyAddress');
-                      }}
-                      value={corsProxyAddress.inputValue}
-                      validationText={corsProxyAddress.validationText}
-                    />
-                  </div>
-                )}
-              </>
-            )}
-          </div>
-
+                </>
+              )}
+            </div>
+          )}
           <Button
             className="modal-button"
             type={Button.TYPE.TERTIARY}

diff --git a/nerdlets/status-page-dashboard/styles.scss b/nerdlets/status-page-dashboard/styles.scss
@@ -1030,26 +1030,8 @@ button[class*='Dropdown-trigger'],
   }
 }
 
-.hr-sep {
-  height: 1px;
-  border: none;
-  background-color: #b9bdbd;
-  margin-top: 10px;
-
-  &:before {
-    width: 30px;
-    color: #8e9494;
-    bottom: 8px;
-  }
-}
-
-.proxy-info {
-  height: 140px;
-  margin: 5px 0;
-
-  .cors-checkbox {
-    margin-top: 10px;
-  }
+.cors-checkbox {
+  margin: 10px 0 16px;
 }
 
 .rss-icon-container {