css finetuning

Azure · Jul 18, 2024 · ab1e6b2 · ab1e6b2
1 parent 0790501
commit ab1e6b2
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 10 deletions.
diff --git a/webview-ui/src/ClusterProperties/ClusterDisplay.tsx b/webview-ui/src/ClusterProperties/ClusterDisplay.tsx
@@ -63,15 +63,13 @@ export function ClusterDisplay(props: ClusterDisplayProps) {
 
     const supportedPatchVersions = props.clusterInfo.supportedVersions.flatMap((v) => v.patchVersions);
     const isSupported = supportedPatchVersions.includes(props.clusterInfo.kubernetesVersion);
-    console.log("capabilities array", props.clusterInfo.supportedVersions);
-    console.log("capabilities array length", props.clusterInfo.supportedVersions[3].capabilities.length);
 
     return (
         <dl className={styles.propertyList}>
             <dt>Provisioning State</dt>
             <dd>
                 {props.clusterInfo.provisioningState}
-                <div style={{ marginBottom: "10px", marginLeft: "126px", marginTop: "5px" }}>
+                <div className={styles.buttonDiv}>
                     {showAbortButton && (
                         <>
                             &nbsp;
@@ -118,7 +116,7 @@ export function ClusterDisplay(props: ClusterDisplayProps) {
                         </VSCodeLink>
                     </span>
                 </span>
-                <div style={{ marginBottom: "10px", marginLeft: "126px", marginTop: "5px" }}>
+                <div className={styles.buttonDiv}>
                     {startStopState === "Started" && (
                         <VSCodeButton
                             disabled={props.clusterOperationRequested}
@@ -151,7 +149,7 @@ export function ClusterDisplay(props: ClusterDisplayProps) {
             <dd>
                 {props.clusterInfo.kubernetesVersion} {isSupported ? "" : "(Out of support)"}
                 &nbsp;
-                <ClusterDisplayToolTip clusterInfo={props.clusterInfo} ></ClusterDisplayToolTip>
+                <ClusterDisplayToolTip clusterInfo={props.clusterInfo}></ClusterDisplayToolTip>
             </dd>
         </dl>
     );

diff --git a/webview-ui/src/ClusterProperties/ClusterDisplayToolTip.tsx b/webview-ui/src/ClusterProperties/ClusterDisplayToolTip.tsx
@@ -11,7 +11,7 @@ export function ClusterDisplayToolTip(props: ClusterDisplayToolTipProps) {
         <span className={styles.tooltip}>
             <span className={styles.infoIndicator}>
                 <div className="icon">
-                    <i className="codicon codicon-info"></i>
+                    <i className="codicon codicon-info" aria-label="info icon using vscode icons"></i>
                 </div>
             </span>
             <span className={styles.tooltiptext}>

diff --git a/webview-ui/src/ClusterProperties/ClusterProperties.module.css b/webview-ui/src/ClusterProperties/ClusterProperties.module.css
@@ -49,11 +49,11 @@
     visibility: visible;
 }
 
-.secondaryButton {
-    margin-left: 25px;
-}
-
 th:not(:last-child),
 td:not(:last-child) {
     padding-right: 6px; /* Adds space to the right except for the last <th> and <td> in each row */
 }
+
+.buttonDiv {
+    margin: 0.3125rem 0 0.625rem 7.875rem;
+}