commit 5da69356d342f09aabd2705170a6ebdb49052cd5 Author: RedGrox Date: Mon May 11 13:12:17 2026 +0000 First commit diff --git a/README.md b/README.md new file mode 100644 index 0000000..bef2c0d --- /dev/null +++ b/README.md @@ -0,0 +1 @@ +# AloeGames site diff --git a/html/css/style.css b/html/css/style.css new file mode 100644 index 0000000..ba1a009 --- /dev/null +++ b/html/css/style.css @@ -0,0 +1,164 @@ +:root { + --bg-main: #06090f; + --bg-secondary: #0b1220; + --card: #0f172a; + --card-hover: #111c34; + --text-main: #e5e7eb; + --text-muted: #94a3b8; + --accent: #22c55e; + --accent-glow: rgba(34, 197, 94, 0.4); + --border: rgba(34, 197, 94, 0.15); +} + +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +body { + font-family: 'Inter', sans-serif; + background: radial-gradient(circle at 20% 20%, #0b1220, #06090f); + color: var(--text-main); + scroll-behavior: smooth; +} + +header { + position: fixed; + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + padding: 20px 40px; + background: rgba(6, 9, 15, 0.7); + backdrop-filter: blur(12px); + border-bottom: 1px solid var(--border); + z-index: 1000; +} + +.logo { + font-size: 22px; + font-weight: 800; + color: var(--accent); + text-shadow: 0 0 10px var(--accent-glow); + vertical-align: middle; +} + +.lang-switch { + cursor: pointer; + padding: 8px 14px; + border-radius: 10px; + background: var(--card); + border: 1px solid var(--border); + transition: 0.3s; +} + +.lang-switch:hover { + background: var(--card-hover); + box-shadow: 0 0 10px var(--accent-glow); +} + +section { + padding: 120px 40px; + max-width: 1100px; + margin: auto; +} + +.hero { + height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text-align: center; +} + +h1 { + font-size: 64px; + font-weight: 800; + margin-bottom: 20px; + background: linear-gradient(90deg, #22c55e, #4ade80); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +h2 { + font-size: 32px; + margin-bottom: 20px; + color: var(--accent); +} + +p { + font-size: 18px; + color: var(--text-muted); + max-width: 700px; + line-height: 1.6; +} + +.btn { + margin-top: 30px; + padding: 14px 28px; + background: linear-gradient(135deg, #22c55e, #16a34a); + border: none; + border-radius: 12px; + font-size: 16px; + cursor: pointer; + transition: 0.3s; + color: black; + font-weight: 600; + box-shadow: 0 0 15px var(--accent-glow); +} + +.btn:hover { + transform: scale(1.05); + box-shadow: 0 0 25px var(--accent-glow); +} + +.grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 20px; + margin-top: 40px; +} + +.card { + background: var(--card); + padding: 20px; + border-radius: 16px; + border: 1px solid var(--border); + transition: 0.3s; + position: relative; +} + +.card::after { + content: ""; + position: absolute; + inset: 0; + border-radius: 16px; + box-shadow: 0 0 0px transparent; + transition: 0.3s; +} + +.card:hover { + transform: translateY(-6px); + background: var(--card-hover); +} + +.card:hover::after { + box-shadow: 0 0 20px var(--accent-glow); +} + +footer { + text-align: center; + padding: 40px; + color: #475569; +} + +canvas { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: -1; +} \ No newline at end of file diff --git a/html/images/favicon.ico b/html/images/favicon.ico new file mode 100644 index 0000000..f0fa4ae Binary files /dev/null and b/html/images/favicon.ico differ diff --git a/html/images/logo.png b/html/images/logo.png new file mode 100755 index 0000000..a45ca83 Binary files /dev/null and b/html/images/logo.png differ diff --git a/html/index.html b/html/index.html new file mode 100644 index 0000000..22dd94c --- /dev/null +++ b/html/index.html @@ -0,0 +1,60 @@ + + + + + + + AloeGames + + + + + + + + +
+ +
RU / EN
+
+ +
+ +

We Build Worlds

+

AloeGames is a modern game development studio focused on creating immersive, next-generation + experiences.

+ +
+ +
+

About Us

+

We are a team of passionate developers, designers, and dreamers. Our mission is to push the + boundaries of interactive entertainment and deliver unforgettable gaming experiences.

+
+ + + + + + + + + + \ No newline at end of file diff --git a/html/js/app.js b/html/js/app.js new file mode 100644 index 0000000..eb98fef --- /dev/null +++ b/html/js/app.js @@ -0,0 +1,86 @@ +let currentLang = 'en'; + +const translations = { + en: { + title: 'We Build Worlds', + desc: 'AloeGames is a modern game development studio focused on creating immersive, next-generation experiences.', + button: 'Explore', + aboutTitle: 'About Us', + aboutText: 'We are a team of passionate developers, designers, and dreamers. Our mission is to push the boundaries of interactive entertainment and deliver unforgettable gaming experiences.', + projectsTitle: 'Our Projects', + contactTitle: 'Contact', + contactText: 'Get in touch with us for partnerships, collaborations, or just to say hello.' + }, + ru: { + title: 'Мы создаём миры', + desc: 'AloeGames — современная игровая студия, создающая захватывающий игровой опыт нового поколения.', + button: 'Смотреть', + aboutTitle: 'О нас', + aboutText: 'Мы команда разработчиков, дизайнеров и мечтателей. Наша цель — расширять границы интерактивных развлечений и создавать незабываемые игры.', + projectsTitle: 'Наши проекты', + contactTitle: 'Контакты', + contactText: 'Свяжитесь с нами для сотрудничества или просто чтобы сказать привет.' + } +}; + +function toggleLang() { + currentLang = currentLang === 'en' ? 'ru' : 'en'; + const t = translations[currentLang]; + + document.getElementById('title').textContent = t.title; + document.getElementById('desc').textContent = t.desc; + document.getElementById('button').textContent = t.button; + document.getElementById('aboutTitle').textContent = t.aboutTitle; + document.getElementById('aboutText').textContent = t.aboutText; + document.getElementById('projectsTitle').textContent = t.projectsTitle; + document.getElementById('contactTitle').textContent = t.contactTitle; + document.getElementById('contactText').textContent = t.contactText; +} + +// Background animation +const canvas = document.getElementById('bgCanvas'); +const ctx = canvas.getContext('2d'); + +function resize() { + canvas.width = window.innerWidth; + canvas.height = window.innerHeight; +} + +window.addEventListener('resize', resize); +resize(); + +const particles = []; + +for (let i = 0; i < 80; i++) { + particles.push({ + x: Math.random() * canvas.width, + y: Math.random() * canvas.height, + vx: (Math.random() - 0.5) * 0.5, + vy: (Math.random() - 0.5) * 0.5, + size: Math.random() * 2 + 1 + }); +} + +function animate() { + ctx.clearRect(0, 0, canvas.width, canvas.height); + + particles.forEach(p => { + p.x += p.vx; + p.y += p.vy; + + if (p.x < 0 || p.x > canvas.width) p.vx *= -1; + if (p.y < 0 || p.y > canvas.height) p.vy *= -1; + + ctx.beginPath(); + ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2); + ctx.fillStyle = 'rgba(34,197,94,0.8)'; + ctx.shadowBlur = 10; + ctx.shadowColor = 'rgba(34,197,94,0.8)'; + ctx.fill(); + ctx.shadowBlur = 0; + }); + + requestAnimationFrame(animate); +} + +animate(); \ No newline at end of file