Skip to content

Scinage Redesign

Stanley Huang requested to merge update-styles into login-page

These MRs should be merged first: https://git.uwaterloo.ca/science-computing/Scinage/merge_requests/43, !11 (closed)

Once the above MRs are merged, the base of this MR should be changed to master

Summary

This MR adds in new styles for the initial redesign of the Scinage app. This is not a final redesign, rather, a first pass at a redesign and is subject to stakeholder approval.

Makes the following changes:

Other Changes

  • Updated all top level pages (home, groups, images, widgets, screens, slides, trash, videos)
  • Minor re-ordering of frontend code, CSS and JS
  • Sets a cookie named "sidebarCollpased" to persist the sidebar state, which is expanded by default
  • Created Vue components
    • card -> Used to display tiles on the frontpage
    • info-panel -> Used to display secondary info on pages
    • page-header -> Used to display standardized page header
    • sidebar -> Used for the left navigation sidebar
    • sidebar-item -> Each item in the sidebar

Other changes made since the initial MR opened:

  • Persist sidebar state as a cookie
  • Changed card hover effect to highlight instead
  • Force the sidebar to collapse on widget edit/slide edit pages
  • Remove some of the wasted space
  • Fixed some bugs with the slide edit and widget edit page
  • Made the slide cards wider on the slideshow page

What this MR will not include (will come at a later time)

  • Changing Vue to production mode (this will come at a later time)
  • Updating non-top level pages
  • Updating the slide creation experience
  • Updating home page with screenshots of slides/widgets or analytic information
  • Other non-stylistic changes
  • Updating styles on login/auth pages
Screenshots image image image image image image image image image image image image image image
Edited by Stanley Huang

Merge request reports