desci-labs / nodes-web

UI to create and consume interoperable research objects
https://nodes.desci.com
GNU Affero General Public License v3.0
12 stars 3 forks source link

UI Changes - Add Component View #164

Closed nillabeanrc88 closed 1 year ago

nillabeanrc88 commented 1 year ago

Loom Video: https://www.loom.com/share/6f463d9649bd4dfd8bba8b216e577d42 Figma Designs: https://www.figma.com/file/fq5PkOL7FNMDTCf1BQMRz1/DeSci-Nodes-(Beta)?type=design&node-id=3201%3A245231&t=c5g3hf1hWWhoXFd4-1

Tasks:

  1. Adjust Title and Subtitle Font Sizes: The title font size needs to be reduced from 28px to 18px. Also, the font size of the text below the title needs to be reduced from 16px to 14px.
  2. Update 'Upload Individual Component' section:
    • Update the icon to match the new design.
    • Ensure the text reads 'Upload Individual Component'.
    • Adjust the text size from 21px to 16px for 'Upload Individual Component'.
    • Ensure the text below 'Upload Individual Component' is 14px, consistent with the new design.
  3. Consistency in Changes: Ensure that the changes made to the 'Upload Individual Component' section are replicated in similar sections below.
  4. Update 'Component Library' section:
    • Check if 'Other' option is present.
    • Ensure that the 'Add your first component' pop-up has a drop shadow on the back.
    • Confirm if 'Interactive Notebook' is missing and if so, add it to the section.
    • Review the thickness of the line around the icon; in the new design, it should be 1px.
  5. First Time User Experience: Review if there's a way to dismiss the initial experience guide. This isn't currently in the design but may be needed for users who aren't ready to add their first component.
  6. Review Container Width Consistency: Confirm that the width of the header and the combined width of the tiles are the same (728px).