ORCA Beautification Hackathon

March 23-24 2023

Global TODOs and notes for discussion

  • typography across views
  • horizontal container - consider prose line length ideals
  • Consistency of when to use a card visual language (card implies interactivity)
    • We're now using it for the login form, but this might be an inconsistency
  • Casing: use sentence case in headings and buttons
  • Sometimes heading levels are arbitrary

Views/Partials and TODOs

  • Login

    • Center the login form
    • Change copy on submit buttons to be more precise: Log in -> "Send Code"

  • Members (list)

  • Member detail

  • Achievements (list)

    • Update grid layout with auto-fill

  • About

    • Hide url if org url is null

  • +error.svelte

    • apply

  • Home page ç

    • empty state improvements: add an illustration
    • Grid when there are less than 4 badges … center them?

  • AchievementForm

    • Image preview is very verbose… if there's an image, make a replace action, show preview within
    • Fixing spacing of select arrow on category select input – it's too close to the edge
    • Criteria preview, switch to a tabbed view like GitHub does.
    • Mark required fields before entry
    • Make Heading left-aligned, use Heading component
    • Maybe a grid with a "FR" would be better than the flex layout we're adding
    • Clean up typography on claim config instructions - change color

  • Backpack

    • Empty state – lose the dropzone looking thing.
    • Update card appearance to match achievement list

  • Breadcrumb component

    • Separator could be made a tiny bit cuter

  • Award badge form

    • the name of the badge in the preview card is clickable. Probably shouldn't be in this context.

Components

  • Heading: new component for a section title followed by a paragraph of description
    • Specify override for the size
  • A layout component for a form component that includes some inputs
  • Handle Icons and Icon Button a bit more nicely
  • AchievementSummary component: Remake layout
  • AchievementStatusTag: refactor into component, make it more in the foreground

Other Bugs and improvements

  • typed in an invalid email, it flashed the error but then continued to a page that said "check your email for an invitation link"
  • Sometimes form validation wasn't triggering on AchievementForm input blur
  • Category is not a required field
  • Enable creation of a category if they want a new one
  • Bootstrap fixture creation script to spin up a community with a few achievements, categories, etc, for local development
  • Consider: "Button" is a bit weird name to have for a component that is sometimes an <a>?
  • Login: catch login error and render error on login form so user can try again instead of allowing fallthrough to +error.svelte
  • When navigating from the Achievement detail view to the award view for that achievement, the award component appears below the achievement detail view component then disappears.
  • Upon invite, when you don't agree to terms, you lose your work, because you get redirected to error view.
  • On claim edit, the form is now in a modal, but the actions are duplicated.
Select a repo