trevor/sst_site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init commit

Browse Source
This commit is contained in:
Andrew K. Choi
2025-10-19 18:27:00 +09:00
commit 150891b29d
219 changed files with 70016 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

211
.history/views/contact-new_20251019174704.ejs Normal file
View File

@@ -0,0 +1,211 @@
<!DOCTYPE html>
<html lang="<%= locale %>" class="<%= theme === 'dark' ? 'dark' : '' %>">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%- __('contact.meta.title') %> - SmartSolTech</title>
<!-- SEO Meta Tags -->
<meta name="description" content="<%- __('contact.meta.description') %>">
<!-- Styles -->
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
<link href="/css/main.css" rel="stylesheet">
<link href="/css/fixes.css" rel="stylesheet">
<link href="/css/dark-theme.css" rel="stylesheet">
</head>
<body class="font-sans dark:bg-gray-900 dark:text-gray-100">
<%- include('partials/navigation') %>
<!-- Hero Section -->
<section class="relative bg-gradient-to-br from-blue-900 via-purple-900 to-indigo-900 dark:from-gray-900 dark:via-blue-900 dark:to-purple-900 py-20 hero-section">
<div class="absolute inset-0 bg-black opacity-50 dark:opacity-70"></div>
<div class="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
<h1 class="text-5xl md:text-6xl font-bold text-white mb-6">
<%- __('contact.hero.title') %>
</h1>
<p class="text-xl text-gray-300 dark:text-gray-200 max-w-3xl mx-auto">
<%- __('contact.hero.subtitle') %>
</p>
</div>
</section>
<!-- Contact Section -->
<section class="py-20 bg-white dark:bg-gray-900">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12">
<!-- Contact Form -->
<div>
<h2 class="text-3xl font-bold text-gray-900 dark:text-white mb-6">
<%- __('contact.form.title') %>
</h2>
<form id="contact-form" class="space-y-6">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
<%- __('contact.form.name') %>
</label>
<input type="text" name="name" required class="form-input w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent dark:bg-gray-700 dark:text-white">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
<%- __('contact.form.email') %>
</label>
<input type="email" name="email" required class="form-input w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent dark:bg-gray-700 dark:text-white">
</div>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
<%- __('contact.form.phone') %>
</label>
<input type="tel" name="phone" class="form-input w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent dark:bg-gray-700 dark:text-white">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
<%- __('contact.form.service.title') %>
</label>
<select name="serviceInterest" class="form-input w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent dark:bg-gray-700 dark:text-white">
<option value=""><%- __('contact.form.service.select') %></option>
<option value="web-development"><%- __('contact.form.service.web') %></option>
<option value="mobile-app"><%- __('contact.form.service.mobile') %></option>
<option value="ui-ux-design"><%- __('contact.form.service.design') %></option>
<option value="branding"><%- __('contact.form.service.branding') %></option>
<option value="consulting"><%- __('contact.form.service.consulting') %></option>
<option value="other"><%- __('contact.form.service.other') %></option>
</select>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
<%- __('contact.form.message') %>
</label>
<textarea name="message" rows="5" required class="form-input w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-none dark:bg-gray-700 dark:text-white"></textarea>
</div>
<button type="submit" class="w-full btn-primary bg-gradient-to-r from-blue-600 to-purple-600 text-white font-semibold py-3 rounded-lg hover:from-blue-700 hover:to-purple-700 transition-all duration-300 transform hover:scale-105">
<%- __('contact.form.submit') %>
</button>
</form>
</div>
<!-- Contact Info -->
<div>
<h2 class="text-3xl font-bold text-gray-900 dark:text-white mb-6">
<%- __('contact.info.title') %>
</h2>
<div class="space-y-6">
<!-- Phone -->
<div class="flex items-start">
<div class="w-12 h-12 bg-blue-100 dark:bg-blue-900 rounded-full flex items-center justify-center mr-4 flex-shrink-0">
<i class="fas fa-phone text-blue-600 dark:text-blue-400"></i>
</div>
<div>
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-2">
<%- __('contact.phone.title') %>
</h3>
<p class="text-gray-600 dark:text-gray-300">
<%- __('contact.phone.number') %>
</p>
<p class="text-sm text-gray-500 dark:text-gray-400">
<%- __('contact.phone.hours') %>
</p>
</div>
</div>
<!-- Email -->
<div class="flex items-start">
<div class="w-12 h-12 bg-purple-100 dark:bg-purple-900 rounded-full flex items-center justify-center mr-4 flex-shrink-0">
<i class="fas fa-envelope text-purple-600 dark:text-purple-400"></i>
</div>
<div>
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-2">
<%- __('contact.email.title') %>
</h3>
<p class="text-gray-600 dark:text-gray-300">
<%- __('contact.email.address') %>
</p>
<p class="text-sm text-gray-500 dark:text-gray-400">
<%- __('contact.email.response') %>
</p>
</div>
</div>
<!-- Telegram -->
<div class="flex items-start">
<div class="w-12 h-12 bg-green-100 dark:bg-green-900 rounded-full flex items-center justify-center mr-4 flex-shrink-0">
<i class="fab fa-telegram text-green-600 dark:text-green-400"></i>
</div>
<div>
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-2">
<%- __('contact.telegram.title') %>
</h3>
<p class="text-gray-600 dark:text-gray-300">
@smartsoltech
</p>
<p class="text-sm text-gray-500 dark:text-gray-400">
<%- __('contact.telegram.subtitle') %>
</p>
</div>
</div>
<!-- Address -->
<div class="flex items-start">
<div class="w-12 h-12 bg-gray-100 dark:bg-gray-700 rounded-full flex items-center justify-center mr-4 flex-shrink-0">
<i class="fas fa-map-marker-alt text-gray-600 dark:text-gray-400"></i>
</div>
<div>
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-2">
<%- __('contact.address.title') %>
</h3>
<p class="text-gray-600 dark:text-gray-300">
<%- __('contact.address.line1') %><br>
<%- __('contact.address.line2') %>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<%- include('partials/footer') %>
<!-- Scripts -->
<script>
// Theme initialization
document.addEventListener('DOMContentLoaded', function() {
const theme = localStorage.getItem('theme') || 'light';
document.documentElement.className = theme === 'dark' ? 'dark' : '';
});
// Contact form handler
document.getElementById('contact-form').addEventListener('submit', function(e) {
e.preventDefault();
const formData = new FormData(this);
fetch('/contact', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => {
if (data.success) {
alert('<%- __("contact.form.success") %>');
this.reset();
} else {
alert('<%- __("contact.form.error") %>');
}
})
.catch(error => {
console.error('Error:', error);
alert('<%- __("contact.form.error") %>');
});
});
</script>
</body>
</html>