diff --git a/overrides/README.md b/overrides/README.md new file mode 100644 index 000000000..f190c1407 --- /dev/null +++ b/overrides/README.md @@ -0,0 +1,11 @@ +# Customizing Paperless + +*See customization +[documentation](https://paperless.readthedocs.io/en/latest/customising.html) +for more detail!* + +The example `.css` and `.js` snippets in this folder can be placed into +one of two files in your ``PAPERLESS_MEDIADIR`` folder: `overrides.js` or +`overrides.css`. Please feel free to submit pull requests to the main +repository with other examples of customizations that you think others may +find useful. \ No newline at end of file diff --git a/overrides/tag_colour_preview.js b/overrides/tag_colour_preview.js new file mode 100644 index 000000000..a265f247e --- /dev/null +++ b/overrides/tag_colour_preview.js @@ -0,0 +1,26 @@ +// The following jQuery snippet will add a small square next to the selection +// drop-down on the `Add tag` page that will update to show the selected tag +// color as the drop-down value is changed. Copy and paste it into +// ``PAPERLESS_MEDIADIR/overrides.js`` to see the effects. + +let colour; +let colour_num; + +colour_num = django.jQuery("#id_colour").val() - 1; +colour = django.jQuery('#id_colour')[0][colour_num].text; +django.jQuery('#id_colour').after('
') + +django.jQuery('#colour_square').css({ + 'float': 'left', + 'width': '20px', + 'height': '20px', + 'margin': '5px', + 'border': '1px solid rgba(0, 0, 0, .2)', + 'background': colour +}); + +django.jQuery('#id_colour').change(function () { + colour_num = django.jQuery("#id_colour").val() - 1; + colour = django.jQuery('#id_colour')[0][colour_num].text; + django.jQuery('#colour_square').css({'background': colour}); +});