✨ Allow custom styles system wide

[ldidry]

Q	A
Bug fix?	no
New feature?	yes
BC breaks?	no
Deprecations?	no
Tests pass?	no
Documentation	yes
Translation	no
CHANGELOG.md	no
License	MIT

Should fix #4060

• add a setting called custom_css in app/config/parameters.yml, available for twig
• when set to true, Wallabag calls http://your-wallabag/custom.css on every page
• put a file named custom.css in web/ directory: it will be used by Wallabag.

The green sidebar of the screenshot is created by custom.css.

[j0k3r]

Can’t we just have a custom.css always in the repo but empty AND in the .gitignore to avoid noise?

This will avoid having to define some extra config to use it.

[ldidry]

@j0k3r If you think it’s better, I’m okay with that. I’ll change that tonight.

[ldidry]

Unfortunately, once you have commit a file, .gitignore does not work on it anymore. There is some ways to ignore modifications to such a file, but it only works locally.

I can try to create a (twig extension to check if the file exists](https://stackoverflow.com/questions/16898628/symfony2-and-twig-check-if-an-asset-exists) though, but it will take me some time.

[j0k3r]

You just have to do git add -f web/custom.css

[ldidry]

But then, when people add rules in it, git will say that the file has changed, it won’t be ignored.

[j0k3r]

Try it it’ll be ignored

[ldidry]

I tried. It’s not ignored.

luc@vm: ~/wallabag  test± git log --name-status HEAD^..HEAD
commit a03bb905f2391728a03623a03582ec28bf7023e4 (HEAD -> test, origin/test)
Author: Luc Didry <luc@didry.org>
Date:   Thu Oct 10 23:36:50 2019 +0200

    Test with empty custom.css

M       app/config/config.yml
M       app/config/parameters.yml.dist
M       src/Wallabag/CoreBundle/Resources/views/base.html.twig
A       web/custom.css
luc@vm: ~/wallabag  test± git status
Sur la branche test
Votre branche est à jour avec 'origin/test'.

rien à valider, la copie de travail est propre
luc@vm: ~/wallabag  test± tail -n 1 .gitignore
web/custom.css
luc@vm: ~/wallabag  test± echo ".side-nav{color:green;}" > web/custom.css
luc@vm: ~/wallabag  test(+1/-0)± git status
Sur la branche test
Votre branche est à jour avec 'origin/test'.

Modifications qui ne seront pas validées :
  (utilisez "git add <fichier>..." pour mettre à jour ce qui sera validé)
  (utilisez "git checkout -- <fichier>..." pour annuler les modifications dans la copie de travail)

        modifié :         web/custom.css

aucune modification n'a été ajoutée à la validation (utilisez "git add" ou "git commit -a")
luc@vm: ~/wallabag  test(+1/-0)±

[j0k3r]

Wow I was sure it works. 😞
Anyway, we should then add a web/custom.css.dist (with comment inside about what the purpose of that file and how to use it), ignore web/custom.css and explain in the doc that we should cp web/custom.css.dist web/custom.css to enable custom css.

But then is it acceptable to always load the web/custom.css even when it does not exist?
poke @wallabag/core

[ldidry]

But then is it acceptable to always load the web/custom.css even when it does not exist?

I think not: power user will ask them-self why they have a 404 call on each page.

But I thought about another way: what about touch web/custom.css on make install ?

[j0k3r]

That might do the trick.
Maybe also on make update

[ldidry]

Should I put that in GNUmakefile or in scripts/install.sh?

[ldidry]

I’ll put it in GNUmakefile as a new target: we need that for make dev too.

[ldidry]

Done