First Stylesheet and Invalid Cells Updating when changing layout (#67)

* Move coloring alongside row_deletion, column_deleton and copy/paste

* Added some catches for adding values

* added stylesheet

* moved background color to stylesheet

Author: PaulJonasJost

src/petab_gui/app.py

@@ -12,7 +12,6 @@
 from pathlib import Path
 
 
-
 def find_example(path: Path) -> Path:
     while path.parent != path:
         if (path / "example").is_dir():
@@ -26,11 +25,8 @@ class PEtabGuiApp(QApplication):
     def __init__(self):
         super().__init__(sys.argv)
 
-        # no need to instantiate a PEtab problem, as we are not using it
-        # 
-        # petab_problem = petab.Problem.from_yaml(
-        #     find_example(Path(__file__).parent) / "problem.yaml"
-        # )
+        # Load the styleshee
+        self.apply_stylesheet()
         self.model = PEtabModel()
         self.view = MainWindow()
         self.controller = MainController(self.view, self.model)
@@ -50,6 +46,17 @@ def event(self, event):
 
         return super().event(event)
 
+    def apply_stylesheet(self):
+        """Load and apply the QSS stylesheet."""
+        stylesheet_path = os.path.join(
+            os.path.dirname(__file__), "stylesheet.css"
+        )
+        if os.path.exists(stylesheet_path):
+            with open(stylesheet_path, "r") as f:
+                self.setStyleSheet(f.read())
+        else:
+            print(f"Warning: Stylesheet '{stylesheet_path}' not found!")
+
 
 def main():
     app = PEtabGuiApp()

src/petab_gui/controllers/logger_controller.py

@@ -16,8 +16,9 @@ def __init__(self, views):
             The view of the logger widget.
         """
         self.views = views
+        self.logger_level = 1
 
-    def log_message(self, message, color="black"):
+    def log_message(self, message, color="black", loglevel=1):
         """Log a message to the logger.
 
         Parameters
@@ -27,6 +28,8 @@ def log_message(self, message, color="black"):
         color: str
             The color of the message. Default is black.
         """
+        if loglevel > self.logger_level:
+            return
         timestamp = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
         full_message = \
             f"[{timestamp}]\t <span style='color: {color};'>{message}</span>"

src/petab_gui/models/pandas_table_model.py

@@ -52,10 +52,7 @@ def data(self, index, role=Qt.DisplayRole):
                 return ""
             return str(value)
         elif role == Qt.BackgroundRole:
-            if (row, column) in self._invalid_cells:
-                return QColor(Qt.red)
-            if (row, column) == (self._data_frame.shape[0], 0):
-                return QColor(144, 238, 144, 150)
+            return self.determine_background_color(row, column)
         return None
 
     def flags(self, index):
@@ -395,6 +392,22 @@ def maybe_add_rows(self, start_row, n_rows):
             )
             self.layoutChanged.emit()
 
+    def determine_background_color(self, row, column):
+        """Determine the background color of a cell.
+
+        1. If it is the first column and last row, return light green.
+        2. If it is an invalid cell, return red
+        3. If it is an even row return light blue
+        4. Otherwise return light green
+        """
+        if (row, column) == (self._data_frame.shape[0], 0):
+            return QColor(144, 238, 144, 150)
+        if (row, column) in self._invalid_cells:
+            return QColor(255, 100, 100, 150)
+        if row % 2 == 0:
+            return QColor(144, 190, 109, 102)
+        return QColor(177, 217, 231, 102)
+
 
 class IndexedPandasTableModel(PandasTableModel):
     """Table model for tables with named index."""
@@ -475,10 +488,7 @@ def data(self, index, role=Qt.DisplayRole):
                 return ""
             return str(value)
         elif role == Qt.BackgroundRole:
-            if (row, column) in self._invalid_cells:
-                return QColor(Qt.red)
-            if (row, column) == (self._data_frame.shape[0], 0):
-                return QColor(144, 238, 144, 150)
+            return self.determine_background_color(row, column)
         return None
 
     def headerData(self, section, orientation, role=Qt.DisplayRole):

src/petab_gui/stylesheet.css

@@ -0,0 +1,141 @@
+/* 🌟 Light Mode */
+QWidget {
+    background-color: #f8f9fa;  /* Soft background */
+    color: #333;  /* Dark text */
+    font-family: "Arial", sans-serif;
+}
+
+/* Dark Mode */
+QWidget[darkMode="true"] {
+    background-color: #2b2b2b;
+    color: #f8f9fa;
+}
+
+/* 🌟 Ensure alternate row colors but allow BackgroundRole */
+QTableView {
+    background: transparent; /* Keep the overall table background transparent */
+    border: none;
+    border-radius: 10px;
+    padding: 5px;
+    gridline-color: transparent;
+}
+
+/* 🎨 Restore table header style */
+QHeaderView::section {
+    background-color: #d5dcef;
+    font-weight: bold;
+    border: none;
+    padding: 6px;
+    border-radius: 5px;
+}
+
+/* 🚀 Selection should remain visible */
+QTableView::item:selected {
+    background-color: rgba(122, 93, 204, 0.2);
+    color: white;
+    border: none;
+}
+
+/* Fix cell editing */
+QTableView::item:selected:active {
+    background-color: rgba(122, 93, 204, 0.6);
+    color: white;
+    border: none;
+    outline: none;
+}
+
+QTableView QLineEdit {
+    background-color: white;
+    color: black;
+    padding: 3px;
+    border: 2px solid #7A5DCC;
+    border-radius: 5px;
+}
+
+
+QMenuBar {
+    background-color: #dee2e6; /* Soft gray */
+    padding: 6px;
+}
+
+QMenuBar::item {
+    background-color: transparent;
+    padding: 8px 16px;
+    border-radius: 5px;
+}
+
+/* Hover Effect */
+QMenuBar::item:selected {
+    background-color: #7A5DCC; /* Purple */
+    color: white;
+}
+
+/* Menu Items */
+QMenu {
+    background-color: white;
+    border: 1px solid #ccc;
+}
+
+QMenu::item {
+    padding: 8px 12px;
+}
+
+QMenu::item:selected {
+    background-color: #7A5DCC; /* Purple hover */
+    color: white;
+}
+/* Rounded Buttons */
+QPushButton {
+    background-color: #d5e8d4; /* Light green */
+    color: black;
+    border-radius: 15px;
+    padding: 8px 16px;
+    border: 2px solid transparent;
+}
+
+/* Button Hover */
+QPushButton:hover {
+    background-color: #b7e1b5; /* Slightly darker green */
+}
+
+/* Input Fields */
+QLineEdit, QTextEdit {
+    background-color: white;
+    border: 2px solid #ccc;
+    border-radius: 10px;
+    padding: 6px;
+}
+
+/* Selected Input */
+QLineEdit:focus, QTextEdit:focus {
+    border: 2px solid #7A5DCC; /* Purple border when focused */
+}
+
+/* 🌟 Rounded Dock Widgets */
+QDockWidget {
+    background-color: #eef1f6; /* Light grayish-blue */
+    border-radius: 10px;
+    border: 1px solid #ccc;
+}
+
+/* 🌟 Dock Title Styling */
+QDockWidget::title {
+    background-color: #d5dcef; /* Soft blue */
+    padding: 5px;
+    border-top-left-radius: 10px;
+    border-top-right-radius: 10px;
+    font-weight: bold;
+}
+
+/* 🌟 Hover effect for close button */
+QDockWidget::close-button {
+    border: none;
+    background: transparent;
+}
+
+/* Change close button color on hover */
+QDockWidget::close-button:hover {
+    background-color: #ffcccc; /* Light red */
+    border-radius: 5px;
+}
+

src/petab_gui/views/main_view.py

@@ -116,6 +116,7 @@ def __init__(self):
 
         # drag drop
         self.setAcceptDrops(True)
+        # self.dumpObjectTree()
 
 
     def dragEnterEvent(self, event):

src/petab_gui/views/table_view.py

@@ -24,6 +24,7 @@ def __init__(self, title, parent=None):
         layout.addWidget(self.table_view)
         # Dictionary to store column-specific completers
         self.completers = {}
+        self.table_view.setAlternatingRowColors(True)
 
     def copy_to_clipboard(self):
         selected_rect, rect_start = get_selected_rectangles(