Merge branch 'develop' into version-switcher

Author: ksen0

README.md

@@ -16,6 +16,12 @@ Learn more about [our community](https://p5js.org/community/) and read our commu
 
 Make your first sketch in the [p5.js Editor](https://editor.p5js.org/)! Learn more about sketching with p5.js on the [Get Started](https://p5js.org/tutorials/get-started/) and find everything you can do in the [Reference](https://p5js.org/reference/). You can also look at [examples](https://editor.p5js.org/p5/sketches) and remix them in the p5.js Editor.
 
+## Contributing
+
+[Contributing to the p5.js Web Editor](https://github.com/processing/p5.js-web-editor/blob/develop/contributor_docs/README.md)
+
+[p5.js Community Statement](https://editor.p5js.org/code-of-conduct)
+
 
 ## Issues
 
@@ -24,18 +30,6 @@ If you have found a bug in the p5.js Web Editor, you can file it under the ["iss
 * p5.js library: [https://github.com/processing/p5.js/issues](https://github.com/processing/p5.js/issues)
 * p5.js website: [https://github.com/processing/p5.js-website/issues](https://github.com/processing/p5.js-website/issues)
 
-
-## References for Contributing to the p5.js Web Editor
-
-[Code of Conduct](https://editor.p5js.org/code-of-conduct)
-
-[Contribution Guidelines for p5.js](https://p5js.org/contributor-docs/#/)
-
-[Contribution Guidelines for the p5.js Web Editor](https://github.com/processing/p5.js-web-editor/tree/develop/contributor_docs)
-
-[p5.js Community Statement](https://p5js.org/community/)
-
-
 ## Acknowledgements
 
 Support for this project has come from [Processing Foundation](https://processingfoundation.org/), [NYU ITP](https://tisch.nyu.edu/itp), [CS4All, NYC DOE](http://cs4all.nyc/), [COSA at DU](https://liberalarts.du.edu/emergent-digital-practices/open-source-arts), [STUDIO for Creative Inquiry](https://studioforcreativeinquiry.org/), [Grant for the Web](https://www.grantfortheweb.org/), [New Media Rights](https://www.newmediarights.org/), and many others. 

client/styles/components/_overlay.scss

@@ -61,7 +61,7 @@
 
 .overlay__close-button {
   @include icon();
-  padding: #{math.div(3, $base-font-size)}rem 0 #{math.div(3, $base-font-size)}rem #{math.div(10, $base-font-size)}rem;
+  padding: #{math.div(3, $base-font-size)}rem 0 #{math.div(3, $base-font-size)}rem;
 }
 
 /* Fixed height overlay */

client/styles/components/_sketch-list.scss

@@ -101,6 +101,7 @@
   }
 
   & svg {
+    margin-left: #{math.div(5, $base-font-size)}rem;
     @include themify() {
       fill: getThemifyVariable("inactive-text-color");
     }

contributor_docs/installation.md

@@ -6,7 +6,7 @@ Follow these instructions to set up your development environment, which you need
 
 _Note_: The installation steps assume you are using a Unix-like shell. If you are using Windows, you will need to use `copy` instead of `cp`.
 
-1. Install Node.js. The recommended way is to Node through [nvm](https://github.com/nvm-sh/nvm). You can also install [node.js](https://nodejs.org/download/release/v16.14.2/) version 16.14.2 directly from the Node.js website.
+1. Install Node.js. The recommended way is to Node through [nvm](https://github.com/nvm-sh/nvm). You can also install [node.js](https://nodejs.org/download/release/v16.14.2/) version 16.14.2 directly from the Node.js website. To check if you already have Node installed on your computer, run `$ node -v`.
 2. [Fork](https://help.github.com/articles/fork-a-repo) the [p5.js Web Editor repository](https://github.com/processing/p5.js-web-editor) into your own GitHub account.
 3. [Clone](https://help.github.com/articles/cloning-a-repository/) your new fork of the repository from GitHub onto your local computer.
 
@@ -29,12 +29,12 @@ _Note_: The installation steps assume you are using a Unix-like shell. If you ar
 9. (Optional) Update `.env` with necessary keys to enable certain app behaviors, i.e. add Github ID and Github Secret if you want to be able to log in with Github.
    * See the [GitHub API Configuration](#github-api-configuration) section for information on how to authenticate with Github.
    * See the [S3 Bucket Configuration](#s3-bucket-configuration) section for information on how to set up an S3 bucket
-11. Run `$ npm run fetch-examples` to download the example sketches into a user called 'p5'. Note that you need to configure your GitHub Credentials, which you can do by following the [Github API Configuration](#github-api-configuration) section.
-12. Enable Prettier in your text editor by following [this guide](https://prettier.io/docs/en/editors.html).
-13. `$ npm start`
-14. Navigate to [http://localhost:8000](http://localhost:8000) in your browser
-15. Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en)
-16. Open and close the Redux DevTools using `ctrl+h`, and move them with `ctrl+w`
+10. Run `$ npm run fetch-examples` to download the example sketches into a user called 'p5'. Note that you need to configure your GitHub Credentials, which you can do by following the [Github API Configuration](#github-api-configuration) section.
+11. Enable Prettier in your text editor by following [this guide](https://prettier.io/docs/en/editors.html).
+12. `$ npm start`
+13. Navigate to [http://localhost:8000](http://localhost:8000) in your browser
+14. Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en)
+15. Open and close the Redux DevTools using `ctrl+h`, and move them with `ctrl+w`
 
 ## Docker Installation
 

translations/locales/en-US/translations.json

@@ -172,7 +172,7 @@
   },
   "Preferences": {
     "Settings": "Settings",
-    "GeneralSettings": "General settings",
+    "GeneralSettings": "General Settings",
     "Accessibility": "Accessibility",
     "LibraryManagement": "Library Management",
     "Theme": "Theme",