client/posts: add transparency grid
Can be turned off in browsing settings.
This commit is contained in:
parent
07603be35e
commit
56432e6089
7 changed files with 17 additions and 2 deletions
|
@ -192,8 +192,11 @@ function bundleConfig(config) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function bundleBinaryAssets() {
|
function bundleBinaryAssets() {
|
||||||
copyFile('./img/favicon.png', './public/img/favicon.png');
|
glob('./img/*.png', {}, (er, files) => {
|
||||||
copyFile('./img/404.png', './public/img/404.png');
|
for (let file of files) {
|
||||||
|
copyFile(file, path.join('./public/img/', path.basename(file)));
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const config = getConfig();
|
const config = getConfig();
|
||||||
|
|
|
@ -199,6 +199,9 @@ $safety-unsafe = #F3985F
|
||||||
background-color: alpha(@background-color, 0.15)
|
background-color: alpha(@background-color, 0.15)
|
||||||
|
|
||||||
.post-container
|
.post-container
|
||||||
|
.post-content.transparency-grid img
|
||||||
|
background: url('/img/transparency_grid.png');
|
||||||
|
|
||||||
text-align: center
|
text-align: center
|
||||||
.post-content
|
.post-content
|
||||||
text-align: left
|
text-align: left
|
||||||
|
|
|
@ -15,6 +15,9 @@
|
||||||
<%= ctx.makeCheckbox({text: 'Enable keyboard shortcuts', id: 'keyboard-shortcuts', name: 'keyboard-shortcuts', checked: ctx.browsingSettings.keyboardShortcuts}) %>
|
<%= ctx.makeCheckbox({text: 'Enable keyboard shortcuts', id: 'keyboard-shortcuts', name: 'keyboard-shortcuts', checked: ctx.browsingSettings.keyboardShortcuts}) %>
|
||||||
<a class='append icon' href='/help/keyboard'><i class='fa fa-question-circle-o'></i></a>
|
<a class='append icon' href='/help/keyboard'><i class='fa fa-question-circle-o'></i></a>
|
||||||
</li>
|
</li>
|
||||||
|
<li>
|
||||||
|
<%= ctx.makeCheckbox({text: 'Enable transparency grid', id: 'transparency-grid', name: 'transparency-grid', checked: ctx.browsingSettings.transparencyGrid}) %>
|
||||||
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class='messages'></div>
|
<div class='messages'></div>
|
||||||
|
|
BIN
client/img/transparency_grid.png
Normal file
BIN
client/img/transparency_grid.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 100 B |
|
@ -86,6 +86,9 @@ class PostContentControl {
|
||||||
const postContentNode = this._template({
|
const postContentNode = this._template({
|
||||||
post: this._post,
|
post: this._post,
|
||||||
});
|
});
|
||||||
|
if (settings.getSettings().transparencyGrid) {
|
||||||
|
postContentNode.classList.add('transparency-grid');
|
||||||
|
}
|
||||||
this._containerNode.appendChild(postContentNode);
|
this._containerNode.appendChild(postContentNode);
|
||||||
optimizedResize.add(() => this._refreshSize());
|
optimizedResize.add(() => this._refreshSize());
|
||||||
views.monitorNodeRemoval(
|
views.monitorNodeRemoval(
|
||||||
|
|
|
@ -20,6 +20,7 @@ function getSettings(settings) {
|
||||||
upscaleSmallPosts: false,
|
upscaleSmallPosts: false,
|
||||||
endlessScroll: false,
|
endlessScroll: false,
|
||||||
keyboardShortcuts: true,
|
keyboardShortcuts: true,
|
||||||
|
transparencyGrid: true,
|
||||||
};
|
};
|
||||||
let ret = {};
|
let ret = {};
|
||||||
let userSettings = localStorage.getItem('settings');
|
let userSettings = localStorage.getItem('settings');
|
||||||
|
|
|
@ -24,6 +24,8 @@ class SettingsView {
|
||||||
form.querySelector('#endless-scroll').checked,
|
form.querySelector('#endless-scroll').checked,
|
||||||
keyboardShortcuts:
|
keyboardShortcuts:
|
||||||
form.querySelector('#keyboard-shortcuts').checked,
|
form.querySelector('#keyboard-shortcuts').checked,
|
||||||
|
transparencyGrid:
|
||||||
|
form.querySelector('#transparency-grid').checked,
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue