feat(css): add important stylesheet variants

.github/workflows/gh-pages.yaml

@@ -16,7 +16,7 @@ jobs:
       - uses: "actions/setup-node@v4"
         with:
           node-version: "latest"
-      - run: "pip install catppuccin[pygments]"
+      - run: "pip install catppuccin[pygments,gh-pages]"
       - run: "scripts/build-gh-pages"
       - run: "npx lightningcss-cli --minify ./gh-pages/pygments/*.css --output-dir ./gh-pages/pygments/"
       - uses: "peaceiris/actions-gh-pages@v3"

.gitignore

@@ -15,3 +15,6 @@ __pycache__/
 .coverage
 coverage.xml
 htmlcov
+
+# gh-pages build script output
+/gh-pages

pyproject.toml

@@ -19,10 +19,12 @@ catppuccin-mocha = "catppuccin.extras.pygments:MochaStyle"
 python = "^3.8.0"
 pygments = { version = "^2.17.2", optional = true }
 rich = { version = "^13.7.0", optional = true }
+tinycss2 = { version = "^1.2.1", optional = true }
 
 [tool.poetry.extras]
 pygments = ["pygments"]
 rich = ["rich"]
+gh-pages = ["tinycss2"]
 
 [tool.poetry.group.dev.dependencies]
 mypy = "^1.8.0"
@@ -58,7 +60,4 @@ ignore = [
 strict = true
 
 [tool.coverage.report]
-exclude_lines = [
-  "pragma: no cover",
-  "if TYPE_CHECKING:",
-]
+exclude_lines = ["pragma: no cover", "if TYPE_CHECKING:"]

scripts/build-gh-pages

@@ -1,7 +1,7 @@
 #!/usr/bin/env python
-import re
 from pathlib import Path
 
+import tinycss2
 from pygments.formatters.html import HtmlFormatter
 
 from catppuccin import PALETTE
@@ -23,16 +23,32 @@ PYGMENTS_STYLES = {
 }
 
 
-PADDING_PAT = re.compile(r" padding-(?:left|right): \d+px;")
-
-
 def write(content: str, path: Path) -> None:
     path.parent.mkdir(parents=True, exist_ok=True)
     path.write_text(content)
 
 
-def postprocess_css(content: str) -> str:
-    return PADDING_PAT.sub("", content)
+def postprocess_css(content: str, important: bool) -> str:
+    rules = tinycss2.parse_stylesheet(content, skip_comments=True, skip_whitespace=True)
+    for rule in rules:
+        declarations = tinycss2.parse_declaration_list(
+            rule.content, skip_comments=True, skip_whitespace=True
+        )
+
+        # remove padding
+        declarations = [
+            declaration
+            for declaration in declarations
+            if "padding" not in declaration.lower_name
+        ]
+
+        # add !important if needed
+        for declaration in declarations:
+            declaration.important = important
+
+        rule.content = declarations
+
+    return tinycss2.serialize(rules)
 
 
 def flavor_css(flavor: str) -> str:
@@ -49,17 +65,24 @@ def variable_css() -> str:
     return css
 
 
-def build_css() -> None:
+def build_css(*, important: bool) -> None:
     # build individual CSS files for each flavor
     for flavor in PALETTE:
-        filename = f"catppuccin-{flavor.identifier}.css"
+        if important:
+            filename = f"catppuccin-{flavor.identifier}.important.css"
+        else:
+            filename = f"catppuccin-{flavor.identifier}.css"
         path = PYGMENTS_DIR / filename
-        write(postprocess_css(flavor_css(flavor.identifier)), path)
+        write(postprocess_css(flavor_css(flavor.identifier), important), path)
 
     # build a variable CSS file
-    path = PYGMENTS_DIR / "catppuccin-variables.css"
-    write(postprocess_css(variable_css()), path)
+    if important:
+        path = PYGMENTS_DIR / "catppuccin-variables.important.css"
+    else:
+        path = PYGMENTS_DIR / "catppuccin-variables.css"
+    write(postprocess_css(variable_css(), important), path)
 
 
 if __name__ == "__main__":
-    build_css()
+    build_css(important=False)
+    build_css(important=True)