From 884399ed20163e6168d23149561213d1f5f525e8 Mon Sep 17 00:00:00 2001 From: Henry Date: Sat, 5 Aug 2023 12:55:04 -0700 Subject: [PATCH 1/5] Fix CSS --- src/Projects/Projects.css | 29 ++++++++++++++--------------- src/Resume/Resume.css | 1 - src/TopBarContainer.css | 11 ++--------- src/TopBarContainer.tsx | 18 ++++++------------ 4 files changed, 22 insertions(+), 37 deletions(-) diff --git a/src/Projects/Projects.css b/src/Projects/Projects.css index 2895654..3dddb0e 100644 --- a/src/Projects/Projects.css +++ b/src/Projects/Projects.css @@ -1,10 +1,9 @@ .projects-container { display: flex; flex-direction: row; - width: calc(100% - 30px); - padding: 10px; - gap: 10px; - max-height: 85vh; + width: calc(100% - 2em); + padding: 1em; + gap: 1em; justify-content: center; overflow-x: hidden; } @@ -12,8 +11,8 @@ .project-list-content { display: flex; flex-direction: column; - padding: 10px; - gap: 10px; + padding: 0.5em; + gap: 0.5em; border-radius: 12px; overflow-y: scroll; flex-grow: 1; @@ -22,14 +21,14 @@ .projects-list-cell { display: flex; flex-direction: row; - padding: 10px; - gap: 10px; + padding: 0.5em; + gap: 0.5em; border-top: 1px solid rgba(111, 111, 111, 1); font-family: "Roboto", sans-serif; font-size: 20px; border-radius: 12px; - padding-left: 10px; - padding-right: 10px; + padding-left: 0.5em; + padding-right: 0.5em; color: rgba(111, 111, 111, 1); margin: 0 auto; background-color: rgb(255, 255, 255); @@ -45,7 +44,7 @@ } .project-list-title { - max-width: 300px; + max-width: 15em; color: rgba(111, 111, 111, 1); font-size: 20px; letter-spacing: 0%; @@ -64,8 +63,8 @@ .project-content { display: flex; flex-direction: column; - padding: 10px; - gap: 10px; + padding: 0.5em; + gap: 0.5em; border-radius: 12px; background-color: white; box-shadow: 1px 4px 6px 0px rgba(0, 0, 0, 0.20000000298023224); @@ -85,7 +84,7 @@ } .project-thumbnail { - width: 100px; - height: 100px; + width: 5em; + height: 5em; border-radius: 12px; } \ No newline at end of file diff --git a/src/Resume/Resume.css b/src/Resume/Resume.css index 28690bf..cdd6238 100644 --- a/src/Resume/Resume.css +++ b/src/Resume/Resume.css @@ -5,7 +5,6 @@ height: 100vh; padding: 10px; gap: 10px; - max-height: 85vh; justify-content: center; overflow-x: hidden; } diff --git a/src/TopBarContainer.css b/src/TopBarContainer.css index 8b4db1f..6f703af 100644 --- a/src/TopBarContainer.css +++ b/src/TopBarContainer.css @@ -5,7 +5,6 @@ align-items: flex-start; } - .top-bar { display: flex; flex-direction: row; @@ -13,16 +12,10 @@ align-items: flex-start; padding-top: 1em; padding-left: 1em; + padding-right: 1em; padding-bottom: 1em; gap: 1em; - width: 100%; -} - -@media (max-width: 50em) { - .top-bar { - justify-content: center; - align-items: center; - } + /* width: 100%; */ } .top-bar-title { diff --git a/src/TopBarContainer.tsx b/src/TopBarContainer.tsx index 23faa5f..cea713a 100644 --- a/src/TopBarContainer.tsx +++ b/src/TopBarContainer.tsx @@ -7,21 +7,17 @@ import PlatformContext, { FormFactor } from "./Platform/PlatformContext"; export default function TopBarContainer() { const platformInfo = React.useContext(PlatformContext) - const isWideMode = platformInfo.formFactor === FormFactor.Wide + const titleContent = platformInfo.formFactor === FormFactor.Wide ? "henry.allen" : "h.a" return ( <>
- { - isWideMode ? - -
- henry.allen -
- - : null - } + +
+ {titleContent} +
+
Projects @@ -33,8 +29,6 @@ export default function TopBarContainer() {
- -
From 632766107b1051975e721b5bd78a00b153f74288 Mon Sep 17 00:00:00 2001 From: Henry Date: Sat, 5 Aug 2023 12:59:10 -0700 Subject: [PATCH 2/5] more css --- src/Loading/Loading.css | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/src/Loading/Loading.css b/src/Loading/Loading.css index c329685..236fd23 100644 --- a/src/Loading/Loading.css +++ b/src/Loading/Loading.css @@ -1,10 +1,9 @@ .loading-container { - display: flex; - flex-direction: row; - width: calc(100% - 30px); - padding: 10px; - gap: 10px; - max-height: 85vh; - justify-content: center; - overflow-x: hidden; - } \ No newline at end of file + display: flex; + flex-direction: row; + width: calc(100% - 2em); + padding: 0.5em; + gap: 0.5em; + justify-content: center; + overflow-x: hidden; +} \ No newline at end of file From 3c7bfce10201101b2dae323b78e873ee2c199523 Mon Sep 17 00:00:00 2001 From: Henry Date: Sat, 5 Aug 2023 13:06:08 -0700 Subject: [PATCH 3/5] remaining CSS --- src/FilterNavigator/FilterNavigator.css | 22 +++++++++++----------- src/Resume/Resume.css | 6 +++--- 2 files changed, 14 insertions(+), 14 deletions(-) diff --git a/src/FilterNavigator/FilterNavigator.css b/src/FilterNavigator/FilterNavigator.css index ad732d7..717c98d 100644 --- a/src/FilterNavigator/FilterNavigator.css +++ b/src/FilterNavigator/FilterNavigator.css @@ -3,15 +3,15 @@ flex-direction: column; justify-content: flex-start; align-items: center; - gap: 10px; + gap: 1em; } .filter-list-container { display: flex; flex-direction: column; - padding: 10px; - padding-bottom: 15px; - min-width: 250px; + padding: 0.5em; + padding-bottom: 0.5em; + min-width: 16em; border-radius: 12px; background-color: white; box-shadow: 1px 4px 6px 0px rgba(0, 0, 0, 0.20000000298023224); @@ -23,8 +23,8 @@ .search-cell { display: flex; flex-direction: column; - padding: 10px; - min-width: 250px; + padding: 0.5em; + min-width: 16em; border-radius: 12px; background-color: white; box-shadow: 1px 4px 6px 0px rgba(0, 0, 0, 0.20000000298023224); @@ -37,7 +37,7 @@ border-radius: 12px; background-color: white; box-shadow: 1px 4px 6px 0px rgba(0, 0, 0, 0.20000000298023224); - padding: 5px; + padding: 0.5em; border-color: rgb(80, 80, 80); } @@ -48,14 +48,14 @@ .filter-list-cell { width: 90%; - padding-top: 10px; - padding-bottom: 10px; + padding-top: 0.5em; + padding-bottom: 0.5em; border-top: 1px solid rgba(111, 111, 111, 1); font-family: "Roboto", sans-serif; font-size: 20px; border-radius: 12px; - padding-left: 10px; - padding-right: 10px; + padding-left: 0.5em; + padding-right: 0.5em; color: rgba(111, 111, 111, 1); margin: 0 auto; } diff --git a/src/Resume/Resume.css b/src/Resume/Resume.css index cdd6238..1b84d1c 100644 --- a/src/Resume/Resume.css +++ b/src/Resume/Resume.css @@ -1,10 +1,10 @@ .resume-container { display: flex; flex-direction: row; - width: calc(100% - 30px); + width: calc(100% - 2em); height: 100vh; - padding: 10px; - gap: 10px; + padding: 1em; + gap: 1em; justify-content: center; overflow-x: hidden; } From 77a01a5fe824c9308aaf5942ee54672d17171fcf Mon Sep 17 00:00:00 2001 From: Henry Date: Sat, 5 Aug 2023 13:13:20 -0700 Subject: [PATCH 4/5] Filter Navigator css --- src/FilterNavigator/FilterNavigator.css | 7 ++----- src/Projects/Projects.css | 5 +---- 2 files changed, 3 insertions(+), 9 deletions(-) diff --git a/src/FilterNavigator/FilterNavigator.css b/src/FilterNavigator/FilterNavigator.css index 717c98d..b7570b3 100644 --- a/src/FilterNavigator/FilterNavigator.css +++ b/src/FilterNavigator/FilterNavigator.css @@ -4,14 +4,13 @@ justify-content: flex-start; align-items: center; gap: 1em; + padding: 1em; } .filter-list-container { display: flex; flex-direction: column; - padding: 0.5em; - padding-bottom: 0.5em; - min-width: 16em; + min-width: 17em; border-radius: 12px; background-color: white; box-shadow: 1px 4px 6px 0px rgba(0, 0, 0, 0.20000000298023224); @@ -54,8 +53,6 @@ font-family: "Roboto", sans-serif; font-size: 20px; border-radius: 12px; - padding-left: 0.5em; - padding-right: 0.5em; color: rgba(111, 111, 111, 1); margin: 0 auto; } diff --git a/src/Projects/Projects.css b/src/Projects/Projects.css index 3dddb0e..4efce8d 100644 --- a/src/Projects/Projects.css +++ b/src/Projects/Projects.css @@ -1,9 +1,6 @@ .projects-container { display: flex; flex-direction: row; - width: calc(100% - 2em); - padding: 1em; - gap: 1em; justify-content: center; overflow-x: hidden; } @@ -11,7 +8,7 @@ .project-list-content { display: flex; flex-direction: column; - padding: 0.5em; + padding: 1em; gap: 0.5em; border-radius: 12px; overflow-y: scroll; From 2fc6718ebc27739aa69bfc2a5b5d746589afd98e Mon Sep 17 00:00:00 2001 From: Henry Date: Sat, 5 Aug 2023 13:17:50 -0700 Subject: [PATCH 5/5] width 100 --- src/Projects/Projects.css | 1 + 1 file changed, 1 insertion(+) diff --git a/src/Projects/Projects.css b/src/Projects/Projects.css index 4efce8d..b5215ea 100644 --- a/src/Projects/Projects.css +++ b/src/Projects/Projects.css @@ -3,6 +3,7 @@ flex-direction: row; justify-content: center; overflow-x: hidden; + width: 100%; } .project-list-content {