diff --git a/package-lock.json b/package-lock.json index 514c47c2..96ada3d1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -26,6 +26,7 @@ "bootstrap": "^4.1.3", "chart.js": "^2.9.4", "font-awesome": "^4.7.0", + "gsap": "^2.1.3", "material-ui-chip-input": "^1.1.0", "parallax-js": "^3.1.0", "qrcode.react": "^0.9.3", @@ -2581,6 +2582,11 @@ } } }, + "node_modules/@material-ui/core/node_modules/popper.js": { + "version": "1.16.1-lts", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", + "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" + }, "node_modules/@material-ui/icons": { "version": "4.9.1", "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.9.1.tgz", @@ -10538,6 +10544,11 @@ "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz", "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=" }, + "node_modules/gsap": { + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/gsap/-/gsap-2.1.3.tgz", + "integrity": "sha512-8RFASCqi2FOCBuv7X4o7M6bLdy+1hbR0azg+MG7zz+EVsI+OmJblYsTk0GEepQd2Jg/ItMPiVTibF7r3EVxjZQ==" + }, "node_modules/gzip-size": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz", @@ -12522,6 +12533,12 @@ "node": ">= 6" } }, + "node_modules/jquery": { + "version": "3.7.1", + "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz", + "integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==", + "peer": true + }, "node_modules/js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", @@ -14741,9 +14758,14 @@ } }, "node_modules/popper.js": { - "version": "1.16.1-lts", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", - "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" + "version": "1.16.1", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", + "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==", + "deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } }, "node_modules/portfinder": { "version": "1.0.28", @@ -18731,16 +18753,6 @@ "react-dom": "0.14.x || ^15.0.0 || ^16.0.0" } }, - "node_modules/react-popper/node_modules/popper.js": { - "version": "1.16.1", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", - "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==", - "deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1", - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/popperjs" - } - }, "node_modules/react-router": { "version": "4.3.1", "resolved": "https://registry.npmjs.org/react-router/-/react-router-4.3.1.tgz", @@ -25905,6 +25917,13 @@ "prop-types": "^15.7.2", "react-is": "^16.8.0", "react-transition-group": "^4.4.0" + }, + "dependencies": { + "popper.js": { + "version": "1.16.1-lts", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", + "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" + } } }, "@material-ui/icons": { @@ -32236,6 +32255,11 @@ "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz", "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=" }, + "gsap": { + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/gsap/-/gsap-2.1.3.tgz", + "integrity": "sha512-8RFASCqi2FOCBuv7X4o7M6bLdy+1hbR0azg+MG7zz+EVsI+OmJblYsTk0GEepQd2Jg/ItMPiVTibF7r3EVxjZQ==" + }, "gzip-size": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz", @@ -33782,6 +33806,12 @@ } } }, + "jquery": { + "version": "3.7.1", + "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz", + "integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==", + "peer": true + }, "js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", @@ -35594,9 +35624,9 @@ } }, "popper.js": { - "version": "1.16.1-lts", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", - "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" + "version": "1.16.1", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", + "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==" }, "portfinder": { "version": "1.0.28", @@ -38571,13 +38601,6 @@ "requires": { "popper.js": "^1.14.1", "prop-types": "^15.6.1" - }, - "dependencies": { - "popper.js": { - "version": "1.16.1", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", - "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==" - } } }, "react-router": { diff --git a/package.json b/package.json index c811e104..72e5aa6d 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "bootstrap": "^4.1.3", "chart.js": "^2.9.4", "font-awesome": "^4.7.0", + "gsap": "^2.1.3", "material-ui-chip-input": "^1.1.0", "parallax-js": "^3.1.0", "qrcode.react": "^0.9.3", diff --git a/public/index-s23.css b/public/index-s23.css index 2c69dca6..e5ec2c0c 100644 --- a/public/index-s23.css +++ b/public/index-s23.css @@ -6,7 +6,7 @@ --primary-color: #FFF5e8; /* Logo, link colors, text */ --primary-color-alt: #4fab5f; /* Form body bg, form headers text */ --secondary-color: #000000; /* Barely used accent color...combine this and primary-color-alt...? */ - --secondary-color-alt:#1f6aa0; /* Background color */ + --secondary-color-alt: #8db67e; /* Background color */ --accent-color: #4bbede; /* Logout, Live button color */ /* split card colors */ --splitCard-color:#000000; diff --git a/public/tailwind-output.css b/public/tailwind-output.css index c520d2e2..a61fb00b 100644 --- a/public/tailwind-output.css +++ b/public/tailwind-output.css @@ -642,20 +642,12 @@ video { position: sticky; } -.-left-48 { - left: -12rem; +.-left-\[7rem\] { + left: -7rem; } -.top-12 { - top: 3rem; -} - -.top-\[54rem\] { - top: 54rem; -} - -.-right-\[12rem\] { - right: -12rem; +.top-\[10rem\] { + top: 10rem; } .top-\[44rem\] { @@ -666,24 +658,40 @@ video { left: 24rem; } +.right-4 { + right: 1rem; +} + +.top-4 { + top: 1rem; +} + .right-0 { right: 0px; } +.top-2 { + top: 0.5rem; +} + +.left-4 { + left: 1rem; +} + .top-0 { top: 0px; } -.bottom-\[20rem\] { - bottom: 20rem; +.bottom-\[3rem\] { + bottom: 3rem; } .-right-32 { right: -8rem; } -.bottom-5 { - bottom: 1.25rem; +.bottom-9 { + bottom: 2.25rem; } .top-\[30rem\] { @@ -702,34 +710,14 @@ video { left: 35rem; } -.top-\[10rem\] { - top: 10rem; -} - -.left-\[45rem\] { - left: 45rem; -} - .left-\[-10rem\] { left: -10rem; } -.top-10 { - top: 2.5rem; -} - .-top-4 { top: -1rem; } -.-top-44 { - top: -11rem; -} - -.-right-10 { - right: -2.5rem; -} - .left-\[30rem\] { left: 30rem; } @@ -738,24 +726,28 @@ video { left: -20rem; } -.z-40 { - z-index: 40; -} - .z-30 { z-index: 30; } +.z-20 { + z-index: 20; +} + .z-10 { z-index: 10; } -.z-0 { - z-index: 0; +.z-40 { + z-index: 40; } -.z-20 { - z-index: 20; +.z-50 { + z-index: 50; +} + +.z-0 { + z-index: 0; } .m-auto { @@ -766,11 +758,6 @@ video { margin: 2.5rem; } -.mx-auto { - margin-left: auto; - margin-right: auto; -} - .mx-5 { margin-left: 1.25rem; margin-right: 1.25rem; @@ -795,14 +782,18 @@ video { margin-top: 1.25rem; } -.mt-1 { - margin-top: 0.25rem; +.ml-1 { + margin-left: 0.25rem; } .mt-4 { margin-top: 1rem; } +.mt-\[8rem\] { + margin-top: 8rem; +} + .mt-2 { margin-top: 0.5rem; } @@ -839,10 +830,6 @@ video { margin-bottom: 0.75rem; } -.mr-2 { - margin-right: 0.5rem; -} - .block { display: block; } @@ -951,6 +938,10 @@ video { width: 100%; } +.w-24 { + width: 6rem; +} + .w-\[27rem\] { width: 27rem; } @@ -959,10 +950,6 @@ video { width: 24rem; } -.w-\[12rem\] { - width: 12rem; -} - .w-2\/5 { width: 40%; } @@ -979,10 +966,6 @@ video { width: 5rem; } -.w-64 { - width: 16rem; -} - .w-44 { width: 11rem; } @@ -995,10 +978,6 @@ video { max-width: 80rem; } -.max-w-\[88rem\] { - max-width: 88rem; -} - .max-w-3xl { max-width: 48rem; } @@ -1030,12 +1009,6 @@ video { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } -.rotate-\[270deg\] { - --tw-rotate: 270deg; - -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); -} - .scale-95 { --tw-scale-x: .95; --tw-scale-y: .95; @@ -1099,18 +1072,6 @@ video { margin-bottom: calc(0.25rem * var(--tw-space-y-reverse)); } -.space-y-3 > :not([hidden]) ~ :not([hidden]) { - --tw-space-y-reverse: 0; - margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse))); - margin-bottom: calc(0.75rem * var(--tw-space-y-reverse)); -} - -.space-x-4 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(1rem * var(--tw-space-x-reverse)); - margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))); -} - .divide-y > :not([hidden]) ~ :not([hidden]) { --tw-divide-y-reverse: 0; border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); @@ -1164,9 +1125,9 @@ video { border-bottom-color: rgb(255 255 255 / var(--tw-border-opacity)); } -.bg-gray-900 { +.bg-gray-800 { --tw-bg-opacity: 1; - background-color: rgb(17 24 39 / var(--tw-bg-opacity)); + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); } .bg-gray-300 { @@ -1174,14 +1135,14 @@ video { background-color: rgb(209 213 219 / var(--tw-bg-opacity)); } -.bg-blue-300 { +.bg-f23-lightGreen { --tw-bg-opacity: 1; - background-color: rgb(147 197 253 / var(--tw-bg-opacity)); + background-color: rgb(141 182 126 / var(--tw-bg-opacity)); } -.bg-cyan-100 { +.bg-f23-mediumGreen { --tw-bg-opacity: 1; - background-color: rgb(207 250 254 / var(--tw-bg-opacity)); + background-color: rgb(62 129 105 / var(--tw-bg-opacity)); } .bg-white { @@ -1191,37 +1152,21 @@ video { .bg-text { --tw-bg-opacity: 1; - background-color: rgb(209 233 239 / var(--tw-bg-opacity)); -} - -.bg-gray-600 { - --tw-bg-opacity: 1; - background-color: rgb(75 85 99 / var(--tw-bg-opacity)); -} - -.bg-gray-800 { - --tw-bg-opacity: 1; - background-color: rgb(31 41 55 / var(--tw-bg-opacity)); + background-color: rgb(241 225 146 / var(--tw-bg-opacity)); } .bg-gradient-to-b { background-image: linear-gradient(to bottom, var(--tw-gradient-stops)); } -.from-mainBg { - --tw-gradient-from: #1f6aa0; - --tw-gradient-to: rgb(31 106 160 / 0); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); -} - -.from-black { - --tw-gradient-from: #000; - --tw-gradient-to: rgb(0 0 0 / 0); +.from-f23-lightGreen { + --tw-gradient-from: #8db67e; + --tw-gradient-to: rgb(141 182 126 / 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } -.to-endBg { - --tw-gradient-to: #0f3854; +.object-contain { + object-fit: contain; } .p-6 { @@ -1250,6 +1195,16 @@ video { padding-bottom: 0.5rem; } +.py-10 { + padding-top: 2.5rem; + padding-bottom: 2.5rem; +} + +.px-10 { + padding-left: 2.5rem; + padding-right: 2.5rem; +} + .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; @@ -1285,26 +1240,6 @@ video { padding-bottom: 3rem; } -.py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; -} - -.px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; -} - -.px-20 { - padding-left: 5rem; - padding-right: 5rem; -} - -.px-8 { - padding-left: 2rem; - padding-right: 2rem; -} - .pt-64 { padding-top: 16rem; } @@ -1389,9 +1324,9 @@ video { line-height: 1.75rem; } -.text-4xl { - font-size: 2.25rem; - line-height: 2.5rem; +.text-6xl { + font-size: 3.75rem; + line-height: 1; } .text-5xl { @@ -1404,9 +1339,9 @@ video { line-height: 1.75rem; } -.text-6xl { - font-size: 3.75rem; - line-height: 1; +.text-4xl { + font-size: 2.25rem; + line-height: 2.5rem; } .font-bold { @@ -1449,12 +1384,12 @@ video { .text-text { --tw-text-opacity: 1; - color: rgb(209 233 239 / var(--tw-text-opacity)); + color: rgb(241 225 146 / var(--tw-text-opacity)); } .text-textSubtitle { --tw-text-opacity: 1; - color: rgb(149 220 240 / var(--tw-text-opacity)); + color: rgb(241 225 146 / var(--tw-text-opacity)); } .text-white { @@ -1467,6 +1402,11 @@ video { color: rgb(17 24 39 / var(--tw-text-opacity)); } +.text-f23-yellowGreen { + --tw-text-opacity: 1; + color: rgb(241 225 146 / var(--tw-text-opacity)); +} + .underline { text-decoration-line: underline; } @@ -1540,9 +1480,9 @@ video { cursor: pointer; } -.hover\:bg-sky-900:hover { +.hover\:bg-f23-mediumGreen:hover { --tw-bg-opacity: 1; - background-color: rgb(12 74 110 / var(--tw-bg-opacity)); + background-color: rgb(62 129 105 / var(--tw-bg-opacity)); } .hover\:bg-black:hover { @@ -1615,18 +1555,6 @@ video { } @media (min-width: 640px) { - .sm\:top-\[42rem\] { - top: 42rem; - } - - .sm\:-top-40 { - top: -10rem; - } - - .sm\:-right-20 { - right: -5rem; - } - .sm\:mt-24 { margin-top: 6rem; } @@ -1643,14 +1571,6 @@ video { width: 32rem; } - .sm\:w-\[14rem\] { - width: 14rem; - } - - .sm\:w-96 { - width: 24rem; - } - .sm\:w-\[24rem\] { width: 24rem; } @@ -1659,18 +1579,6 @@ video { grid-template-columns: repeat(2, minmax(0, 1fr)); } - .sm\:space-x-24 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(6rem * var(--tw-space-x-reverse)); - margin-left: calc(6rem * calc(1 - var(--tw-space-x-reverse))); - } - - .sm\:space-x-20 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(5rem * var(--tw-space-x-reverse)); - margin-left: calc(5rem * calc(1 - var(--tw-space-x-reverse))); - } - .sm\:space-x-10 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(2.5rem * var(--tw-space-x-reverse)); @@ -1698,20 +1606,16 @@ video { visibility: hidden; } - .md\:absolute { - position: absolute; - } - - .md\:-left-24 { - left: -6rem; + .md\:fixed { + position: fixed; } - .md\:top-60 { - top: 15rem; + .md\:absolute { + position: absolute; } - .md\:-right-10 { - right: -2.5rem; + .md\:top-\[25rem\] { + top: 25rem; } .md\:top-44 { @@ -1734,26 +1638,10 @@ video { top: 30rem; } - .md\:left-\[40rem\] { - left: 40rem; - } - .md\:left-\[-10rem\] { left: -10rem; } - .md\:-top-10 { - top: -2.5rem; - } - - .md\:right-0 { - right: 0px; - } - - .md\:-top-40 { - top: -10rem; - } - .md\:left-\[50rem\] { left: 50rem; } @@ -1772,8 +1660,8 @@ video { margin-bottom: 1.25rem; } - .md\:mt-16 { - margin-top: 4rem; + .md\:mt-28 { + margin-top: 7rem; } .md\:mt-0 { @@ -1800,8 +1688,12 @@ video { min-height: 1060px; } - .md\:w-\[17rem\] { - width: 17rem; + .md\:w-\[28rem\] { + width: 28rem; + } + + .md\:w-\[40rem\] { + width: 40rem; } .md\:w-\[35rem\] { @@ -1887,12 +1779,16 @@ video { } @media (min-width: 1024px) { - .lg\:-right-32 { - right: -8rem; + .lg\:-left-\[10rem\] { + left: -10rem; } - .lg\:top-\[36rem\] { - top: 36rem; + .lg\:top-\[10rem\] { + top: 10rem; + } + + .lg\:-right-44 { + right: -11rem; } .lg\:left-\[20rem\] { @@ -1911,44 +1807,28 @@ video { top: 40rem; } - .lg\:left-\[50rem\] { - left: 50rem; - } - .lg\:left-\[-10rem\] { left: -10rem; } - .lg\:-top-24 { - top: -6rem; - } - - .lg\:right-0 { - right: 0px; - } - - .lg\:right-20 { - right: 5rem; - } - - .lg\:-top-60 { - top: -15rem; + .lg\:left-\[50rem\] { + left: 50rem; } .lg\:left-\[-20rem\] { left: -20rem; } - .lg\:w-\[24rem\] { - width: 24rem; + .lg\:w-\[32rem\] { + width: 32rem; } - .lg\:w-144 { - width: 36rem; + .lg\:w-\[45em\] { + width: 45em; } - .lg\:w-128 { - width: 32rem; + .lg\:w-144 { + width: 36rem; } .lg\:text-12xl { @@ -1962,16 +1842,24 @@ video { } @media (min-width: 1280px) { - .xl\:-left-44 { - left: -11rem; + .xl\:-left-\[15rem\] { + left: -15rem; + } + + .xl\:top-\[10rem\] { + top: 10rem; + } + + .xl\:top-\[7rem\] { + top: 7rem; } - .xl\:top-10 { - top: 2.5rem; + .xl\:w-\[40rem\] { + width: 40rem; } - .xl\:w-\[30rem\] { - width: 30rem; + .xl\:w-\[60rem\] { + width: 60rem; } } diff --git a/src/App.jsx b/src/App.jsx index ec9c97eb..41fa6cad 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -17,10 +17,11 @@ import { import LandingPage from "./components/_Landing/Landing"; import { Snackbar } from "@material-ui/core"; // Alert messages import { Alert } from "@material-ui/lab"; // Alert messages -import ParticleBackground from "./components/_Landing/assets/Particles"; +// import ParticleBackground from "./components/_Landing/assets/Particles"; import NavBar from "./NavBar"; import { defaults } from "./Defaults"; // Get a handle to the default application settings import { Profile } from "./components/Profile"; // User profile storage +import initStars from "./components/_Landing/assets/scripts/stars"; const updateStateOnURLChange = (component) => { let previousUrl = ""; @@ -88,6 +89,11 @@ class App extends Component { } }); } + + componentDidMount() { + initStars(500); + } + /** * Set the application magic link * @param {String} magic Magic link from lcs @@ -238,8 +244,8 @@ class App extends Component { return ( {/* BrowserRouter wil allow us to switch between the different pages in our SPA based on the URL routing */} -
- +
{/* Application alert messages go here */} diff --git a/src/NavBar.jsx b/src/NavBar.jsx index 9c95bdbe..e78685ae 100644 --- a/src/NavBar.jsx +++ b/src/NavBar.jsx @@ -189,7 +189,7 @@ class NavBar extends Component { open={this.state.open} onClose={this.handleClose} > - + { @@ -42,23 +43,22 @@ const ForgotPage = (props) => { const [done, setDone] = useState(false); const [errors, setErrors] = useState(""); - const onSubmit = (e) => { + const onSubmit = async (e) => { e.preventDefault(); if (!loading) { setLoading(true); setErrors(""); let email = document.getElementById("email").value; - props.profile.Forgot(email) - .then((msg) => { - if (msg.error) { - setLoading(false); - setErrors(msg.error); - } else { - setLoading(false); - setDone(true); - setErrors(""); - } - }); + let msg = await props.profile.Forgot(email); + if (msg.error) { + setLoading(false); + setErrors(msg.error); + } else { + setLoading(false); + setDone(true); + setErrors(""); + } + } }; @@ -69,7 +69,7 @@ const ForgotPage = (props) => { return ( - + { > { done ?
- {setDone(false);}}> Link Sent! - +
:
} - - - {/* + { { autoComplete="email" size="small" /> - */} + } + {/*
Please reach out to rnd@hackru.org to reset password -
+
*/} - - {/* + { { Submit - */} + } + {/* { color="primary"> Email Us - + + */} -
{
- + ); - + }; ForgotPage.propTypes = { diff --git a/src/components/Profile.js b/src/components/Profile.js index 04f2d8a2..94ac285d 100644 --- a/src/components/Profile.js +++ b/src/components/Profile.js @@ -1,3 +1,4 @@ +//import { ControlCameraSharp } from "@material-ui/icons"; import { defaults } from "../Defaults"; import PropTypes from "prop-types"; @@ -486,24 +487,23 @@ class Profile { } else { await fetch(ENDPOINTS.forgot, { method: "POST", - body: { + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ email: email, forgot: true, - }, - json: true, + }), }) - .then((res) => { - if (res.statusCode === 200) { + .then(async (res) => { + let resJSON = await res.json(); + if (resJSON.statusCode === 200) { return resp; } else { - if (res.errorMessage) { - console.error(res.errorMessage); - } - if (res.body) { - return res.body; + if (resJSON.body) { + resp.error = resJSON.body; } else { resp.error = "Unexpected Error"; - return resp; } } }) @@ -511,9 +511,9 @@ class Profile { resp.error = error + "An error occured when attempting to general url"; - return resp; }); } + return resp; } } async Reset(email, password, conpassword, magic) { diff --git a/src/components/_Landing/Landing.css b/src/components/_Landing/Landing.css index 9965d12f..f490683d 100644 --- a/src/components/_Landing/Landing.css +++ b/src/components/_Landing/Landing.css @@ -3,7 +3,7 @@ } */ .glow { - text-shadow:1px 1px 6px #fff; + /* text-shadow:1px 1px 6px #fff; */ } .glow-symbol { @@ -14,13 +14,21 @@ box-shadow: 1px 1px 6px #4bbede; } .glow-subtitles { - text-shadow:1px 1px 20px #4bbede; + /* text-shadow:1px 1px 20px #f1e192; */ } .transparent-black-background { background-color: rgba(0, 0, 0, 0.4); } +.star { + position: absolute; + width: 4px; + height: 4px; + border-radius: 2px; + background: white; +} + .floating { animation-name: floating; diff --git a/src/components/_Landing/Landing.tsx b/src/components/_Landing/Landing.tsx index 96f425af..8fe69faf 100644 --- a/src/components/_Landing/Landing.tsx +++ b/src/components/_Landing/Landing.tsx @@ -8,7 +8,7 @@ import Hero from "./sections/hero/hero"; import { randomizeAnimationDurations } from "./utilities"; import Schedule from "./sections/schedule/Schedule"; import Sponsors from "./sections/sponsors/Sponsors"; - +import Sun from "./assets/sun/sun"; function LandingPage(props: any) { @@ -18,7 +18,9 @@ function LandingPage(props: any) { }, []); return ( -
+
+ diff --git a/src/components/_Landing/assets/Particles.tsx b/src/components/_Landing/assets/Particles.tsx deleted file mode 100644 index 2453bc15..00000000 --- a/src/components/_Landing/assets/Particles.tsx +++ /dev/null @@ -1,49 +0,0 @@ -/* eslint-disable indent */ -import React from "react"; -import Particles from "react-particles"; -import { loadFull } from "tsparticles"; - -const options: any = { - background: { - color: "#000", - opacity: 0 - }, - fullscreen: { - enable: true, - zIndex: -1, - }, - particles: { - move: { - direction: "none", - enable: true, - outModes: { - default: "out", - }, - random: true, - speed: 0.1, - straight: false, - }, - opacity: { - animation: { - enable: true, - speed: 1.3, - sync: false, - }, - value: { min: 0, max: 1 }, - }, - size: { - value: { min: 1, max: 3 }, - } - }, -}; - -export default function ParticleBackground() { - return ( -
- await loadFull(engine)} - options={options} - /> -
- ); -} \ No newline at end of file diff --git a/src/components/_Landing/assets/ananyaSquirrel.png b/src/components/_Landing/assets/ananyaSquirrel.png deleted file mode 100644 index 2a3ce41f..00000000 Binary files a/src/components/_Landing/assets/ananyaSquirrel.png and /dev/null differ diff --git a/src/components/_Landing/assets/animals/frog-min.png b/src/components/_Landing/assets/animals/frog-min.png new file mode 100644 index 00000000..15d7337d Binary files /dev/null and b/src/components/_Landing/assets/animals/frog-min.png differ diff --git a/src/components/_Landing/assets/animals/owl-min.png b/src/components/_Landing/assets/animals/owl-min.png new file mode 100644 index 00000000..52e2632f Binary files /dev/null and b/src/components/_Landing/assets/animals/owl-min.png differ diff --git a/src/components/_Landing/assets/animals/rabbit-min.png b/src/components/_Landing/assets/animals/rabbit-min.png new file mode 100644 index 00000000..212e39c3 Binary files /dev/null and b/src/components/_Landing/assets/animals/rabbit-min.png differ diff --git a/src/components/_Landing/assets/animals/racoon-min.png b/src/components/_Landing/assets/animals/racoon-min.png new file mode 100644 index 00000000..7312d345 Binary files /dev/null and b/src/components/_Landing/assets/animals/racoon-min.png differ diff --git a/src/components/_Landing/assets/animals/whale.png b/src/components/_Landing/assets/animals/whale.png new file mode 100644 index 00000000..f023819f Binary files /dev/null and b/src/components/_Landing/assets/animals/whale.png differ diff --git a/src/components/_Landing/assets/clouds/cloud1.png b/src/components/_Landing/assets/clouds/cloud1.png new file mode 100644 index 00000000..87479621 Binary files /dev/null and b/src/components/_Landing/assets/clouds/cloud1.png differ diff --git a/src/components/_Landing/assets/clouds/cloud1.svg b/src/components/_Landing/assets/clouds/cloud1.svg deleted file mode 100644 index f197c948..00000000 --- a/src/components/_Landing/assets/clouds/cloud1.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/_Landing/assets/clouds/cloud2.png b/src/components/_Landing/assets/clouds/cloud2.png new file mode 100644 index 00000000..bab0a9a8 Binary files /dev/null and b/src/components/_Landing/assets/clouds/cloud2.png differ diff --git a/src/components/_Landing/assets/clouds/cloud2.svg b/src/components/_Landing/assets/clouds/cloud2.svg deleted file mode 100644 index 6437ec32..00000000 --- a/src/components/_Landing/assets/clouds/cloud2.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/_Landing/assets/clouds/cloud3.png b/src/components/_Landing/assets/clouds/cloud3.png new file mode 100644 index 00000000..09279ce8 Binary files /dev/null and b/src/components/_Landing/assets/clouds/cloud3.png differ diff --git a/src/components/_Landing/assets/clouds/cloud3.svg b/src/components/_Landing/assets/clouds/cloud3.svg deleted file mode 100644 index 2d677834..00000000 --- a/src/components/_Landing/assets/clouds/cloud3.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/_Landing/assets/clouds/cloud4.png b/src/components/_Landing/assets/clouds/cloud4.png new file mode 100644 index 00000000..2b89e94c Binary files /dev/null and b/src/components/_Landing/assets/clouds/cloud4.png differ diff --git a/src/components/_Landing/assets/clouds/cloud4.svg b/src/components/_Landing/assets/clouds/cloud4.svg deleted file mode 100644 index 97883179..00000000 --- a/src/components/_Landing/assets/clouds/cloud4.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/_Landing/assets/clouds/cloud5.png b/src/components/_Landing/assets/clouds/cloud5.png new file mode 100644 index 00000000..8600555a Binary files /dev/null and b/src/components/_Landing/assets/clouds/cloud5.png differ diff --git a/src/components/_Landing/assets/clouds/cloud6.png b/src/components/_Landing/assets/clouds/cloud6.png new file mode 100644 index 00000000..0bc44e63 Binary files /dev/null and b/src/components/_Landing/assets/clouds/cloud6.png differ diff --git a/src/components/_Landing/assets/judyBear.png b/src/components/_Landing/assets/judyBear.png deleted file mode 100644 index 7d1d11f8..00000000 Binary files a/src/components/_Landing/assets/judyBear.png and /dev/null differ diff --git a/src/components/_Landing/assets/judyCat.png b/src/components/_Landing/assets/judyCat.png deleted file mode 100644 index 5493f181..00000000 Binary files a/src/components/_Landing/assets/judyCat.png and /dev/null differ diff --git a/src/components/_Landing/assets/judyCat.svg b/src/components/_Landing/assets/judyCat.svg deleted file mode 100644 index cc27713f..00000000 --- a/src/components/_Landing/assets/judyCat.svg +++ /dev/null @@ -1,5230 +0,0 @@ - - - - diff --git a/src/components/_Landing/assets/judyDog.svg b/src/components/_Landing/assets/judyDog.svg deleted file mode 100644 index a6fd9fa5..00000000 --- a/src/components/_Landing/assets/judyDog.svg +++ /dev/null @@ -1,5494 +0,0 @@ - - - - diff --git a/src/components/_Landing/assets/judyDog4.png b/src/components/_Landing/assets/judyDog4.png deleted file mode 100644 index f816dbf5..00000000 Binary files a/src/components/_Landing/assets/judyDog4.png and /dev/null differ diff --git a/src/components/_Landing/assets/katrinaHedgehog.png b/src/components/_Landing/assets/katrinaHedgehog.png deleted file mode 100644 index 95145f32..00000000 Binary files a/src/components/_Landing/assets/katrinaHedgehog.png and /dev/null differ diff --git a/src/components/_Landing/assets/kimFox2.png b/src/components/_Landing/assets/kimFox2.png deleted file mode 100644 index e4a80195..00000000 Binary files a/src/components/_Landing/assets/kimFox2.png and /dev/null differ diff --git a/src/components/_Landing/assets/mlh-trust-badge-2022-white.svg b/src/components/_Landing/assets/mlh-trust-badge-2022-white.svg deleted file mode 100644 index 9b31a6a9..00000000 --- a/src/components/_Landing/assets/mlh-trust-badge-2022-white.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/_Landing/assets/rabbit.svg b/src/components/_Landing/assets/rabbit.svg deleted file mode 100644 index b6da46a3..00000000 --- a/src/components/_Landing/assets/rabbit.svg +++ /dev/null @@ -1,6532 +0,0 @@ - - - - diff --git a/src/components/_Landing/assets/rutgers.png b/src/components/_Landing/assets/rutgers.png deleted file mode 100644 index f83fb259..00000000 Binary files a/src/components/_Landing/assets/rutgers.png and /dev/null differ diff --git a/src/components/_Landing/assets/rutgers2.jpeg b/src/components/_Landing/assets/rutgers2.jpeg deleted file mode 100644 index 9710bb4f..00000000 Binary files a/src/components/_Landing/assets/rutgers2.jpeg and /dev/null differ diff --git a/src/components/_Landing/assets/sammiPig.png b/src/components/_Landing/assets/sammiPig.png deleted file mode 100644 index 53d9134e..00000000 Binary files a/src/components/_Landing/assets/sammiPig.png and /dev/null differ diff --git a/src/components/_Landing/assets/scripts/stars.js b/src/components/_Landing/assets/scripts/stars.js new file mode 100644 index 00000000..2737ed03 --- /dev/null +++ b/src/components/_Landing/assets/scripts/stars.js @@ -0,0 +1,30 @@ +import { TweenMax } from "gsap/TweenMax"; + +// Amount of stars +function createStars(numberOfStars) { + for (let i = 0; i < numberOfStars; i++) { + placeStarRandomly(); + } +} +// Create Stars +function placeStarRandomly(){ + const tmpStar = document.createElement("div"); + tmpStar.className = "star"; + tmpStar.style.position = "absolute"; + tmpStar.style.top = 98*Math.random()+"%"; + tmpStar.style.left = 100*Math.random()+"%"; + document.getElementById("starryBackground").appendChild(tmpStar); +} + +function animateStars() { + const stars = document.querySelectorAll(".star"); + Array.prototype.forEach.call(stars, function(el,){ + TweenMax.to(el, Math.random() * 0.5 + 0.5, {opacity: Math.random(), onComplete: animateStars}); + }); +} + + +export default function initStars(numberOfStars) { + createStars(numberOfStars); + animateStars(); +} diff --git a/src/components/_Landing/assets/suminRabbit2.png b/src/components/_Landing/assets/suminRabbit2.png deleted file mode 100644 index 53e7d8b7..00000000 Binary files a/src/components/_Landing/assets/suminRabbit2.png and /dev/null differ diff --git a/src/components/_Landing/assets/sun/sun.css b/src/components/_Landing/assets/sun/sun.css new file mode 100644 index 00000000..d25917eb --- /dev/null +++ b/src/components/_Landing/assets/sun/sun.css @@ -0,0 +1,179 @@ +#sun-container { + left: 15%; + top: -250px; + position: absolute; + width: 100px; + height: 100px; + z-index: 1; + animation: rotateSun 15s infinite alternate; +} + +@keyframes rotateSun { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(5deg); + } +} + +#sun { + position: absolute; + top: 50%; + left: 50%; + width: 300px; + height: 300px; + background-color: #c1e8da; + opacity: 30%; + border-radius: 50%; + transform: translate(-50%, -50%); + z-index: 1; +} + + +#sun2 { + position: absolute; + top: 50%; + left: 50%; + width: 500px; + height: 500px; + background-color: #c1e8da; + opacity: 15%; + border-radius: 50%; + transform: translate(-50%, -50%); + z-index: 1; +} + +#sun3 { + position: absolute; + top: 50%; + left: 50%; + width: 700px; + height: 700px; + background-color: #c1e8da; + opacity: 10%; + border-radius: 50%; + transform: translate(-50%, -50%); + z-index: 1; +} + +/* Start of First Ray Styling (and sub-rays) */ + + +#ray { + position: absolute; + z-index: -1000; + top: 50%; + left: -450%; + + width: 1000px; + height: 3000px; + + clip-path: polygon(50% 0%, 0% 100%, 100% 100%); + transform-origin: bottom left; + transform: rotate(deg); + background: linear-gradient(to top, transparent 50%, #c1e8da); + opacity: 20%; +} + +#ray2 { + position: absolute; + z-index: -1000; + top: 50%; + left: -450%; + + width: 1000px; + height: 3000px; + + clip-path: polygon(50% 0%, 0% 100%, 100% 100%); + transform-origin: bottom left; + transform: rotate(deg); + background: linear-gradient(to top, transparent 60%, #c1e8da); + opacity: 20%; +} + +#ray3 { + position: absolute; + z-index: -1000; + top: 50%; + left: -450%; + + width: 1000px; + height: 3000px; + + clip-path: polygon(50% 0%, 0% 55%, 100% 55%); + /* animation: animateClipPath 3s alternate 2; */ + /* animation-iteration-count: 4; */ + transform-origin: bottom left; + /* transform: rotate(deg); */ + background: linear-gradient(to top, transparent 80%, #c1e8da); + opacity: 20%; +} + + +/* Start of Second Ray Styling (and sub-rays) */ +#ray4 { + position: absolute; + z-index: -1000; + top: -500%; + left: 1800%; + + width: 1000px; + height: 3000px; + + clip-path: polygon(50% 0%, 0% 100%, 100% 100%); + transform-origin: bottom left; + transform: rotate(-45deg); + background: linear-gradient(to top, transparent 50%, #c1e8da); + opacity: 14%; +} + +#ray5 { + position: absolute; + z-index: -1000; + top: -500%; + left: 1800%; + + width: 1000px; + height: 3000px; + + clip-path: polygon(50% 0%, 0% 55%, 100% 63%); + transform-origin: bottom left; + transform: rotate(-45deg); + background: linear-gradient(to top, transparent 50%, #c1e8da); + opacity: 20%; +} + +#ray6 { + position: absolute; + z-index: -1000; + top: -500%; + left: 1800%; + + width: 1000px; + height: 3000px; + + clip-path: polygon(50% 0%, 0% 100%, 100% 100%); + transform-origin: bottom left; + transform: rotate(-45deg); + background: linear-gradient(to top, transparent 50%, #c1e8da); + opacity: 20%; +} + +/* Start of Third Ray Styling (and sub-rays) */ + +#ray7 { + position: absolute; + z-index: -1000; + top: -1400%; + left: -2000%; + + width: 1000px; + height: 3000px; + + clip-path: polygon(50% 0%, 0% 100%, 100% 100%); + transform-origin: bottom left; + transform: rotate(40deg); + background: linear-gradient(to top, transparent 50%, #c1e8da); + opacity: 20%; +} \ No newline at end of file diff --git a/src/components/_Landing/assets/sun/sun.tsx b/src/components/_Landing/assets/sun/sun.tsx new file mode 100644 index 00000000..a3995fd7 --- /dev/null +++ b/src/components/_Landing/assets/sun/sun.tsx @@ -0,0 +1,26 @@ +import React from "react"; +import "./sun.css"; + +function Sun() { + return ( +
+
+
+ +
+
+
+
+ +
+
+
+ +
+
+
+
+ ); +} + +export default Sun; \ No newline at end of file diff --git a/src/components/_Landing/assets/yellow_hackru.png b/src/components/_Landing/assets/yellow_hackru.png new file mode 100644 index 00000000..cab784b0 Binary files /dev/null and b/src/components/_Landing/assets/yellow_hackru.png differ diff --git a/src/components/_Landing/sections/about/components/AboutContent.tsx b/src/components/_Landing/sections/about/components/AboutContent.tsx index 8e897086..fb5b6e5b 100644 --- a/src/components/_Landing/sections/about/components/AboutContent.tsx +++ b/src/components/_Landing/sections/about/components/AboutContent.tsx @@ -6,9 +6,9 @@ import { BsFillCalendarCheckFill } from "react-icons/bs"; import { MdLocationOn } from "react-icons/md"; import Card from "../../../global_components/CardAbout"; import { theme } from "../../../Default"; -import squirrel from "../../../assets/ananyaSquirrel.png"; -import bear from "../../../assets/judyBear.png"; -import hedgehog from "../../../assets/katrinaHedgehog.png"; +import frog from "../../../assets/animals/frog-min.png"; +import racoon from "../../../assets/animals/racoon-min.png"; +import rabbit from "../../../assets/animals/rabbit-min.png"; import useAboutConfig from "../hooks/useConfigAbout"; import "./AboutContent.css"; import { defaults } from "../../../Default"; @@ -212,8 +212,8 @@ function AboutContent() {
- problem
@@ -221,7 +221,7 @@ function AboutContent() { {/* xsm is created because the order reverts back in 300px measurements idk why. */} {/* there is not sm/xs ordering. IDK why but once after merge with main, it didn't work */}
- problem
@@ -274,7 +274,7 @@ function AboutContent() {
- problem
diff --git a/src/components/_Landing/sections/faq/FAQ.tsx b/src/components/_Landing/sections/faq/FAQ.tsx index c27de5b1..5eb2154d 100644 --- a/src/components/_Landing/sections/faq/FAQ.tsx +++ b/src/components/_Landing/sections/faq/FAQ.tsx @@ -1,32 +1,28 @@ import React from "react"; import QuestionContainer from "./QuestionContainer"; -import catPATH from "../../assets/judyCat.png"; -import dogPATH from "../../assets/judyDog4.png"; -import cloud from "../../assets/clouds/cloud1.svg"; -import cloud3 from "../../assets/clouds/cloud3.svg"; +import cloud from "../../assets/clouds/cloud1.png"; +import cloud3 from "../../assets/clouds/cloud3.png"; +import owl from "../../assets/animals/owl-min.png"; function FAQ() { return (
+ relative overflow-hidden items-center + flex-col justify-start min-h-[600px]">
-
FAQs
+
FAQs
- - - + owl {({ open }) => ( -
+
-
+
+
diff --git a/src/components/_Landing/sections/footer/Footer.tsx b/src/components/_Landing/sections/footer/Footer.tsx index 1729780b..dc2fa242 100644 --- a/src/components/_Landing/sections/footer/Footer.tsx +++ b/src/components/_Landing/sections/footer/Footer.tsx @@ -1,4 +1,3 @@ - import { FaFacebookF } from "react-icons/fa"; import { FaInstagram } from "react-icons/fa"; import { FaTwitter } from "react-icons/fa"; @@ -12,7 +11,11 @@ function Footer() { return (
+<<<<<<< HEAD
+======= +
+>>>>>>> fall-2023
diff --git a/src/components/_Landing/sections/hero/MainHeroContent.tsx b/src/components/_Landing/sections/hero/MainHeroContent.tsx index 628b42df..38f7806c 100644 --- a/src/components/_Landing/sections/hero/MainHeroContent.tsx +++ b/src/components/_Landing/sections/hero/MainHeroContent.tsx @@ -1,5 +1,4 @@ import React from "react"; -import { IoMoon } from "react-icons/io5"; import { Link } from "react-router-dom"; import SocialMediaComponent from "../../global_components/SocialMediaComponent"; @@ -24,7 +23,7 @@ function LoginAndRegister(props: { isLoggedIn: boolean, registrationOpen: false, function HeroTitle() { return ( -
+
HACKRU @@ -32,10 +31,6 @@ function HeroTitle() {
Hack All Knight   - -
- -
@@ -49,7 +44,7 @@ function HeroTitle() { function CenterContent({ isLoggedIn }: { isLoggedIn: boolean }) { return (
diff --git a/src/components/_Landing/sections/hero/Navbar.tsx b/src/components/_Landing/sections/hero/Navbar.tsx index 30caa4e7..82b49b79 100644 --- a/src/components/_Landing/sections/hero/Navbar.tsx +++ b/src/components/_Landing/sections/hero/Navbar.tsx @@ -3,6 +3,7 @@ import { MdOutlineMenu } from "react-icons/md"; import { Menu, Transition } from "@headlessui/react"; import { Fragment } from "react"; import { scrollToSectionName } from "./utilities"; +import yellowHackRULogo from "../../assets/yellow_hackru.png"; function MenuItem(props: { sectionName: string }) { const { sectionName } = props; @@ -10,7 +11,7 @@ function MenuItem(props: { sectionName: string }) { {({ active }) => (