As per request, I've had a look at the migration report in order to improve its overall look and feel. I've compiled a series of CSS definitions that change how the the report presents its information.
The main goals have been to:
- ensure that all warnings, errors and required user action can be easily identified, even in very large reports.
- make sure that the report looks less technical and conveys a sense of trust.
Please find attached an archive containing four HTML files:
- two files in the "_styled" directory contain the new look
- the other two files in the "_original" directory represent the originals I've styled.
Please review the changes and add them to the migration tool, if you agree with them. I've actually had a hard time to properly style the layouts, as the HTML generated by the tool currently lacks classes and identifiers to easily style all elements for all three main sections (modules, scripts, components) simultaneously. You'll those found many very specific CSS selectors in the there. We should definitely improve and unify the generated HTML soon - that will make some of the CSS definitions a lot simpler and easier to understand.
This work represents the first step in proposed styling the report I've worked on. I've actually created a series of mockups representing where I suggest we go with this - I've attached PNGs of these as well. Please consider this when reviewing the proposed CSS changes. I suggest we first basically agree on the direction this is heading, before any change is applied.