Merge pull request #37 from pedroacamargo/develop

Develop
pedroacamargo · Jul 3, 2023 · d2139b6 · d2139b6
2 parents e749d67 + e227eda
commit d2139b6
Show file tree

Hide file tree

Showing 9 changed files with 77 additions and 15 deletions.
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -27,7 +27,7 @@
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Belanosima:wght@400;600&family=Open+Sans:ital,wght@0,300;0,400;1,300&family=Raleway:wght@400;700&family=Share+Tech+Mono&display=swap" rel="stylesheet">
-    <title>React App</title>
+    <title>Camargo.dev</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/src/Styles/contact/ContactForms.styles.scss b/src/Styles/contact/ContactForms.styles.scss
@@ -2,7 +2,7 @@
 
 .forms-container {
     padding-top: 70px;
-    overflow: hidden;
+    //overflow: hidden;
 
     @include flexcenter();
     flex-direction: column;
@@ -190,17 +190,34 @@
         &:last-child {
             margin-left: 50px;
             .input-container .textarea {
-                width: 300px;
-
+                width: 200px;
+                margin: 10px 10px;
+
+                & + .input-label + .input-icon + .linebot {
+                    margin-left: 2px;
+                }
+
+
                 &:focus + .input-label + .input-icon + .linebot {
-                    width: 300px;
+                    width: 200px;
+                    margin-left: 2px;
                 }
             }
         }
 
         .form-section {
             flex-direction: column;
             margin: 20px;
-        }            
+        }    
+
+        .btn-submit {
+            margin-left: -30px;
+
+        }
+
+        .light-blink{
+            margin-left: -40px;
+        }
+
     } 
 }
diff --git a/src/Styles/navbar/Navbar.styles.scss b/src/Styles/navbar/Navbar.styles.scss
@@ -12,7 +12,7 @@ nav {
     overflow: hidden;
     box-shadow: 2px 2px 10px rgba(26, 25, 25, 0.336);
     transition: 1s;
-
+    
     .navbar-container {
         @include size(100%, $navOriginalHeight);
         background-color: $colorNavbar;
@@ -21,11 +21,35 @@ nav {
         align-items: center;
         z-index: 3;
 
-        .logo {
-            color: $logoColor;
-            font-family: $logoFont;
-            font-size: $logoSize;
+        .logo-container {
+            position: relative;
+            display: flex;
+            justify-content: center;
+            align-items: center;
             cursor: pointer;
+
+            img {
+                width: 30px;
+                height: 30px;
+                margin-right: 5px;
+            }
+
+            .logo {
+
+                color: $logoColor;
+                font-family: $logoFont;
+                font-size: $logoSize;
+                cursor: pointer;
+                letter-spacing: -2px;
+                position: relative;
+                top: 0;
+                transition: .2s;
+
+                &:hover {
+                    top: -6px;
+                    color: rgb(180, 16, 16);
+                }
+            }
         }
     }
 }

diff --git a/src/Styles/navbar/Variables/Variables.styles.scss b/src/Styles/navbar/Variables/Variables.styles.scss
@@ -15,7 +15,7 @@ $mobileOpenedMenuBackground: rgb(7, 7, 7); // Mobile menu opened background
 
 /* Navbar */
 $navOriginalHeight: 70px;
-$colorNavbar: rgba(0, 0, 0, 0.6);
+$colorNavbar: rgba(0, 0, 0, 0.342);
 $logoFont: 'Share Tech Mono', monospace;
 $logoColor: white;
 $logoSize: 1.7em;

diff --git a/src/components/skills/Skills.component.tsx b/src/components/skills/Skills.component.tsx
@@ -18,7 +18,7 @@ export const Skills = () => {
                             <div className='skill-container'>
                                 <div style={{backgroundColor: `${tech.color}`}} className='rotator'></div>
                                 <div className='tech-stand'>
-                                    <img src={tech.img} alt="" />
+                                    <img src={tech.img} alt={`${tech.techName}`} />
                                     <span>{tech.techName}</span>
                                 </div>
                             </div>

diff --git a/src/projectsDB.json b/src/projectsDB.json
@@ -31,6 +31,9 @@
                 },
                 {
                     "value": "./assets/javascriptlogo.png"
+                },
+                {
+                    "value": "./assets/bootstraplogo.png"
                 }
             ] 
         },

diff --git a/src/routes/Navbar.component.tsx b/src/routes/Navbar.component.tsx
@@ -5,19 +5,37 @@ import { Link } from 'react-router-dom';
 import NavbarLinks from '../components/navbar/NavbarLinks.component';
 import MobileMenu from '../components/navbar/MobileMenu.component';
 import { MobileButton } from '../components/navbar/MobileButton.component';
+import logo from "./pedrocamargo.png"
 
 const Navbar = () => {
     const [isMobileMenuOpened, setIsMobileMenuOpened] = useState<boolean>(false);
+    let logoName = "Camargo.dev"
+    let lettersLogo = [];
+
+    for (let i = 0; i < logoName.length; i++) {
+        lettersLogo.push(logoName[i]);
+    }
+
 
     const handleMenu = () => {
         setIsMobileMenuOpened(!isMobileMenuOpened);
     }
 
     return (
-        <div style={{position: 'fixed', width: '100%', zIndex: '60'}}>
+        <div style={{position: 'fixed', width: '100%', zIndex: '60', backdropFilter: "blur(10px)"}}>
             <nav>
                 <div className="navbar-container">
-                    <Link className='logo' to="/">Camargo.dev</Link>
+                    <Link to="/" className='logo-container'>
+
+                        <img src={logo} alt="Logo" />
+
+                        {lettersLogo.map((letter) => (
+                            <span className='logo'>{letter}</span>
+                        ))}
+
+                    </Link>
+
+
                     <NavbarLinks />
                     <MobileButton isMobileMenuOpened={isMobileMenuOpened} handleMenu={handleMenu}/>
                 </div>

diff --git a/src/routes/pedrocamargo.png b/src/routes/pedrocamargo.png
-Original file line number
+Diff line change
@@ Expand Up / @@ -31,6 +31,9 @@ @@
                     },
                     {
                         "value": "./assets/javascriptlogo.png"
+                    },
+                    {
+                        "value": "./assets/bootstraplogo.png"
                     }
                 ]
             },
@@ Expand Down @@