Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Zelda Audit #5652

Closed
JohnONolan opened this issue Aug 11, 2015 · 32 comments

Comments

@JohnONolan
Copy link
Member

commented Aug 11, 2015

Followup of #5314

ALL TESTED IN SAFARI 8.0.7 for OSX - I am actively working on these issues

  • Broken publish menu position image
  • Dropdown shadow too heavy image
  • "Team" is lowercase and author name is cut off, on author profiles image
  • Button alignment and button text alignment are wrong on author cover image upload modal image
  • Loading buttons are not centered
  • No indication that saving settings has succeeded
  • "View blog" contrast too low
  • Full name should align with fields below image
  • Button text alignment on invite user is wrong image
  • Invitation confirmation should be a notification rather than an alert image
  • There is no indication of any kind when you "resend" and invitation
  • Unstyled validation on settings/general image
  • Subsequent error loop of death image / console
  • Further saves of settings/general do nothing
  • Contrast on tag description too low image
  • Settings menu image upload-by-URL button alignment is wrong image
  • Meta data submenu missing right-chevron on tag-settings-menu image
  • Tried to save user after changing role from author=>editor, infinite loading button, nothing happened
  • For some reason clicking anywhere in the content highlights the entire thing image
  • validation causing forms to load with green icons (should be grey) image
  • Signin form should not be validating inline if field is empty image
  • Not enough space for validation on signin form image
  • Editor frequently ends up in a state where the loading button is permanently spinning for no reason when you open it. Seems to happen when a loading spinner has stalled out or messed up on a previous screen. image
  • "Edit icon" on content management screen should not have an :active / depressed state
  • Hit area on the ? icon is WAY too small
  • Can't actually sign in at all on Chrome - licecap - terminal - console (when I then manually refreshed, I was already signed in)
  • AutoNav flickering - safari / chrome
  • The width of the publish button is being set with JS (why?!) which is breaking whenever the content changes image
  • Publish button height has regressed image
  • CMD+Backspace does not work to delete a post in safari (content mgmt screen)
  • Tag input has unintentional box shadow image
  • The download count on setup is incorrectly formatted (needs comma) image
  • Do not validate empty form fields on setup image
  • Pressing "tab" after the last input field takes keyboard focus to address bar. Should be: submit button. image
  • User invite validation should be properly coloured image
  • Validation message does not disappear even though I have fixed it image
  • Can we inject that validation message into the button instead of under the textarea?
  • "Failed to send 1 invitationS ? Come on now. Aside from bad grammar, this also needs to be more helpful and offer a suggestion as to why this might be the case. image
  • Duplicate alerts should not stack image
  • When I click back to step 2, my password field is empty and validation is red. Now I don't know if I need to enter this again, or not? Has this step already been completed? Do I have to do it again? Genuinely confused, and I know how this works, roughly! image
  • Hang on, what instructions? Why do I need instructions? image
  • Clicked on "forgot password" and then nothing happened, at all, except the button disabled itself. What am I supposed to do now? (Also, clearly it couldn't send the email, I haven't got any mail svc configured) image -- oh, after like 10 mins this appeared image

By Hannah

  • gravatar behaviour doesn't fire until blur moved to #5797
  • skip to content link doesn't work detailed comment
  • need to hide search bar
  • using tab navigation on tag page TSM causes meta menu to half-open image - reproduce by putting cursor in name field and tabbing until you see this.
  • session expiry issues
  • loading interstitial & pre-app loading screen moving to post-zelda
  • double click to open post not working on content screen
  • No validation on user invites

Loading buttons: Don't know how to solve

When an action takes more than 1s, the loading spinner makes sense in a button. But when an action takes 0.1s - adding/removing a loading spinner makes the button feel broken. I think we need a mandatory "success" animation which can follow the loading animation when the route is not changing. I don't think this is going to be easy.

Also: When logging in, the loading button stops spinning before the admin loads. This should not happen. It should keep spinning all the way until the route changes without ever stopping

Mobile

All tested on latest Chrome for iOS

  • Small viewport: title cut off image
  • Mobile menu should close on route change
  • "Collapse sidebar" icon should also close mobile menu
  • Mobile menu hit area too small
  • Horizontal scroll/overflow when mobile menu is open
  • Can't edit any post (when you tap on post in content mgmt, nothing happens)
  • Need a way to trigger mobile uploads

@JohnONolan JohnONolan self-assigned this Aug 11, 2015

@JohnONolan JohnONolan added this to the Zelda milestone Aug 11, 2015

cobbspur added a commit to cobbspur/Ghost that referenced this issue Aug 11, 2015
Fix spinner on settings page
refs TryGhost#5652

- stops spinner from spinning forever on settings screen when saving
@ErisDS ErisDS referenced this issue Aug 11, 2015
22 of 25 tasks complete
JohnONolan added a commit to JohnONolan/Ghost that referenced this issue Aug 12, 2015
JohnONolan added a commit to JohnONolan/Ghost that referenced this issue Aug 12, 2015
Multiple minor visual style fixes
- Lighter dropdown shadow
- Removed display:flex from .btn because safari can't handle it on <button> elements, where it will immediately set all text-alignment to "left" with no way to change. I haven't been able to find any regressions for this change so far. Can't remember why buttons were supposed to be flexbox anyway. Maybe for icon alignment within buttons, but I can't find any such examples within the app.
- Safari thinks that user-select: all; means a single click should SELECT ALL THE THINGS. Removed/replaced with user-select: text; which makes it behave like Chrome; click and drag to select.
- Increased hit area for "?" button
- Removed :active style for post-edit button on content management screen, adjusted position
- Increased contrast on tag description, tag count, and view blog links

See TryGhost#5652
JohnONolan added a commit to JohnONolan/Ghost that referenced this issue Aug 13, 2015
JohnONolan added a commit to JohnONolan/Ghost that referenced this issue Aug 13, 2015
Variety of style fixes
- Modal button position tweaked, removed extraneous margin
- Fix user profile full name field and mobile profile-picture
- Added chevron to tag settings men, corrected chevron colour
- Fixed regression in delete-tag button caused by removing flexbox from buttons
- Fixed regression in button positioning on about-ghost page caused by removing flexbox from buttons

See TryGhost#5652
@acburdine

This comment has been minimized.

Copy link
Member

commented Aug 18, 2015

@JohnONolan the reason the width of the publish button is being set with JS is because when the spinner is activated on post save, the width of the button will shrink to the size of the spinner. This can be removed; however, I didn't have any other good ideas on what to do to prevent the button from shrinking when the spinner is active.

@JohnONolan

This comment has been minimized.

Copy link
Member Author

commented Aug 19, 2015

@acburdine The way we handle this on Ghost.org is that when a loading-button is clicked:

  1. The width of the button is retrieved with jQuery
  2. The width of the button is set to itself with jQuery
  3. The text of the button is replaced with the span of the loading element with jQuery

(so width is only fixed when it needs to be, not all the time)

@acburdine

This comment has been minimized.

Copy link
Member

commented Aug 20, 2015

@JohnONolan ah gotcha. That's kind of the way I was doing it, but not exactly, so I'll PR a fix to it.

acburdine added a commit to acburdine/Ghost that referenced this issue Aug 20, 2015
fix auto width and height of spin button component
refs TryGhost#5652
- changes the spin-button so that it only sets the size when the button is submitting instead of all of the time
@kevinansfield

This comment has been minimized.

Copy link
Contributor

commented Aug 20, 2015

Can't actually sign in at all on Chrome

I've just seen the same issue in Safari too

kevinansfield added a commit to kevinansfield/Ghost that referenced this issue Aug 20, 2015
Minor UI fixes for invitations
issue TryGhost#5652
- display "Sending Invite..." text after clicking "RESEND" link
- change "Invitation sent" alert to notification
cobbspur added a commit to cobbspur/Ghost that referenced this issue Aug 28, 2015
No validations on setup for empty fields
refs TryGhost#5652

 - new action on focusOut which only calls validate if the fields has a value
kevinansfield added a commit to kevinansfield/Ghost that referenced this issue Aug 31, 2015
Basic post/user search
refs TryGhost#5343, TryGhost#5652
- implements basic post and user search using selectize input
- queries minimal API endpoint and refreshes results on search input focus if results are older than 60 seconds
ErisDS added a commit to ErisDS/Ghost that referenced this issue Sep 1, 2015
Form field icons load in default 'grey' state
ref TryGhost#5652

- validations can be in default, success or error state
- adds check for 'hasValidated' if the validations haven't fired yet, the field is in the default state
- hasValidated is an Ember.Array which tracks the state for each field
kevinansfield added a commit to kevinansfield/Ghost that referenced this issue Sep 1, 2015
Mobile markdown/preview tabs
refs TryGhost#5652
- on mobile, add Markdown/Preview links to the editor footer that switch between the respective views
- temporary resolution to the inability to upload on mobile without access to the preview
ErisDS added a commit to ErisDS/Ghost that referenced this issue Sep 2, 2015
Make skip link work with Ember
refs TryGhost#5652

- handles the skip link using js so that ember doesn't interfere with the anchor
- uses the code suggested here: https://www.codehive.io/boards/pZUuwIk
kevinansfield added a commit to kevinansfield/Ghost that referenced this issue Sep 2, 2015
Better flickering auto-nav fix
refs TryGhost#5652
- reverts previous fix (TryGhost#5698) to return translate3d smoothness
- add separate open-autonav toggle element and style it to always stick to the viewport edge to avoid wandering hover hit areas
ErisDS added a commit to ErisDS/Ghost that referenced this issue Sep 2, 2015
Adds rudimentary validation to user invite
refs TryGhost#5652

- with these changes, validation appears, but doesn't properly prevent closing the modal
- this needs revisiting at some point
@ErisDS

This comment has been minimized.

Copy link
Member

commented Sep 2, 2015

Items are all checked off!

@ErisDS ErisDS closed this Sep 2, 2015

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
4 participants
You can’t perform that action at this time.