Skip to content

Latest commit

 

History

History
38 lines (23 loc) · 1.48 KB

CONTRIBUTING.md

File metadata and controls

38 lines (23 loc) · 1.48 KB

Contributing

  • Commit Lint w/ Conventional Commits
  • Prettier

Style guide

Overall Look and Feel of Code-Comp

Code-Comp's overall look and feel should be high-tech. The use of darker colours and 3D features such as the Hero should give the user a futuristic feel to reflect on the product.

Colors

Code-Comps colour scheme follows a dark theme that is pleasing to the eye and has a high-tech feel, reminiscent of big tech sites such as Github. Other colours can be used if necessary.

  • color-light: hsl(220, 80%, 90%);
  • color-dark: hsl(220, 80%, 10%);
  • color-primary: hsl(220, 80%, 50%);
  • color-secondary: hsl(220, 80%, 30%);
  • color-tertiary: hsl(220, 80%, 70%);
  • color-background: hsl(220, 30%, 10%);

Iconography:

Icons should be sleek and clean with a modern design to match the rest of the site. Most icons should be flat if incorporated into text (ex. profile icon) Exceptions can be made to these rules such as is the case with the 3D-Hero.

Typography:

The majority of the text will be using Lato, Arial, Times New Roman and Georgia from Google Fonts. Exceptions can be made if needed.

Links:

Links on the site will be emphasized with some combination of: underline, bold, hover color change or hover size change, depending on what is required for the situation to give a clean and advanced feel to the site.

Buttons:

Buttons are flat on the screen with some having hover effects, such as change in colour or change in size, to emphasize the futuristic feel.