This Team Colors is a fork from Team Colors is a reference of HEX values for the brand colors of major league sporting teams.
PHP is used to parse and load the HTML markup. Javascript is used to load vector versions of the team logos with PNG fallbacks.
Team Colors data is rendered from the team-data.json
file. Any changes to the data of the page can be done from that file. Teams are sorted according to their respective leagues. Leagues and league navigation controls are all rendered from this single .json
file.
If you want to edit a team's name or color(s), find the team's entry in teams.json
.
If you want to add a team, add the team name and colors in teams.json
. Then, add a .svg logo in the appropriate img/
directory, with the team's name (as stated in team-data.json
) in lowercase with hyphens in place of spaces.
Adding a league is relatively straight forward. Copy the model used for structuring data in team-data.json
, add the appropriate logos, and you're done.
CSS is built and compiled using compass. Partials are in src/sass/
and are compiled to stylesheets in css/
.
Specialized version of modernizer tests support for SVG only. If SVG is supported, a class of 'svg' is added to the body.
This class is important. The main script will check to see if the body has a class of svg. If it does, the team logos (in .svg fomat) will be loaded. Otherwise, the team logos are not loaded.
All team logos are in .svg format. See documentation on modernizer for more info.