Swap out editable border to outline to align corner triangle

jpmorganchase · Apr 4, 2024 · d64a9df · d64a9df
1 parent 0043f91
commit d64a9df
Showing 1 changed file with 3 additions and 8 deletions.
diff --git a/packages/ag-grid-theme/css/salt-ag-grid-theme.css b/packages/ag-grid-theme/css/salt-ag-grid-theme.css
@@ -211,25 +211,21 @@ div[class*="ag-theme-salt"] .ag-cell {
 
 div[class*="ag-theme-salt"] .ag-cell.editable-cell,
 div[class*="ag-theme-salt"] .ag-cell.editable-numeric-cell {
-  border: var(--salt-size-border) var(--salt-container-borderStyle) var(--salt-editable-borderColor);
+  outline: var(--salt-size-border) var(--salt-container-borderStyle) var(--salt-editable-borderColor);
+  outline-offset: -1px;
   justify-content: flex-end;
 }
 div[class*="ag-theme-salt"] .ag-cell.numeric-cell {
   justify-content: flex-end;
 }
-div[class*="ag-theme-salt"] .ag-has-focus .ag-cell.editable-cell:focus,
-div[class*="ag-theme-salt"] .ag-has-focus .editable-numeric-cell:focus {
-  border: var(--salt-size-border) var(--salt-container-borderStyle) transparent;
-}
 div[class*="ag-theme-salt"] .ag-has-focus .ag-cell.ag-cell-focus,
 div[class*="ag-theme-salt"] .ag-context-menu-open .ag-cell.ag-cell-focus:not(.ag-cell-range-selected),
 div[class*="ag-theme-salt"] .ag-cell-range-single-cell,
 div[class*="ag-theme-salt"] .ag-cell-range-single-cell.ag-cell-range-handle,
 div[class*="ag-theme-salt"] .ag-cell-focus:not(.ag-cell-range-selected):focus-within {
   outline: var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--salt-focused-outlineColor);
   outline-offset: -2px;
-  /* !important is needed with default `.ag-cell-inline-editing` has it to override color */
-  border: var(--salt-size-border) var(--salt-container-borderStyle) transparent !important;
+  border-width: 0;
 }
 
 div[class*="ag-theme-salt"] .ag-cell-wrapper.ag-row-group {
@@ -254,7 +250,6 @@ div[class*="ag-theme-salt"] .editable-cell.ag-cell-inline-editing:before {
   position: absolute;
   top: 0px;
   z-index: 2;
-  transform: translate(-1px, -1px);
 }
 
 div[class*="ag-theme-salt"] .editable-cell.ag-cell-inline-editing {