Modal Refinements Update

[RaymondDashWu]

Updated version of this PR. Previous PR was not merged and now touches parts of the codebase I didn't write.

Changelog

• Preview button changed from button to icon below map preview
• Aspect ratio added to constants.js
• Text from "Resolution" simplified by dropping aspect ratios. Ex: "Good 16:9 (720p)" to "Good (720p)"
• "Resolution" dropdown changed to "Quality"
• Aspect Ratio moved to Export Settings
• Aspect ratio option added. Only resolutions of selected aspect ratio will appear. In addition, map preview will change based on aspect ratio selected
• Refactored many styled div to styled components and put into styled-components.js
• Added styling changes to modal to look more consistent with Kepler's current modals
• Fixed bug where rendering feedback overlapped with spinner.
• Tabs renamed from Edit/Export to Animation/Settings. Filenames changed as well as references

[coveralls]

Pull Request Test Coverage Report for Build 1068904178

Details

• 0 of 0 changed or added relevant lines in 0 files are covered.
• No unchanged relevant lines lost coverage.
• Overall coverage remained the same at 16.701%

---

Totals
Change from base Build 1053015326:	0.0%
Covered Lines:	142
Relevant Lines:	667

---

💛 - Coveralls

[macrigiuseppe]

@chrisgervang Few comments:

• if the default tab is settings, why isn't the first tab?
• The style for the active tab seems off. Check this out

I think the bottom border should go underneath the current active tab

[RaymondDashWu]

@chrisgervang Few comments:

• if the default tab is settings, why isn't the first tab?
• The style for the active tab seems off. Check this out

I think the bottom border should go underneath the current active tab

Sorry for the confusion. That note was from the previous PR that didn't get merged in. I removed it but the reason Export isn't the default anymore was that we decided that we wanted the flow to be to allow users to select the type of animation before picking settings like resolution and aspect ratio. The currently active tab in that screenshot is Animation. I think that addresses your concern but let me know if you have more questions.

[RaymondDashWu]

Added some new bugs that I previously didn't catch. Will work on fixing them over the weekend.