Implement design changes

[phavekes]

This issue is imported from pivotal

See Miro - https://miro.com/app/board/o9J_kr5d5dg=/

Implemented in https://github.com/OpenConext/OpenConext-myconext/pull/61

[phavekes]

De linkjes naar gmail en outlook zijn dus:

https://www.gmail.com en https://outlook.live.com/owa/ icons: https://a.slack-edge.com/bv1-8/get-started-icon-gmail@2x-e80b706.png https://a.slack-edge.com/bv1-8/get-started-icon-outlook-55f9ac5.png (Okke Harsta - Sep 30, 2020)

[phavekes]

=== Voor Okke ===

• Het icoontje van het vraagtekentje naast \'Other sign-in options\' is nog niet helemaal netjes uitgelijnd (Firefox, Mac OS; in Chrome, Mac OS ook niet)
• NL tekst \'Andere inlog manieren\' -> \'Andere inlogmogelijkheden\'
• EN tekst error msg als je onbekend mail adres invoert: \'We could not find an eduID with that email address. Try another, or request a new eduID account.\'
• NL tekst feedforward (onder de Gmail/Outlook linkjes) -> \'Kan je de e-mail niet vinden? Kijk in je spam-map.\'
• NL tekst feedforward -> \'Om in te loggen, klik je op de link in de e-mail die we hebben gestuurd naar .\'
• Bij de feedforward staat \'To sign in, click the link in the email we sent to .\'. Volgens mij mist daar een e-mail adres op het laatst
• De (regel)afstand tussen de error als je een email adres invult die niet wordt herkend en de \'Stay logged in\' regel klopt niet (Mac OS, FIrefox). De error moet 10px los staan van het veld waar het bij hoort, en daaronder 25 px tot het volgende label

=== Eerst voor Edwin, daarna misschien voor Okke ===

• De tooltip als je met je muis op het vraagtekentje naast Other sign-in options gaat staan, willen we dat zo? Lijkt niet helemaal conform Styleboard.

  (Arnout Terpstra - Oct 5, 2020)

[phavekes]

See comments (Okke Harsta - Oct 5, 2020)

[phavekes]

@arnoutt 

• design tooltip: AEdwin: dat zal ik even aan Laura vragen.
• (regel)afstand tussen error en rest: AEdwin: De error moet 10px los staan van het veld waar het bij hoort, en daaronder 25 px tot het volgende label.
• Over labels: AEdwin: Ik bedoel dat sommige placeholderteksten niet moeten beginnen met de lablenamen. Maar dat kunnen we zelf in de languagefiles aanpassen.
• De linkjes naar Gmail/Outlook openen nu in precies hetzelfde tabblad. AEdwin: Ik denk dat dat wel goed is ja, want die andere tab mocht toch al gesloten worden... (edwinvandebospoort - Oct 6, 2020)

[phavekes]

@arnoutt ik had de labels bij het aanvragen van een eduID weggehaald voor uniformiteit, maar als je dan het formulier gaat invullen is het onduidelijk wat nou wat was. Dus heb ik dat teruggedraaid. Ik zelf denk dat de tooltip bi other sign-in options weg moet. Daar gaan we niks zinnigs in kunnen vermelden. Je laatste punt van de feedforward komt waarschijnlijk omdat je de pagina hebt ververst. Dan raakt de JS het email veld kwijt. (Okke Harsta - Oct 6, 2020)

[phavekes]

@arnoutt blijven er alleen maar teksten over voor mij - tenzij je de tooltip - wilt houden. En dat kunnen jullie zelf doen😀 (Okke Harsta - Oct 6, 2020)

[phavekes]

@okkeh @arnoutt Tooltip weg voor nu vind ik ook wel ff goed, vraag ik alsnog design aan Laura, want het zit ook in de WAYF.

Regelafstand errormelding moet je nog wel doen volgens mij ;-) (edwinvandebospoort - Oct 6, 2020)

[phavekes]

@okkeh vergeet die regelafstand niet en het uitlijnen van het vraagteken icoontje  ;) of was dat al gefixt?

Die tooltip komt later nog.

De teksten kunnen we idd zelf.

(Ik heb mijn oorspronkelijke comment geupdate) (Arnout Terpstra - Oct 6, 2020)

[phavekes]

Nog 3 punten mijnerzijds:

• De herkenning van het instellingsemailadres werkt bij mij niet meer, bij jullie wel? (edwin@uva.nl heeft in ieder geval mail ontvangen :-)
• Check your mail scherm 2 dingen: 1. De terug-arrow moet kleiner. 2. linkjes naar gmail/outlook in grijs zetten (zijn secundair), en bij mouse-ver blauw en underlined. (edwinvandebospoort - Oct 6, 2020)

[phavekes]

(Peter Havekes - Oct 19, 2020)

[phavekes]

@phavekes  The email of the user used to display the mail has been send screen is from the JavaScript app. If you refresh your screen then it\'s gone. But it does work, see attachment (Okke Harsta - Oct 19, 2020)

[phavekes]

@phavekes we of course only check the institutional domain when you sign up. Once you have signed up, we omit the warning. (Okke Harsta - Oct 19, 2020)

[phavekes]

@edwinvandebospoort  (Okke Harsta - Oct 20, 2020)

[phavekes]

@okkeh heb jij ook de opmerking van Edwin over de grootte van back arrow meegenomen? Ik kan het even niet meer overzien ;) (Arnout Terpstra - Oct 20, 2020)

[phavekes]

@arnoutt Ja. back-arrow icon is vervangen. Volgens Edwin is deze story nu goed. (Okke Harsta - Oct 20, 2020)