Convert Roadmap page v1.1 responsiveness

maidsafe / safenetwork.tech

BSD 3-Clause "New" or "Revised" License

18 stars 22 forks source link

Convert Roadmap page v1.1 responsiveness #212

Closed shankarsengalani closed 5 years ago

shankarsengalani commented 5 years ago

Implement Roadmap page v1.1 to fit all it's breakpoints (L, M, S, XS, XXS and XXXS)

Story points: 4

S-Coyle commented 5 years ago

Testing using Figma designs as my guide:

[x] L = 1800-2200
[x] M = 1301-1600
[x] S = 1001-1300
[x] XS = 769-1000
[x] XXS = 501-768
[x] XXXS = <= 500

Tested only in Chrome v73.0.3683.103, so far

Raised #286, #287, #288, #289, #290, #291, #292 while testing this.

S-Coyle commented 5 years ago

Some cross browser testing, though not to the depth I tested in Chrome above:

[x] Firefox 66.3.3
[x] Safari 12.1
[x] Edge - @calumcraig will test Edge on his Win10 VM and add results in a comment below

NOTE - IE11 - the site does not function or look as it should on IE11 - this is a known issue, updated the following bug https://github.com/maidsafe/safenetwork.tech/issues/79

calumcraig commented 5 years ago

With the exception of the above issues raised by Stephen and #301 #304 and #305 completed testing in Edge (Windows 10 VM) and the resizing of the page is working as expected:

Edge
Size	Test resolution	Pass?	Issues	Notes
XL	2560x1323	OK
L	1985x1089	OK
Default	1791x875	OK
M	1373x880	OK
S	1168x953	OK
XS	909x923	OK - TBC	https://maidsafe.slack.com/archives/C29U5J68G/p1557242930069400
XXS	721x890	OK
XXXS	442x890	OK

calumcraig commented 5 years ago

Testing completed - moving to done.