pierre/wallabag
1
0
Fork 0
forked from wallabag/wallabag
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

Add display article configurator (font family, font size, line height and max width)

Browse Source
This commit is contained in:
Nicolas Lœuillet
2023-07-29 12:26:44 +02:00
parent 0e44035b67
commit b1752b619d
71 changed files with 1457 additions and 170 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
app/Resources/static/themes/material/index.js
View File

@ -8,7 +8,9 @@ import 'materialize-css/dist/js/materialize';
import '../_global/index';
/* Tools */
import { initExport, initFilters, initRandom } from './js/tools';
import {
initExport, initFilters, initRandom, initPreviewText,
} from './js/tools';
/* Import shortcuts */
import './js/shortcuts/main';
@ -177,6 +179,7 @@ $(document).ready(() => {
initRandom();
stickyNav();
articleScroll();
initPreviewText();
const toggleNav = (toShow, toFocus) => {
$('.nav-panel-actions').hide(100);
@ -199,6 +202,29 @@ $(document).ready(() => {
return false;
});
$('#config_fontsize').on('input', () => {
const value = $('#config_fontsize').val();
const css = `${value}em`;
$('#preview-content').css('font-size', css);
});
$('#config_font').on('change', () => {
const value = $('#config_font').val();
$('#preview-content').css('font-family', value);
});
$('#config_lineHeight').on('input', () => {
const value = $('#config_lineHeight').val();
const css = `${value}em`;
$('#preview-content').css('line-height', css);
});
$('#config_maxWidth').on('input', () => {
const value = $('#config_maxWidth').val();
const css = `${value}em`;
$('#preview-article').css('max-width', css);
});
const materialAddForm = $('.nav-panel-add');
materialAddForm.on('submit', () => {
materialAddForm.addClass('disabled');