From f6a0f923c6544bfcbd9f5a20f7632ff003b51b93 Mon Sep 17 00:00:00 2001
From: Dalia Shaaban <144673861+dshaaban01@users.noreply.github.com>
Date: Fri, 17 Nov 2023 17:14:33 +0000
Subject: [PATCH] interactive : stylistic changes (#1804)

stylistic changes for better code readability
---
 xdsl/interactive/app.py   | 18 ++----------------
 xdsl/interactive/app.tcss |  9 +++++----
 2 files changed, 7 insertions(+), 20 deletions(-)

diff --git a/xdsl/interactive/app.py b/xdsl/interactive/app.py
index 5686abeefa..7feec7592f 100644
--- a/xdsl/interactive/app.py
+++ b/xdsl/interactive/app.py
@@ -9,13 +9,11 @@
 
 from io import StringIO
 
-from rich.style import Style
 from textual import events, on
 from textual.app import App, ComposeResult
 from textual.containers import Horizontal, ScrollableContainer, Vertical
 from textual.reactive import reactive
 from textual.widgets import Button, Footer, Label, ListItem, ListView, TextArea
-from textual.widgets.text_area import TextAreaTheme
 
 from xdsl.dialects.builtin import ModuleOp
 from xdsl.ir import MLContext
@@ -49,16 +47,6 @@ class InputApp(App[None]):
         ("q", "quit_app", "Quit"),
     ]
 
-    # defines a theme for the Input/Output TextArea's
-    _DEFAULT_THEME = TextAreaTheme(
-        name="my_theme_design",
-        base_style=Style(bgcolor="white"),
-        syntax_styles={
-            "string": Style(color="red"),
-            "comment": Style(color="magenta"),
-        },
-    )
-
     current_module = reactive[ModuleOp | Exception | None](None)
     """
     Reactive variable used to save the current state of the modified Input TextArea
@@ -171,10 +159,8 @@ def on_mount(self) -> None:
         """Configure widgets in this application before it is first shown."""
 
         # register's the theme for the Input/Output TextArea's
-        self.input_text_area.register_theme(InputApp._DEFAULT_THEME)
-        self.output_text_area.register_theme(InputApp._DEFAULT_THEME)
-        self.input_text_area.theme = "my_theme_design"
-        self.output_text_area.theme = "my_theme_design"
+        self.input_text_area.theme = "vscode_dark"
+        self.output_text_area.theme = "vscode_dark"
 
         self.query_one("#input_container").border_title = "Input xDSL IR"
         self.query_one("#output_container").border_title = "Output xDSL IR"
diff --git a/xdsl/interactive/app.tcss b/xdsl/interactive/app.tcss
index a197a11f02..6fb3bc74bc 100644
--- a/xdsl/interactive/app.tcss
+++ b/xdsl/interactive/app.tcss
@@ -1,7 +1,7 @@
 # ListView
 #passes_list_view{
     border: heavy $accent-darken-1;
-    border-title-color: $warning-lighten-1;
+    border-title-color: $error-darken-3;
     border-title-style: bold;
     border-title-align: center;
     height: 100%;
@@ -17,7 +17,7 @@
 # ScrollableContainer(Label)
 #selected_passes {
     border: heavy $accent-darken-1;
-    border-title-color: $warning-lighten-1;
+    border-title-color: $error-darken-3;
     border-title-style: bold;
     border-title-align: center;
 }
@@ -25,7 +25,7 @@
 # Vertical(TextArea, Button)
 #input_container {
     border: heavy $accent-darken-1;
-    border-title-color: $warning-lighten-1;
+    border-title-color: $error-darken-3;
     border-title-style: bold;
     border-title-align: center;
 }
@@ -33,7 +33,7 @@
 # Vertical(TextArea, Button)
 #output_container {
     border: heavy $accent-darken-1;
-    border-title-color: $warning-lighten-1;
+    border-title-color: $error-darken-3;
     border-title-style: bold;
     border-title-align: center;
 }
@@ -42,4 +42,5 @@ Screen {
     layout: grid;
     grid-size: 1 2;
     grid-rows: 45% 55%;
+    background: $surface;
 }