photo added to about section

fikretellek · Dec 17, 2024 · 744155b · 744155b
1 parent 28e0ddd
commit 744155b
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/src/components/About/About.jsx b/src/components/About/About.jsx
@@ -7,7 +7,12 @@ const About = () => {
         <div id="about" className="top-margin-for-header"></div>
         <h1>About</h1>
         <div id="about-hero">
-          <div id="about-img"></div>
+          <div id="about-img">
+            <img
+              src="https://media.licdn.com/dms/image/v2/D4E03AQECXUXvwU432Q/profile-displayphoto-shrink_800_800/profile-displayphoto-shrink_800_800/0/1711816469455?e=1740009600&v=beta&t=X4kRSh2cTkvpXuFQ9SF4G9YxghZq3FMiYgMYRG0brP0"
+              alt=""
+            />
+          </div>
           <div id="about-info">
             <p>Hi, my name is Fikret. I enjoy crafting code and building dreams.</p>
             <p>

diff --git a/src/components/About/About.scss b/src/components/About/About.scss
@@ -9,11 +9,17 @@
     display: flex;
     flex-direction: row-reverse;
     justify-content: space-between;
+
     #about-img {
       width: 400px;
       height: 400px;
       background-color: black;
       border-radius: calc(2 * var(--border-radius));
+      overflow: hidden;
+      img {
+        height: 100%;
+        filter: grayscale(1);
+      }
     }
     #about-info {
       display: flex;