Remove unnecessary CSS rules and avoid !important priority

eclipse-cdt-cloud · Jun 21, 2024 · f49f2ec · f49f2ec
1 parent fef99db
commit f49f2ec
Showing 1 changed file with 48 additions and 52 deletions.
diff --git a/media/memory-table.css b/media/memory-table.css
@@ -27,8 +27,9 @@
   white-space: nowrap;
 }
 
-.memory-inspector-table .column-data .byte-group.editable:hover {
-/*  border-bottom: 1px dotted var(--vscode-editorHoverWidget-border); */
+.p-datatable :focus-visible {
+  outline-style: dotted;
+  outline-offset: -1px;
 }
 
 /* == MoreMemorySelect == */
@@ -161,28 +162,60 @@
   color: var(--vscode-debugTokenExpression-name);
 }
 
-/* == Data Edit == */
+/* Cell Styles */
 
-.byte-group {
-  font-family: var(--vscode-editor-font-family);
-  margin-right: 2px;
-  padding: 2px 1px; /* we use this padding to balance out the 2px that are needed for the editing */
-  outline-offset: 0px;
+.p-datatable .p-datatable-tbody > tr > td[data-column="address"][role="cell"],
+.p-datatable .p-datatable-tbody > tr > td[data-column="ascii"][role="cell"] {
+  padding: 0;
 }
 
-.byte-group:last-child {
-  margin-right: 0px;
+.p-datatable .p-datatable-tbody > tr > td[data-column="data"][role="cell"],
+.p-datatable .p-datatable-tbody > tr > td[data-column="variables"][role="cell"] {
+  padding: 0 12px;
+  vertical-align: middle;
 }
 
-.p-datatable :focus-visible {
-  outline-style: dotted;
+/* Group Styles */
+
+[role='group']:hover {
+  border-bottom: 0px;
+  color: var(--vscode-list-activeSelectionForeground);
+  outline: 1px solid var(--vscode-list-focusOutline);
+}
+
+[role='group'][data-group-selected='true'] {
+  background: var(--vscode-list-activeSelectionBackground);
+  color: var(--vscode-list-activeSelectionForeground);
+  outline: 1px solid var(--vscode-list-focusOutline);
+}
+
+[data-column="address"][role="group"],
+[data-column="ascii"][role="group"] {
+  padding: 4px 12px;
+  display: flex;
   outline-offset: -1px;
 }
 
-.byte-group:has(> .data-edit) {
+[data-column="data"][role="group"],
+[data-column="variables"][role="group"] {
+  padding: 4px 1px;
+  line-height: 23.5px;
+  outline-offset: -1px;
+}
+
+/* Data Column */
+
+
+/* == Data Edit == */
+
+[data-column="data"][role="group"]:last-child {
+  margin-right: 0px;
+}
+
+[data-column="data"][role="group"]:has(> .data-edit) {
   outline: 1px solid var(--vscode-inputOption-activeBorder);
-  padding-left: 0px !important; /* editing takes two more pixels cause the input field will cut off the characters otherwise. */
-  padding-right: 0px !important; /* editing takes two more pixels cause the input field will cut off the characters otherwise. */
+  padding-left: 0px; /* editing takes two more pixels cause the input field will cut off the characters otherwise. */
+  padding-right: 0px; /* editing takes two more pixels cause the input field will cut off the characters otherwise. */
 }
 
 .data-edit {
@@ -206,41 +239,4 @@
 .p-datatable .p-datatable-tbody > tr > td.p-highlight:has(>.selected) {
   background: transparent;
   outline: none;
-}
-
-[role='group']:hover {
-  border-bottom: 0px;
-  color: var(--vscode-list-activeSelectionForeground);
-  outline: 1px solid var(--vscode-list-focusOutline);
-}
-
-[role='group'][data-group-selected='true'] {
-  background: var(--vscode-list-activeSelectionBackground);
-  color: var(--vscode-list-activeSelectionForeground);
-  outline: 1px solid var(--vscode-list-focusOutline);
-}
-
-[data-column="address"][role="cell"],
-[data-column="ascii"][role="cell"] {
-  padding: 0 !important;
-}
-
-[data-column="address"][role="group"],
-[data-column="ascii"][role="group"] {
-  padding: 4px 12px;
-  display: flex;
-  outline-offset: -1px;
-}
-
-[data-column="data"][role="cell"],
-[data-column="variables"][role="cell"] {
-  padding: 0 12px !important;
-  vertical-align: middle !important;
-}
-
-[data-column="data"][role="group"],
-[data-column="variables"][role="group"] {
-  padding: 4px 1px;
-  line-height: 23.5px;
-  outline-offset: -1px;
 }