@damithc What do you think of the Ui?
Based on our discussion, have followed github's style for file-header and made panels white

GitHub UI has a way to clearly separate each file. We need to have something similar. As of now we have a horizontal line but that seems to separate the filename from the code, rather than showing where a file ends.

@damithc What do you think?

@damithc What do you think?

As Github does, use a very light grey for the box containing the file name?

@damithc I have added the Github colour. I have also suggested two options for borders. Let me know how to proceed.

Option 2 looks better. May be reduce the thickness of the border between the filename and the content as there is no reason for it to be thicker than others?

@damithc For review. Will proceed accordingly then.

Are you able increase the curvature at the top and bottom corners like this? No curve for the middle one.

The initial one was 2.

Current top: 4
Current bottom: 8

Current top: 4
Current bottom: 8

let's make both 4 as there is no logical reason to make them different.

Closing this PR due to some issues. Have re=opened in #1080