Everything in invoiceninja is straight forward for me except for proposals. I have been struggling for a while now trying to get formatting the way I want to. I am having a ton of issues but the one that pops up the most is my styling changes are not permanent. For example, I am trying to shrink the top & bottom padding on the default quote from Seth Godin that comes in the default template (I copied it over to a new template I am making).
Here are the 3 ways I have tried to change the padding style:
Edit Proposal and change the top & bottom padding under “Dimension” menu. (then save)
Edit Proposal Template and change the top & bottom padding under “Dimension” menu. (then save)
Download the template HTML, manually modify the CSS styles and then import template. Go to Proposal and reload the template & save.
As soon as I hit save, the values got back to the originals. Why can’t I change these? Or how do I do it?
I have only see ninja docs that scratch the surface on how to use this UI. Can anyone explain to me what I am doing wrong?
Yeah I have been looking around at GrapesJS, but haven’t found anything to help me. Their demo app does not have a save button so I cannot duplicate this issue on their site.
This is what I found when submitting a change to a single cell 3 times. By default, padding bottom is 120px on this item. I changed padding bottom to 60px, 62px, and 63px. What I noticed is the old CSS remains in the config, so the original default CSS is at the very bottom of the inline style submitted when saved.
So to demonstrate, I clicked save 3 times and it did a PUT to domain.com//proposals/(id) the HTML field had the excepted HTML markup, and then inline CSS styles afterwards. Parsing the styles, I found these entries being submitted on save.
css:
* { box-sizing: border-box; } body {margin: 0;}
#i8drv3{padding:0px 0px 63px 0px;}
*{box-sizing:border-box;}body{margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;}
#i8drv3{padding-top:0px;padding-right:0px;padding-bottom:62px;padding-left:0px;}
*{box-sizing:border-box;}body{margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;}
#i8drv3{padding-top:0px;padding-right:0px;padding-bottom:60px;padding-left:0px;}
...
...LOTS OF CSS HERE AND TOWARDS THE END...
...
#i8drv3{box-sizing:border-box;padding-top:0px;padding-right:0px;padding-bottom:120px;padding-left:0px;}
So it appears it’s keep historical records of all my changes, but the CSS order of execution is causing my changes to be ignored and it always defaults to the 120px padding bottom. Is this a bug or intentional?