feat: split custom css from github markdown css

This commit is contained in:
relikd
2025-12-04 19:05:38 +01:00
parent 838ecae118
commit d8f691145a
5 changed files with 16 additions and 8 deletions

View File

@@ -13,6 +13,7 @@
549688412EE0B0B700FB282A /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5496883A2EE0B0B700FB282A /* AppDelegate.swift */; };
549688482EE0B0BA00FB282A /* PreviewViewController.xib in Resources */ = {isa = PBXBuildFile; fileRef = 549688452EE0B0BA00FB282A /* PreviewViewController.xib */; };
549688492EE0B0BA00FB282A /* PreviewViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 549688432EE0B0BA00FB282A /* PreviewViewController.swift */; };
5496C6CD2EE1FE7100EE9345 /* style.css in Resources */ = {isa = PBXBuildFile; fileRef = 5496C6CC2EE1FE6E00EE9345 /* style.css */; };
54AD6C9B2EE0BC45006CCA14 /* Markdown in Frameworks */ = {isa = PBXBuildFile; productRef = 54AD6C9A2EE0BC45006CCA14 /* Markdown */; };
54AD6C9D2EE0C2B1006CCA14 /* markdown.css in Resources */ = {isa = PBXBuildFile; fileRef = 54AD6C9C2EE0C2B1006CCA14 /* markdown.css */; };
54C508DB2EE0ED4600E5C1A3 /* empty.txt in Resources */ = {isa = PBXBuildFile; fileRef = 54C508DA2EE0ED4200E5C1A3 /* empty.txt */; };
@@ -56,6 +57,7 @@
549688432EE0B0BA00FB282A /* PreviewViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PreviewViewController.swift; sourceTree = "<group>"; };
549688442EE0B0BA00FB282A /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.xib; name = Base; path = Base.lproj/PreviewViewController.xib; sourceTree = "<group>"; };
5496884A2EE0B12D00FB282A /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
5496C6CC2EE1FE6E00EE9345 /* style.css */ = {isa = PBXFileReference; lastKnownFileType = text.css; path = style.css; sourceTree = "<group>"; };
54AD6C9C2EE0C2B1006CCA14 /* markdown.css */ = {isa = PBXFileReference; lastKnownFileType = text.css; path = markdown.css; sourceTree = "<group>"; };
54C508BA2EE0D40A00E5C1A3 /* Preview.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = Preview.entitlements; sourceTree = "<group>"; };
54C508DA2EE0ED4200E5C1A3 /* empty.txt */ = {isa = PBXFileReference; lastKnownFileType = text; path = empty.txt; sourceTree = "<group>"; };
@@ -141,6 +143,7 @@
children = (
54C508FE2EE1C16D00E5C1A3 /* AppIcon.icns */,
54AD6C9C2EE0C2B1006CCA14 /* markdown.css */,
5496C6CC2EE1FE6E00EE9345 /* style.css */,
54C508DA2EE0ED4200E5C1A3 /* empty.txt */,
);
path = resources;
@@ -246,6 +249,7 @@
buildActionMask = 2147483647;
files = (
549688482EE0B0BA00FB282A /* PreviewViewController.xib in Resources */,
5496C6CD2EE1FE7100EE9345 /* style.css in Resources */,
54AD6C9D2EE0C2B1006CCA14 /* markdown.css in Resources */,
54C508DB2EE0ED4600E5C1A3 /* empty.txt in Resources */,
);

View File

@@ -27,7 +27,7 @@ class PreviewViewController: NSViewController, QLPreviewingController, WKNavigat
}
/// Load resource file either from user documents dir (if exists) or app bundle (default).
func bundleFile(filename: String, ext: String) throws -> URL {
func bundleFile(filename: String, ext: String) -> URL {
if let userFile = URL.UserModDir?.appendingPathComponent(filename + "." + ext, isDirectory: false), userFile.exists() {
return userFile
}
@@ -35,7 +35,6 @@ class PreviewViewController: NSViewController, QLPreviewingController, WKNavigat
}
func preparePreviewOfFile(at url: URL) async throws {
let cssUrl = try bundleFile(filename: "markdown", ext: "css")
let md = try Document(parsing: url)
let ver = Bundle.main.infoDictionary?["CFBundleShortVersionString"] as! String
@@ -47,7 +46,8 @@ class PreviewViewController: NSViewController, QLPreviewingController, WKNavigat
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="\(cssUrl)" />
<link rel="stylesheet" type="text/css" href="\(bundleFile(filename: "markdown", ext: "css"))" />
<link rel="stylesheet" type="text/css" href="\(bundleFile(filename: "style", ext: "css"))" />
</head>
<body class="markdown-body">
\(HTMLFormatter.format(md))

View File

@@ -40,7 +40,7 @@ If you want customizations, you can write your own css file.
### How to customize CSS
1. Right click on the app and select "Show Package Contents"
2. Copy `Contents/Resources/style.css`
2. Copy `Contents/Resources/style.css` (or `markdown.css`)
3. Open `~/Library/Containers/de.relikd.QLMarkdown.Preview/Data/Documents/`
4. Paste the previous file and modify it to your liking

View File

@@ -1,7 +1,3 @@
/* manually added: */
body { padding: 20px 40px 10px; }
footer { font-size: 0.6em; color: #777; margin: 50px 0 0; text-align: center; }
/* Copied from https://github.com/sindresorhus/github-markdown-css (2025-12-04) */
.markdown-body {
--base-size-4: 0.25rem;

8
resources/style.css Normal file
View File

@@ -0,0 +1,8 @@
body {
padding: 20px 30px 10px;
}
footer {
font-size: 0.6em;
color: #777;
margin: 50px 0 0;
}