fix: make images and text darker

suvnshr · Dec 21, 2024 · 6b77f6b · 6b77f6b
1 parent 9ff7f73
commit 6b77f6b
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 3 deletions.
diff --git a/components/BlogCard.js b/components/BlogCard.js
@@ -23,6 +23,7 @@ const useStyles = makeStyles({
     objectFit: "contain",
     height: 210,
     backgroundColor: "#2b2b2b",
+    filter: "brightness(0.8)",
   },
   button: {
     padding: "8px 16px",

diff --git a/components/MyAvatar.js b/components/MyAvatar.js
@@ -10,6 +10,7 @@ const useStyles = makeStyles((theme) => ({
       height: 180,
       width: 180,
     },
+    filter: "brightness(0.93)",
     margin: "auto",
     borderRadius: 30,
   },

diff --git a/components/ProjectCard.js b/components/ProjectCard.js
@@ -21,6 +21,7 @@ const useStyles = makeStyles({
     objectFit: "contain",
     height: 210,
     backgroundColor: "#2b2b2b",
+    filter: "brightness(0.8)",
   },
   button: {
     padding: "8px 16px",

diff --git a/customTheme.js b/customTheme.js
@@ -13,7 +13,11 @@ let customTheme = createMuiTheme({
     secondary: {
       main: grey[800],
     },
+    text: {
+      primary: "#fafafa",
+    }
   },
+
 });
 
 customTheme = responsiveFontSizes(customTheme);

diff --git a/sections/ProfileSection.js b/sections/ProfileSection.js
@@ -10,6 +10,8 @@ import MyAvatar from "../components/MyAvatar";
 import SocialLinkButton from "../components/SocialLinkButton";
 import profileData from "../data/profileData";
 
+const TEXT_SHADOW = "0.5px 2px 2px #323232, 0 1px 3px #323232";
+
 const useStyles = makeStyles((theme) => ({
   background: {
     backgroundImage: `url(${profileData.backgroundImage})`,
@@ -21,9 +23,8 @@ const useStyles = makeStyles((theme) => ({
   },
 
   name: {
-    color: "#fff",
     padding: "0 10px",
-    textShadow: "0.5px 2px 2px #545454, 0 1px 3px #545454",
+    textShadow: TEXT_SHADOW,
     letterSpacing: "0.5px",
     [theme.breakpoints.down("sm")]: {
       marginTop: 20,
@@ -34,7 +35,7 @@ const useStyles = makeStyles((theme) => ({
     color: "#fcfcfc",
     padding: "0 10px",
     marginTop: 10,
-    textShadow: "0.5px 2px 2px #545454, 0 1px 3px #545454",
+    textShadow: TEXT_SHADOW,
     [theme.breakpoints.down("sm")]: {
       fontSize: "1.15em",
     },