completed setup

.eslintrc.json

@@ -0,0 +1,25 @@
+{
+ "env": {
+ "browser": true,
+ "es6": true,
+ "jest": true
+ },
+ "parser": "babel-eslint",
+ "parserOptions": {
+ "ecmaVersion": 2018,
+ "sourceType": "module"
+ },
+ "extends": ["airbnb-base"],
+ "rules": {
+ "no-shadow": "off",
+ "no-param-reassign": "off",
+ "eol-last": "off",
+ "import/extensions": [ 1, {
+ "js": "always", "json": "always"
+ }]
+ },
+ "ignorePatterns": [
+ "dist/",
+ "build/"
+ ]
+}

.github/workflows/linters.yml

@@ -0,0 +1,70 @@
+name: Linters
+
+on: pull_request
+
+env:
+ FORCE_COLOR: 1
+
+jobs:
+ lighthouse:
+ name: Lighthouse
+ runs-on: ubuntu-22.04
+ steps:
+ - uses: actions/checkout@v2
+ - uses: actions/setup-node@v1
+ with:
+ node-version: "12.x"
+ - name: Setup Lighthouse
+ run: npm install -g @lhci/cli@0.7.x
+ - name: Lighthouse Report
+ run: lhci autorun --upload.target=temporary-public-storage --collect.staticDistDir=.
+ webhint:
+ name: Webhint
+ runs-on: ubuntu-22.04
+ steps:
+ - uses: actions/checkout@v2
+ - uses: actions/setup-node@v1
+ with:
+ node-version: "12.x"
+ - name: Setup Webhint
+ run: |
+ npm install --save-dev hint@7.x
+ [ -f .hintrc ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.hintrc
+ - name: Webhint Report
+ run: npx hint .
+ stylelint:
+ name: Stylelint
+ runs-on: ubuntu-22.04
+ steps:
+ - uses: actions/checkout@v2
+ - uses: actions/setup-node@v1
+ with:
+ node-version: "12.x"
+ - name: Setup Stylelint
+ run: |
+ npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x
+ [ -f .stylelintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.stylelintrc.json
+ - name: Stylelint Report
+ run: npx stylelint "**/*.{css,scss}"
+ eslint:
+ name: ESLint
+ runs-on: ubuntu-22.04
+ steps:
+ - uses: actions/checkout@v2
+ - uses: actions/setup-node@v1
+ with:
+ node-version: "12.x"
+ - name: Setup ESLint
+ run: |
+ npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x
+ [ -f .eslintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/javascript/.eslintrc.json
+ - name: ESLint Report
+ run: npx eslint .
+ nodechecker:
+ name: node_modules checker
+ runs-on: ubuntu-22.04
+ steps:
+ - uses: actions/checkout@v2
+ - name: Check node_modules existence
+ run: |
+ if [ -d "node_modules/" ]; then echo -e "\e[1;31mThe node_modules/ folder was pushed to the repo. Please remove it from the GitHub repository and try again."; echo -e "\e[1;32mYou can set up a .gitignore file with this folder included on it to prevent this from happening in the future." && exit 1; fi

.gitignore

@@ -0,0 +1 @@
+node_modules

.hintrc

@@ -0,0 +1,18 @@
+{
+ "connector": {
+ "name": "local",
+ "options": {
+ "pattern": ["**", "!.git/**", "!node_modules/**"]
+ }
+ },
+ "extends": ["development"],
+ "formatters": ["stylish"],
+ "hints": [
+ "button-type",
+ "disown-opener",
+ "html-checker",
+ "meta-charset-utf-8",
+ "meta-viewport",
+ "no-inline-styles:error"
+ ]
+}

.stylelintrc.json

@@ -0,0 +1,22 @@
+{
+ "extends": ["stylelint-config-standard"],
+ "plugins": ["stylelint-scss", "stylelint-csstree-validator"],
+ "rules": {
+ "at-rule-no-unknown": null,
+ "scss/at-rule-no-unknown": [
+ true,
+ {
+ "ignoreAtRules": [
+ "tailwind",
+ "apply",
+ "variants",
+ "responsive",
+ "screen"
+ ]
+ }
+ ]
+ },
+ "csstree/validator": true,
+ "ignoreFiles": ["build/**", "dist/**", "**/reset*.css", "**/bootstrap*.css"]
+ }
+

README.md

@@ -1 +1,54 @@
-# Leaderboard
+## **Description**
+The **leaderboard** website displays scores submitted by different players. It also allows you to submit your score. All data is preserved thanks to the external [Leaderboard API service](https://www.notion.so/microverse/Leaderboard-API-service-24c0c3c116974ac49488d4eb0267ade3)
+
+## **Project Goals:**
+- Use [Gitflow](https://github.com/microverseinc/curriculum-transversal-skills/blob/main/git-github/gitflow.md).
+- Setup project with [Webpack](https://github.com/microverseinc/curriculum-javascript/blob/main/todo-list/lessons/webpack_v1_1.md).
+
+
+
+## **Build With:**
+- HTML
+- CSS
+- JavaScript
+- Webpack
+
+## **SETUP**
+To make use of this project, kindly run any of the following commands.
+
+```
+git clone https://github.com/Ridwanullahi-code/Leaderboard.git
+```
+or 
+
+```
+git clone git@github.com:Ridwanullahi-code/Leaderboard.git
+```
+```
+npm install 
+```
+To run the project on server, run below command 
+```
+npm start
+```
+## **Show your support**
+
+Give a ⭐️ if you like this project!
+
+## **Authors**
+
+- Github: [Ridwan](https://github.com/Ridwanullahi-code)
+
+
+## 🚀 **About Me**
+I'm full stack software developer, Computer science, and Microverse student.
+
+**Stack:** Python, JavaScript, Bootstrap, Ruby, Rails, React, Redux. Available for hire!
+
+
+## **Acknowledgements**
+ - [Microverse](https://www.microverse.org/)
+
+## **License**
+
+This project is [MIT](https://choosealicense.com/licenses/mit/) licensed.

babel.config.json

@@ -0,0 +1,4 @@
+// without options
+{
+ "plugins": ["@babel/plugin-transform-modules-commonjs"]
+}

css/index.css

@@ -0,0 +1,59 @@
+@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap");
+
+* {
+ box-sizing: border-box;
+ padding: 0;
+ margin: 0;
+ font-family: "Poppins", "Times New Roman", sans-serif;
+}
+
+header {
+ text-align: center;
+}
+
+main {
+ height: 80vh;
+ display: flex;
+ justify-content: space-around;
+ align-items: center;
+}
+
+.display-section {
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+}
+
+.display-section div {
+ display: flex;
+ gap: 10px;
+ align-items: center;
+}
+
+.refresh-btn {
+ padding: 2px 2em;
+}
+
+table {
+ border-collapse: collapse;
+ width: 30vw;
+ border: 1px solid grey;
+}
+
+table tr:nth-child(even) {
+ background-color: rgba(128, 128, 128, 0.381);
+}
+
+table tr:hover {
+ background-color: #ddd;
+}
+
+table td {
+ padding: 3px;
+}
+
+.add-section form {
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+}