From 5c9c5db0164713f595dc219f6dc4966235b15373 Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Thu, 26 Oct 2023 04:48:05 -0300 Subject: [PATCH 01/13] Fixes Header and Footer --- src/app/footer/footer.component.css | 18 +++-- src/app/header/header.component.css | 16 +++- src/app/header/header.component.html | 112 ++++++++++++++------------- src/app/header/header.component.ts | 2 - 4 files changed, 84 insertions(+), 64 deletions(-) diff --git a/src/app/footer/footer.component.css b/src/app/footer/footer.component.css index a62fa5a..ba194de 100644 --- a/src/app/footer/footer.component.css +++ b/src/app/footer/footer.component.css @@ -20,18 +20,22 @@ padding: 20px 0; } -.footer-links a { - color: #ffffff; - font-size: 18px; - margin: 0 10px; -} - .footer-btn { color: #ffffff; font-size: 18px; border: 1px solid #ffffff; border-radius: 50%; - margin: 0 5px; + margin: 0 10px; + + width: 42px; + height: 42px; +} + +.footer-btn a { + display: flex; + text-align: center; + justify-content: center; + align-items: center; } .footer-btn:hover { diff --git a/src/app/header/header.component.css b/src/app/header/header.component.css index 89de955..fe21636 100644 --- a/src/app/header/header.component.css +++ b/src/app/header/header.component.css @@ -1,12 +1,22 @@ +.wrapper { + width: 100vw; + overflow: hidden; +} + .header { top: 0; left: 0; display: flex; position: fixed; - width: 100%; + width: 100vw; + background-color: #2e2e2e; + height: 10vh; min-height: 80px; + + justify-content: center; + align-items: center; } .header-spacer { @@ -100,6 +110,10 @@ app-header-slider { /* ====================== COMPUTER MEDIA FORMAT ======================== */ @media only screen and (min-width: 712px) { + .main { + max-width: 1333px; + } + .nav-links { all: unset; width: 50%; diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html index 3a00597..06dbcda 100644 --- a/src/app/header/header.component.html +++ b/src/app/header/header.component.html @@ -1,60 +1,63 @@ -
-
- -
- -
- -
-
- - Profile Picture +
+
+
+ +
+
- - -
-
-
+
+
+ + Profile Picture +
+ + + +
+
+
+
-
+ +
-
+
+
diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts index 734ff54..d3c6a31 100644 --- a/src/app/header/header.component.ts +++ b/src/app/header/header.component.ts @@ -33,8 +33,6 @@ export class HeaderComponent implements OnInit, OnDestroy { profileDropdownState: boolean = false; - signupPopupState: boolean = false; - navSliderStatus: boolean = false; userSliderStatus: boolean = false; From 34ae8b1818a65ca4586276db7e76a909c4affcf2 Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Thu, 26 Oct 2023 21:59:06 -0300 Subject: [PATCH 02/13] Fixes Header Bar Behavior --- .../header-slider/header-slider.component.css | 2 +- src/app/header/header.component.css | 10 +- src/app/header/header.component.html | 156 +++++++++--------- src/app/header/header.component.ts | 2 +- src/styles.css | 7 + 5 files changed, 91 insertions(+), 86 deletions(-) diff --git a/src/app/header/header-slider/header-slider.component.css b/src/app/header/header-slider/header-slider.component.css index 5946178..4d7f6ec 100644 --- a/src/app/header/header-slider/header-slider.component.css +++ b/src/app/header/header-slider/header-slider.component.css @@ -2,7 +2,7 @@ background-color: #2e2e2e; width: 50%; height: 90vh; - position: absolute; + position: fixed; top: 10vh; right: 0; overflow: hidden !important; diff --git a/src/app/header/header.component.css b/src/app/header/header.component.css index fe21636..0a955e5 100644 --- a/src/app/header/header.component.css +++ b/src/app/header/header.component.css @@ -1,8 +1,3 @@ -.wrapper { - width: 100vw; - overflow: hidden; -} - .header { top: 0; left: 0; @@ -11,6 +6,7 @@ width: 100vw; background-color: #2e2e2e; + z-index: 50; height: 10vh; min-height: 80px; @@ -114,6 +110,10 @@ app-header-slider { max-width: 1333px; } + .slider-container { + display: none; + } + .nav-links { all: unset; width: 50%; diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html index 06dbcda..f080519 100644 --- a/src/app/header/header.component.html +++ b/src/app/header/header.component.html @@ -1,92 +1,90 @@ -
-
-
- -
- -
- -
-
- - Profile Picture -
- - - -
-
-
-
+
+
+ +
+
-
-
- - +
- - -
+ + Profile Picture +
-
- - - - + +
+
+
+
+
+ + + + +
+ +
+ + + + +
+
diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts index d3c6a31..4f75f3f 100644 --- a/src/app/header/header.component.ts +++ b/src/app/header/header.component.ts @@ -5,7 +5,7 @@ import { OnDestroy, OnInit, ViewChild, - ViewContainerRef, + ViewContainerRef, ViewEncapsulation, } from '@angular/core'; import { faUser } from '@fortawesome/free-solid-svg-icons'; import { LoginComponent } from './header-popup/login/login.component'; diff --git a/src/styles.css b/src/styles.css index 0b165c2..e0431ef 100644 --- a/src/styles.css +++ b/src/styles.css @@ -6,6 +6,13 @@ margin: 0 auto; } +html, body { + width: 100vw; + overflow-y: scroll; + overflow-x: hidden; + position: absolute; +} + h1, h2, h3, From 8d36666f9582914156cb480126b29e2e1c76726e Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Thu, 26 Oct 2023 22:06:15 -0300 Subject: [PATCH 03/13] Initial Implementation of the Home Page --- src/app/home/home.component.css | 113 +++++++++++++++++++++++++++++++ src/app/home/home.component.html | 40 +++++++++++ src/app/home/home.component.ts | 8 +++ 3 files changed, 161 insertions(+) diff --git a/src/app/home/home.component.css b/src/app/home/home.component.css index e69de29..ab6cec4 100644 --- a/src/app/home/home.component.css +++ b/src/app/home/home.component.css @@ -0,0 +1,113 @@ +.me-section { + background: rgb(46,46,46); + background: linear-gradient(180deg, rgba(46,46,46,1) 35%, rgba(51,51,51,1) 100%); + height: 90vh; +} + +.intro { + height: 60%; + display: flex; + flex-direction: column; + justify-content: center; +} + +.intro h1 { + font-weight: 600; + font-size: 2.5rem; + color: #ffffff; +} + +.intro p { + font-family: "Poppins", sans-serif; + + font-size: 1rem; + font-weight: 100; + color: #f1f1f1; +} + +.intro br { + display: block; + margin: 10px 0; + content: " "; +} + + +/* SCROLL BUTTON*/ +.scroll-btn-container { + display: flex; +} + +.scroll-btn span { + position: relative; + display: block; + content: ""; + + width: 24px; + height: 24px; + + border-left: 1px solid #fff; + border-bottom: 1px solid #fff; + + cursor: pointer; + + transform-style: preserve-3d; + + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + -webkit-animation: scbt 2s infinite; + animation: scbt 2s infinite; +} +.scroll-btn span:nth-of-type(1) { + -webkit-animation-delay: 0s; + animation-delay: 0s; +} +.scroll-btn span:nth-of-type(2) { + -webkit-animation-delay: .15s; + animation-delay: .15s; +} +.scroll-btn span:nth-of-type(3) { + -webkit-animation-delay: .3s; + animation-delay: .3s; +} +@-webkit-keyframes scbt { + 0% { + opacity: 0; + } + 50% { + opacity: 1; + } + 100% { + opacity: 0; + } +} +@keyframes scbt { + 0% { + opacity: 0; + } + 50% { + opacity: 1; + } + 100% { + opacity: 0; + } +} + + +/* STACK SECTION*/ +.stack-section { + background-color: #f1f1f1; + height: 90vh; +} +.stack { + height: 60%; + display: flex; + flex-direction: column; + justify-content: center; +} + +.stack p { + font-family: "Poppins", sans-serif; + + font-size: 1rem; + font-weight: 100; +} diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index e69de29..a9a7ed0 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -0,0 +1,40 @@ +
+
+

+ I'M VITOR HIDEYOSHI +

+

+ I'm a software engineer with a passion for web development + and a strong interest in data science. I spend most of my time + learning new technologies and improving my skills, searching for + new challenges and opportunities to grow as a professional. + +
+ + In this search for new challenges I gained experience in different + areas of software development, from web development to data science. + I'm always looking for new opportunities to learn and improve my skills. +

+
+ +
+ + + + + +
+
+ + +
+
+

+ My Stack +

+

+ I'm always looking for new technologies to learn and improve my skills. + Here are some of the technologies I've been working with recently: +

+
+
diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index 68bf907..4f694c7 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -7,4 +7,12 @@ import { Component, OnInit } from '@angular/core'; }) export class HomeComponent { constructor() {} + + scrollToElement(element: HTMLElement): void { + element.scrollIntoView({ + behavior: "smooth", + block: "start", + inline: "nearest" + }); + } } From dacbf9f5487f6f349da98530d278093f06df8cfc Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Fri, 27 Oct 2023 08:24:29 -0300 Subject: [PATCH 04/13] Makes Header with Gradient for Better Styling --- src/app/header/header.component.css | 4 +++- src/app/home/home.component.css | 8 +++++++- src/app/home/home.component.html | 4 ++++ 3 files changed, 14 insertions(+), 2 deletions(-) diff --git a/src/app/header/header.component.css b/src/app/header/header.component.css index 0a955e5..4ed8e5b 100644 --- a/src/app/header/header.component.css +++ b/src/app/header/header.component.css @@ -5,7 +5,9 @@ position: fixed; width: 100vw; - background-color: #2e2e2e; + + background: rgb(46,46,46); + background: linear-gradient(180deg, rgba(46,46,46,1) 65%, rgba(46,46,46,0.45) 100%); z-index: 50; height: 10vh; diff --git a/src/app/home/home.component.css b/src/app/home/home.component.css index ab6cec4..4a60533 100644 --- a/src/app/home/home.component.css +++ b/src/app/home/home.component.css @@ -95,7 +95,8 @@ /* STACK SECTION*/ .stack-section { - background-color: #f1f1f1; + background: rgb(241,241,241); + /*background: linear-gradient(0deg, rgba(241,241,241,1) 80%, rgba(51,51,51,1) 100%);*/ height: 90vh; } .stack { @@ -105,6 +106,11 @@ justify-content: center; } +.stack h2 { + font-weight: 600; + font-size: 2.5rem; +} + .stack p { font-family: "Poppins", sans-serif; diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index a9a7ed0..87b1202 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -37,4 +37,8 @@ Here are some of the technologies I've been working with recently:

+ +
+ +
From be7e11aba47da2eec4504ee4edb77825db4ee688 Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Tue, 31 Oct 2023 02:12:26 -0300 Subject: [PATCH 05/13] Implements Better Env Configuration --- Dockerfile | 4 +- package-lock.json | 631 +++++++++++++++++++++++++++++++++++++++++----- package.json | 8 +- set_env.js | 27 ++ 4 files changed, 607 insertions(+), 63 deletions(-) create mode 100644 set_env.js diff --git a/Dockerfile b/Dockerfile index 262ba6e..54544e9 100644 --- a/Dockerfile +++ b/Dockerfile @@ -9,7 +9,7 @@ RUN apk add gettext RUN npm install RUN npm install -g @angular/cli@16 -RUN ng build --configuration=production +RUN npm run build:prod EXPOSE 5000-7000 -CMD sh -c "envsubst < dist/frontend-hideyoshi.com/assets/env.sample.js > dist/frontend-hideyoshi.com/assets/env.js && npm start" +CMD ["npm", "run", "start:prod"] diff --git a/package-lock.json b/package-lock.json index edd6f33..f8569a3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -27,6 +27,7 @@ "bootstrap": "^4.6.2", "cookieconsent": "^3.1.1", "cors": "^2.8.5", + "envsub": "^4.1.0", "express": "^4.18.1", "jquery": "^3.6.0", "ngx-cookie-service": "^16.0.1", @@ -5741,7 +5742,6 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.0.tgz", "integrity": "sha512-LPuwb2P+NrQw3XhxGc36+XSvuBPopovXYTR9Ew++Du9Yb/bx5AzBfrIsBoj0EZUifjQU+sHL21sseZ3jerWO/A==", - "dev": true, "dependencies": { "call-bind": "^1.0.2", "is-array-buffer": "^3.0.1" @@ -5764,6 +5764,26 @@ "node": ">=8" } }, + "node_modules/arraybuffer.prototype.slice": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.2.tgz", + "integrity": "sha512-yMBKppFur/fbHu9/6USUe03bZ4knMYiwFBcyiaXB8Go0qNehwX6inYPzK9U0NeQvGxKthcmHcaR8P5MStSRBAw==", + "dependencies": { + "array-buffer-byte-length": "^1.0.0", + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "get-intrinsic": "^1.2.1", + "is-array-buffer": "^3.0.2", + "is-shared-array-buffer": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/async": { "version": "3.2.4", "resolved": "https://registry.npmjs.org/async/-/async-3.2.4.tgz", @@ -5813,7 +5833,6 @@ "version": "1.0.5", "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz", "integrity": "sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==", - "dev": true, "engines": { "node": ">= 0.4" }, @@ -6015,6 +6034,11 @@ "readable-stream": "^3.4.0" } }, + "node_modules/bluebird": { + "version": "3.7.2", + "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz", + "integrity": "sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==" + }, "node_modules/body-parser": { "version": "1.20.1", "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.1.tgz", @@ -6316,12 +6340,13 @@ } }, "node_modules/call-bind": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.2.tgz", - "integrity": "sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==", + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.5.tgz", + "integrity": "sha512-C3nQxfFZxFRVoJoGKKI8y3MOEo129NQ+FgQ08iye+Mk4zNZZGdjfs06bVTr+DBSlA66Q2VEcMki/cUCP4SercQ==", "dependencies": { - "function-bind": "^1.1.1", - "get-intrinsic": "^1.0.2" + "function-bind": "^1.1.2", + "get-intrinsic": "^1.2.1", + "set-function-length": "^1.1.1" }, "funding": { "url": "https://github.com/sponsors/ljharb" @@ -7352,6 +7377,19 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/define-data-property": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.1.tgz", + "integrity": "sha512-E7uGkTzkk1d0ByLeSc6ZsFS79Axg+m1P/VsgYsxHgiuc3tFSj+MjMIwe90FC4lOAZzNBdY7kkO2P2wKdsQ1vgQ==", + "dependencies": { + "get-intrinsic": "^1.2.1", + "gopd": "^1.0.1", + "has-property-descriptors": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/define-lazy-prop": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz", @@ -7365,7 +7403,6 @@ "version": "1.2.0", "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.0.tgz", "integrity": "sha512-xvqAVKGfT1+UAvPwKTVw/njhdQ8ZhXK4lI0bCIuCMrp2up9nPnaDftrLtmpTazqd1o+UY4zgzU+avtMbDP+ldA==", - "dev": true, "dependencies": { "has-property-descriptors": "^1.0.0", "object-keys": "^1.1.1" @@ -7430,6 +7467,14 @@ "integrity": "sha512-uJaamHkagcZtHPqCIHZxnFrXlunQXgBOsZSUOWwFw31QJCAbyTBoHMW75YOTur5ZNx8pIeAKgf6GWIgaqqiLhA==", "dev": true }, + "node_modules/diff": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz", + "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==", + "engines": { + "node": ">=0.3.1" + } + }, "node_modules/dir-glob": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz", @@ -7780,6 +7825,94 @@ "node": ">=6" } }, + "node_modules/envsub": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/envsub/-/envsub-4.1.0.tgz", + "integrity": "sha512-B44hta3xNFu6+zDhOha1TIrZkQHGDO3G5K8D2sJIkm/s3XyQjxWBGp1B+b/Y74Go1PqMP+cp8moPR4JullnD9Q==", + "dependencies": { + "bluebird": "^3.7.2", + "chalk": "^3.0.0", + "commander": "^4.0.1", + "diff": "^4.0.1", + "handlebars": "^4.5.3", + "lodash": "^4.17.15", + "replace-last": "^1.2.6", + "string.prototype.matchall": "^4.0.8" + }, + "bin": { + "envsub": "bin/envsub.js", + "envsubh": "bin/envsubh.js" + } + }, + "node_modules/envsub/node_modules/ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dependencies": { + "color-convert": "^2.0.1" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/envsub/node_modules/chalk": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz", + "integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==", + "dependencies": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/envsub/node_modules/color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dependencies": { + "color-name": "~1.1.4" + }, + "engines": { + "node": ">=7.0.0" + } + }, + "node_modules/envsub/node_modules/color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" + }, + "node_modules/envsub/node_modules/commander": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz", + "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==", + "engines": { + "node": ">= 6" + } + }, + "node_modules/envsub/node_modules/has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "engines": { + "node": ">=8" + } + }, + "node_modules/envsub/node_modules/supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dependencies": { + "has-flag": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/err-code": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/err-code/-/err-code-2.0.3.tgz", @@ -7808,6 +7941,58 @@ "is-arrayish": "^0.2.1" } }, + "node_modules/es-abstract": { + "version": "1.22.3", + "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.22.3.tgz", + "integrity": "sha512-eiiY8HQeYfYH2Con2berK+To6GrK2RxbPawDkGq4UiCQQfZHb6wX9qQqkbpPqaxQFcl8d9QzZqo0tGE0VcrdwA==", + "dependencies": { + "array-buffer-byte-length": "^1.0.0", + "arraybuffer.prototype.slice": "^1.0.2", + "available-typed-arrays": "^1.0.5", + "call-bind": "^1.0.5", + "es-set-tostringtag": "^2.0.1", + "es-to-primitive": "^1.2.1", + "function.prototype.name": "^1.1.6", + "get-intrinsic": "^1.2.2", + "get-symbol-description": "^1.0.0", + "globalthis": "^1.0.3", + "gopd": "^1.0.1", + "has-property-descriptors": "^1.0.0", + "has-proto": "^1.0.1", + "has-symbols": "^1.0.3", + "hasown": "^2.0.0", + "internal-slot": "^1.0.5", + "is-array-buffer": "^3.0.2", + "is-callable": "^1.2.7", + "is-negative-zero": "^2.0.2", + "is-regex": "^1.1.4", + "is-shared-array-buffer": "^1.0.2", + "is-string": "^1.0.7", + "is-typed-array": "^1.1.12", + "is-weakref": "^1.0.2", + "object-inspect": "^1.13.1", + "object-keys": "^1.1.1", + "object.assign": "^4.1.4", + "regexp.prototype.flags": "^1.5.1", + "safe-array-concat": "^1.0.1", + "safe-regex-test": "^1.0.0", + "string.prototype.trim": "^1.2.8", + "string.prototype.trimend": "^1.0.7", + "string.prototype.trimstart": "^1.0.7", + "typed-array-buffer": "^1.0.0", + "typed-array-byte-length": "^1.0.0", + "typed-array-byte-offset": "^1.0.0", + "typed-array-length": "^1.0.4", + "unbox-primitive": "^1.0.2", + "which-typed-array": "^1.1.13" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/es-get-iterator": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/es-get-iterator/-/es-get-iterator-1.1.3.tgz", @@ -7834,6 +8019,35 @@ "integrity": "sha512-vZK7T0N2CBmBOixhmjdqx2gWVbFZ4DXZ/NyRMZVlJXPa7CyFS+/a4QQsDGDQy9ZfEzxFuNEsMLeQJnKP2p5/JA==", "dev": true }, + "node_modules/es-set-tostringtag": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.2.tgz", + "integrity": "sha512-BuDyupZt65P9D2D2vA/zqcI3G5xRsklm5N3xCwuiy+/vKy8i0ifdsQP1sLgO4tZDSCaQUSnmC48khknGMV3D2Q==", + "dependencies": { + "get-intrinsic": "^1.2.2", + "has-tostringtag": "^1.0.0", + "hasown": "^2.0.0" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/es-to-primitive": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz", + "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==", + "dependencies": { + "is-callable": "^1.1.4", + "is-date-object": "^1.0.1", + "is-symbol": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/esbuild": { "version": "0.18.17", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.17.tgz", @@ -8740,7 +8954,6 @@ "version": "0.3.3", "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz", "integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==", - "dev": true, "dependencies": { "is-callable": "^1.1.3" } @@ -8884,15 +9097,34 @@ } }, "node_modules/function-bind": { - "version": "1.1.1", - "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", - "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==" + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", + "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/function.prototype.name": { + "version": "1.1.6", + "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.6.tgz", + "integrity": "sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "functions-have-names": "^1.2.3" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } }, "node_modules/functions-have-names": { "version": "1.2.3", "resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.3.tgz", "integrity": "sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==", - "dev": true, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -8935,14 +9167,14 @@ } }, "node_modules/get-intrinsic": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.1.tgz", - "integrity": "sha512-2DcsyfABl+gVHEfCOaTrWgyt+tb6MSEGmKq+kI5HwLbIYgjgmMcV8KQ41uaKz1xxUcn9tJtgFbQUEVcEbd0FYw==", + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.2.tgz", + "integrity": "sha512-0gSo4ml/0j98Y3lngkFEot/zhiCeWsbYIlZ+uZOVgzLyLaUw7wxUL+nCTP0XJvJg1AXulJRI3UJi8GsbDuxdGA==", "dependencies": { - "function-bind": "^1.1.1", - "has": "^1.0.3", + "function-bind": "^1.1.2", "has-proto": "^1.0.1", - "has-symbols": "^1.0.3" + "has-symbols": "^1.0.3", + "hasown": "^2.0.0" }, "funding": { "url": "https://github.com/sponsors/ljharb" @@ -8969,6 +9201,21 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/get-symbol-description": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.0.tgz", + "integrity": "sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==", + "dependencies": { + "call-bind": "^1.0.2", + "get-intrinsic": "^1.1.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/glob": { "version": "7.2.3", "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", @@ -9016,6 +9263,20 @@ "node": ">=4" } }, + "node_modules/globalthis": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.3.tgz", + "integrity": "sha512-sFdI5LyBiNTHjRd7cGPWapiHWMOXKyuBNX/cWJ3NfzrZQVa8GI/8cofCl74AOVqq9W5kNmguTIzJ/1s2gyI9wA==", + "dependencies": { + "define-properties": "^1.1.3" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/globby": { "version": "11.1.0", "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz", @@ -9040,7 +9301,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz", "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==", - "dev": true, "dependencies": { "get-intrinsic": "^1.1.3" }, @@ -9078,6 +9338,34 @@ "integrity": "sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg==", "dev": true }, + "node_modules/handlebars": { + "version": "4.7.8", + "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.7.8.tgz", + "integrity": "sha512-vafaFqs8MZkRrSX7sFVUdo3ap/eNiLnb4IakshzvP56X5Nr1iGKAIqdX6tMlm6HcNRIkr6AxO5jFEoJzzpT8aQ==", + "dependencies": { + "minimist": "^1.2.5", + "neo-async": "^2.6.2", + "source-map": "^0.6.1", + "wordwrap": "^1.0.0" + }, + "bin": { + "handlebars": "bin/handlebars" + }, + "engines": { + "node": ">=0.4.7" + }, + "optionalDependencies": { + "uglify-js": "^3.1.4" + } + }, + "node_modules/handlebars/node_modules/source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/has": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", @@ -9114,7 +9402,6 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.0.2.tgz", "integrity": "sha512-tSvCKtBr9lkF0Ex0aQiP9N+OpV4zi2r/Nee5VkRDbaqv35RLYMzbwQfFSZZH0kR+Rd6302UJZ2p/bJCEoR3VoQ==", - "dev": true, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -9132,7 +9419,6 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.0.tgz", "integrity": "sha512-62DVLZGoiEBDHQyqG4w9xCuZ7eJEwNmJRWw2VY84Oedb7WFcA27fiEVe8oUQx9hAUJ4ekurquucTGwsyO1XGdQ==", - "dev": true, "dependencies": { "get-intrinsic": "^1.1.1" }, @@ -9166,7 +9452,6 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.0.tgz", "integrity": "sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ==", - "dev": true, "dependencies": { "has-symbols": "^1.0.2" }, @@ -9183,6 +9468,17 @@ "integrity": "sha512-8Rf9Y83NBReMnx0gFzA8JImQACstCYWUplepDa9xprwwtmgEZUF0h/i5xSA625zB/I37EtrswSST6OXxwaaIJQ==", "dev": true }, + "node_modules/hasown": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.0.tgz", + "integrity": "sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==", + "dependencies": { + "function-bind": "^1.1.2" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/hdr-histogram-js": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/hdr-histogram-js/-/hdr-histogram-js-2.0.3.tgz", @@ -9712,7 +10008,6 @@ "version": "1.0.5", "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.5.tgz", "integrity": "sha512-Y+R5hJrzs52QCG2laLn4udYVnxsfny9CpOhNhUvk/SSSVyF6T27FzRbF0sroPidSu3X8oEAkOn2K804mjpt6UQ==", - "dev": true, "dependencies": { "get-intrinsic": "^1.2.0", "has": "^1.0.3", @@ -9756,7 +10051,6 @@ "version": "3.0.2", "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.2.tgz", "integrity": "sha512-y+FyyR/w8vfIRq4eQcM1EYgSTnmHXPqaF+IgzgraytCFq5Xh8lllDVmAZolPJiZttZLeFSINPYMaEJ7/vWUa1w==", - "dev": true, "dependencies": { "call-bind": "^1.0.2", "get-intrinsic": "^1.2.0", @@ -9776,7 +10070,6 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz", "integrity": "sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==", - "dev": true, "dependencies": { "has-bigints": "^1.0.1" }, @@ -9800,7 +10093,6 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz", "integrity": "sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==", - "dev": true, "dependencies": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -9816,7 +10108,6 @@ "version": "1.2.7", "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz", "integrity": "sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==", - "dev": true, "engines": { "node": ">= 0.4" }, @@ -9840,7 +10131,6 @@ "version": "1.0.5", "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.5.tgz", "integrity": "sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==", - "dev": true, "dependencies": { "has-tostringtag": "^1.0.0" }, @@ -9953,6 +10243,17 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-negative-zero": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.2.tgz", + "integrity": "sha512-dqJvarLawXsFbNDeJW7zAz8ItJ9cd28YufuuFzh0G8pNHjJMnY08Dv7sYX2uF5UpQOwieAeOExEYAWWfu7ZZUA==", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-number": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", @@ -9966,7 +10267,6 @@ "version": "1.0.7", "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.7.tgz", "integrity": "sha512-k1U0IRzLMo7ZlYIfzRu23Oh6MiIFasgpb9X76eqfFZAqwH44UI4KTBvBYIZ1dSL9ZzChTB9ShHfLkR4pdW5krQ==", - "dev": true, "dependencies": { "has-tostringtag": "^1.0.0" }, @@ -10020,7 +10320,6 @@ "version": "1.1.4", "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.1.4.tgz", "integrity": "sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==", - "dev": true, "dependencies": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -10045,7 +10344,6 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.2.tgz", "integrity": "sha512-sqN2UDu1/0y6uvXyStCOzyhAjCSlHceFoMKJW8W9EU9cvic/QdsZ0kEU93HEy3IUEFZIiH/3w+AH/UQbPHNdhA==", - "dev": true, "dependencies": { "call-bind": "^1.0.2" }, @@ -10069,7 +10367,6 @@ "version": "1.0.7", "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.0.7.tgz", "integrity": "sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==", - "dev": true, "dependencies": { "has-tostringtag": "^1.0.0" }, @@ -10084,7 +10381,6 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.4.tgz", "integrity": "sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==", - "dev": true, "dependencies": { "has-symbols": "^1.0.2" }, @@ -10099,7 +10395,6 @@ "version": "1.1.12", "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.12.tgz", "integrity": "sha512-Z14TF2JNG8Lss5/HMqt0//T9JeHXttXy5pH/DBU4vi98ozO2btxzq9MwYDZYnKwU8nRsz/+GVFVRDq3DkVuSPg==", - "dev": true, "dependencies": { "which-typed-array": "^1.1.11" }, @@ -10131,6 +10426,17 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-weakref": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.0.2.tgz", + "integrity": "sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==", + "dependencies": { + "call-bind": "^1.0.2" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-weakset": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.2.tgz", @@ -10165,8 +10471,7 @@ "node_modules/isarray": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz", - "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==", - "dev": true + "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==" }, "node_modules/isbinaryfile": { "version": "4.0.10", @@ -10959,8 +11264,7 @@ "node_modules/lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", - "dev": true + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, "node_modules/lodash.debounce": { "version": "4.0.8", @@ -11390,7 +11694,6 @@ "version": "1.2.8", "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz", "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==", - "dev": true, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -11737,8 +12040,7 @@ "node_modules/neo-async": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz", - "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", - "dev": true + "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==" }, "node_modules/ngx-cookie-service": { "version": "16.0.1", @@ -12274,9 +12576,9 @@ } }, "node_modules/object-inspect": { - "version": "1.12.3", - "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.12.3.tgz", - "integrity": "sha512-geUvdk7c+eizMNUDkRpW1wJwgfOiOeHbxBR/hLXK1aT6zmVSO0jsQcs7fj6MGw89jC/cjGfLcNOrtMYtGqm81g==", + "version": "1.13.1", + "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz", + "integrity": "sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==", "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -12301,7 +12603,6 @@ "version": "1.1.1", "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz", "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==", - "dev": true, "engines": { "node": ">= 0.4" } @@ -12319,7 +12620,6 @@ "version": "4.1.4", "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.4.tgz", "integrity": "sha512-1mxKf0e58bvyjSCtKYY4sRe9itRk3PJpquJOjeIkz885CczcI4IvJJDLPS72oowuSh+pBxUFROpX+TU++hxhZQ==", - "dev": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.1.4", @@ -13607,14 +13907,13 @@ "dev": true }, "node_modules/regexp.prototype.flags": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.0.tgz", - "integrity": "sha512-0SutC3pNudRKgquxGoRGIz946MZVHqbNfPjBdxeOhBrdgDKlRoXmYLQN9xRbrR09ZXWeGAdPuif7egofn6v5LA==", - "dev": true, + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz", + "integrity": "sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==", "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", - "functions-have-names": "^1.2.3" + "set-function-name": "^2.0.0" }, "engines": { "node": ">= 0.4" @@ -13661,6 +13960,14 @@ "jsesc": "bin/jsesc" } }, + "node_modules/replace-last": { + "version": "1.2.6", + "resolved": "https://registry.npmjs.org/replace-last/-/replace-last-1.2.6.tgz", + "integrity": "sha512-Cj+MK38VtNu1S5J73mEZY3ciQb9dJajNq1Q8inP4dn/MhJMjHwoAF3Z3FjspwAEV9pfABl565MQucmrjOkty4g==", + "engines": { + "node": ">= 4.0.0" + } + }, "node_modules/require-directory": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz", @@ -13880,6 +14187,23 @@ "tslib": "^2.1.0" } }, + "node_modules/safe-array-concat": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.0.1.tgz", + "integrity": "sha512-6XbUAseYE2KtOuGueyeobCySj9L4+66Tn6KQMOPQJrAJEowYKW/YR/MGJZl7FdydUdaFu4LYyDZjxf4/Nmo23Q==", + "dependencies": { + "call-bind": "^1.0.2", + "get-intrinsic": "^1.2.1", + "has-symbols": "^1.0.3", + "isarray": "^2.0.5" + }, + "engines": { + "node": ">=0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/safe-buffer": { "version": "5.2.1", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz", @@ -13899,6 +14223,19 @@ } ] }, + "node_modules/safe-regex-test": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.0.tgz", + "integrity": "sha512-JBUUzyOgEwXQY1NuPtvcj/qcBDbDmEvWufhlnXZIm75DEHp+afM1r1ujJpJsV/gSM4t59tpDyPi1sd6ZaPFfsA==", + "dependencies": { + "call-bind": "^1.0.2", + "get-intrinsic": "^1.1.3", + "is-regex": "^1.1.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/safer-buffer": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", @@ -14211,6 +14548,33 @@ "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==", "dev": true }, + "node_modules/set-function-length": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.1.1.tgz", + "integrity": "sha512-VoaqjbBJKiWtg4yRcKBQ7g7wnGnLV3M8oLvVWwOk2PdYY6PEFegR1vezXR0tw6fZGF9csVakIRjrJiy2veSBFQ==", + "dependencies": { + "define-data-property": "^1.1.1", + "get-intrinsic": "^1.2.1", + "gopd": "^1.0.1", + "has-property-descriptors": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/set-function-name": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.1.tgz", + "integrity": "sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==", + "dependencies": { + "define-data-property": "^1.0.1", + "functions-have-names": "^1.2.3", + "has-property-descriptors": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/setprototypeof": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz", @@ -14678,6 +15042,67 @@ "node": ">=8" } }, + "node_modules/string.prototype.matchall": { + "version": "4.0.10", + "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.10.tgz", + "integrity": "sha512-rGXbGmOEosIQi6Qva94HUjgPs9vKW+dkG7Y8Q5O2OYkWL6wFaTRZO8zM4mhP94uX55wgyrXzfS2aGtGzUL7EJQ==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "get-intrinsic": "^1.2.1", + "has-symbols": "^1.0.3", + "internal-slot": "^1.0.5", + "regexp.prototype.flags": "^1.5.0", + "set-function-name": "^2.0.0", + "side-channel": "^1.0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/string.prototype.trim": { + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.8.tgz", + "integrity": "sha512-lfjY4HcixfQXOfaqCvcBuOIapyaroTXhbkfJN3gcB1OtyupngWK4sEET9Knd0cXd28kTUqu/kHoV4HKSJdnjiQ==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/string.prototype.trimend": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.7.tgz", + "integrity": "sha512-Ni79DqeB72ZFq1uH/L6zJ+DKZTkOtPIHovb3YZHQViE+HDouuU4mBrLOLDn5Dde3RF8qw5qVETEjhu9locMLvA==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/string.prototype.trimstart": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.7.tgz", + "integrity": "sha512-NGhtDFu3jCEm7B4Fy0DpLewdJQOZcQ0rGbwQ/+stjnrp2i+rlKeCvos9hOIeCmqwratM47OBxY7uFZzjxHXmrg==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/strip-ansi": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", @@ -15284,6 +15709,67 @@ "node": ">= 0.6" } }, + "node_modules/typed-array-buffer": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.0.tgz", + "integrity": "sha512-Y8KTSIglk9OZEr8zywiIHG/kmQ7KWyjseXs1CbSo8vC42w7hg2HgYTxSWwP0+is7bWDc1H+Fo026CpHFwm8tkw==", + "dependencies": { + "call-bind": "^1.0.2", + "get-intrinsic": "^1.2.1", + "is-typed-array": "^1.1.10" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/typed-array-byte-length": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.0.tgz", + "integrity": "sha512-Or/+kvLxNpeQ9DtSydonMxCx+9ZXOswtwJn17SNLvhptaXYDJvkFFP5zbfU/uLmvnBJlI4yrnXRxpdWH/M5tNA==", + "dependencies": { + "call-bind": "^1.0.2", + "for-each": "^0.3.3", + "has-proto": "^1.0.1", + "is-typed-array": "^1.1.10" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/typed-array-byte-offset": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.0.tgz", + "integrity": "sha512-RD97prjEt9EL8YgAgpOkf3O4IF9lhJFr9g0htQkm0rchFp/Vx7LW5Q8fSXXub7BXAODyUQohRMyOc3faCPd0hg==", + "dependencies": { + "available-typed-arrays": "^1.0.5", + "call-bind": "^1.0.2", + "for-each": "^0.3.3", + "has-proto": "^1.0.1", + "is-typed-array": "^1.1.10" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/typed-array-length": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.4.tgz", + "integrity": "sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng==", + "dependencies": { + "call-bind": "^1.0.2", + "for-each": "^0.3.3", + "is-typed-array": "^1.1.9" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/typed-assert": { "version": "1.0.9", "resolved": "https://registry.npmjs.org/typed-assert/-/typed-assert-1.0.9.tgz", @@ -15322,6 +15808,32 @@ "node": "*" } }, + "node_modules/uglify-js": { + "version": "3.17.4", + "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.17.4.tgz", + "integrity": "sha512-T9q82TJI9e/C1TAxYvfb16xO120tMVFZrGA3f9/P4424DNu6ypK103y0GPFVa17yotwSyZW5iYXgjYHkGrJW/g==", + "optional": true, + "bin": { + "uglifyjs": "bin/uglifyjs" + }, + "engines": { + "node": ">=0.8.0" + } + }, + "node_modules/unbox-primitive": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz", + "integrity": "sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==", + "dependencies": { + "call-bind": "^1.0.2", + "has-bigints": "^1.0.2", + "has-symbols": "^1.0.3", + "which-boxed-primitive": "^1.0.2" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/unicode-canonical-property-names-ecmascript": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz", @@ -16042,7 +16554,6 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz", "integrity": "sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==", - "dev": true, "dependencies": { "is-bigint": "^1.0.1", "is-boolean-object": "^1.1.0", @@ -16070,13 +16581,12 @@ } }, "node_modules/which-typed-array": { - "version": "1.1.11", - "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.11.tgz", - "integrity": "sha512-qe9UWWpkeG5yzZ0tNYxDmd7vo58HDBc39mZ0xWWpolAGADdFOzkfamWLDxkOWcvHQKVmdTyQdLD4NOfjLWTKew==", - "dev": true, + "version": "1.1.13", + "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.13.tgz", + "integrity": "sha512-P5Nra0qjSncduVPEAr7xhoF5guty49ArDTwzJ/yNuPIbZppyRxFQsRCWrocxIY+CnMVG+qfbU2FmDKyvSGClow==", "dependencies": { "available-typed-arrays": "^1.0.5", - "call-bind": "^1.0.2", + "call-bind": "^1.0.4", "for-each": "^0.3.3", "gopd": "^1.0.1", "has-tostringtag": "^1.0.0" @@ -16103,6 +16613,11 @@ "integrity": "sha512-CC1bOL87PIWSBhDcTrdeLo6eGT7mCFtrg0uIJtqJUFyK+eJnzl8A1niH56uu7KMa5XFrtiV+AQuHO3n7DsHnLQ==", "dev": true }, + "node_modules/wordwrap": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz", + "integrity": "sha512-gvVzJFlPycKc5dZN4yPkP8w7Dc37BtP1yczEneOb4uq34pXZcvrtRTmWV8W+Ume+XCxKgbjM+nevkyFPMybd4Q==" + }, "node_modules/wrap-ansi": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz", diff --git a/package.json b/package.json index 25e719b..136ca43 100644 --- a/package.json +++ b/package.json @@ -2,10 +2,11 @@ "name": "frontend-hideyoshi.com", "version": "0.0.0", "scripts": { - "start": "node ./server.js", + "start": "node ./set_env.js && node ./server.js", + "serve": "node ./set_env.js && ng serve", "build": "ng build", - "serve": "ng serve", - "serve:prod": "ng serve --configuration=production", + "start:prod": "node ./set_env.js --prod && node ./server.js", + "serve:prod": "node ./set_env.js --prod && ng serve --configuration=production", "build:prod": "ng build --configuration=production" }, "proxy": { @@ -34,6 +35,7 @@ "bootstrap": "^4.6.2", "cookieconsent": "^3.1.1", "cors": "^2.8.5", + "envsub": "^4.1.0", "express": "^4.18.1", "jquery": "^3.6.0", "ngx-cookie-service": "^16.0.1", diff --git a/set_env.js b/set_env.js new file mode 100644 index 0000000..f1fc67b --- /dev/null +++ b/set_env.js @@ -0,0 +1,27 @@ +function getPrefix() { + if (process.argv.includes('--prod') || process.argv.includes('-p')) { + return `${__dirname}/dist/frontend-hideyoshi.com` + } + return `${__dirname}/src` +} + +function readDotEnv() { + const dotenv = require('dotenv') + dotenv.config() +} + +function setEnv() { + readDotEnv() + let prefix = getPrefix() + + let templateFile = `${prefix}/assets/env.sample.js` + let outputFile = `${prefix}/assets/env.js` + + const envsub = require('envsub') + + envsub({templateFile, outputFile}).then(() => {}).catch((err) => { + console.error(err) + }); +} + +setEnv() From d707b28caa823de67ec89031c4cc79b6a5b1923a Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Tue, 31 Oct 2023 02:39:14 -0300 Subject: [PATCH 06/13] Empty commit From 0b32845c2b547d04074300cd5afe9cf9fae89360 Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Wed, 8 Nov 2023 04:15:18 -0300 Subject: [PATCH 07/13] Implements Initial Stack Slider --- angular.json | 9 +- package-lock.json | 112 ++++++++++++------ package.json | 2 + src/app/app.module.ts | 4 +- src/app/header/header.component.css | 1 - src/app/home/home.component.css | 4 +- src/app/home/home.component.html | 3 +- src/app/home/home.module.ts | 21 ++++ .../stack-card/stack-card.component.css | 40 +++++++ .../stack-card/stack-card.component.html | 7 ++ .../stack-card/stack-card.component.spec.ts | 21 ++++ .../stack-card/stack-card.component.ts | 35 ++++++ .../stack-slider/stack-slider.component.css | 5 + .../stack-slider/stack-slider.component.html | 9 ++ .../stack-slider.component.spec.ts | 21 ++++ .../stack-slider/stack-slider.component.ts | 76 ++++++++++++ src/app/shared/model/stack/stack.model.ts | 5 + 17 files changed, 327 insertions(+), 48 deletions(-) create mode 100644 src/app/home/home.module.ts create mode 100644 src/app/home/stack-slider/stack-card/stack-card.component.css create mode 100644 src/app/home/stack-slider/stack-card/stack-card.component.html create mode 100644 src/app/home/stack-slider/stack-card/stack-card.component.spec.ts create mode 100644 src/app/home/stack-slider/stack-card/stack-card.component.ts create mode 100644 src/app/home/stack-slider/stack-slider.component.css create mode 100644 src/app/home/stack-slider/stack-slider.component.html create mode 100644 src/app/home/stack-slider/stack-slider.component.spec.ts create mode 100644 src/app/home/stack-slider/stack-slider.component.ts create mode 100644 src/app/shared/model/stack/stack.model.ts diff --git a/angular.json b/angular.json index 5ab386a..2452635 100644 --- a/angular.json +++ b/angular.json @@ -26,13 +26,14 @@ ], "styles": [ "src/styles.css", - "node_modules/bootstrap/dist/css/bootstrap.min.css", - "node_modules/normalize.css/normalize.css", - "node_modules/cookieconsent/build/cookieconsent.min.css" + "node_modules/bootstrap/dist/css/bootstrap.css", + "node_modules/cookieconsent/build/cookieconsent.min.css", + "node_modules/@glidejs/glide/dist/css/glide.core.css", + "node_modules/@glidejs/glide/dist/css/glide.theme.css" ], "scripts": [ "node_modules/jquery/dist/jquery.min.js", - "node_modules/bootstrap/dist/js/bootstrap.bundle.min.js", + "node_modules/bootstrap/dist/js/bootstrap.bundle.js", "node_modules/cookieconsent/build/cookieconsent.min.js" ], "serviceWorker": true, diff --git a/package-lock.json b/package-lock.json index f8569a3..c9e31e2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -24,6 +24,7 @@ "@fortawesome/free-brands-svg-icons": "^6.1.1", "@fortawesome/free-regular-svg-icons": "^6.1.1", "@fortawesome/free-solid-svg-icons": "^6.1.1", + "@glidejs/glide": "^3.6.0", "bootstrap": "^4.6.2", "cookieconsent": "^3.1.1", "cors": "^2.8.5", @@ -32,6 +33,7 @@ "jquery": "^3.6.0", "ngx-cookie-service": "^16.0.1", "ngx-cookieconsent": "^4.0.2", + "ngx-glide": "^16.0.0", "normalize.css": "^8.0.1", "rxjs": "~7.5.0", "ts-interface-checker": "^1.0.2", @@ -778,12 +780,12 @@ "dev": true }, "node_modules/@babel/code-frame": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.22.10.tgz", - "integrity": "sha512-/KKIMG4UEL35WmI9OlvMhurwtytjvXoFcGNrOvyG9zIzA8YmPjVtIZUf7b05+TPO7G7/GEmLHDaoCgACHl9hhA==", + "version": "7.22.13", + "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.22.13.tgz", + "integrity": "sha512-XktuhWlJ5g+3TJXc5upd9Ks1HutSArik6jf2eAjYFyIOf4ej3RN+184cZbzDvbPnuTJIUhPKKJE3cIsYTiAT3w==", "dev": true, "dependencies": { - "@babel/highlight": "^7.22.10", + "@babel/highlight": "^7.22.13", "chalk": "^2.4.2" }, "engines": { @@ -977,22 +979,36 @@ } }, "node_modules/@babel/helper-environment-visitor": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.5.tgz", - "integrity": "sha512-XGmhECfVA/5sAt+H+xpSg0mfrHq6FzNr9Oxh7PSEBBRUb/mL7Kz3NICXb194rCqAEdxkhPT1a88teizAFyvk8Q==", + "version": "7.22.20", + "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz", + "integrity": "sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==", "dev": true, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helper-function-name": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.22.5.tgz", - "integrity": "sha512-wtHSq6jMRE3uF2otvfuD3DIvVhOsSNshQl0Qrd7qC9oQJzHvOL4qQXlQn2916+CXGywIjpGuIkoyZRRxHPiNQQ==", + "version": "7.23.0", + "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz", + "integrity": "sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==", "dev": true, "dependencies": { - "@babel/template": "^7.22.5", - "@babel/types": "^7.22.5" + "@babel/template": "^7.22.15", + "@babel/types": "^7.23.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/helper-function-name/node_modules/@babel/template": { + "version": "7.22.15", + "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz", + "integrity": "sha512-QPErUVm4uyJa60rkI73qneDacvdvzxshT3kksGqlGWYdOTIUOwJ7RDUL8sGqslY1uXWSL6xMFKEXDS3ox2uF0w==", + "dev": true, + "dependencies": { + "@babel/code-frame": "^7.22.13", + "@babel/parser": "^7.22.15", + "@babel/types": "^7.22.15" }, "engines": { "node": ">=6.9.0" @@ -1154,9 +1170,9 @@ } }, "node_modules/@babel/helper-validator-identifier": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.5.tgz", - "integrity": "sha512-aJXu+6lErq8ltp+JhkJUfk1MTGyuA4v7f3pA+BJ5HLfNC6nAQ0Cpi9uOquUj8Hehg0aUiHzWQbOVJGao6ztBAQ==", + "version": "7.22.20", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz", + "integrity": "sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==", "dev": true, "engines": { "node": ">=6.9.0" @@ -1200,12 +1216,12 @@ } }, "node_modules/@babel/highlight": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.22.10.tgz", - "integrity": "sha512-78aUtVcT7MUscr0K5mIEnkwxPE0MaxkR5RxRwuHaQ+JuU5AmTPhY+do2mdzVTnIJJpyBglql2pehuBIWHug+WQ==", + "version": "7.22.20", + "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.22.20.tgz", + "integrity": "sha512-dkdMCN3py0+ksCgYmGG8jKeGA/8Tk+gJwSYYlFGxG5lmhfKNoAy004YpLxpS1W2J8m/EK2Ew+yOs9pVRwO89mg==", "dev": true, "dependencies": { - "@babel/helper-validator-identifier": "^7.22.5", + "@babel/helper-validator-identifier": "^7.22.20", "chalk": "^2.4.2", "js-tokens": "^4.0.0" }, @@ -1214,9 +1230,9 @@ } }, "node_modules/@babel/parser": { - "version": "7.22.11", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.22.11.tgz", - "integrity": "sha512-R5zb8eJIBPJriQtbH/htEQy4k7E2dHWlD2Y2VT07JCzwYZHBxV5ZYtM0UhXSNMT74LyxuM+b1jdL7pSesXbC/g==", + "version": "7.23.0", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.0.tgz", + "integrity": "sha512-vvPKKdMemU85V9WE/l5wZEmImpCtLqbnTvqDS2U1fJ96KrxoW7KrXhNsNCblQlg8Ck4b85yxdTyelsMUgFUXiw==", "dev": true, "bin": { "parser": "bin/babel-parser.js" @@ -2491,19 +2507,19 @@ } }, "node_modules/@babel/traverse": { - "version": "7.22.11", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.22.11.tgz", - "integrity": "sha512-mzAenteTfomcB7mfPtyi+4oe5BZ6MXxWcn4CX+h4IRJ+OOGXBrWU6jDQavkQI9Vuc5P+donFabBfFCcmWka9lQ==", + "version": "7.23.2", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.2.tgz", + "integrity": "sha512-azpe59SQ48qG6nu2CzcMLbxUudtN+dOM9kDbUqGq3HXUJRlo7i8fvPoxQUzYgLZ4cMVmuZgm8vvBpNeRhd6XSw==", "dev": true, "dependencies": { - "@babel/code-frame": "^7.22.10", - "@babel/generator": "^7.22.10", - "@babel/helper-environment-visitor": "^7.22.5", - "@babel/helper-function-name": "^7.22.5", + "@babel/code-frame": "^7.22.13", + "@babel/generator": "^7.23.0", + "@babel/helper-environment-visitor": "^7.22.20", + "@babel/helper-function-name": "^7.23.0", "@babel/helper-hoist-variables": "^7.22.5", "@babel/helper-split-export-declaration": "^7.22.6", - "@babel/parser": "^7.22.11", - "@babel/types": "^7.22.11", + "@babel/parser": "^7.23.0", + "@babel/types": "^7.23.0", "debug": "^4.1.0", "globals": "^11.1.0" }, @@ -2512,12 +2528,12 @@ } }, "node_modules/@babel/traverse/node_modules/@babel/generator": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.22.10.tgz", - "integrity": "sha512-79KIf7YiWjjdZ81JnLujDRApWtl7BxTqWD88+FFdQEIOG8LJ0etDOM7CXuIgGJa55sGOwZVwuEsaLEm0PJ5/+A==", + "version": "7.23.0", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.0.tgz", + "integrity": "sha512-lN85QRR+5IbYrMWM6Y4pE/noaQtg4pNiqeNGX60eqOfo6gtEj6uw/JagelB8vVztSd7R6M5n1+PQkDbHbBRU4g==", "dev": true, "dependencies": { - "@babel/types": "^7.22.10", + "@babel/types": "^7.23.0", "@jridgewell/gen-mapping": "^0.3.2", "@jridgewell/trace-mapping": "^0.3.17", "jsesc": "^2.5.1" @@ -2527,13 +2543,13 @@ } }, "node_modules/@babel/types": { - "version": "7.22.11", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.22.11.tgz", - "integrity": "sha512-siazHiGuZRz9aB9NpHy9GOs9xiQPKnMzgdr493iI1M67vRXpnEq8ZOOKzezC5q7zwuQ6sDhdSp4SD9ixKSqKZg==", + "version": "7.23.0", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.23.0.tgz", + "integrity": "sha512-0oIyUfKoI3mSqMvsxBdclDwxXKXAUA8v/apZbc+iSyARYou1o8ZGDxbUYyLFoW2arqS2jDGqJuZvv1d/io1axg==", "dev": true, "dependencies": { "@babel/helper-string-parser": "^7.22.5", - "@babel/helper-validator-identifier": "^7.22.5", + "@babel/helper-validator-identifier": "^7.22.20", "to-fast-properties": "^2.0.0" }, "engines": { @@ -3102,6 +3118,11 @@ "node": ">=6" } }, + "node_modules/@glidejs/glide": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/@glidejs/glide/-/glide-3.6.0.tgz", + "integrity": "sha512-47Aa+JmYjY4xTFpTtYCwrqirmI1arnp1UZETwtWpbTPisXUAuxrdJxKJLH8KHFWMsSrLi9+AcfyfzDIuO75rEA==" + }, "node_modules/@humanwhocodes/config-array": { "version": "0.11.10", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.10.tgz", @@ -12068,6 +12089,19 @@ "rxjs": "^7.5.0" } }, + "node_modules/ngx-glide": { + "version": "16.0.0", + "resolved": "https://registry.npmjs.org/ngx-glide/-/ngx-glide-16.0.0.tgz", + "integrity": "sha512-MVPTfYI+dSA1d/GmC6DVkAD5D3VWWLMzcZNAwrvRbMcj4+h4fWoxXlVNu2yLwFF+Nz0O2YhOFpvi6zlD8xg88Q==", + "dependencies": { + "tslib": "^2.3.0" + }, + "peerDependencies": { + "@angular/common": ">=16.x", + "@angular/core": ">=16.x", + "@glidejs/glide": "3.x" + } + }, "node_modules/nice-napi": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz", diff --git a/package.json b/package.json index 136ca43..0b5c8bd 100644 --- a/package.json +++ b/package.json @@ -32,6 +32,7 @@ "@fortawesome/free-brands-svg-icons": "^6.1.1", "@fortawesome/free-regular-svg-icons": "^6.1.1", "@fortawesome/free-solid-svg-icons": "^6.1.1", + "@glidejs/glide": "^3.6.0", "bootstrap": "^4.6.2", "cookieconsent": "^3.1.1", "cors": "^2.8.5", @@ -40,6 +41,7 @@ "jquery": "^3.6.0", "ngx-cookie-service": "^16.0.1", "ngx-cookieconsent": "^4.0.2", + "ngx-glide": "^16.0.0", "normalize.css": "^8.0.1", "rxjs": "~7.5.0", "ts-interface-checker": "^1.0.2", diff --git a/src/app/app.module.ts b/src/app/app.module.ts index ddced24..1ee9eb6 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -11,12 +11,14 @@ import { AppServiceWorkerModule } from './app-service-worker.module'; import { ServiceWorkerModule } from '@angular/service-worker'; import { environment } from '../environments/environment'; import { FooterComponent } from './footer/footer.component'; +import {HomeModule} from "./home/home.module"; @NgModule({ - declarations: [AppComponent, HomeComponent, FooterComponent], + declarations: [AppComponent, FooterComponent], imports: [ BrowserModule, HeaderModule, + HomeModule, AppRouterModule, AppServiceWorkerModule, SharedModule, diff --git a/src/app/header/header.component.css b/src/app/header/header.component.css index 4ed8e5b..0b13bc5 100644 --- a/src/app/header/header.component.css +++ b/src/app/header/header.component.css @@ -7,7 +7,6 @@ background: rgb(46,46,46); - background: linear-gradient(180deg, rgba(46,46,46,1) 65%, rgba(46,46,46,0.45) 100%); z-index: 50; height: 10vh; diff --git a/src/app/home/home.component.css b/src/app/home/home.component.css index 4a60533..b604fbe 100644 --- a/src/app/home/home.component.css +++ b/src/app/home/home.component.css @@ -97,10 +97,10 @@ .stack-section { background: rgb(241,241,241); /*background: linear-gradient(0deg, rgba(241,241,241,1) 80%, rgba(51,51,51,1) 100%);*/ - height: 90vh; + height: 80vh; } .stack { - height: 60%; + height: 35%; display: flex; flex-direction: column; justify-content: center; diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index 87b1202..5d99240 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -39,6 +39,7 @@
- + +
diff --git a/src/app/home/home.module.ts b/src/app/home/home.module.ts new file mode 100644 index 0000000..3780093 --- /dev/null +++ b/src/app/home/home.module.ts @@ -0,0 +1,21 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import {HomeComponent} from "./home.component"; +import {StackSliderComponent} from "./stack-slider/stack-slider.component"; +import {StackCardComponent} from "./stack-slider/stack-card/stack-card.component"; +import {NgxGlideComponent} from "ngx-glide"; + + + +@NgModule({ + declarations: [ + HomeComponent, + StackSliderComponent, + StackCardComponent + ], + imports: [ + CommonModule, + NgxGlideComponent + ] +}) +export class HomeModule { } diff --git a/src/app/home/stack-slider/stack-card/stack-card.component.css b/src/app/home/stack-slider/stack-card/stack-card.component.css new file mode 100644 index 0000000..74b49ea --- /dev/null +++ b/src/app/home/stack-slider/stack-card/stack-card.component.css @@ -0,0 +1,40 @@ +.stack-card { + width: 300px; + + border-radius: 15px; +} + +.stack-card-image { + width: 100%; + border-top-left-radius: 15px !important; + border-top-right-radius: 15px !important; + background-size: cover; + background-position: center; + background-repeat: no-repeat; +} + +.stack-card-body { + padding: 10px; + flex-grow: 1; + + width: 250px; + height: 130px; + inline-size: 250px; +} + +.stack-card-text { + word-break: break-all !important; + white-space: normal !important; +} + + +/*CARD STATE*/ +.active { + opacity: 1; + width: 300px; +} + +.inactive { + opacity: 0.85; + width: 275px; +} diff --git a/src/app/home/stack-slider/stack-card/stack-card.component.html b/src/app/home/stack-slider/stack-card/stack-card.component.html new file mode 100644 index 0000000..0e318bb --- /dev/null +++ b/src/app/home/stack-slider/stack-card/stack-card.component.html @@ -0,0 +1,7 @@ +
+ Stack Image +
+
{{stack.name}}
+

{{stack.description}}

+
+
diff --git a/src/app/home/stack-slider/stack-card/stack-card.component.spec.ts b/src/app/home/stack-slider/stack-card/stack-card.component.spec.ts new file mode 100644 index 0000000..c36ef9f --- /dev/null +++ b/src/app/home/stack-slider/stack-card/stack-card.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { StackCardComponent } from './stack-card.component'; + +describe('StackCardComponent', () => { + let component: StackCardComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [StackCardComponent] + }); + fixture = TestBed.createComponent(StackCardComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/home/stack-slider/stack-card/stack-card.component.ts b/src/app/home/stack-slider/stack-card/stack-card.component.ts new file mode 100644 index 0000000..0bfc93c --- /dev/null +++ b/src/app/home/stack-slider/stack-card/stack-card.component.ts @@ -0,0 +1,35 @@ +import {Component, Input} from '@angular/core'; +import {Stack} from "../../../shared/model/stack/stack.model"; +import {animate, state, style, transition, trigger} from "@angular/animations"; + +@Component({ + selector: 'app-stack-card', + templateUrl: './stack-card.component.html', + styleUrls: ['./stack-card.component.css'], + animations: [ + trigger('cardAnimation', [ + state('active', style({ + opacity: 1, + width: '300px', + })), + state('inactive', style({ + opacity: 0.85, + width: '275px', + })), + transition('* => *', [ + animate('0.1s') + ]), + ]) + ], +}) +export class StackCardComponent { + @Input() + stack!: Stack; + + @Input() + inFocus: boolean = false; + + get cardState(): 'active'|'inactive' { + return this.inFocus ? 'active' : 'inactive'; + } +} diff --git a/src/app/home/stack-slider/stack-slider.component.css b/src/app/home/stack-slider/stack-slider.component.css new file mode 100644 index 0000000..6c75bf0 --- /dev/null +++ b/src/app/home/stack-slider/stack-slider.component.css @@ -0,0 +1,5 @@ +.slider-card { + justify-content: center; + align-items: center; + display: flex; +} diff --git a/src/app/home/stack-slider/stack-slider.component.html b/src/app/home/stack-slider/stack-slider.component.html new file mode 100644 index 0000000..98a4163 --- /dev/null +++ b/src/app/home/stack-slider/stack-slider.component.html @@ -0,0 +1,9 @@ + + + + + + + + diff --git a/src/app/home/stack-slider/stack-slider.component.spec.ts b/src/app/home/stack-slider/stack-slider.component.spec.ts new file mode 100644 index 0000000..64e0e2e --- /dev/null +++ b/src/app/home/stack-slider/stack-slider.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { StackSliderComponent } from './stack-slider.component'; + +describe('StackSliderComponent', () => { + let component: StackSliderComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [StackSliderComponent] + }); + fixture = TestBed.createComponent(StackSliderComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/home/stack-slider/stack-slider.component.ts b/src/app/home/stack-slider/stack-slider.component.ts new file mode 100644 index 0000000..502cfb0 --- /dev/null +++ b/src/app/home/stack-slider/stack-slider.component.ts @@ -0,0 +1,76 @@ +import {AfterViewInit, ChangeDetectorRef, Component, ViewChild} from '@angular/core'; +import {NgxGlideComponent} from "ngx-glide"; +import {Stack} from "../../shared/model/stack/stack.model"; + + +@Component({ + selector: 'app-stack-slider', + templateUrl: './stack-slider.component.html', + styleUrls: ['./stack-slider.component.css'] +}) +export class StackSliderComponent implements AfterViewInit { + @ViewChild('ngxGlide') + ngxGlide!: NgxGlideComponent; + + stacks: Stack[] = [ + { + name: 'Angular', + image: 'https://picsum.photos/id/1/100/100', + description: 'Angular is a platform for building mobile and desktop web applications.', + }, + { + name: 'React', + image: 'https://picsum.photos/id/2/100/100', + description: 'React is a JavaScript library for building user interfaces.', + }, + { + name: 'Vue', + image: 'https://picsum.photos/id/3/100/100', + description: 'Vue is a progressive framework for building user interfaces.', + }, + { + name: 'Svelte', + image: 'https://picsum.photos/id/4/100/100', + description: 'Svelte is a radical new approach to building user interfaces.', + }, + { + name: 'Ember', + image: 'https://picsum.photos/id/5/100/100', + description: 'Ember.js is an open-source JavaScript web framework.', + }, + { + name: 'Preact', + image: 'https://picsum.photos/id/6/100/100', + description: 'Preact is a fast 3kB alternative to React with the same modern API.', + } + ] + + constructor(private cd: ChangeDetectorRef) { } + + ngAfterViewInit(): void { + if (this.ngxGlide) + this.buildCarousel(); + + this.cd.detectChanges(); + } + + buildCarousel(): void { + this.ngxGlide.showArrows = false; + this.ngxGlide.showBullets = false; + this.ngxGlide.type = 'carousel'; + this.ngxGlide.perView = 5; + this.ngxGlide.focusAt = 'center'; + this.ngxGlide.gap = 10; + this.ngxGlide.autoplay = 3000; + + this.ngxGlide.recreate(); + } + + get currentIndex(): number { + return this.ngxGlide?.getIndex(); + } + + isInFocus(stack: Stack): boolean { + return this.stacks.indexOf(stack) === this.currentIndex; + } +} diff --git a/src/app/shared/model/stack/stack.model.ts b/src/app/shared/model/stack/stack.model.ts new file mode 100644 index 0000000..fa6b311 --- /dev/null +++ b/src/app/shared/model/stack/stack.model.ts @@ -0,0 +1,5 @@ +export interface Stack { + name: string; + image: string; + description: string; +} From 5ad76cfa2469586180268b7954ebac5037493144 Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Wed, 8 Nov 2023 19:06:55 -0300 Subject: [PATCH 08/13] Implements Responsiveness in Stack Slider --- .../stack-slider/stack-slider.component.ts | 33 ++++++++++++++++--- 1 file changed, 28 insertions(+), 5 deletions(-) diff --git a/src/app/home/stack-slider/stack-slider.component.ts b/src/app/home/stack-slider/stack-slider.component.ts index 502cfb0..527ba34 100644 --- a/src/app/home/stack-slider/stack-slider.component.ts +++ b/src/app/home/stack-slider/stack-slider.component.ts @@ -1,4 +1,4 @@ -import {AfterViewInit, ChangeDetectorRef, Component, ViewChild} from '@angular/core'; +import {AfterViewInit, ChangeDetectorRef, Component, HostListener, ViewChild} from '@angular/core'; import {NgxGlideComponent} from "ngx-glide"; import {Stack} from "../../shared/model/stack/stack.model"; @@ -47,18 +47,27 @@ export class StackSliderComponent implements AfterViewInit { constructor(private cd: ChangeDetectorRef) { } + @HostListener('window:resize', ['$event']) + onResize(event: any) { + const numberOfCards = this.getNumberOfCards(event.target.innerWidth); + this.buildCarousel(numberOfCards); + } + ngAfterViewInit(): void { - if (this.ngxGlide) - this.buildCarousel(); + if (this.ngxGlide) { + const numberOfCards = this.getNumberOfCards(window.innerWidth); + this.buildCarousel(numberOfCards); + } this.cd.detectChanges(); } - buildCarousel(): void { + buildCarousel(numberOfCards: number): void { + this.ngxGlide.perView = numberOfCards; + this.ngxGlide.showArrows = false; this.ngxGlide.showBullets = false; this.ngxGlide.type = 'carousel'; - this.ngxGlide.perView = 5; this.ngxGlide.focusAt = 'center'; this.ngxGlide.gap = 10; this.ngxGlide.autoplay = 3000; @@ -73,4 +82,18 @@ export class StackSliderComponent implements AfterViewInit { isInFocus(stack: Stack): boolean { return this.stacks.indexOf(stack) === this.currentIndex; } + + private getNumberOfCards(windowWidth: number): number { + if (windowWidth <= 412) { + return 1; + } else if (windowWidth <= 768) { + return 2; + } else if (windowWidth <= 975) { + return 3; + } else if (windowWidth <= 1440) { + return 4; + } else { + return 5; + } + } } From 7c7a01f2ca171a95c12c55e9442c5e6d9780c696 Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Wed, 8 Nov 2023 23:48:07 -0300 Subject: [PATCH 09/13] Fixes Popup Angular Animation Overlap https://stackoverflow.com/questions/55122978/angular-7-animations-causes-z-index-overlapping-issue-on-webkit-browsers --- .../stack-slider/stack-slider.component.html | 14 +++++--------- .../components/popup/popup.component.css | 18 +++++++++--------- .../shared/components/popup/popup.component.ts | 2 ++ 3 files changed, 16 insertions(+), 18 deletions(-) diff --git a/src/app/home/stack-slider/stack-slider.component.html b/src/app/home/stack-slider/stack-slider.component.html index 98a4163..9967157 100644 --- a/src/app/home/stack-slider/stack-slider.component.html +++ b/src/app/home/stack-slider/stack-slider.component.html @@ -1,9 +1,5 @@ - - - - - - - - + + + + diff --git a/src/app/shared/components/popup/popup.component.css b/src/app/shared/components/popup/popup.component.css index 14fa8fa..8d3867c 100644 --- a/src/app/shared/components/popup/popup.component.css +++ b/src/app/shared/components/popup/popup.component.css @@ -7,14 +7,9 @@ .popup-background { background-color: rgba(0, 0, 0, 0.5); - justify-content: center; - align-content: center; - align-items: center; - overflow-y: hidden; - position: fixed; - display: flex; - height: 100vh; - width: 100vw; + position: absolute; + width: 100%; + height: 100%; left: 0; top: 0; } @@ -25,10 +20,15 @@ border: 1px solid #dddd; border-radius: 18px; height: fit-content; - position: relative; max-width: 400px; overflow: auto; width: 90%; + + position: fixed; + top: 50%; + left: 50%; + + transform: translate(-50%, -50%); } .popup-header { diff --git a/src/app/shared/components/popup/popup.component.ts b/src/app/shared/components/popup/popup.component.ts index b7fee51..93d3539 100644 --- a/src/app/shared/components/popup/popup.component.ts +++ b/src/app/shared/components/popup/popup.component.ts @@ -27,12 +27,14 @@ import { 'hide', style({ opacity: '0', + zIndex: 2 }), ), state( 'show', style({ opacity: '1', + zIndex: 2 }), ), transition( From 25d1109f3425ae91f4d6ed6c95afe2521941de7f Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Thu, 9 Nov 2023 01:01:20 -0300 Subject: [PATCH 10/13] Adds Real Stack Info --- src/app/home/home.module.ts | 5 +- .../stack-slider/stack-slider.component.ts | 55 ++++++++++++++----- src/assets/stacks/angular.svg | 1 + src/assets/stacks/aws.svg | 1 + src/assets/stacks/docker.svg | 1 + src/assets/stacks/fastapi.svg | 1 + src/assets/stacks/kubernetes.svg | 1 + src/assets/stacks/nextjs.svg | 1 + src/assets/stacks/nodejs.svg | 1 + src/assets/stacks/postgresql.svg | 1 + src/assets/stacks/redis.svg | 1 + src/assets/stacks/spring.svg | 1 + src/assets/stacks/terraform.svg | 1 + 13 files changed, 54 insertions(+), 17 deletions(-) create mode 100644 src/assets/stacks/angular.svg create mode 100644 src/assets/stacks/aws.svg create mode 100644 src/assets/stacks/docker.svg create mode 100644 src/assets/stacks/fastapi.svg create mode 100644 src/assets/stacks/kubernetes.svg create mode 100644 src/assets/stacks/nextjs.svg create mode 100644 src/assets/stacks/nodejs.svg create mode 100644 src/assets/stacks/postgresql.svg create mode 100644 src/assets/stacks/redis.svg create mode 100644 src/assets/stacks/spring.svg create mode 100644 src/assets/stacks/terraform.svg diff --git a/src/app/home/home.module.ts b/src/app/home/home.module.ts index 3780093..2bfa1be 100644 --- a/src/app/home/home.module.ts +++ b/src/app/home/home.module.ts @@ -1,5 +1,5 @@ import { NgModule } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import {CommonModule, NgOptimizedImage} from '@angular/common'; import {HomeComponent} from "./home.component"; import {StackSliderComponent} from "./stack-slider/stack-slider.component"; import {StackCardComponent} from "./stack-slider/stack-card/stack-card.component"; @@ -15,7 +15,8 @@ import {NgxGlideComponent} from "ngx-glide"; ], imports: [ CommonModule, - NgxGlideComponent + NgxGlideComponent, + NgOptimizedImage ] }) export class HomeModule { } diff --git a/src/app/home/stack-slider/stack-slider.component.ts b/src/app/home/stack-slider/stack-slider.component.ts index 527ba34..465537a 100644 --- a/src/app/home/stack-slider/stack-slider.component.ts +++ b/src/app/home/stack-slider/stack-slider.component.ts @@ -15,33 +15,58 @@ export class StackSliderComponent implements AfterViewInit { stacks: Stack[] = [ { name: 'Angular', - image: 'https://picsum.photos/id/1/100/100', + image: './assets/stacks/angular.svg', description: 'Angular is a platform for building mobile and desktop web applications.', }, { - name: 'React', - image: 'https://picsum.photos/id/2/100/100', + name: 'Next.js', + image: './assets/stacks/nextjs.svg', description: 'React is a JavaScript library for building user interfaces.', }, { - name: 'Vue', - image: 'https://picsum.photos/id/3/100/100', - description: 'Vue is a progressive framework for building user interfaces.', + name: 'FastAPI', + image: './assets/stacks/fastapi.svg', + description: 'FastAPI is a modern, fast (high-performance), web framework for building APIs.', }, { - name: 'Svelte', - image: 'https://picsum.photos/id/4/100/100', - description: 'Svelte is a radical new approach to building user interfaces.', + name: 'Node.js', + image: './assets/stacks/nodejs.svg', + description: 'Node.js is an open-source, cross-platform, back-end JavaScript runtime environment.', }, { - name: 'Ember', - image: 'https://picsum.photos/id/5/100/100', - description: 'Ember.js is an open-source JavaScript web framework.', + name: 'Spring Boot', + image: './assets/stacks/spring.svg', + description: 'Spring Boot makes it easy to create stand-alone, production-grade APIs', }, { - name: 'Preact', - image: 'https://picsum.photos/id/6/100/100', - description: 'Preact is a fast 3kB alternative to React with the same modern API.', + name: 'Docker', + image: './assets/stacks/docker.svg', + description: 'Docker is a set of platform as a service products to deliver software in packages called containers.', + }, + { + name: 'Kubernetes', + image: './assets/stacks/kubernetes.svg', + description: 'Kubernetes is an open-source container-orchestration system for automating deployment, scaling, and management.', + }, + { + name: 'Terraform', + image: './assets/stacks/terraform.svg', + description: 'Terraform is an open-source infrastructure as code software tool.', + }, + { + name: 'PostgreSQL', + image: './assets/stacks/postgresql.svg', + description: 'PostgreSQL is a free and open-source relational database.', + }, + { + name: 'Redis', + image: './assets/stacks/redis.svg', + description: 'Redis is an in-memory data structure store.', + }, + { + name: 'AWS', + image: './assets/stacks/aws.svg', + description: 'Amazon Web Services is a subsidiary of Amazon providing on-demand cloud computing.', } ] diff --git a/src/assets/stacks/angular.svg b/src/assets/stacks/angular.svg new file mode 100644 index 0000000..468c4ba --- /dev/null +++ b/src/assets/stacks/angular.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/aws.svg b/src/assets/stacks/aws.svg new file mode 100644 index 0000000..3840f92 --- /dev/null +++ b/src/assets/stacks/aws.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/docker.svg b/src/assets/stacks/docker.svg new file mode 100644 index 0000000..0a9c6b0 --- /dev/null +++ b/src/assets/stacks/docker.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/fastapi.svg b/src/assets/stacks/fastapi.svg new file mode 100644 index 0000000..c307de8 --- /dev/null +++ b/src/assets/stacks/fastapi.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/kubernetes.svg b/src/assets/stacks/kubernetes.svg new file mode 100644 index 0000000..9825631 --- /dev/null +++ b/src/assets/stacks/kubernetes.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/nextjs.svg b/src/assets/stacks/nextjs.svg new file mode 100644 index 0000000..14b3837 --- /dev/null +++ b/src/assets/stacks/nextjs.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/nodejs.svg b/src/assets/stacks/nodejs.svg new file mode 100644 index 0000000..0481f9f --- /dev/null +++ b/src/assets/stacks/nodejs.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/postgresql.svg b/src/assets/stacks/postgresql.svg new file mode 100644 index 0000000..9fa5c4d --- /dev/null +++ b/src/assets/stacks/postgresql.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/redis.svg b/src/assets/stacks/redis.svg new file mode 100644 index 0000000..0712975 --- /dev/null +++ b/src/assets/stacks/redis.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/spring.svg b/src/assets/stacks/spring.svg new file mode 100644 index 0000000..ce9bba0 --- /dev/null +++ b/src/assets/stacks/spring.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/stacks/terraform.svg b/src/assets/stacks/terraform.svg new file mode 100644 index 0000000..4929cd9 --- /dev/null +++ b/src/assets/stacks/terraform.svg @@ -0,0 +1 @@ + \ No newline at end of file From 93791a60aeef6dc8dcb0892e1583923a316c92b7 Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Thu, 9 Nov 2023 01:23:15 -0300 Subject: [PATCH 11/13] Adds Hind Font for P Texts and Fixes Cards Styling --- .../stack-card/stack-card.component.css | 25 +++++++++++++------ .../stack-card/stack-card.component.html | 7 +++++- .../stack-card/stack-card.component.ts | 8 +++--- src/styles.css | 5 ++++ 4 files changed, 33 insertions(+), 12 deletions(-) diff --git a/src/app/home/stack-slider/stack-card/stack-card.component.css b/src/app/home/stack-slider/stack-card/stack-card.component.css index 74b49ea..2d5f302 100644 --- a/src/app/home/stack-slider/stack-card/stack-card.component.css +++ b/src/app/home/stack-slider/stack-card/stack-card.component.css @@ -5,12 +5,11 @@ } .stack-card-image { - width: 100%; - border-top-left-radius: 15px !important; - border-top-right-radius: 15px !important; - background-size: cover; - background-position: center; - background-repeat: no-repeat; + width: 250px; + height: 250px; + position: relative; + display: flex; + align-items: center; } .stack-card-body { @@ -22,9 +21,18 @@ inline-size: 250px; } +.stack-card-title { + font-size: 1.5rem; + font-weight: 600; + margin-bottom: 10px; +} + .stack-card-text { word-break: break-all !important; white-space: normal !important; + font-size: 1rem; + font-weight: 400 !important; + font-family: 'Hind', sans-serif !important; } @@ -35,6 +43,7 @@ } .inactive { - opacity: 0.85; - width: 275px; + opacity: 0.7; + width: 300px; + height: 410px; } diff --git a/src/app/home/stack-slider/stack-card/stack-card.component.html b/src/app/home/stack-slider/stack-card/stack-card.component.html index 0e318bb..f79d7db 100644 --- a/src/app/home/stack-slider/stack-card/stack-card.component.html +++ b/src/app/home/stack-slider/stack-card/stack-card.component.html @@ -1,5 +1,10 @@
- Stack Image +
+ Stack Image +
{{stack.name}}

{{stack.description}}

diff --git a/src/app/home/stack-slider/stack-card/stack-card.component.ts b/src/app/home/stack-slider/stack-card/stack-card.component.ts index 0bfc93c..e64dbd1 100644 --- a/src/app/home/stack-slider/stack-card/stack-card.component.ts +++ b/src/app/home/stack-slider/stack-card/stack-card.component.ts @@ -10,11 +10,13 @@ import {animate, state, style, transition, trigger} from "@angular/animations"; trigger('cardAnimation', [ state('active', style({ opacity: 1, - width: '300px', + width: '350px', + height: '425px', })), state('inactive', style({ - opacity: 0.85, - width: '275px', + opacity: 0.7, + width: '300px', + height: '410px', })), transition('* => *', [ animate('0.1s') diff --git a/src/styles.css b/src/styles.css index e0431ef..5d178f5 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1,4 +1,5 @@ /* You can add global styles to this file, and also import other style files */ +@import url('https://fonts.googleapis.com/css2?family=Hind:wght@300;400;500;600;700&display=swap'); @import "font-montserrat.css"; * { @@ -21,3 +22,7 @@ h5, h6 { font-family: "Montserrat", sans-serif; } + +p { + font-family: "Hind", sans-serif; +} From 920701b1bb48422f46840319ee5e02850dc77435 Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Thu, 9 Nov 2023 01:58:23 -0300 Subject: [PATCH 12/13] Fixes Minor Responsiveness Issues --- src/app/home/home.component.css | 21 +++++++++++++++++++ src/app/home/home.component.ts | 2 +- .../stack-card/stack-card.component.css | 7 +++++-- .../stack-card/stack-card.component.ts | 4 ++-- 4 files changed, 29 insertions(+), 5 deletions(-) diff --git a/src/app/home/home.component.css b/src/app/home/home.component.css index b604fbe..3e0e8ff 100644 --- a/src/app/home/home.component.css +++ b/src/app/home/home.component.css @@ -117,3 +117,24 @@ font-size: 1rem; font-weight: 100; } + +.stack-slider { + height: 65%; +} + + +/*ON MOBILE VIEWPORT*/ +@media only screen and (max-width: 400px) { + .intro { + height: 75%; + } + + .stack-section { + height: 100vh; + } + .stack { + padding-top: 60px; + width: 80%; + height: 30%; + } +} diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index 4f694c7..c6afd72 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -12,7 +12,7 @@ export class HomeComponent { element.scrollIntoView({ behavior: "smooth", block: "start", - inline: "nearest" + inline: "start" }); } } diff --git a/src/app/home/stack-slider/stack-card/stack-card.component.css b/src/app/home/stack-slider/stack-card/stack-card.component.css index 2d5f302..b3c5ebb 100644 --- a/src/app/home/stack-slider/stack-card/stack-card.component.css +++ b/src/app/home/stack-slider/stack-card/stack-card.component.css @@ -1,5 +1,8 @@ .stack-card { - width: 300px; + width: 325px; + display: flex; + justify-content: center; + align-items: center; border-radius: 15px; } @@ -44,6 +47,6 @@ .inactive { opacity: 0.7; - width: 300px; + width: 280px; height: 410px; } diff --git a/src/app/home/stack-slider/stack-card/stack-card.component.ts b/src/app/home/stack-slider/stack-card/stack-card.component.ts index e64dbd1..f8b7126 100644 --- a/src/app/home/stack-slider/stack-card/stack-card.component.ts +++ b/src/app/home/stack-slider/stack-card/stack-card.component.ts @@ -10,12 +10,12 @@ import {animate, state, style, transition, trigger} from "@angular/animations"; trigger('cardAnimation', [ state('active', style({ opacity: 1, - width: '350px', + width: '325px', height: '425px', })), state('inactive', style({ opacity: 0.7, - width: '300px', + width: '280px', height: '410px', })), transition('* => *', [ From 951d963eb819f0fe715dee9e6a0443ede9295eb4 Mon Sep 17 00:00:00 2001 From: Vitor Hideyoshi Date: Thu, 9 Nov 2023 02:07:11 -0300 Subject: [PATCH 13/13] Better Snap Scroll Behavior --- src/app/home/home.component.css | 2 +- src/app/home/home.component.ts | 8 ++++++-- src/app/home/stack-slider/stack-slider.component.ts | 2 +- 3 files changed, 8 insertions(+), 4 deletions(-) diff --git a/src/app/home/home.component.css b/src/app/home/home.component.css index 3e0e8ff..0e44c53 100644 --- a/src/app/home/home.component.css +++ b/src/app/home/home.component.css @@ -130,7 +130,7 @@ } .stack-section { - height: 100vh; + height: 90vh; } .stack { padding-top: 60px; diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index c6afd72..0698872 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -9,10 +9,14 @@ export class HomeComponent { constructor() {} scrollToElement(element: HTMLElement): void { + let block: ScrollLogicalPosition = "start"; + if (window.innerWidth < 400) { + block = "end"; + } element.scrollIntoView({ behavior: "smooth", - block: "start", - inline: "start" + block: block, + inline: "nearest" }); } } diff --git a/src/app/home/stack-slider/stack-slider.component.ts b/src/app/home/stack-slider/stack-slider.component.ts index 465537a..ef32c00 100644 --- a/src/app/home/stack-slider/stack-slider.component.ts +++ b/src/app/home/stack-slider/stack-slider.component.ts @@ -109,7 +109,7 @@ export class StackSliderComponent implements AfterViewInit { } private getNumberOfCards(windowWidth: number): number { - if (windowWidth <= 412) { + if (windowWidth <= 450) { return 1; } else if (windowWidth <= 768) { return 2;