Homepage redesign
closes https://gitlab.com/minds/ux/issues/2 closes #2112
Testing
- logged out, go to the homepage. There's a 50/50 chance that you will either see a mobile phone on the right, or the register form. You can change it manually by modifying the experiment key in the local storage from 'base' to 'form' and vice-versa.
- everything should look like in Michael's designs, for mobile, tablets and desktop.
If you're on the homepage version with the mobile phone:
- "Join Minds Now" buttons should redirect to
/onboardingwhere you'll only see the registration form. - Registering should go to the next step for onboarding
- Skipping this should redirect you to homepage
If you're on the homepage version with the register form:
- Registering should redirect to the first step of the onboarding
- Skipping it should redirect to newsfeed
Testing the onboarding steps TBD
depends on engine!395
added scoped label
changed the description
added 7 commits
- 4c3d6e23 - (feat): renamed HomepageComponent to HomepageV1Component
- 5be586b4 - (fix): no background colour for the form
- 8484f94e - (feat): responsive design for register form and top-left corner decoration
- 867ec072 - (fix): several styling fixes for mobile resolution
- 2afc5b4f - (fix): app buttons
- 11be027c - (feat): added m-grid__column__skip-#{$i} for desktop and mobile
- 507c3221 - (fix): quotation and links styling fixes
Toggle commit listadded 74 commits
-
507c3221...35070b4f - 73 commits from branch
master - cc521451 - Merge remote-tracking branch 'upstream/master' into feat/homepage-redesign
-
507c3221...35070b4f - 73 commits from branch
added 1 commit
- bd99718e - (fix): added images that got deleted while merging master
mentioned in merge request engine!395
unmarked as a Work In Progress
changed title from design to design
changed the description
added scoped label
marked as a Work In Progress
added 2 commits
added 11 commits
-
dec3617e...a0d1737e - 10 commits from branch
master - 57e73e13 - Merge remote-tracking branch 'upstream/master' into feat/homepage-redesign
-
dec3617e...a0d1737e - 10 commits from branch
changed the description
added 17 commits
-
18ccfa82...32c47ab2 - 13 commits from branch
master - 76833369 - (feat): remove last section and correct items in "our principles"
- fb30ca6f - (feat): add join button
- dbe902ab - (fix): tringle thingy
- 011c75d7 - Merge remote-tracking branch 'upstream/master' into feat/homepage-redesign
Toggle commit list-
18ccfa82...32c47ab2 - 13 commits from branch
added 1 commit
- 3607b826 - (fix): "Join Minds Now" on the bottom should only appear for base experiment
unmarked as a Work In Progress
ReporterLink? ;)
![Mark Harding](data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200"><rect fill-opacity="0"/></svg>)
OwnerClick 'View App' above.
- Last updated by Marcelo Rivera
17 17 @Component({ 18 18 template: ` 19 19 <div 20 *mExperiment="'homepage'; bucket: 'base'" 20 *mExperiment="'homepage'; buckets: ['base']" 21 21 class="homepage-bucket-base" 22 22 ></div> 23 23 <div 24 *mExperiment="'homepage'; bucket: 'variant1'" 24 *mExperiment="'homepage'; buckets: ['variant1']" - Owner
I am unable to test with variant1. It is showing blank
changed this line in version 18 of the diff
- Last updated by Marcelo Rivera
3 3 m-marketing { 4 4 display: block; 5 5 font-family: Roboto, sans-serif; 6 overflow-x: hidden; - Owner
why is this here?
![Marcelo Rivera](data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80"><rect fill-opacity="0"/></svg>)
Developersome of the shape we've included in ::before and ::after elements need to be moved a bit away from the screen, so it causes overflow which spawns horizontal scrollbars in smaller resolutions
- Last updated by Marcelo Rivera
14 14 }) 15 15 export class ExperimentDirective { 16 16 @Input('mExperiment') mExperimentId; 17 @Input() mExperimentBucket; 17 @Input() mExperimentBuckets: Array<string>; - Owner
Why have we changed this to an array? (It appears to also have broken things). This MR is for homepage update only not a change to our AB testing platform.
- Developer
I needed to add that in order to not duplicate code that much on the homepage. With this change it would give you the ability to say that a given element could appear in more than one variant. Just reviewed it and it seems it's broken on the backend, which doesn't support more than 2 variants (I hadn't noticed that before). Anyways, I'm reverting it for now
changed this line in version 18 of the diff
- Last updated by Marcelo Rivera
48 i18n 49 > 50 Earn for your ideas. 51 </p> 31 52 32 <div class="m-homepage--app-buttons"> 33 <div class="m-homepage--app-buttons__iosBanner"> 53 <button 54 class="mf-button mf-button--alt m-homepage__joinButton" 55 (click)="goToLoginPage()" 56 i18n 57 > 58 Join Minds Now 59 </button> 60 61 <div class="m-homepage__appButtons"> - Owner
These look inconsistent with the mockup.
.@michaelfbradley I thought we were not going to use the google play icon?
- Developer
This is because it changed since I did that part, nobody told me and I didn't notice it.
@michaelfbradley could you give me the latest .sketch file so I can export it?
Edited by Marcelo Rivera
- Last updated by Marcelo Rivera
38 29 private loginReferrer: LoginReferrerService, 39 30 public session: Session 40 31 ) { 32 this.topbar = document.querySelector('.m-v2-topbar__Top'); - Owner
This is going to cause SSR issues. Document should be avoided, especially when using DOM elements
changed this line in version 21 of the diff
- Resolved by Marcelo Rivera
- Resolved by Marcelo Rivera
- Last updated by Marcelo Rivera
W: 333 | H: 608
- Owner
This is fussy on retina display.
- Developer
How do you suggest that I tweak that? I don't own a retina display, so I cannot test it there
- Resolved by Marcelo Rivera
- Owner
@michaelfbradley Why are we using a different green on the homepage to elsewhere?
- Owner
@eiennohi there looks to be lots of discrepancies between implementation and mockup. Also the AB testing does not appear to be working at all. Please revert those changes.
added scoped label and automatically removed label
added 1 commit
- 09e8059c - (fix): reverted lint on tasks/extract.i18n.xlf.ts
added 1 commit
- c8d26f1c - (fix): don't use document for accessing the topbar
