Skip to content

Commit b797610

Browse files
dafidafi
committed
fix: redesign the hiddenSettings.md page
1 parent 40fd19b commit b797610

6 files changed

Lines changed: 193 additions & 38 deletions

File tree

‎README.md‎

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,28 @@
77

88
### Tailwind
99

10-
Generate the `CSS` every time styles on `input.css` change
10+
Regenerate the CSS whenever `input.css` changes.
1111

1212
npx @tailwindcss/cli -i ./css/input.css -o css/theme.css
1313

14+
### Images
15+
16+
Reduce image size
17+
18+
find img/screenshots -type file -name '*.png' -exec pngquant -f --ext .png --quality=65-80 {} \;
19+
20+
# Highlight rectangle
21+
22+
See [contextMenuExclude.png](img/screenshots/folder/fileFilters/contextMenuExclude.png) or [traverseFileFilters.png](img/screenshots/folder/fileFilters/traverseFileFilters.png)
23+
24+
To highlight a region in GIMP:
25+
26+
1. Use the Ellipse/Rectangle Select Tool
27+
2. Select the area you want to keep
28+
3. Select → Feather — e.g., 30–50px for soft edges
29+
4. Invert the selection — `Select → Invert`
30+
5. Darken the surrounding area — `Colors → Brightness-Contrast`, set Brightness to -127
31+
1432
# Local Test
1533

1634
### Generate documentation for the Apple Help system

‎_includes/scripts.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,4 +24,5 @@
2424
</script>
2525
{% endif %}
2626
{% endcase %}
27+
<script src="js/copy-cmd.js"></script>
2728

‎css/input.css‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -129,6 +129,36 @@ img.folder-legend {
129129
line-height: 1.4;
130130
}
131131

132+
td.copy-cmd {
133+
cursor: pointer;
134+
white-space: nowrap;
135+
user-select: none;
136+
}
137+
138+
td.copy-cmd::after {
139+
content: '';
140+
display: inline-block;
141+
width: 20px;
142+
height: 20px;
143+
margin-left: 7px;
144+
vertical-align: middle;
145+
opacity: 0;
146+
transition: opacity 0.15s;
147+
background-size: contain;
148+
background-repeat: no-repeat;
149+
background-position: center;
150+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='13' height='13' rx='2' ry='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E");
151+
}
152+
153+
td.copy-cmd:hover::after {
154+
opacity: 1;
155+
}
156+
157+
td.copy-cmd.copied::after {
158+
opacity: 1;
159+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
160+
}
161+
132162
img.wiki-img {
133163
max-width: 50%;
134164
border: 1px solid #94a3b8;

‎css/theme.css‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1557,6 +1557,32 @@ img.folder-legend {
15571557
color: #64748b;
15581558
line-height: 1.4;
15591559
}
1560+
td.copy-cmd {
1561+
cursor: pointer;
1562+
white-space: nowrap;
1563+
user-select: none;
1564+
}
1565+
td.copy-cmd::after {
1566+
content: '';
1567+
display: inline-block;
1568+
width: 20px;
1569+
height: 20px;
1570+
margin-left: 7px;
1571+
vertical-align: middle;
1572+
opacity: 0;
1573+
transition: opacity 0.15s;
1574+
background-size: contain;
1575+
background-repeat: no-repeat;
1576+
background-position: center;
1577+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='13' height='13' rx='2' ry='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E");
1578+
}
1579+
td.copy-cmd:hover::after {
1580+
opacity: 1;
1581+
}
1582+
td.copy-cmd.copied::after {
1583+
opacity: 1;
1584+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
1585+
}
15601586
img.wiki-img {
15611587
max-width: 50%;
15621588
border: 1px solid #94a3b8;

‎hiddenSettings.md‎

Lines changed: 107 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -4,43 +4,113 @@ layout: default
44

55
# mainAnchor is used by Apple links
66
mainAnchor: hiddenSettings
7-
title: Hidden settings
7+
title: Hidden Settings
88
subtitle: Settings not yet available from the preferences panel
99
---
1010

11-
Hidden settings
12-
===
13-
14-
Some settings aren't available from the preferences panel and must be set from the CLI.
15-
16-
Comparison completed notification
17-
--
18-
19-
`showNotificationWhenWindowIsOnFront` (`boolean`, default `false`)
20-
21-
If `true` the notification is always shown, otherwise only when the application window isn't in the foreground.
22-
23-
defaults write com.visualdiffer showNotificationWhenWindowIsOnFront true
24-
25-
Customize the file date/time format in Folder Differ View
26-
--
27-
28-
`folderViewDateFormat` (`string`, default taken from system locale settings)
29-
30-
It is possible to change how time is shown in the Folder Differ View.
31-
32-
Change format
33-
-------------
34-
Open the terminal application and type:
35-
36-
defaults write com.visualdiffer folderViewDateFormat HHmmss
37-
38-
The example above sets the format to show only the time (without date); format patterns can be found at [Unicode Technical Standard #35](https://unicode.org/reports/tr35/tr35-6.html#Date_Format_Patterns).
39-
40-
Restore default value
41-
===
42-
43-
At any time it is possible to restore the default value by deleting the key:
44-
45-
defaults delete com.visualdiffer showNotificationWhenWindowIsOnFront
46-
defaults delete com.visualdiffer folderViewDateFormat
11+
Some settings are not exposed in the Preferences panel and must be configured from the terminal using the `defaults` command.
12+
13+
**General pattern**
14+
15+
defaults write com.visualdiffer <key> <value>
16+
17+
**Reset to default**
18+
19+
defaults delete com.visualdiffer <key>
20+
21+
Changes take effect the next time the application is launched.
22+
23+
# [Settings](#settings)
24+
25+
Click any row in the **Example** column to copy the full command to the clipboard.
26+
27+
<div class="table-wrapper">
28+
<table class="alt">
29+
<thead>
30+
<tr>
31+
<th>Key</th>
32+
<th>Default</th>
33+
<th>Description</th>
34+
<th>Example</th>
35+
</tr>
36+
</thead>
37+
<tbody>
38+
<tr>
39+
<td><code>alwaysResolveSymlinks</code></td>
40+
<td>YES</td>
41+
<td>Resolve symbolic links when determining file paths.</td>
42+
<td class="copy-cmd"
43+
data-cmd="defaults write com.visualdiffer alwaysResolveSymlinks -bool false">
44+
<code>-bool false</code>
45+
</td>
46+
</tr>
47+
<tr>
48+
<td><code>colorsConfigPath</code></td>
49+
<td>—</td>
50+
<td>Path to a JSON file containing a custom color configuration.
51+
Recommended location: <code>~/Library/Application Scripts/com.visualdiffer</code></td>
52+
<td class="copy-cmd"
53+
data-cmd="defaults write com.visualdiffer colorsConfigPath &quot;/Users/&lt;&lt;username&gt;&gt;/Library/Application Scripts/com.visualdiffer/vd-colors.json&quot;">
54+
<code>"/path/to/vd-colors.json"</code>
55+
</td>
56+
</tr>
57+
<tr>
58+
<td><code>defaultEncoding</code></td>
59+
<td>UTF-8</td>
60+
<td>Default character encoding for opening text files.
61+
The value is the <code>CFStringEncoding</code> integer identifier.</td>
62+
<td class="copy-cmd"
63+
data-cmd="defaults write com.visualdiffer defaultEncoding -int 30">
64+
<code>-int 30</code>
65+
</td>
66+
</tr>
67+
<tr>
68+
<td><code>filesStatusBarShowMessageTimeout</code></td>
69+
<td>3</td>
70+
<td>Seconds a status bar message stays visible in the file diff view before the counters are restored.</td>
71+
<td class="copy-cmd"
72+
data-cmd="defaults write com.visualdiffer filesStatusBarShowMessageTimeout -int 5">
73+
<code>-int 5</code>
74+
</td>
75+
</tr>
76+
<tr>
77+
<td><code>foldersDifferenceNavigatorCenterInWindow</code></td>
78+
<td>YES</td>
79+
<td>Center the selected difference in the folder comparison window when navigating.</td>
80+
<td class="copy-cmd"
81+
data-cmd="defaults write com.visualdiffer foldersDifferenceNavigatorCenterInWindow -bool false">
82+
<code>-bool false</code>
83+
</td>
84+
</tr>
85+
<tr>
86+
<td><code>folderViewDateFormat</code></td>
87+
<td><code>ddMMyyHHmmss</code></td>
88+
<td>Date and time format used in the folder diff view.
89+
Pattern syntax: <a href="https://unicode.org/reports/tr35/tr35-6.html#Date_Format_Patterns">Unicode Technical Standard #35</a></td>
90+
<td class="copy-cmd"
91+
data-cmd="defaults write com.visualdiffer folderViewDateFormat HHmmss">
92+
<code>HHmmss</code>
93+
</td>
94+
</tr>
95+
<tr>
96+
<td><code>showNotificationWhenWindowIsOnFront</code></td>
97+
<td>NO</td>
98+
<td>When <code>NO</code>, completion notifications are shown only when the app is in the background.
99+
When <code>YES</code>, notifications are always shown.</td>
100+
<td class="copy-cmd"
101+
data-cmd="defaults write com.visualdiffer showNotificationWhenWindowIsOnFront -bool true">
102+
<code>-bool true</code>
103+
</td>
104+
</tr>
105+
<tr>
106+
<td><code>showRecentDocumentsList</code></td>
107+
<td>NO</td>
108+
<td>Show the Recent Documents popup menu on the main window.</td>
109+
<td class="copy-cmd"
110+
data-cmd="defaults write com.visualdiffer showRecentDocumentsList -bool true">
111+
<code>-bool true</code>
112+
</td>
113+
</tr>
114+
</tbody>
115+
</table>
116+
</div>

‎js/copy-cmd.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
document.addEventListener('DOMContentLoaded', function () {
2+
document.querySelectorAll('.copy-cmd').forEach(function (cell) {
3+
cell.addEventListener('click', function () {
4+
navigator.clipboard.writeText(cell.dataset.cmd).then(function () {
5+
cell.classList.add('copied');
6+
setTimeout(function () { cell.classList.remove('copied'); }, 1500);
7+
});
8+
});
9+
});
10+
});

0 commit comments

Comments
 (0)