diff --git a/site/package-lock.json b/site/package-lock.json index c393d9d..7d7d49e 100644 --- a/site/package-lock.json +++ b/site/package-lock.json @@ -11,6 +11,7 @@ "@testing-library/jest-dom": "^5.11.4", "@testing-library/react": "^11.1.0", "@testing-library/user-event": "^12.1.10", + "aos": "^2.3.4", "react": "^17.0.2", "react-dom": "^17.0.2", "react-router-dom": "^5.3.0", @@ -1884,7 +1885,6 @@ "jest-resolve": "^26.6.2", "jest-util": "^26.6.2", "jest-worker": "^26.6.2", - "node-notifier": "^8.0.0", "slash": "^3.0.0", "source-map": "^0.6.0", "string-length": "^4.0.1", @@ -3384,6 +3384,16 @@ "node": ">= 8" } }, + "node_modules/aos": { + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/aos/-/aos-2.3.4.tgz", + "integrity": "sha512-zh/ahtR2yME4I51z8IttIt4lC1Nw0ktsFtmeDzID1m9naJnWXhCoARaCgNOGXb5CLy3zm+wqmRAEgMYB5E2HUw==", + "dependencies": { + "classlist-polyfill": "^1.0.3", + "lodash.debounce": "^4.0.6", + "lodash.throttle": "^4.0.1" + } + }, "node_modules/aproba": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz", @@ -4769,7 +4779,6 @@ "dependencies": { "anymatch": "~3.1.1", "braces": "~3.0.2", - "fsevents": "~2.3.1", "glob-parent": "~5.1.0", "is-binary-path": "~2.1.0", "is-glob": "~4.0.1", @@ -4916,6 +4925,11 @@ "node": ">=0.10.0" } }, + "node_modules/classlist-polyfill": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.2.0.tgz", + "integrity": "sha1-k1vC39lFiodrJ5YXUUY4vKqWSi4=" + }, "node_modules/clean-css": { "version": "4.2.3", "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz", @@ -6751,8 +6765,7 @@ "esprima": "^4.0.1", "estraverse": "^4.2.0", "esutils": "^2.0.2", - "optionator": "^0.8.1", - "source-map": "~0.6.1" + "optionator": "^0.8.1" }, "bin": { "escodegen": "bin/escodegen.js", @@ -10519,7 +10532,6 @@ "@types/node": "*", "anymatch": "^3.0.3", "fb-watchman": "^2.0.0", - "fsevents": "^2.1.2", "graceful-fs": "^4.2.4", "jest-regex-util": "^26.0.0", "jest-serializer": "^26.6.2", @@ -11717,7 +11729,6 @@ "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz", "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==", "dependencies": { - "graceful-fs": "^4.1.6", "universalify": "^2.0.0" }, "optionalDependencies": { @@ -11909,6 +11920,11 @@ "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz", "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=" }, + "node_modules/lodash.debounce": { + "version": "4.0.8", + "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", + "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168=" + }, "node_modules/lodash.memoize": { "version": "4.1.2", "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz", @@ -11936,6 +11952,11 @@ "lodash._reinterpolate": "^3.0.0" } }, + "node_modules/lodash.throttle": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz", + "integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ=" + }, "node_modules/lodash.uniq": { "version": "4.5.0", "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz", @@ -15424,7 +15445,6 @@ "eslint-webpack-plugin": "^2.5.2", "file-loader": "6.1.1", "fs-extra": "^9.0.1", - "fsevents": "^2.1.3", "html-webpack-plugin": "4.5.0", "identity-obj-proxy": "3.0.0", "jest": "26.6.0", @@ -19019,10 +19039,8 @@ "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz", "integrity": "sha512-9P3MWk6SrKjHsGkLT2KHXdQ/9SNkyoJbabxnKOoJepsvJjJG8uYTR3yTPxPQvNDI3w4Nz1xnE0TLHK4RIVe/MQ==", "dependencies": { - "chokidar": "^3.4.1", "graceful-fs": "^4.1.2", - "neo-async": "^2.5.0", - "watchpack-chokidar2": "^2.0.1" + "neo-async": "^2.5.0" }, "optionalDependencies": { "chokidar": "^3.4.1", @@ -19112,7 +19130,6 @@ "anymatch": "^2.0.0", "async-each": "^1.0.1", "braces": "^2.3.2", - "fsevents": "^1.2.7", "glob-parent": "^3.1.0", "inherits": "^2.0.3", "is-binary-path": "^1.0.0", @@ -19560,7 +19577,6 @@ "anymatch": "^2.0.0", "async-each": "^1.0.1", "braces": "^2.3.2", - "fsevents": "^1.2.7", "glob-parent": "^3.1.0", "inherits": "^2.0.3", "is-binary-path": "^1.0.0", @@ -20110,9 +20126,6 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz", "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=", - "dependencies": { - "graceful-fs": "^4.1.6" - }, "optionalDependencies": { "graceful-fs": "^4.1.6" } @@ -20570,9 +20583,6 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz", "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=", - "dependencies": { - "graceful-fs": "^4.1.6" - }, "optionalDependencies": { "graceful-fs": "^4.1.6" } @@ -23520,6 +23530,16 @@ "picomatch": "^2.0.4" } }, + "aos": { + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/aos/-/aos-2.3.4.tgz", + "integrity": "sha512-zh/ahtR2yME4I51z8IttIt4lC1Nw0ktsFtmeDzID1m9naJnWXhCoARaCgNOGXb5CLy3zm+wqmRAEgMYB5E2HUw==", + "requires": { + "classlist-polyfill": "^1.0.3", + "lodash.debounce": "^4.0.6", + "lodash.throttle": "^4.0.1" + } + }, "aproba": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz", @@ -24767,6 +24787,11 @@ } } }, + "classlist-polyfill": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.2.0.tgz", + "integrity": "sha1-k1vC39lFiodrJ5YXUUY4vKqWSi4=" + }, "clean-css": { "version": "4.2.3", "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz", @@ -30313,6 +30338,11 @@ "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz", "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=" }, + "lodash.debounce": { + "version": "4.0.8", + "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", + "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168=" + }, "lodash.memoize": { "version": "4.1.2", "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz", @@ -30340,6 +30370,11 @@ "lodash._reinterpolate": "^3.0.0" } }, + "lodash.throttle": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz", + "integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ=" + }, "lodash.uniq": { "version": "4.5.0", "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz", diff --git a/site/package.json b/site/package.json index 18f0e99..af6d0b6 100644 --- a/site/package.json +++ b/site/package.json @@ -7,6 +7,7 @@ "@testing-library/jest-dom": "^5.11.4", "@testing-library/react": "^11.1.0", "@testing-library/user-event": "^12.1.10", + "aos": "^2.3.4", "react": "^17.0.2", "react-dom": "^17.0.2", "react-router-dom": "^5.3.0", diff --git a/site/src/App.css b/site/src/App.css index 1950123..33011f2 100644 --- a/site/src/App.css +++ b/site/src/App.css @@ -97,21 +97,25 @@ a { width: 85rem; background-color: rgba(0, 0, 0, 0.5); border: solid rgba(156,49,45,.2) .3rem; - text-align: center; } .project{ - background-image: radial-gradient(ellipse at top, #ff000036,transparent), radial-gradient(ellipse at bottom,#25282c,transparent), radial-gradient(ellipse at right,#25282c,transparent), radial-gradient(ellipse at left,#25282c,transparent); display: inline-block; text-align: left; margin: 1rem; width: 25rem; height: 15rem; border: .3rem black solid; + background-color: rgba(22,22,22,.8); +} +.tab{ + display: inline; + float: right; } .project h3{ + display: inline-block; border-bottom: black solid .2rem; } -.project p{ +.body{ color:rgb(212, 212, 212); } .project img{ @@ -136,6 +140,15 @@ a { filter: invert(18%) sepia(6%) saturate(5428%) hue-rotate(314deg) brightness(95%) contrast(97%); } +.incomplete{ + color:red; +} +.WIP{ + color:yellow; +} +.complete{ + color:green; +} .footer{ display: block; background-color: rgb(156,49,45); diff --git a/site/src/App.js b/site/src/App.js index cf91a69..00bdc6b 100644 --- a/site/src/App.js +++ b/site/src/App.js @@ -5,6 +5,10 @@ import Nav from './componets/Nav.js' import Socials from './componets/Socials.js' import About from './componets/About.js' import Projects from './Projects'; +import AOS from 'aos'; +import 'aos/dist/aos.css'; // You can also use for styles + +AOS.init(); function App() { return ( diff --git a/site/src/Projects.js b/site/src/Projects.js index 29045be..a37931d 100644 --- a/site/src/Projects.js +++ b/site/src/Projects.js @@ -6,8 +6,10 @@ export default function Projects(){ return( <>
Project status is indicated by the color of the project card:
⬤ - Complete
+ ⬤ - Work In Progress
⬤ - incomplete
Ahoy, I'm Andrew Simonson
I'm primarily an extremely forgetful person @@ -17,6 +19,8 @@ export default function About(){
I'm a first year student at Rochester Institute of Technology in the Computing Exploration program. I'm from Hagerstown, Maryland.
+⬤
+{this.props.children}
+{props.children}
-