3D Hero Banner (#58)

* Hide right border of last navbar item

* Added three.js dependencies

* Started integrating HeroBanner3d

* Added ocean

* Configured sun at sunset

* Configured sun at sunset

* Slower water

* Renamed OceanAndSky to Environment

* Stop animation after a few text loops

* Added config for HeroBanner3d inside docusaurus.config.js; choose 2d or 3d banner according to config

* Updated index.test.js to test for 3d hero banner

* Added unit tests for AnimatedText and Environment

* Added unit tests for HeroBanner3d and Ocean; bumped to 1.6.0

CHANGELOG.md

@@ -7,6 +7,9 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
 You should update the version number in the [package.json](./package.json) according to the semantic versioning,
 then run `npm install`.
 
+## 1.6.0
+- Added 3D hero banner
+
 ## 1.5.1
 - Bumped to node 16, docusaurus 2.0.1, react 17.0.2
 

CONTRIBUTING.md

@@ -26,12 +26,18 @@ This project uses [Jest](https://jestjs.io/) for unit testing. When contributing
 
 The naming convention for a file `foo.js` is to put the related unit tests next to it as `foo.test.js`.
 
-Run the unit tests with:
+Run all the unit tests with:
 
 ```
 npm run test
 ```
 
+or a specific unit test with:
+
+```
+npm run test <path to test file>
+```
+
 Unit tests for React components use [snapshot testing](https://jestjs.io/docs/snapshot-testing), please take a moment
 to learn about this kind of tests and how to use them.
 

CREDITS.md

@@ -4,3 +4,4 @@ We would like to give a special thanks to:
 
 * [Ishan @seefromthesky](https://unsplash.com/@seefromthesky) for the photo on Unsplash
 * [Christina @ wocintechchat.com](https://unsplash.com/@wocintechchat) for the photo on Unsplash
+* [three.js](https://threejs.org/) for the [Ocean](https://threejs.org/examples/webgl_shaders_ocean.html) example from which we based the `HeroBanner3d` implementation

docusaurus.config.js

@@ -16,8 +16,16 @@ limitations under the License.
 
 const customFields = {
   heroConfig: {
-    title: 'Powering global travel through a world-class tech platform.',
-    subtitle: 'Peek behind the scenes at our open source projects.'
+    hero2d: {
+      title: 'Powering global travel through a world-class tech platform.',
+      subtitle: 'Peek behind the scenes at our open source projects.',
+      imageUrl: '/img/hero.jpg'
+    },
+    hero3d: {
+      enabled: true,
+      title: 'Expedia Group',
+      subtitle: 'Open Source'
+    }
   },
   repositoriesConfig: {
     navbarLabel: 'Projects',

jest.config.js

@@ -16,6 +16,7 @@ limitations under the License.
 
 const config = {
     resetMocks: true,
+    setupFiles: ["<rootDir>/src/jest/helpers.js"],
     transform: {
         "\\.[jt]sx?$": "babel-jest",
         ".+\\.(css|styl|less|sass|scss)$": "jest-css-modules-transform"