diff --git a/app/components/banner/banner.module.scss b/app/components/banner/banner.module.scss index febf156..8fc1c4b 100644 --- a/app/components/banner/banner.module.scss +++ b/app/components/banner/banner.module.scss @@ -2,17 +2,16 @@ .banner { display: grid; - grid-template-columns: $profile-size 1fr; - width: 100%; - min-height: $card-height; + grid-template-rows: 1fr; + grid-template-columns: auto 1fr; background: url("/images/banner.jpg"); background-size: cover; background-position: 50%; @include mobile { - grid-template-rows: 14rem 1fr; + grid-template-rows: auto 1fr; grid-template-columns: 1fr; - font-size: 16px; + font-size: $medium-font-size; } } @@ -23,31 +22,33 @@ img { @include content-border; - border-width: 4px; - width: $profile-size - 4rem; + border-width: $border-size * 2; + width: $profile-size; height: auto; + margin: $banner-margin; } @include mobile { - font-size: 16px; - img { - width: 11rem; + width: $profile-size-mobile; + margin: $banner-margin-mobile; } } } .description { @include flex-center; - font-size: 20px; - line-height: 2; - padding: 1rem; - text-shadow: 0 0 4px black; + margin: $banner-margin; + margin-left: 0; + font-size: $large-font-size; font-weight: bold; + line-height: 2; color: white; + text-shadow: $description-shadow; @include mobile { - line-height: 1.5; - padding-top: 0; + margin: $banner-margin-mobile; + margin-top: 0; + font-size: $medium-font-size; } } diff --git a/app/components/banner/banner.tsx b/app/components/banner/banner.tsx index 7c5f531..2f59ec9 100644 --- a/app/components/banner/banner.tsx +++ b/app/components/banner/banner.tsx @@ -17,10 +17,10 @@ export default function Banner() {
Howdy! My name is Paul Scott, and I am a software engineer at Vistar - Media. I obtained my MSE in Computer & Information Science from the - University of Pennsylvania, and obtained my BS in Computer Science - from Penn State. My areas of interest are computer graphics, - distributed systems, emulation, machine learning, and web development. + Media. I received my MSE in Computer & Information Science from the + University of Pennsylvania, and my BS in Computer Science from Penn + State. My areas of interest are computer graphics, distributed + systems, emulation, machine learning, and web development.
diff --git a/app/components/card/card.module.scss b/app/components/card/card.module.scss index 89a1771..5619c23 100644 --- a/app/components/card/card.module.scss +++ b/app/components/card/card.module.scss @@ -19,13 +19,13 @@ } .title { - font-size: $medium-font-size; + font-size: $large-font-size; font-weight: bold; } .description { position: relative; - font-size: $regular-font-size; + font-size: $medium-font-size; } .image { diff --git a/app/components/footer/footer.module.scss b/app/components/footer/footer.module.scss index da5fb97..037195e 100644 --- a/app/components/footer/footer.module.scss +++ b/app/components/footer/footer.module.scss @@ -2,7 +2,7 @@ .footer { width: 100%; - font-size: $medium-font-size; + font-size: $large-font-size; line-height: 1.5; text-align: center; padding-top: $window-spacing * 2; diff --git a/app/components/footer/footer.tsx b/app/components/footer/footer.tsx index d877876..4682998 100644 --- a/app/components/footer/footer.tsx +++ b/app/components/footer/footer.tsx @@ -6,7 +6,7 @@ export default function Footer() { Email at pauljscott8@gmail.com{" "} or call at (215) 880-9592
- Updated December 8th, 2024 + Updated December 9th, 2024 ); } diff --git a/app/components/header/header.module.scss b/app/components/header/header.module.scss index c94fced..b5e19fc 100644 --- a/app/components/header/header.module.scss +++ b/app/components/header/header.module.scss @@ -6,7 +6,7 @@ position: sticky; top: 0; width: 100%; - padding: $large-border; + padding: $border-size * 2; background: $header-color; } diff --git a/app/components/header/header.tsx b/app/components/header/header.tsx index 45fa9f4..1c4ffd6 100644 --- a/app/components/header/header.tsx +++ b/app/components/header/header.tsx @@ -30,7 +30,7 @@ export default function Header() {
Experience Education - Skills + Skills Projects Courses Hobbies diff --git a/app/components/section/section.tsx b/app/components/section/section.tsx index 1e844a6..d0c9678 100644 --- a/app/components/section/section.tsx +++ b/app/components/section/section.tsx @@ -29,12 +29,12 @@ function getCardDims(columns: number, lessColumns: number): CardDims { dims.width = getCardWidth(columnsAdjusted); if (columnsAdjusted == 2 && lessColumns == 2) { - dims.titleSize = variables.regularFontSize; + dims.titleSize = variables.mediumFontSize; dims.descriptionSize = variables.smallFontSize; dims.labelPadding = `calc(${variables.cardSpacing} / 2)`; } else { - dims.titleSize = variables.mediumFontSize; - dims.descriptionSize = variables.regularFontSize; + dims.titleSize = variables.largeFontSize; + dims.descriptionSize = variables.mediumFontSize; dims.labelPadding = variables.cardSpacing; } diff --git a/app/components/window/window.module.scss b/app/components/window/window.module.scss index 7654173..87f982b 100644 --- a/app/components/window/window.module.scss +++ b/app/components/window/window.module.scss @@ -28,7 +28,7 @@ grid-template-columns: $title-bar-height 1fr $title-bar-height $title-bar-height; grid-template-rows: $title-bar-height; text-align: center; - font-size: $medium-font-size; + font-size: $large-font-size; } .title { @@ -45,7 +45,7 @@ height: 2.5rem; color: $menu-font-color; background-color: $menu-color; - font-size: $medium-font-size; + font-size: $large-font-size; span { margin-left: 1rem; @@ -90,7 +90,7 @@ @include content-border; background: $content-color; height: $title-bar-height; - font-size: 20px; + font-size: $large-font-size; padding-left: $card-spacing; } diff --git a/app/constants.module.scss b/app/constants.module.scss index c63eba3..bdcfd73 100644 --- a/app/constants.module.scss +++ b/app/constants.module.scss @@ -12,9 +12,9 @@ // $content-color: #c6b2a8; // $content-border-color1: #e7deda; // $content-border-color2: #6a605a; -// $page-links-color: #4992a7; -// $page-links-border-color1: #adced7; -// $page-links-border-color2: #244953; +// $page-links-color: #8998aa; +// $page-links-border-color1: #cad1d9; +// $page-links-border-color2: #464d56; // $background-color: #4992a7; /* solaris colors */ @@ -38,23 +38,19 @@ $background-color: #524a8c; /* font sizes */ $small-font-size: 12px; -$regular-font-size: 16px; -$medium-font-size: 20px; -$large-font-size: 24px; +$medium-font-size: 16px; +$large-font-size: 20px; /* dimensions */ $window-spacing: 1.5rem; $card-spacing: 0.5rem; $border-size: 1.75px; -$large-border: $border-size * 2; -$min-width: 60rem; -$profile-size: 20rem; -$small-profile-size: 16rem; -$card-height: 20rem; -$medium-card-height: 17.5rem; -$small-card-height: 15rem; -$mobile-card-height: 70vmin; -$mobile-small-card-height: 70vmin / 2; +$banner-margin: 2rem; +$banner-margin-mobile: 1rem; +$profile-size: 16rem; +$profile-size-mobile: 12rem; +$description-padding: 1rem; +$description-shadow: 0 0 4px black; $title-bar-height: 2rem; $corner-size: calc($title-bar-height + $border-size * 3); $mobile-cutoff: 640px; @@ -62,8 +58,8 @@ $mobile-cutoff: 640px; :export { cardSpacing: $card-spacing; smallFontSize: $small-font-size; - regularFontSize: $regular-font-size; mediumFontSize: $medium-font-size; + largeFontSize: $large-font-size; } @mixin mobile { diff --git a/app/globals.scss b/app/globals.scss index d60949b..e3a5278 100644 --- a/app/globals.scss +++ b/app/globals.scss @@ -9,9 +9,6 @@ html, body { max-width: 100vw; - // background-image: url("../public/images/background.png"); - // background-repeat: repeat; - // background-size: 10rem; background-color: $background-color; color: black; } diff --git a/app/page.module.scss b/app/page.module.scss index 5854638..1a25e44 100644 --- a/app/page.module.scss +++ b/app/page.module.scss @@ -9,6 +9,6 @@ @media screen and (max-width: $mobile-cutoff) { max-width: 100%; padding: 0 0.5rem; - margin: 0.5rem auto; + margin: 0.5rem auto $window-spacing auto; } } diff --git a/public/content.json b/public/content.json index afdaa1c..3a8b977 100644 --- a/public/content.json +++ b/public/content.json @@ -61,9 +61,9 @@ ] }, { - "sectionId": "top-languages", + "sectionId": "languages", "imageFolder": "skills", - "title": "Top Programming Languages", + "title": "Programming Languages", "columns": 4, "content": [ { @@ -97,27 +97,11 @@ { "title": "Python", "image": "python.svg" - } - ] - }, - { - "sectionId": "other-languages", - "imageFolder": "skills", - "title": "Other Programming Languages", - "columns": 4, - "content": [ - { - "title": "Julia", - "image": "julia.svg" }, { "title": "PHP", "image": "php.svg" }, - { - "title": "Rust", - "image": "rust.svg" - }, { "title": "Swift", "image": "swift.jpg" @@ -312,7 +296,7 @@ }, { "sectionId": "grad-courses", - "title": "Graduate Courses @ UPenn", + "title": "Graduate Courses", "columns": 4, "content": [ { @@ -369,7 +353,7 @@ }, { "sectionId": "ugrad-courses", - "title": "Undergraduate Courses @ Penn State", + "title": "Undergraduate Courses", "columns": 4, "content": [ { @@ -472,7 +456,7 @@ }, { "sectionId": "hobbies", - "title": "Hobbies + Interests", + "title": "Hobbies & Interests", "columns": 4, "content": [ { diff --git a/public/icons/linkedin.png b/public/icons/linkedin.png index aedea96..3abdcd6 100644 Binary files a/public/icons/linkedin.png and b/public/icons/linkedin.png differ