Dataset Page Redesign

[djbrooke]

Now that we've taken in and analyzed user feedback on the Dataset and File Page (#3404), we should move towards implementation. The plan is to implement the new file page and new dataset page as individual issues instead of one larger issue.

@TaniaSchlatter to include a mockup here. We'll plan to discuss before this enters a sprint.

[TaniaSchlatter]

Note that the primary goals of this redesign are to:

1. address scaleability to better support the growing variety of dataset-level functions and tools
2. improve accessibility and compliance with WCAG 2.0 standards
3. support a variety of browser states (responsiveness to browser viewport shifts and mobile access – this is addressed in the design changes but might not be implemented as part of this issue)
4. communicate information and functionality to users in concert with the redesigned File page (File Page Redesign #6604).
5. Address and close several issues that effect the UI, itemized below.

[TaniaSchlatter]

Prioritized list
Link to mockups: https://sketch.cloud/s/o5ZK3/a/OMPJGR
Itemization of changes:

1. Change layout and styling of action buttons on the top of the dataset page (effects the button display code on the file page) UI Cleanup - Action Button + Metrics Block Layout #3341, Improve visibility of buttons for data owners #3815
2. Truncate UNFs, MD5s, etc. to show first 4-7 and last 3 characters Long (e.g. SHA-512) fixity checksums are too long for display #5210
   • Truncate summary metadata and enable open/close functionality to view all
3. Remove name of dataset from breadcrumb Improve the clarity of page types and their purpose #3953
   - Change styling and layout of metrics block UI Cleanup - Action Button + Metrics Block Layout #3341
   • Adjust the layout of summary metadata to reduce space between labels and text
4. Update styling of file table tabs
5. Refine layout of file table sort/filter/search functions to support flexible viewport and styling updates, along with enabling search of file tags UI to enable file tags to be searched #4122 (and file tag issues: File Tags - Improve UI/UX and misc. bugs #6074)
6. Change file table button style and appearance in the UI to maximum 3 icon buttons (3rd being "kabob" to display additional actions in a dropdown) to support file feature scaleability
   • Change file table cards to support flexible viewports/responsive design, truncate file labels if needed
7. Move dataset thumbnail into citation block Improve thumbnails #6450
   • Add clipboard icon and click to copy functionality to DOI in citation block As a Dataverse user, I'd like to be able to select and copy just the DOI from the citation block #4994