dashboard: base setup

[thelostone-mc]

Description

Reason for this PR
Rather than working on explorer page and submitting a PR with tons of changes.
I'd wanna break it into batches (small deliverables ) => easier to review and merge

This PR has two commits

• added support for Muli font family
• reindent /explorer page and added missing closing tag

This would be the first of the series.
Me and @eswarasai will start on the explorer page soon. Figured I'd get some cleaning up done beforehand to make our work easier

Checklist

• changes don't break existing behavior
• commit message follows commit guidelines

Refers/Fixes

• Update styling on bounty flow #487

cc: @owocki

[owocki]

i wish there was an easy way to say via github diffs that this is just formatting changes without having to do it line by line :/

this lgtm; @mbeacom ?

[thelostone-mc]

@owocki I also added another commit here!
Just added Muli fonts to our code base

[eswarasai]

@thelostone-mc -- I've added .editorconfig to ensure that the spacing issues won't occur in the future and also to follow standard indentation throughout the project. Can you please try to configure your IDE to use the local .editorconfig and fix the spacing issues?

cc: @owocki @mbeacom

[thelostone-mc]

@eswarasai thoughts on shifting to 2 spaces = 1 tab for html pages ?
#487 (comment)

@coderberry

[eswarasai]

@thelostone-mc -- Sure. If that's what ideal and preferable, then we can definitely remove html from 4-space indentation.

@owocki @mbeacom -- Any objections here?

[owocki]

defer to @mbeacom on this one.. ill do whatever the group does

[mbeacom]

lgtm - I'm fine with the indentation change. I think it would be beneficial for us to document the styling guidelines, though.

[mkosowsk]

@mbeacom

Is it in the roadmap to use something like Prettier to codify code formatting?

[mbeacom]

@mkosowsk Yes! We're currently in the deliberation stage of determining an approach to automatic styling and enforcement of style. I'd love to remove the guess work as much as possible for community contributors and reduce the friction (as well as manual interaction/intervention) for contributions.

I'm open to discuss how we tackle this moving forward.

[mkosowsk]

@mbeacom Using Prettier seems relatively straightforward:

1. Install dependencies
2. Configure prettier.rc with JSON of agreed upon styles (bracketSpacing, tabWidth, etc.)
3. I'm using TypeScript so here I use a TSLint but Gitcoin would use an ESLint. Seems that there are some issues with using Prettier and a lint but looks like they're straightforward to resolve:

https://stackoverflow.com/questions/44690308/whats-the-difference-between-prettier-eslint-eslint-plugin-prettier-and-eslint

4. Configure .lintstagedrc
5. Add appropriate scripts to package.json that people can run before submitting PR's
6. Contributors now can write and commit pretty code by just running a script after
   doing their work 😍

Might be interesting to open up to the community what type of standards they think are good to enforce 👍🏻

Think this is a very important topic to tackle so that contributors can focus their energy on more crucial things, like whether or not to use emoji in the codebase. I personally give that idea two 👍 way up!