refactor(frontend): update theme

4 files changed, 8 insertions, 5 deletions

diff --git a/subprojects/frontend/src/editor/EditorButtons.tsx b/subprojects/frontend/src/editor/EditorButtons.tsx
index bed6afa8..735531e8 100644
--- a/subprojects/frontend/src/editor/EditorButtons.tsx
+++ b/subprojects/frontend/src/editor/EditorButtons.tsx
@@ -53,7 +53,7 @@ function EditorButtons(): JSX.Element {
       >
         <RedoIcon fontSize="small" />
       </IconButton>
-      <ToggleButtonGroup size="small" sx={{ mx: 1 }}>
+      <ToggleButtonGroup size="small" className="rounded" sx={{ mx: 1 }}>
         <ToggleButton
           selected={editorStore.showLineNumbers}
           onClick={() => editorStore.toggleLineNumbers()}
diff --git a/subprojects/frontend/src/editor/EditorTheme.ts b/subprojects/frontend/src/editor/EditorTheme.ts
index fe5ba58e..d8680070 100644
--- a/subprojects/frontend/src/editor/EditorTheme.ts
+++ b/subprojects/frontend/src/editor/EditorTheme.ts
@@ -95,7 +95,8 @@ export default styled('div', {
       fontStyle: 'italic',
     },
     '.tok-problem-containment': {
-      fontWeight: 700,
+      fontWeight: theme.typography.fontWeightBold,
+      textDecorationSkipInk: 'none',
     },
     '.tok-problem-error': {
       '&, & .tok-typeName': {
@@ -278,7 +279,7 @@ export default styled('div', {
           '&[aria-selected="true"]': {
             color: theme.palette.text.primary,
             background: 'transparent',
-            fontWeight: 700,
+            fontWeight: theme.typography.fontWeightMedium,
           },
           ':hover': {
             background: alpha(
diff --git a/subprojects/frontend/src/editor/GenerateButton.tsx b/subprojects/frontend/src/editor/GenerateButton.tsx
index 14258723..4b998af6 100644
--- a/subprojects/frontend/src/editor/GenerateButton.tsx
+++ b/subprojects/frontend/src/editor/GenerateButton.tsx
@@ -24,8 +24,9 @@ function GenerateButton(): JSX.Element {
     return (
       <Button
         aria-label={`Select next diagnostic out of ${summary}`}
-        color="error"
         onClick={() => editorStore.nextDiagnostic()}
+        color="error"
+        className="rounded"
       >
         {summary}
       </Button>
@@ -35,6 +36,7 @@ function GenerateButton(): JSX.Element {
   return (
     <Button
       color={warningCount > 0 ? 'warning' : 'primary'}
+      className="rounded"
       startIcon={<PlayArrowIcon />}
     >
       {summary === '' ? GENERATE_LABEL : `${GENERATE_LABEL} (${summary})`}
diff --git a/subprojects/frontend/src/editor/SearchToolbar.tsx b/subprojects/frontend/src/editor/SearchToolbar.tsx
index a5925328..45f1336d 100644
--- a/subprojects/frontend/src/editor/SearchToolbar.tsx
+++ b/subprojects/frontend/src/editor/SearchToolbar.tsx
@@ -181,7 +181,7 @@ function SearchToolbar({ store }: { store: SearchPanelStore }): JSX.Element {
                 aria-label="Show replace options"
                 aria-controls={replaceId}
                 size="small"
-                sx={{ borderRadius: '100%' }}
+                className="iconOnly"
               >
                 <FindReplaceIcon fontSize="small" />
               </ToggleButton>