Skip to content

Main Site Styling

Jump to bottom
Vitor Vicente edited this page Mar 9, 2020 · 1 revision

Foundations

The Main Website utilizes the following core colors:

  • #333 - Dark Grey
  • #fff - White
  • #f21131 - Light Red
  • #C30000 - Accent Red
  • #6C0000 - Dark Red

In addition, it makes use of the following two fonts:

  • Gruppo - Titles & Standouts
  • Andale Mono, monospace - Remaining Text

Please make sure to make use of these so that everything is consistent.


CSS Files

The main.css file contains all the CSS for the static elements directly encoded into a page element, any and all global changes must be made here.

All specific components have their own CSS in their own files, each labeled accordingly. To edit their CSS edit the specific file.


Calendar.css

This specific file was not made by any UPE member but comes directly from the react-big-calendar import, there is very little documentation online on how to alter it, and besides the basic colors, we have changed very few attributes. Tread carefully when editing it and always check if you haven't made a mistake.

In order to reload the CSS of the calendar, you'll need to remove the import statement from the EventsCalendar.js, reload the page, and put the statement back in.

Clone this wiki locally