diff --git a/assets/css/custom.css b/assets/css/custom.css new file mode 100644 index 0000000..86ca417 --- /dev/null +++ b/assets/css/custom.css @@ -0,0 +1,54 @@ + +body { + background-color: #ecf0f1; + color: #2c3e50; + font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; +} + +h1, h2, h3, h4, h5, h6 { + font-family: Georgia, serif; +} + +.navbar { + background-color: #ffffff; + box-shadow: 0 2px 4px rgba(0,0,0,0.1); +} + +.hero { + background: url('https://picsum.photos/seed/hero/1600/900') no-repeat center center; + background-size: cover; + color: white; + padding: 100px 0; + text-align: center; +} + +.hero h1 { + font-size: 3.5rem; + font-weight: bold; +} + +.section { + padding: 60px 0; +} + +.card { + border: none; + border-radius: 0.25rem; + box-shadow: 0 4px 8px rgba(0,0,0,0.1); +} + +.btn-primary { + background-color: #3498db; + border: none; +} + +.btn-secondary { + background-color: #2ecc71; + border: none; +} + +.footer { + background-color: #2c3e50; + color: white; + padding: 40px 0; +} diff --git a/assets/js/main.js b/assets/js/main.js new file mode 100644 index 0000000..fa36c56 --- /dev/null +++ b/assets/js/main.js @@ -0,0 +1,13 @@ + +document.addEventListener('DOMContentLoaded', function () { + // Smooth scrolling for anchor links + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + e.preventDefault(); + + document.querySelector(this.getAttribute('href')).scrollIntoView({ + behavior: 'smooth' + }); + }); + }); +}); diff --git a/index.php b/index.php index e13ae95..6ba7f73 100644 --- a/index.php +++ b/index.php @@ -1,131 +1,112 @@ - - + - - - New Style - - - - + + + John Doe - Personal Portfolio + + + + -
-
-

Analyzing your requirements and generating your website…

-
- Loading… -
-

Flatlogic AI is collecting your requirements and applying the first changes.

-

This page will update automatically as the plan is implemented.

-

Runtime: PHP — UTC

-
-
- + + + + + +
+
+

Welcome to My Portfolio

+

I create beautiful and functional websites.

+ See My Work +
+
+ + +
+
+

About Me

+

Placeholder text for the about section. This is where you can introduce yourself and talk about your skills and experience.

+
+
+ + +
+
+

Portfolio

+
+
+
+ Placeholder for project 1. +
+
Project One
+

A brief description of the first project.

+
+
+
+
+
+ Placeholder for project 2. +
+
Project Two
+

A brief description of the second project.

+
+
+
+
+
+
+ + +
+
+

Contact Me

+
+
+ + +
+
+ + +
+
+ + +
+ +
+
+
+ + + + + + - + \ No newline at end of file