Redesign completely the "petition template"

[fallen]

The petition template code is not very clean to stay polite.
Rewriting it from scratch is really something that needs to be done.
Maybe rethinking the page organization with designers would be a good idea.

The template in question is https://github.com/fallen/Pytition/blob/master/pytition/petition/templates/petition/detail2.html

[fallen]

Let's be more specific about what I think should change in this detail2.html template:

• its name
• fontawesome should go away, the remaining part of the site uses Open Iconic, fontawesome was interesting becaused it shipped with Bootstrap 3, Bootstrap 4 no longer does.

<script type='text/javascript'>var CONTEXT_ROOT = '/ea-action';</script>
<script type='text/javascript' src='/static/eaCommon.js'></script>
<script type='text/javascript' src='/static/eaAJAX.js'></script>
<script type='text/javascript' src='/static/eacampaign.js'></script>

• Those should go away as well. They are copy paste from an old Greenpeace petition, I don't even know which kind of copyright or license applies on those files and I guess we use very few of the features brought by those. Let's just integrate the minimum we need and remove the files altogether.
• think about dropping typeahead, is it really needed?

"Important" features to keep IMO:

• Color of "Sign button", or at least have a nice style, not the default HTML5 button style.
• Color of signature number loading bar
• The fact that the signature number loading bar "loads" at page startup (animation)
• The fact that the right panel follows the scroll and sticks to the top when it reaches it.
• Keep it reactive, like https://petition.antipub.org/petition/4/ so that when it is viewed on smartphone or small screen the right panel stacks up with the petition and the "sign" button follows the scrolling/reading.
• Error feedbacks on the signature submission form

[numahell]

its name

Yes !

fontawesome should go away, the remaining part of the site uses Open Iconic, fontawesome was interesting becaused it shipped with Bootstrap 3, Bootstrap 4 no longer does.

Ok, I did not found exactly the same icons but it should work.

think about dropping typeahead, is it really needed?

I agree, it is not really needed.

The fact that the right panel follows the scroll and sticks to the top when it reaches it.

It is.

Keep it reactive, like https://petition.antipub.org/petition/4/ so that when it is viewed on smartphone or small screen the right panel stacks up with the petition and the "sign" button follows the scrolling/reading.

I can use order flexbox property

And ok for the others features, I have to test the petition signature for some of them.

[fallen]

I think we can close this.
Thanks again! :)