Refactor project

This commit is contained in:
TheAlluringCO
2025-07-10 00:21:08 +02:00
parent 6af2403497
commit bb06ed902b
11 changed files with 81 additions and 86 deletions

153
inc/css/style.css Normal file
View File

@@ -0,0 +1,153 @@
/* Import Google Font */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap');
html {
box-sizing: border-box;
width: 100%;
overflow-x: hidden;
}
*, *::before, *::after {
box-sizing: inherit;
}
body {
background-color: #f5f7fa;
margin: 0;
font-family: 'Inter', Arial, sans-serif;
color: #333;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
padding: 40px 20px;
transition: background-color 0.3s ease, color 0.3s ease;
width: 100%;
}
body.dark-mode {
background-color: #121212;
color: #f5f5f5;
}
.container {
width: 100%;
max-width: 600px;
text-align: center;
padding: 20px;
}
form, .email-output {
padding: 25px;
background-color: #ffffff;
border-radius: 12px;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
margin-top: 20px;
transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
}
body.dark-mode form,
body.dark-mode .email-output {
background-color: #1e1e1e;
color: #f5f5f5;
}
label {
font-weight: bold;
display: block;
margin-bottom: 8px;
}
textarea, select {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
margin-bottom: 15px;
}
button {
background-color: #3498db;
color: white;
padding: 12px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s ease, transform 0.3s ease;
width: 100%;
}
button:hover {
background-color: #2980b9;
transform: translateY(-2px);
}
button + button {
margin-top: 10px;
}
#copyBtn {
background-color: #2ecc71;
}
#copyBtn:hover {
background-color: #27ae60;
}
.back-link {
display: inline-block;
margin-top: 15px;
color: #3498db;
text-decoration: none;
}
.back-link:hover {
text-decoration: underline;
}
#toast {
position: fixed;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
background-color: #2ecc71;
color: white;
padding: 12px 20px;
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
transition: opacity 0.3s ease, visibility 0.3s ease;
opacity: 0;
visibility: hidden;
pointer-events: none;
z-index: 9999;
}
#toast.show {
opacity: 1;
visibility: visible;
}
@media (max-width: 600px) {
.container {
padding: 10px;
}
form, .email-output {
padding: 15px;
}
button {
padding: 10px;
}
}
.email-output button {
margin-top: 10px;
}
.email-output pre {
white-space: pre-wrap;
word-wrap: break-word;
}

9
inc/js/theme.js Normal file
View File

@@ -0,0 +1,9 @@
document.addEventListener('DOMContentLoaded', () =>{
const toggleBtn = document.getElementById('darkModeBtn');
if(toggleBtn){
toggleBtn.addEventListener('click', (e) =>{
e.preventDefault();
document.body.classList.toggle('dark-mode');
})
}
})

3
inc/php/footer.php Normal file
View File

@@ -0,0 +1,3 @@
<script src="/inc/js/theme.js"></script>
</body>
</html>

7
inc/php/header.php Normal file
View File

@@ -0,0 +1,7 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>AI Email Generator - Result</title>
<link rel="stylesheet" href="style.css">
</head>

31
inc/php/resources.php Normal file
View File

@@ -0,0 +1,31 @@
<?php
function getLanguages(){
return array(
'English',
'Swedish',
'Spanish',
'French',
'German',
'Italian',
'Portuguese',
'Dutch',
'Norwegian',
'Danish',
'Finnish',
'Polish',
'Czech',
'Hungarian',
'Greek',
'Turkish',
'Russian',
'Chinese',
'Japanese',
'Korean',
'Arabic',
'Hebrew',
'Hindi',
'Thai',
'Vietnamese',
);
}