gui: more colors and add spoilers

alacritty_config_gui.py

@@ -88,6 +88,77 @@ class FontSelect(QtWidgets.QPushButton):
         }
 
 
+class Spoiler(QtWidgets.QWidget):
+    def __init__(self, title):
+        super().__init__()
+        self.toggle = QtWidgets.QToolButton()
+        self.toggle.setStyleSheet("QToolButton { border: none; }")
+        self.toggle.setToolButtonStyle(QtCore.Qt.ToolButtonTextBesideIcon)
+        self.toggle.setArrowType(QtCore.Qt.ArrowType.RightArrow)
+        self.toggle.setText(title)
+        self.toggle.setCheckable(True)
+        self.toggle.setChecked(False)
+
+        self.header = QtWidgets.QFrame()
+        self.header.setFrameShape(QtWidgets.QFrame.HLine)
+        self.header.setFrameShadow(QtWidgets.QFrame.Sunken)
+        self.header.setSizePolicy(
+            QtWidgets.QSizePolicy.Expanding, QtWidgets.QSizePolicy.Maximum
+        )
+
+        self.content = QtWidgets.QScrollArea()
+        self.content.setStyleSheet("""
+            QScrollArea { border: none; background-color: transparent; }
+        """)
+        self.content.setSizePolicy(
+            QtWidgets.QSizePolicy.Expanding, QtWidgets.QSizePolicy.Fixed
+        )
+        self.content.setMaximumHeight(0)
+        self.content.setMinimumHeight(0)
+        self.animation = QtCore.QParallelAnimationGroup()
+        self.animation.addAnimation(
+            QtCore.QPropertyAnimation(self, b"minimumHeight")
+        )
+        self.animation.addAnimation(
+            QtCore.QPropertyAnimation(self, b"maximumHeight")
+        )
+        self.animation.addAnimation(
+            QtCore.QPropertyAnimation(self.content, b"maximumHeight")
+        )
+        self.layout = QtWidgets.QGridLayout()
+        self.layout.addWidget(self.toggle, 0, 0, 1, 1, QtCore.Qt.AlignLeft)
+        self.layout.addWidget(self.header, 0, 2, 1, 1)
+        self.layout.addWidget(self.content, 1, 0, 1, 3)
+        self.layout.setContentsMargins(0, 0, 0, 0)
+        self.setLayout(self.layout)
+        self.toggle.clicked.connect(self.update_state)
+
+    def update_state(self, checked):
+        self.toggle.setArrowType(
+            QtCore.Qt.ArrowType.DownArrow if checked
+            else QtCore.Qt.ArrowType.RightArrow
+        )
+        self.animation.setDirection(
+            QtCore.QAbstractAnimation.Forward if checked
+            else QtCore.QAbstractAnimation.Backward
+        )
+        self.animation.start()
+
+    def set_layout(self, layout):
+        self.content.setLayout(layout)
+        collapsed_height = self.sizeHint().height() - self.content.maximumHeight()
+        content_height = layout.sizeHint().height()
+        for i in range(self.animation.animationCount()-1):
+            animation = self.animation.animationAt(i)
+            animation.setDuration(300)
+            animation.setStartValue(collapsed_height)
+            animation.setEndValue(collapsed_height + content_height)
+        last = self.animation.animationAt(self.animation.animationCount() - 1)
+        last.setDuration(30)
+        last.setStartValue(0)
+        last.setEndValue(content_height)
+
+
 class ConfigWidget(QtWidgets.QWidget):
     def __init__(self):
         super().__init__()
@@ -104,22 +175,18 @@ class ConfigWidget(QtWidgets.QWidget):
 
     def render_section(self, widgets, sup=None, name=None):
         layout = QtWidgets.QVBoxLayout()
+        for wname, widget in widgets.items():
+            if type(widget) is dict:
+                self.render_section(widget, layout, wname)
+            else:
+                self.render_item(layout, wname, widget)
 
         if name and sup is not None:
             layout.setContentsMargins(10, 0, 0, 0)
-            label = QtWidgets.QLabel(self.prettify(name))
+            spoiler = Spoiler(self.prettify(name))
-            font = label.font()
+            spoiler.set_layout(layout)
-            font.setBold(True)
+            sup.addWidget(spoiler)
-            label.setFont(font)
 
-            sup.addWidget(label)
-
-        for name, widget in widgets.items():
-            if type(widget) is dict:
-                sub_layout = self.render_section(widget, layout, name)
-                layout.addLayout(sub_layout)
-            else:
-                self.render_item(layout, name, widget)
         layout.setAlignment(QtCore.Qt.AlignTop)
         return layout
 
@@ -188,6 +255,10 @@ class Font(ConfigWidget):
         glyph_offset_x.setValue(config.get('glyph_offset', {}).get('x'))
         glyph_offset_y = QtWidgets.QSpinBox()
         glyph_offset_y.setValue(config.get('glyph_offset', {}).get('y'))
+        offset_x = QtWidgets.QSpinBox()
+        offset_x.setValue(config.get('offset', {}).get('x'))
+        offset_y = QtWidgets.QSpinBox()
+        offset_y.setValue(config.get('offset', {}).get('y'))
         scale_with_dpi = QtWidgets.QCheckBox()
         scale_with_dpi.setChecked(config.get('scale_with_dpi'))
         size = QtWidgets.QDoubleSpinBox()
@@ -212,6 +283,10 @@ class Font(ConfigWidget):
                 'x': glyph_offset_x,
                 'y': glyph_offset_y,
             },
+            'offset': {
+                'x': offset_x,
+                'y': offset_y,
+            },
             'normal': normal,
             'italic': italic,
             'bold': bold,
@@ -238,30 +313,32 @@ class Colors(ConfigWidget):
             config.get('cursor', {}).get('text')
         )
 
-        normal_black = ColorSelect(
+        normal_black = ColorSelect(config.get('normal', {}).get('black'))
-            config.get('normal', {}).get('black')
+        normal_blue = ColorSelect(config.get('normal', {}).get('blue'))
-        )
+        normal_cyan = ColorSelect(config.get('normal', {}).get('cyan'))
-        normal_blue = ColorSelect(
+        normal_green = ColorSelect(config.get('normal', {}).get('green'))
-            config.get('normal', {}).get('blue')
+        normal_magenta = ColorSelect(config.get('normal', {}).get('magenta'))
-        )
+        normal_red = ColorSelect(config.get('normal', {}).get('red'))
-        normal_cyan = ColorSelect(
+        normal_white = ColorSelect(config.get('normal', {}).get('white'))
-            config.get('normal', {}).get('cyan')
+        normal_yellow = ColorSelect(config.get('normal', {}).get('yellow'))
-        )
+
-        normal_green = ColorSelect(
+        bright_black = ColorSelect(config.get('bright', {}).get('black'))
-            config.get('normal', {}).get('green')
+        bright_blue = ColorSelect(config.get('bright', {}).get('blue'))
-        )
+        bright_cyan = ColorSelect(config.get('bright', {}).get('cyan'))
-        normal_magenta = ColorSelect(
+        bright_green = ColorSelect(config.get('bright', {}).get('green'))
-            config.get('normal', {}).get('magenta')
+        bright_magenta = ColorSelect(config.get('bright', {}).get('magenta'))
-        )
+        bright_red = ColorSelect(config.get('bright', {}).get('red'))
-        normal_red = ColorSelect(
+        bright_white = ColorSelect(config.get('bright', {}).get('white'))
-            config.get('normal', {}).get('red')
+        bright_yellow = ColorSelect(config.get('bright', {}).get('yellow'))
-        )
+
-        normal_white = ColorSelect(
+        dim_black = ColorSelect(config.get('dim', {}).get('black'))
-            config.get('normal', {}).get('white')
+        dim_blue = ColorSelect(config.get('dim', {}).get('blue'))
-        )
+        dim_cyan = ColorSelect(config.get('dim', {}).get('cyan'))
-        normal_yellow = ColorSelect(
+        dim_green = ColorSelect(config.get('dim', {}).get('green'))
-            config.get('normal', {}).get('yellow')
+        dim_magenta = ColorSelect(config.get('dim', {}).get('magenta'))
-        )
+        dim_red = ColorSelect(config.get('dim', {}).get('red'))
+        dim_white = ColorSelect(config.get('dim', {}).get('white'))
+        dim_yellow = ColorSelect(config.get('dim', {}).get('yellow'))
 
         self.widgets = {
             'primary': {
@@ -282,6 +359,26 @@ class Colors(ConfigWidget):
                 'white': normal_white,
                 'yellow': normal_yellow,
             },
+            'bright': {
+                'black': bright_black,
+                'blue': bright_blue,
+                'cyan': bright_cyan,
+                'green': bright_green,
+                'magenta': bright_magenta,
+                'red': bright_red,
+                'white': bright_white,
+                'yellow': bright_yellow,
+            },
+            'dim': {
+                'black': dim_black,
+                'blue': dim_blue,
+                'cyan': dim_cyan,
+                'green': dim_green,
+                'magenta': dim_magenta,
+                'red': dim_red,
+                'white': dim_white,
+                'yellow': dim_yellow,
+            },
         }
 
         self.render_state()