Simplify CSS in HTML format

novelwriter/formats/tohtml.py

@@ -251,7 +251,7 @@ class ToHtml(Tokenizer):
                 lines.append(f"<p class='sep'{hStyle}>{tText}</p>\n")
 
             elif tType == BlockTyp.SKIP:
-                lines.append(f"<p class='skip'{hStyle}>&nbsp;</p>\n")
+                lines.append(f"<p{hStyle}>&nbsp;</p>\n")
 
             elif tType == BlockTyp.COMMENT:
                 lines.append(f"<p class='comment'{hStyle}>{self._formatText(tText, tFmt)}</p>\n")
@@ -349,91 +349,54 @@ class ToHtml(Tokenizer):
         mScale = self._lineHeight/1.15
         tColor = self._theme.text.name(QtHexRgb)
         hColor = self._theme.head.name(QtHexRgb) if self._colorHeads else tColor
+        lColor = self._theme.head.name(QtHexRgb)
+        mColor = self._theme.highlight.name(QtHexRgb)
+
+        mtH0 = mScale * self._marginTitle[0]
+        mbH0 = mScale * self._marginTitle[1]
+        mtH1 = mScale * self._marginHead1[0]
+        mbH1 = mScale * self._marginHead1[1]
+        mtH2 = mScale * self._marginHead2[0]
+        mbH2 = mScale * self._marginHead2[1]
+        mtH3 = mScale * self._marginHead3[0]
+        mbH3 = mScale * self._marginHead3[1]
+        mtH4 = mScale * self._marginHead4[0]
+        mbH4 = mScale * self._marginHead4[1]
+        mtTT = mScale * self._marginText[0]
+        mbTT = mScale * self._marginText[1]
+        mtSP = mScale * self._marginSep[0]
+        mbSP = mScale * self._marginSep[1]
+
+        font = self._textFont
+        fFam = font.family()
+        fSz = font.pointSize()
+        fW = FONT_WEIGHTS.get(font.weight(), 400)
+        fS = FONT_STYLE.get(font.style(), "normal")
+
+        lHeight = round(100 * self._lineHeight)
 
         styles = []
-        font = self._textFont
+        styles.append(
-        styles.append((
+            f"body {{color: {tColor}; font-family: '{fFam}'; font-size: {fSz}pt; "
-            "body {{"
+            f"font-weight: {fW}; font-style: {fS};}}"
-            "color: {0:s}; font-family: '{1:s}'; font-size: {2:d}pt; "
+        )
-            "font-weight: {3:d}; font-style: {4:s};"
+        styles.append(
-            "}}"
+            f"p {{text-align: {self._defaultAlign}; line-height: {lHeight}%; "
-        ).format(
+            f"margin-top: {mtTT:.2f}em; margin-bottom: {mbTT:.2f}em;}}"
-            tColor, font.family(), font.pointSize(),
+        )
-            FONT_WEIGHTS.get(font.weight(), 400),
+        styles.append(f"a {{color: {lColor};}}")
-            FONT_STYLE.get(font.style(), "normal"),
+        styles.append(f"mark {{background: {mColor};}}")
-        ))
+        styles.append(f"h1, h2, h3, h4 {{color: {hColor}; page-break-after: avoid;}}")
-        styles.append((
+        styles.append(f"h1 {{margin-top: {mtH1:.2f}em; margin-bottom: {mbH1:.2f}em;}}")
-            "p {{"
+        styles.append(f"h2 {{margin-top: {mtH2:.2f}em; margin-bottom: {mbH2:.2f}em;}}")
-            "text-align: {0}; line-height: {1:d}%; "
+        styles.append(f"h3 {{margin-top: {mtH3:.2f}em; margin-bottom: {mbH3:.2f}em;}}")
-            "margin-top: {2:.2f}em; margin-bottom: {3:.2f}em;"
+        styles.append(f"h4 {{margin-top: {mtH4:.2f}em; margin-bottom: {mbH4:.2f}em;}}")
-            "}}"
+        styles.append(
-        ).format(
+            f".title {{font-size: 2.5em; margin-top: {mtH0:.2f}em; margin-bottom: {mbH0:.2f}em;}}"
-            self._defaultAlign,
+        )
-            round(100 * self._lineHeight),
+        styles.append(
-            mScale * self._marginText[0],
+            f".sep {{text-align: center; margin-top: {mtSP:.2f}em; margin-bottom: {mbSP:.2f}em;}}"
-            mScale * self._marginText[1],
+        )
-        ))
-        styles.append((
-            "h1 {{"
-            "color: {0:s}; "
-            "page-break-after: avoid; "
-            "margin-top: {1:.2f}em; "
-            "margin-bottom: {2:.2f}em;"
-            "}}"
-        ).format(
-            hColor, mScale * self._marginHead1[0], mScale * self._marginHead1[1]
-        ))
-        styles.append((
-            "h2 {{"
-            "color: {0:s}; "
-            "page-break-after: avoid; "
-            "margin-top: {1:.2f}em; "
-            "margin-bottom: {2:.2f}em;"
-            "}}"
-        ).format(
-            hColor, mScale * self._marginHead2[0], mScale * self._marginHead2[1]
-        ))
-        styles.append((
-            "h3 {{"
-            "color: {0:s}; "
-            "page-break-after: avoid; "
-            "margin-top: {1:.2f}em; "
-            "margin-bottom: {2:.2f}em;"
-            "}}"
-        ).format(
-            hColor, mScale * self._marginHead3[0], mScale * self._marginHead3[1]
-        ))
-        styles.append((
-            "h4 {{"
-            "color: {0:s}; "
-            "page-break-after: avoid; "
-            "margin-top: {1:.2f}em; "
-            "margin-bottom: {2:.2f}em;"
-            "}}"
-        ).format(
-            hColor, mScale * self._marginHead4[0], mScale * self._marginHead4[1]
-        ))
-        styles.append((
-            ".title {{"
-            "font-size: 2.5em; "
-            "margin-top: {0:.2f}em; "
-            "margin-bottom: {1:.2f}em;"
-            "}}"
-        ).format(
-            mScale * self._marginTitle[0], mScale * self._marginTitle[1]
-        ))
-        styles.append((
-            ".sep, .skip {{"
-            "text-align: center; "
-            "margin-top: {0:.2f}em; "
-            "margin-bottom: {1:.2f}em;"
-            "}}"
-        ).format(
-            mScale, mScale
-        ))
-
-        styles.append("a {{color: {0:s};}}".format(self._theme.head.name(QtHexRgb)))
-        styles.append("mark {{background: {0:s};}}".format(self._theme.highlight.name(QtHexRgb)))
 
         return styles
 

tests/reference/mBuildDocBuild_HTML5_Lorem_Ipsum.htm

@@ -7,14 +7,15 @@
 <style>
 body {color: #000000; font-family: 'Arial'; font-size: 12pt; font-weight: 400; font-style: normal;}
 p {text-align: left; line-height: 150%; margin-top: 0.00em; margin-bottom: 0.76em;}
-h1 {color: #4271ae; page-break-after: avoid; margin-top: 1.85em; margin-bottom: 0.65em;}
-h2 {color: #4271ae; page-break-after: avoid; margin-top: 2.18em; margin-bottom: 0.65em;}
-h3 {color: #4271ae; page-break-after: avoid; margin-top: 1.53em; margin-bottom: 0.65em;}
-h4 {color: #4271ae; page-break-after: avoid; margin-top: 1.53em; margin-bottom: 0.65em;}
-.title {font-size: 2.5em; margin-top: 1.85em; margin-bottom: 0.65em;}
-.sep, .skip {text-align: center; margin-top: 1.30em; margin-bottom: 1.30em;}
 a {color: #4271ae;}
 mark {background: #ffffa6;}
+h1, h2, h3, h4 {color: #4271ae; page-break-after: avoid;}
+h1 {margin-top: 1.85em; margin-bottom: 0.65em;}
+h2 {margin-top: 2.18em; margin-bottom: 0.65em;}
+h3 {margin-top: 1.53em; margin-bottom: 0.65em;}
+h4 {margin-top: 1.53em; margin-bottom: 0.65em;}
+.title {font-size: 2.5em; margin-top: 1.85em; margin-bottom: 0.65em;}
+.sep {text-align: center; margin-top: 1.53em; margin-bottom: 1.53em;}
 </style>
 <body>
 <article>

tests/reference/mBuildDocBuild_HTML5_Lorem_Ipsum.json

@@ -2,21 +2,22 @@
   "meta": {
     "projectName": "Lorem Ipsum",
     "novelAuthor": "lipsum.com",
-    "buildTime": 1729624698,
+    "buildTime": 1729639268,
-    "buildTimeStr": "2024-10-22 21:18:18"
+    "buildTimeStr": "2024-10-23 01:21:08"
   },
   "text": {
     "css": [
       "body {color: #000000; font-family: 'Arial'; font-size: 12pt; font-weight: 400; font-style: normal;}",
       "p {text-align: left; line-height: 150%; margin-top: 0.00em; margin-bottom: 0.76em;}",
-      "h1 {color: #4271ae; page-break-after: avoid; margin-top: 1.85em; margin-bottom: 0.65em;}",
-      "h2 {color: #4271ae; page-break-after: avoid; margin-top: 2.18em; margin-bottom: 0.65em;}",
-      "h3 {color: #4271ae; page-break-after: avoid; margin-top: 1.53em; margin-bottom: 0.65em;}",
-      "h4 {color: #4271ae; page-break-after: avoid; margin-top: 1.53em; margin-bottom: 0.65em;}",
-      ".title {font-size: 2.5em; margin-top: 1.85em; margin-bottom: 0.65em;}",
-      ".sep, .skip {text-align: center; margin-top: 1.30em; margin-bottom: 1.30em;}",
       "a {color: #4271ae;}",
-      "mark {background: #ffffa6;}"
+      "mark {background: #ffffa6;}",
+      "h1, h2, h3, h4 {color: #4271ae; page-break-after: avoid;}",
+      "h1 {margin-top: 1.85em; margin-bottom: 0.65em;}",
+      "h2 {margin-top: 2.18em; margin-bottom: 0.65em;}",
+      "h3 {margin-top: 1.53em; margin-bottom: 0.65em;}",
+      "h4 {margin-top: 1.53em; margin-bottom: 0.65em;}",
+      ".title {font-size: 2.5em; margin-top: 1.85em; margin-bottom: 0.65em;}",
+      ".sep {text-align: center; margin-top: 1.53em; margin-bottom: 1.53em;}"
     ],
     "html": [
       [

tests/test_formats/test_fmt_tohtml.py

@@ -407,7 +407,7 @@ def testFmtToHtml_ConvertDirect(mockGUI):
         (BlockTyp.SKIP, 1, "", [], BlockFmt.NONE),
     ]
     html.doConvert()
-    assert html.result == "<p class='skip'>&nbsp;</p>\n"
+    assert html.result == "<p>&nbsp;</p>\n"
 
     # Alignment
     # =========