diff --git a/assets/css/custom.css b/assets/css/custom.css new file mode 100644 index 0000000..7bfca72 --- /dev/null +++ b/assets/css/custom.css @@ -0,0 +1,117 @@ + +:root { + --primary-color: #6366F1; + --secondary-color: #EC4899; + --background-color: #F9FAFB; + --surface-color: #FFFFFF; + --text-color: #1F2937; + --border-radius: 0.5rem; +} + +body { + font-family: 'Lato', sans-serif; + color: var(--text-color); + background-color: var(--background-color); +} + +h1, h2, h3, h4, h5, h6 { + font-family: 'Poppins', sans-serif; + font-weight: 700; +} + +.navbar-brand, .nav-link { + font-family: 'Poppins', sans-serif; +} + +.btn-primary { + background-color: var(--primary-color); + border-color: var(--primary-color); + border-radius: var(--border-radius); + padding: 0.75rem 1.5rem; + font-weight: 600; +} + +.btn-primary:hover { + background-color: #4F46E5; + border-color: #4F46E5; +} + +.btn-secondary { + background-color: var(--secondary-color); + border-color: var(--secondary-color); + border-radius: var(--border-radius); + padding: 0.75rem 1.5rem; + font-weight: 600; +} + +.btn-secondary:hover { + background-color: #DB2777; + border-color: #DB2777; +} + +.hero { + color: white; + padding: 10rem 0; +} + +.hero h1 { + font-size: 3.5rem; +} + +section { + padding: 5rem 0; +} + +.section-title { + text-align: center; + margin-bottom: 3rem; + font-size: 2.5rem; +} + +.card { + border: none; + border-radius: var(--border-radius); + box-shadow: 0 4px 6px rgba(0,0,0,0.1); + transition: transform 0.3s; +} + +.card:hover { + transform: translateY(-5px); +} + +.portfolio-item img { + border-radius: var(--border-radius) var(--border-radius) 0 0; +} + +.testimonial-card { + background-color: var(--surface-color); + padding: 2rem; + border-radius: var(--border-radius); + text-align: center; +} + +.testimonial-card img { + width: 80px; + height: 80px; + border-radius: 50%; + margin-bottom: 1rem; +} + +.form-control { + border-radius: var(--border-radius); +} + +footer { + background-color: var(--text-color); + color: var(--background-color); + padding: 3rem 0; +} + +footer a { + color: var(--background-color); + text-decoration: none; +} + +footer a:hover { + color: var(--primary-color); +} diff --git a/assets/images/pexels/6894103.jpg b/assets/images/pexels/6894103.jpg new file mode 100644 index 0000000..c9619df Binary files /dev/null and b/assets/images/pexels/6894103.jpg differ diff --git a/assets/js/main.js b/assets/js/main.js new file mode 100644 index 0000000..917b9bd --- /dev/null +++ b/assets/js/main.js @@ -0,0 +1,12 @@ +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/includes/pexels.php b/includes/pexels.php new file mode 100644 index 0000000..a7b040b --- /dev/null +++ b/includes/pexels.php @@ -0,0 +1,29 @@ + 0 ? $k : 'Vc99rnmOhHhJAbgGQoKLZtsaIVfkeownoQNbTj78VemUjKh08ZYRbf18'; +} + +function pexels_get($url) { + $ch = curl_init(); + curl_setopt_array($ch, [ + CURLOPT_URL => $url, + CURLOPT_RETURNTRANSFER => true, + CURLOPT_HTTPHEADER => [ 'Authorization: '. pexels_key() ], + CURLOPT_TIMEOUT => 15, + ]); + $resp = curl_exec($ch); + $code = curl_getinfo($ch, CURLINFO_HTTP_CODE); + curl_close($ch); + if ($code >= 200 && $code < 300 && $resp) return json_decode($resp, true); + return null; +} + +function download_to($srcUrl, $destPath) { + $data = file_get_contents($srcUrl); + if ($data === false) return false; + if (!is_dir(dirname($destPath))) { + mkdir(dirname($destPath), 0775, true); + } + return file_put_contents($destPath, $data) !== false; +} diff --git a/index.php b/index.php index 6f7ffab..1cb6796 100644 --- a/index.php +++ b/index.php @@ -1,131 +1,204 @@ - + - - - New Style - - - - + + + John Doe - Personal Portfolio + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - -
-
-

Analyzing your requirements and generating your website…

-
- Loading… -
-

AI is collecting your requirements and applying the first changes.

-

This page will update automatically as the plan is implemented.

-

Runtime: PHP — UTC

-
-
- + + + + + + +
+
+

I'm John Doe

+

A Creative Developer & Designer

+ View My Work +
+
+ + +
+
+

About Me

+
+
+ A placeholder image for the site owner, John Doe. +
+
+

Hello! I'm John Doe, a passionate and creative developer with a love for building beautiful and functional web applications. I specialize in front-end development and have a keen eye for design.

+

With over 5 years of experience in the industry, I have had the pleasure of working on a wide range of projects, from small business websites to large-scale enterprise applications. My goal is to create user-friendly interfaces that provide a seamless and enjoyable experience.

+
+
+
+
+ + +
+
+

Portfolio

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

A brief description of the project, highlighting the technologies used and the problem it solves.

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

A brief description of the project, highlighting the technologies used and a problem it solves.

+
+
+
+
+
+ Placeholder for portfolio project 3. +
+
Project Three
+

A brief description of the project, highlighting the technologies used and the problem it solves.

+
+
+
+
+
+
+ + +
+
+

Testimonials

+
+
+
+ Testimonial from Jane Smith. +

"John is an exceptional developer. He delivered a high-quality product on time and was a pleasure to work with."

+

- Jane Smith, CEO of TechCorp

+
+
+
+
+
+ + +
+
+

Get In Touch

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