diff --git a/.vscode/launch.json b/.vscode/launch.json index c040f5b..85e9480 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -1,14 +1,182 @@ -{ - // Use IntelliSense to learn about possible Node.js debug attributes. - // Hover to view descriptions of existing attributes. - // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 - "version": "0.2.0", - "configurations": [ - { - "type": "node", - "request": "launch", - "name": "Launch Program", - "program": "${file}" - } - ] -} \ No newline at end of file + + + + + + My Portfolio + + + +
+ +
+ +
+

Hi, I'm Your Name

+

I'm a passionate Web Developer

+
+ +
+

About Me

+

+ I'm a developer who loves building websites and web applications. I have experience in HTML, CSS, JavaScript, and more. +

+
+ +
+

Projects

+
+
+

Project One

+

Description of your first project.

+
+
+

Project Two

+

Description of your second project.

+
+
+
+ +
+

Contact Me

+
+ + + + +
+
+ + + + +/* Reset some defaults */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +/* General styles */ +body { + font-family: 'Segoe UI', sans-serif; + line-height: 1.6; + background: #f9f9f9; + color: #333; +} + +/* Navbar */ +nav { + display: flex; + justify-content: space-between; + align-items: center; + padding: 20px; + background: #111; + color: white; +} + +.logo { + font-size: 1.5em; + font-weight: bold; +} + +.nav-links { + list-style: none; + display: flex; +} + +.nav-links li { + margin-left: 20px; +} + +.nav-links a { + color: white; + text-decoration: none; + font-weight: bold; +} + +.nav-links a:hover { + color: #00bcd4; +} + +/* Hero Section */ +.hero { + height: 90vh; + background: linear-gradient(to right, #00bcd4, #2196f3); + color: white; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text-align: center; +} + +.hero span { + color: #ffd600; +} + +/* Section styles */ +section { + padding: 60px 20px; + max-width: 1000px; + margin: auto; +} + +.about, .projects, .contact { + background: white; + margin-bottom: 20px; + border-radius: 10px; + padding: 40px; + box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1); +} + +.projects .project-cards { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); + gap: 20px; +} + +.card { + background: #f1f1f1; + padding: 20px; + border-radius: 8px; +} + +form input, form textarea { + width: 100%; + padding: 10px; + margin: 10px 0; + border: 1px solid #ccc; + border-radius: 5px; +} + +form button { + background: #00bcd4; + color: white; + padding: 10px 20px; + border: none; + border-radius: 5px; + cursor: pointer; +} + +form button:hover { + background: #0097a7; +} + +/* Footer */ +footer { + text-align: center; + padding: 20px; + background: #111; + color: white; +}