diff --git a/.betterer.results b/.betterer.results
index 788ee0822e2..0cbbf2c2539 100644
--- a/.betterer.results
+++ b/.betterer.results
@@ -4779,11 +4779,7 @@ exports[`better eslint`] = {
     "public/app/features/playlist/PlaylistTableRows.tsx:5381": [
       [0, 0, 0, "No untranslated strings. Wrap text with <Trans />", "0"],
       [0, 0, 0, "No untranslated strings. Wrap text with <Trans />", "1"],
-      [0, 0, 0, "No untranslated strings. Wrap text with <Trans />", "2"],
-      [0, 0, 0, "Styles should be written using objects.", "3"],
-      [0, 0, 0, "Styles should be written using objects.", "4"],
-      [0, 0, 0, "Styles should be written using objects.", "5"],
-      [0, 0, 0, "Styles should be written using objects.", "6"]
+      [0, 0, 0, "No untranslated strings. Wrap text with <Trans />", "2"]
     ],
     "public/app/features/playlist/StartModal.tsx:5381": [
       [0, 0, 0, "No untranslated strings. Wrap text with <Trans />", "0"]
diff --git a/public/app/features/playlist/PlaylistTableRows.tsx b/public/app/features/playlist/PlaylistTableRows.tsx
index 630936b3e90..34de08eec1f 100644
--- a/public/app/features/playlist/PlaylistTableRows.tsx
+++ b/public/app/features/playlist/PlaylistTableRows.tsx
@@ -102,30 +102,31 @@ export const PlaylistTableRows = ({ items, onDelete }: Props) => {
 
 function getStyles(theme: GrafanaTheme2) {
   return {
-    row: css`
-      padding: 6px;
-      background: ${theme.colors.background.secondary};
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      margin-bottom: 3px;
+    row: css({
+      padding: theme.spacing(0.75),
+      background: theme.colors.background.secondary,
+      borderRadius: theme.shape.radius.default,
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'space-between',
+      marginBottom: '3px',
 
-      border: 1px solid ${theme.colors.border.medium};
-      &:hover {
-        border: 1px solid ${theme.colors.border.strong};
-      }
-    `,
-    rightMargin: css`
-      margin-right: 5px;
-    `,
-    actions: css`
-      align-items: center;
-      justify-content: center;
-      display: flex;
-    `,
-    settings: css`
-      label: settings;
-      text-align: right;
-    `,
+      border: `1px solid ${theme.colors.border.medium}`,
+      '&:hover': {
+        border: `1px solid ${theme.colors.border.strong}`,
+      },
+    }),
+    rightMargin: css({
+      marginRight: '5px',
+    }),
+    actions: css({
+      alignItems: 'center',
+      justifyContent: 'center',
+      display: 'flex',
+    }),
+    settings: css({
+      label: 'settings',
+      textAlign: 'right',
+    }),
   };
 }