Initial commit: существующий сайт + конфигурация разработки
Some checks failed
Deploy to Production / deploy (push) Failing after 4s
Some checks failed
Deploy to Production / deploy (push) Failing after 4s
This commit is contained in:
75
.gitea/workflows/deploy.yml
Normal file
75
.gitea/workflows/deploy.yml
Normal file
@@ -0,0 +1,75 @@
|
|||||||
|
name: Deploy to Production
|
||||||
|
|
||||||
|
on:
|
||||||
|
push:
|
||||||
|
branches: [main, master]
|
||||||
|
workflow_dispatch: # Ручной запуск из интерфейса
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
deploy:
|
||||||
|
runs-on: self-hosted # Используем ваш act_runner без Docker
|
||||||
|
|
||||||
|
steps:
|
||||||
|
- name: Checkout code
|
||||||
|
uses: actions/checkout@v4
|
||||||
|
with:
|
||||||
|
fetch-depth: 0
|
||||||
|
|
||||||
|
- name: Show structure
|
||||||
|
run: |
|
||||||
|
echo "Структура проекта:"
|
||||||
|
ls -la
|
||||||
|
echo "Текущая директория: $(pwd)"
|
||||||
|
|
||||||
|
- name: Backup current site
|
||||||
|
run: |
|
||||||
|
BACKUP_DIR="/var/backups/arseny-site/$(date +%Y%m%d-%H%M%S)"
|
||||||
|
mkdir -p $BACKUP_DIR
|
||||||
|
cp -r /var/www/arseny.ahtamov.ru/html/* $BACKUP_DIR/ 2>/dev/null || true
|
||||||
|
echo "Backup создан в: $BACKUP_DIR"
|
||||||
|
|
||||||
|
- name: Deploy files
|
||||||
|
run: |
|
||||||
|
echo "Деплой файлов в /var/www/arseny.ahtamov.ru/html/"
|
||||||
|
|
||||||
|
# Удаляем старые файлы (кроме скрытых системных)
|
||||||
|
find /var/www/arseny.ahtamov.ru/html/ -type f \
|
||||||
|
! -name '.htaccess' \
|
||||||
|
! -name '.user.ini' \
|
||||||
|
! -name '.well-known' \
|
||||||
|
-delete 2>/dev/null || true
|
||||||
|
|
||||||
|
# Копируем новые файлы
|
||||||
|
cp -r ./* /var/www/arseny.ahtamov.ru/html/
|
||||||
|
|
||||||
|
# Устанавливаем правильные права
|
||||||
|
chown -R www-data:www-data /var/www/arseny.ahtamov.ru/html/
|
||||||
|
find /var/www/arseny.ahtamov.ru/html/ -type d -exec chmod 755 {} \;
|
||||||
|
find /var/www/arseny.ahtamov.ru/html/ -type f -exec chmod 644 {} \;
|
||||||
|
|
||||||
|
# Для скриптов (если есть) даем права на выполнение
|
||||||
|
find /var/www/arseny.ahtamov.ru/html/ -name "*.php" -exec chmod 755 {} \; 2>/dev/null || true
|
||||||
|
find /var/www/arseny.ahtamov.ru/html/ -name "*.cgi" -exec chmod 755 {} \; 2>/dev/null || true
|
||||||
|
|
||||||
|
- name: Restart nginx
|
||||||
|
run: |
|
||||||
|
echo "Проверяем конфигурацию nginx"
|
||||||
|
nginx -t
|
||||||
|
|
||||||
|
echo "Перезагружаем nginx"
|
||||||
|
systemctl reload nginx || nginx -s reload
|
||||||
|
|
||||||
|
echo "Проверяем статус nginx"
|
||||||
|
systemctl status nginx --no-pager || true
|
||||||
|
|
||||||
|
- name: Verify deployment
|
||||||
|
run: |
|
||||||
|
echo "Проверка деплоя:"
|
||||||
|
echo "Количество файлов в целевой директории:"
|
||||||
|
find /var/www/arseny.ahtamov.ru/html/ -type f | wc -l
|
||||||
|
|
||||||
|
echo "Размер директории:"
|
||||||
|
du -sh /var/www/arseny.ahtamov.ru/html/
|
||||||
|
|
||||||
|
echo "Последние измененные файлы:"
|
||||||
|
ls -lht /var/www/arseny.ahtamov.ru/html/ | head -10
|
||||||
7
.vscode/extensions.json
vendored
Normal file
7
.vscode/extensions.json
vendored
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
{
|
||||||
|
"recommendations": [
|
||||||
|
"ms-vscode.vscode-typescript-next",
|
||||||
|
"ritwickdey.liveserver",
|
||||||
|
"ms-vscode.live-server"
|
||||||
|
]
|
||||||
|
}
|
||||||
15
.vscode/settings.json
vendored
Normal file
15
.vscode/settings.json
vendored
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
{
|
||||||
|
"files.exclude": {
|
||||||
|
"**/.git": true,
|
||||||
|
"**/.gitea": true,
|
||||||
|
"**/.github": true,
|
||||||
|
"**/node_modules": true
|
||||||
|
},
|
||||||
|
"editor.tabSize": 2,
|
||||||
|
"files.associations": {
|
||||||
|
"*.conf": "nginx",
|
||||||
|
"*.html": "html",
|
||||||
|
"*.css": "css",
|
||||||
|
"*.js": "javascript"
|
||||||
|
}
|
||||||
|
}
|
||||||
7
WWW.csproj
Normal file
7
WWW.csproj
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
<Project Sdk="Microsoft.NET.Sdk.Web">
|
||||||
|
<PropertyGroup>
|
||||||
|
<TargetFramework>net8.0</TargetFramework>
|
||||||
|
<Nullable>enable</Nullable>
|
||||||
|
<ImplicitUsings>enable</ImplicitUsings>
|
||||||
|
</PropertyGroup>
|
||||||
|
</Project>
|
||||||
19
WWW.sln
Normal file
19
WWW.sln
Normal file
@@ -0,0 +1,19 @@
|
|||||||
|
|
||||||
|
Microsoft Visual Studio Solution File, Format Version 12.00
|
||||||
|
# Visual Studio Version 17
|
||||||
|
VisualStudioVersion = 17.0.31903.59
|
||||||
|
MinimumVisualStudioVersion = 10.0.40219.1
|
||||||
|
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "WWW", "WWW.csproj", "{UNIQUE-GUID-HERE}"
|
||||||
|
EndProject
|
||||||
|
Global
|
||||||
|
GlobalSection(SolutionConfigurationPlatforms) = preSolution
|
||||||
|
Debug|Any CPU = Debug|Any CPU
|
||||||
|
Release|Any CPU = Release|Any CPU
|
||||||
|
EndGlobalSection
|
||||||
|
GlobalSection(ProjectConfigurationPlatforms) = postSolution
|
||||||
|
{UNIQUE-GUID-HERE}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
|
||||||
|
{UNIQUE-GUID-HERE}.Debug|Any CPU.Build.0 = Debug|Any CPU
|
||||||
|
{UNIQUE-GUID-HERE}.Release|Any CPU.ActiveCfg = Release|Any CPU
|
||||||
|
{UNIQUE-GUID-HERE}.Release|Any CPU.Build.0 = Release|Any CPU
|
||||||
|
EndGlobalSection
|
||||||
|
EndGlobal
|
||||||
30
html/api/counter.php
Normal file
30
html/api/counter.php
Normal file
@@ -0,0 +1,30 @@
|
|||||||
|
<?php
|
||||||
|
// Простой обработчик счетчика
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
header('Access-Control-Allow-Origin: *');
|
||||||
|
header('Access-Control-Allow-Methods: POST, GET');
|
||||||
|
header('Access-Control-Allow-Headers: Content-Type');
|
||||||
|
|
||||||
|
$counterFile = __DIR__ . '/counter.txt';
|
||||||
|
|
||||||
|
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||||
|
// Получаем данные от JavaScript
|
||||||
|
$data = json_decode(file_get_contents('php://input'), true);
|
||||||
|
$count = isset($data['count']) ? intval($data['count']) : 1;
|
||||||
|
|
||||||
|
// Записываем в файл
|
||||||
|
file_put_contents($counterFile, $count);
|
||||||
|
|
||||||
|
echo json_encode(['status' => 'success', 'count' => $count]);
|
||||||
|
|
||||||
|
} elseif ($_SERVER['REQUEST_METHOD'] === 'GET') {
|
||||||
|
// Возвращаем текущее значение
|
||||||
|
if (file_exists($counterFile)) {
|
||||||
|
$count = file_get_contents($counterFile);
|
||||||
|
} else {
|
||||||
|
$count = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
echo json_encode(['count' => intval($count)]);
|
||||||
|
}
|
||||||
|
?>
|
||||||
0
html/api/counter.txt
Normal file
0
html/api/counter.txt
Normal file
493
html/css/style.css
Normal file
493
html/css/style.css
Normal file
@@ -0,0 +1,493 @@
|
|||||||
|
/* Базовые стили */
|
||||||
|
:root {
|
||||||
|
--primary: #4361ee;
|
||||||
|
--secondary: #3a0ca3;
|
||||||
|
--accent: #f72585;
|
||||||
|
--light: #f8f9fa;
|
||||||
|
--dark: #212529;
|
||||||
|
--gray: #6c757d;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||||||
|
line-height: 1.6;
|
||||||
|
color: var(--dark);
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Навигация */
|
||||||
|
.navbar {
|
||||||
|
background-color: white;
|
||||||
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||||
|
position: fixed;
|
||||||
|
width: 100%;
|
||||||
|
top: 0;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar .container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 1rem 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: bold;
|
||||||
|
color: var(--primary);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links {
|
||||||
|
display: flex;
|
||||||
|
gap: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--dark);
|
||||||
|
font-weight: 500;
|
||||||
|
transition: color 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links a:hover {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-toggle {
|
||||||
|
display: none;
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
cursor: pointer;
|
||||||
|
color: var(--dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Герой-секция */
|
||||||
|
.hero {
|
||||||
|
padding: 120px 0 60px;
|
||||||
|
background: linear-gradient(135deg, #4361ee 0%, #3a0ca3 100%);
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-content {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
gap: 4rem;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-text h1 {
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.highlight {
|
||||||
|
color: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-text p {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.social-links {
|
||||||
|
display: flex;
|
||||||
|
gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.social-links a {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
border-radius: 50%;
|
||||||
|
color: white;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.social-links a:hover {
|
||||||
|
background: var(--accent);
|
||||||
|
transform: translateY(-3px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-image {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar-img {
|
||||||
|
width: 300px;
|
||||||
|
height: 300px;
|
||||||
|
border-radius: 50%;
|
||||||
|
object-fit: cover;
|
||||||
|
border: 4px solid white;
|
||||||
|
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar-img:hover {
|
||||||
|
transform: scale(1.05);
|
||||||
|
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Секции */
|
||||||
|
.section {
|
||||||
|
padding: 80px 0;
|
||||||
|
animation: fadeIn 0.8s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section h2 {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 2.5rem;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
color: var(--secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-light {
|
||||||
|
background-color: var(--light);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Обо мне */
|
||||||
|
.about-content {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
gap: 4rem;
|
||||||
|
align-items: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.about-text p {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
line-height: 1.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.facts {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
gap: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fact-card {
|
||||||
|
text-align: center;
|
||||||
|
padding: 2rem 1rem;
|
||||||
|
background: white;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: transform 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fact-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.fact-card i {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
color: var(--primary);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Интересы */
|
||||||
|
.interests-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.interest-card {
|
||||||
|
background: white;
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 10px;
|
||||||
|
text-align: center;
|
||||||
|
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.interest-card:hover {
|
||||||
|
transform: translateY(-10px);
|
||||||
|
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.interest-icon {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
background: linear-gradient(135deg, var(--primary), var(--secondary));
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 0 auto 1.5rem;
|
||||||
|
color: white;
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Проекты */
|
||||||
|
.projects-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-card {
|
||||||
|
background: white;
|
||||||
|
border-radius: 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-card:hover {
|
||||||
|
transform: translateY(-10px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-image {
|
||||||
|
height: 200px;
|
||||||
|
background: linear-gradient(135deg, #4361ee, #3a0ca3);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: white;
|
||||||
|
font-size: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-card h3 {
|
||||||
|
padding: 1.5rem 1.5rem 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-card p {
|
||||||
|
padding: 0 1.5rem;
|
||||||
|
color: var(--gray);
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
display: inline-block;
|
||||||
|
background: var(--primary);
|
||||||
|
color: white;
|
||||||
|
padding: 0.8rem 1.5rem;
|
||||||
|
border-radius: 5px;
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 600;
|
||||||
|
transition: all 0.3s;
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
margin: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn:hover {
|
||||||
|
background: var(--secondary);
|
||||||
|
transform: translateY(-2px);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Блог */
|
||||||
|
.blog-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||||
|
gap: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blog-card {
|
||||||
|
background: white;
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.blog-date {
|
||||||
|
color: var(--accent);
|
||||||
|
font-weight: 600;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blog-card h3 {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blog-card p {
|
||||||
|
color: var(--gray);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.read-more {
|
||||||
|
color: var(--primary);
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.read-more:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Контакты */
|
||||||
|
.contact-wrapper {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
gap: 4rem;
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-info p {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 1rem;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-info i {
|
||||||
|
color: var(--primary);
|
||||||
|
width: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-form input,
|
||||||
|
.contact-form textarea {
|
||||||
|
width: 100%;
|
||||||
|
padding: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
border-radius: 5px;
|
||||||
|
font-family: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-form button {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Футер */
|
||||||
|
footer {
|
||||||
|
background: var(--dark);
|
||||||
|
color: white;
|
||||||
|
text-align: center;
|
||||||
|
padding: 2rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer p {
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Анимации */
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(20px);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Стили для счетчика */
|
||||||
|
[data-counter] {
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.counter-loaded {
|
||||||
|
color: #4CAF50;
|
||||||
|
animation: pulse 2s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: scale(1.05);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Стиль для счетчика в навигации */
|
||||||
|
.nav-counter {
|
||||||
|
background: linear-gradient(45deg, #FF6B6B, #4ECDC4);
|
||||||
|
color: white;
|
||||||
|
padding: 5px 12px;
|
||||||
|
border-radius: 20px;
|
||||||
|
font-size: 14px;
|
||||||
|
margin-left: 15px;
|
||||||
|
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Стиль для счетчика в футере */
|
||||||
|
.footer-counter {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #666;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Адаптивность */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.menu-toggle {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
top: 100%;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
background: white;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 1rem;
|
||||||
|
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links.active {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-content,
|
||||||
|
.about-content,
|
||||||
|
.contact-wrapper {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
gap: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-text h1 {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar-img {
|
||||||
|
width: 200px;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hero-image {
|
||||||
|
order: -1; /* Переместить изображение выше текста на мобильных */
|
||||||
|
}
|
||||||
|
|
||||||
|
.facts {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
padding: 60px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
BIN
html/images/avatar.jpg
Normal file
BIN
html/images/avatar.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 215 KiB |
209
html/index.html
Normal file
209
html/index.html
Normal file
@@ -0,0 +1,209 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="ru">
|
||||||
|
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Арсений Ахтамов</title>
|
||||||
|
<link rel="stylesheet" href="css/style.css">
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<!-- Навигация -->
|
||||||
|
<nav class="navbar">
|
||||||
|
<div class="container">
|
||||||
|
<a href="#" class="logo">Арсений А.</a>
|
||||||
|
<div class="nav-links">
|
||||||
|
<a href="#about">Обо мне</a>
|
||||||
|
<a href="#interests">Интересы</a>
|
||||||
|
<a href="#projects">Проекты</a>
|
||||||
|
<a href="#blog">Блог</a>
|
||||||
|
<a href="#contact">Контакты</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<!-- Герой-секция -->
|
||||||
|
<section class="hero">
|
||||||
|
<div class="container">
|
||||||
|
<div class="hero-content">
|
||||||
|
<div class="hero-text">
|
||||||
|
<h1>Привет, я </h1>
|
||||||
|
<h1><span class="highlight">Арсений Ахтамов</span></h1>
|
||||||
|
<p>Подросток, увлеченный технологиями, программированием и спортом</p>
|
||||||
|
<div class="social-links">
|
||||||
|
<a href="#"><i class="fab fa-vk"></i></a>
|
||||||
|
<a href="#"><i class="fab fa-whatsapp"></i></a>
|
||||||
|
<a href="#"><i class="fab fa-telegram"></i></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="hero-image">
|
||||||
|
<img src="images/avatar.jpg" alt="Арсений Ахтамов" class="avatar-img">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Обо мне -->
|
||||||
|
<section id="about" class="section">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Обо мне</h2>
|
||||||
|
<div class="about-content">
|
||||||
|
<div class="about-text">
|
||||||
|
<p>Меня зовут Арсений Ахтамов, мне 10 лет. Я учусь в 4а классе гимназии "Пеленг" и активно
|
||||||
|
интересуюсь современными технологиями.</p>
|
||||||
|
<p>В свободное время занимаюсь программированием, изучаю веб-разработку и работаю над собственными
|
||||||
|
проектами.</p>
|
||||||
|
<p>Люблю спорт - особенно футбол и велоспорт. Верю, что баланс между технологиями и физической
|
||||||
|
активностью важен для развития.</p>
|
||||||
|
</div>
|
||||||
|
<div class="facts">
|
||||||
|
<div class="fact-card">
|
||||||
|
<i class="fas fa-code"></i>
|
||||||
|
<h3>Программирование</h3>
|
||||||
|
<p>Изучаю Python и C#. Я ещё работал в Figma и Thunkable.</p>
|
||||||
|
</div>
|
||||||
|
<div class="fact-card">
|
||||||
|
<i class="fas fa-futbol"></i>
|
||||||
|
<h3>Спорт</h3>
|
||||||
|
<p>Футбол, плавание, велоспорт</p>
|
||||||
|
</div>
|
||||||
|
<div class="fact-card">
|
||||||
|
<i class="fas fa-gamepad"></i>
|
||||||
|
<h3>Гейминг</h3>
|
||||||
|
<p>Люблю стратегии и RPG игры</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Интересы -->
|
||||||
|
<section id="interests" class="section bg-light">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Мои интересы</h2>
|
||||||
|
<div class="interests-grid">
|
||||||
|
<div class="interest-card">
|
||||||
|
<div class="interest-icon">
|
||||||
|
<i class="fas fa-laptop-code"></i>
|
||||||
|
</div>
|
||||||
|
<h3>IT технологии</h3>
|
||||||
|
<p>Искусственный интеллект, кибербезопасность, разработка игр</p>
|
||||||
|
</div>
|
||||||
|
<div class="interest-card">
|
||||||
|
<div class="interest-icon">
|
||||||
|
<i class="fas fa-camera"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Фотография</h3>
|
||||||
|
<p>Люблю снимать природу и городские пейзажи</p>
|
||||||
|
</div>
|
||||||
|
<div class="interest-card">
|
||||||
|
<div class="interest-icon">
|
||||||
|
<i class="fas fa-music"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Музыка</h3>
|
||||||
|
<p>Слушаю класическую музыку, фанк и неокласическую музыку.</p>
|
||||||
|
</div>
|
||||||
|
<div class="interest-card">
|
||||||
|
<div class="interest-icon">
|
||||||
|
<i class="fas fa-book"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Чтение</h3>
|
||||||
|
<p>Фантастика, научпоп, техническая литература и детективы.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Проекты -->
|
||||||
|
<section id="projects" class="section">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Мои проекты</h2>
|
||||||
|
<div class="projects-grid">
|
||||||
|
<div class="project-card">
|
||||||
|
<div class="project-image">
|
||||||
|
<i class="fas fa-globe"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Персональный сайт</h3>
|
||||||
|
<p>Сайт-портфолио на HTML/CSS/JavaScript</p>
|
||||||
|
<a href="#" class="btn">Посмотреть</a>
|
||||||
|
</div>
|
||||||
|
<div class="project-card">
|
||||||
|
<div class="project-image">
|
||||||
|
<i class="fas fa-robot"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Телеграм-бот</h3>
|
||||||
|
<p>Бот для помощи с домашними заданиями</p>
|
||||||
|
<a href="#" class="btn">Посмотреть</a>
|
||||||
|
</div>
|
||||||
|
<div class="project-card">
|
||||||
|
<div class="project-image">
|
||||||
|
<i class="fas fa-gamepad"></i>
|
||||||
|
</div>
|
||||||
|
<h3>2D игра</h3>
|
||||||
|
<p>Простая игра на Python с PyGame</p>
|
||||||
|
<a href="#" class="btn">Посмотреть</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Блог -->
|
||||||
|
<section id="blog" class="section bg-light">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Последние записи</h2>
|
||||||
|
<div class="blog-grid">
|
||||||
|
<article class="blog-card">
|
||||||
|
<div class="blog-date">15.11.2025</div>
|
||||||
|
<h3>Мой первый сайт</h3>
|
||||||
|
<p>Расскажу о том, как я создавал этот сайт...</p>
|
||||||
|
<a href="#" class="read-more">Читать далее →</a>
|
||||||
|
</article>
|
||||||
|
<article class="blog-card">
|
||||||
|
<div class="blog-date">10.11.2025</div>
|
||||||
|
<h3>Изучаю Python</h3>
|
||||||
|
<p>Поделюсь своими впечатлениями от изучения Python...</p>
|
||||||
|
<a href="#" class="read-more">Читать далее →</a>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Контакты -->
|
||||||
|
<section id="contact" class="section">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Свяжись со мной</h2>
|
||||||
|
<div class="contact-wrapper">
|
||||||
|
<div class="contact-info">
|
||||||
|
<p><i class="fas fa-envelope"></i> ascet.love@email.com</p>
|
||||||
|
<p><i class="fas fa-phone"></i> +7 (903)-953-59-XX</p>
|
||||||
|
<p><i class="fas fa-map-marker-alt"></i> Россия Томск</p>
|
||||||
|
</div>
|
||||||
|
<form class="contact-form">
|
||||||
|
<input type="text" placeholder="Ваше имя" required>
|
||||||
|
<input type="email" placeholder="Email" required>
|
||||||
|
<textarea placeholder="Сообщение" rows="4" required></textarea>
|
||||||
|
<button type="submit" class="btn">Отправить</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Футер -->
|
||||||
|
<footer>
|
||||||
|
<div class="container">
|
||||||
|
<p>© 2025 Арсений Ахтамов. Все права защищены.</p>
|
||||||
|
<p>Создано с ❤️ и папой</p>
|
||||||
|
</div>
|
||||||
|
<div class="footer-counter" data-counter data-format="simple"></div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script src="js/script.js"></script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
||||||
216
html/index_oiginal.html
Normal file
216
html/index_oiginal.html
Normal file
@@ -0,0 +1,216 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="ru">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Арсений Ахтамов</title>
|
||||||
|
<link rel="stylesheet" href="css/style.css">
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<!-- Навигация -->
|
||||||
|
<nav class="navbar">
|
||||||
|
<div class="container">
|
||||||
|
<a href="#" class="logo">Арсений А.</a>
|
||||||
|
<div class="nav-links">
|
||||||
|
<a href="#about">Обо мне</a>
|
||||||
|
<a href="#interests">Интересы</a>
|
||||||
|
<a href="#projects">Проекты</a>
|
||||||
|
<a href="#blog">Блог</a>
|
||||||
|
<a href="#contact">Контакты</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Герой-секция -->
|
||||||
|
<section class="hero">
|
||||||
|
<div class="container">
|
||||||
|
<div class="hero-content">
|
||||||
|
<div class="hero-text">
|
||||||
|
<h1>Привет, я </h1>
|
||||||
|
<h1><span class="highlight">Арсений Ахтамов</span></h1>
|
||||||
|
<p>Подросток, увлеченный технологиями, программированием и спортом</p>
|
||||||
|
<div class="social-links">
|
||||||
|
<a href="#"><i class="fab fa-vk"></i></a>
|
||||||
|
<a href="#"><i class="fab fa-whatsapp"></i></a>
|
||||||
|
<a href="#"><i class="fab fa-telegram"></i></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="hero-image">
|
||||||
|
<div class="avatar-placeholder">
|
||||||
|
<i class="fas fa-user"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Обо мне -->
|
||||||
|
<section id="about" class="section">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Обо мне</h2>
|
||||||
|
<div class="about-content">
|
||||||
|
<div class="about-text">
|
||||||
|
<p>Меня зовут Арсений Ахтамов, мне 10 лет. Я учусь в 4а классе гимназии "Пеленг" и активно
|
||||||
|
интересуюсь современными технологиями.</p>
|
||||||
|
<p>В свободное время занимаюсь программированием, изучаю веб-разработку и работаю над собственными
|
||||||
|
проектами.</p>
|
||||||
|
<p>Люблю спорт - особенно футбол и велоспорт. Верю, что баланс между технологиями и физической
|
||||||
|
активностью важен для развития.</p>
|
||||||
|
</div>
|
||||||
|
<div class="facts">
|
||||||
|
<div class="fact-card">
|
||||||
|
<i class="fas fa-code"></i>
|
||||||
|
<h3>Программирование</h3>
|
||||||
|
<p>Изучаю Python и C#. Я ещё работал в Figma и Thunkable.</p>
|
||||||
|
</div>
|
||||||
|
<div class="fact-card">
|
||||||
|
<i class="fas fa-futbol"></i>
|
||||||
|
<h3>Спорт</h3>
|
||||||
|
<p>Футбол, плавание, велоспорт</p>
|
||||||
|
</div>
|
||||||
|
<div class="fact-card">
|
||||||
|
<i class="fas fa-gamepad"></i>
|
||||||
|
<h3>Гейминг</h3>
|
||||||
|
<p>Люблю стратегии и RPG игры</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Интересы -->
|
||||||
|
<section id="interests" class="section bg-light">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Мои интересы</h2>
|
||||||
|
<div class="interests-grid">
|
||||||
|
<div class="interest-card">
|
||||||
|
<div class="interest-icon">
|
||||||
|
<i class="fas fa-laptop-code"></i>
|
||||||
|
</div>
|
||||||
|
<h3>IT технологии</h3>
|
||||||
|
<p>Искусственный интеллект, кибербезопасность, разработка игр</p>
|
||||||
|
</div>
|
||||||
|
<div class="interest-card">
|
||||||
|
<div class="interest-icon">
|
||||||
|
<i class="fas fa-camera"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Фотография</h3>
|
||||||
|
<p>Люблю снимать природу и городские пейзажи</p>
|
||||||
|
</div>
|
||||||
|
<div class="interest-card">
|
||||||
|
<div class="interest-icon">
|
||||||
|
<i class="fas fa-music"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Музыка</h3>
|
||||||
|
<p>Слушаю класическую музыку, фанк и неокласическую музыку.</p>
|
||||||
|
</div>
|
||||||
|
<div class="interest-card">
|
||||||
|
<div class="interest-icon">
|
||||||
|
<i class="fas fa-book"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Чтение</h3>
|
||||||
|
<p>Фантастика, научпоп, техническая литература и детективы.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Проекты -->
|
||||||
|
<section id="projects" class="section">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Мои проекты</h2>
|
||||||
|
<div class="projects-grid">
|
||||||
|
<div class="project-card">
|
||||||
|
<div class="project-image">
|
||||||
|
<i class="fas fa-globe"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Персональный сайт</h3>
|
||||||
|
<p>Сайт-портфолио на HTML/CSS/JavaScript</p>
|
||||||
|
<a href="#" class="btn">Посмотреть</a>
|
||||||
|
</div>
|
||||||
|
<div class="project-card">
|
||||||
|
<div class="project-image">
|
||||||
|
<i class="fas fa-robot"></i>
|
||||||
|
</div>
|
||||||
|
<h3>Телеграм-бот</h3>
|
||||||
|
<p>Бот для помощи с домашними заданиями</p>
|
||||||
|
<a href="#" class="btn">Посмотреть</a>
|
||||||
|
</div>
|
||||||
|
<div class="project-card">
|
||||||
|
<div class="project-image">
|
||||||
|
<i class="fas fa-gamepad"></i>
|
||||||
|
</div>
|
||||||
|
<h3>2D игра</h3>
|
||||||
|
<p>Простая игра на Python с PyGame</p>
|
||||||
|
<a href="#" class="btn">Посмотреть</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Блог -->
|
||||||
|
<section id="blog" class="section bg-light">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Последние записи</h2>
|
||||||
|
<div class="blog-grid">
|
||||||
|
<article class="blog-card">
|
||||||
|
<div class="blog-date">15.11.2025</div>
|
||||||
|
<h3>Мой первый сайт</h3>
|
||||||
|
<p>Расскажу о том, как я создавал этот сайт...</p>
|
||||||
|
<a href="#" class="read-more">Читать далее →</a>
|
||||||
|
</article>
|
||||||
|
<article class="blog-card">
|
||||||
|
<div class="blog-date">10.11.2025</div>
|
||||||
|
<h3>Изучаю Python</h3>
|
||||||
|
<p>Поделюсь своими впечатлениями от изучения Python...</p>
|
||||||
|
<a href="#" class="read-more">Читать далее →</a>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Контакты -->
|
||||||
|
<section id="contact" class="section">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Свяжись со мной</h2>
|
||||||
|
<div class="contact-wrapper">
|
||||||
|
<div class="contact-info">
|
||||||
|
<p><i class="fas fa-envelope"></i> ascet.love@email.com</p>
|
||||||
|
<p><i class="fas fa-phone"></i> +7 (903)-953-59-XX</p>
|
||||||
|
<p><i class="fas fa-map-marker-alt"></i> Россия Томск</p>
|
||||||
|
</div>
|
||||||
|
<form class="contact-form">
|
||||||
|
<input type="text" placeholder="Ваше имя" required>
|
||||||
|
<input type="email" placeholder="Email" required>
|
||||||
|
<textarea placeholder="Сообщение" rows="4" required></textarea>
|
||||||
|
<button type="submit" class="btn">Отправить</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Футер -->
|
||||||
|
<footer>
|
||||||
|
<div class="container">
|
||||||
|
<p>© 2025 Арсений Ахтамов. Все права защищены.</p>
|
||||||
|
<p>Создано с ❤️ и папой</p>
|
||||||
|
|
||||||
|
<!-- СЧЕТЧИК ЗДЕСЬ -->
|
||||||
|
<?php $count = file_get_contents('/var/www/arseny.ahtamov.ru/html/data/counter.txt');
|
||||||
|
echo "Посетителей: " . ($count ?: '0'); ?>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="footer-counter" data-counter data-format="simple"></div>
|
||||||
|
</footer>
|
||||||
|
<script src="js/script.js"></script>
|
||||||
|
<script src="js/counter.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
87
html/js/counter.js
Normal file
87
html/js/counter.js
Normal file
@@ -0,0 +1,87 @@
|
|||||||
|
// Простой счетчик посещений
|
||||||
|
class SimpleCounter {
|
||||||
|
constructor() {
|
||||||
|
this.storageKey = 'arseny_site_counter';
|
||||||
|
this.serverFile = '/api/counter.txt'; // Файл для синхронизации
|
||||||
|
this.init();
|
||||||
|
}
|
||||||
|
|
||||||
|
async init() {
|
||||||
|
try {
|
||||||
|
// 1. Получаем локальное значение
|
||||||
|
let localCount = localStorage.getItem(this.storageKey);
|
||||||
|
if (!localCount) {
|
||||||
|
localCount = 1;
|
||||||
|
} else {
|
||||||
|
localCount = parseInt(localCount) + 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 2. Сохраняем локально
|
||||||
|
localStorage.setItem(this.storageKey, localCount);
|
||||||
|
|
||||||
|
// 3. Пытаемся синхронизировать с сервером (в фоне, без ожидания)
|
||||||
|
this.syncWithServer(localCount);
|
||||||
|
|
||||||
|
// 4. Показываем на странице
|
||||||
|
this.display(localCount);
|
||||||
|
|
||||||
|
} catch (error) {
|
||||||
|
console.log('Счетчик работает в локальном режиме');
|
||||||
|
this.displayFallback();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async syncWithServer(count) {
|
||||||
|
try {
|
||||||
|
// Отправляем данные на сервер
|
||||||
|
await fetch(this.serverFile, {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
body: JSON.stringify({ count: count })
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
// Игнорируем ошибки - работает локальная версия
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
display(count) {
|
||||||
|
// Ищем все элементы для отображения счетчика
|
||||||
|
const elements = document.querySelectorAll('[data-counter]');
|
||||||
|
|
||||||
|
elements.forEach(element => {
|
||||||
|
const format = element.dataset.format || 'simple';
|
||||||
|
|
||||||
|
switch(format) {
|
||||||
|
case 'simple':
|
||||||
|
element.textContent = `Посетителей: ${this.formatNumber(count)}`;
|
||||||
|
break;
|
||||||
|
case 'number':
|
||||||
|
element.textContent = this.formatNumber(count);
|
||||||
|
break;
|
||||||
|
case 'message':
|
||||||
|
element.textContent = `Вы посетитель №${this.formatNumber(count)}`;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
element.classList.add('counter-loaded');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
displayFallback() {
|
||||||
|
const elements = document.querySelectorAll('[data-counter]');
|
||||||
|
elements.forEach(element => {
|
||||||
|
element.textContent = 'Счетчик загружается...';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
formatNumber(num) {
|
||||||
|
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ' ');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Автоматический запуск при загрузке страницы
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
new SimpleCounter();
|
||||||
|
});
|
||||||
68
html/js/script.js
Normal file
68
html/js/script.js
Normal file
@@ -0,0 +1,68 @@
|
|||||||
|
// Мобильное меню
|
||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
const menuToggle = document.querySelector('.menu-toggle');
|
||||||
|
const navLinks = document.querySelector('.nav-links');
|
||||||
|
|
||||||
|
menuToggle.addEventListener('click', function () {
|
||||||
|
navLinks.classList.toggle('active');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Закрытие меню при клике на ссылку
|
||||||
|
document.querySelectorAll('.nav-links a').forEach(link => {
|
||||||
|
link.addEventListener('click', () => {
|
||||||
|
navLinks.classList.remove('active');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Плавная прокрутка
|
||||||
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||||||
|
anchor.addEventListener('click', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
const targetId = this.getAttribute('href');
|
||||||
|
if (targetId === '#') return;
|
||||||
|
|
||||||
|
const targetElement = document.querySelector(targetId);
|
||||||
|
if (targetElement) {
|
||||||
|
window.scrollTo({
|
||||||
|
top: targetElement.offsetTop - 80,
|
||||||
|
behavior: 'smooth'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Форма обратной связи
|
||||||
|
const contactForm = document.querySelector('.contact-form');
|
||||||
|
if (contactForm) {
|
||||||
|
contactForm.addEventListener('submit', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
// Здесь можно добавить отправку формы на сервер
|
||||||
|
alert('Спасибо за сообщение! Я свяжусь с вами в ближайшее время.');
|
||||||
|
this.reset();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Анимация появления элементов при скролле
|
||||||
|
const observerOptions = {
|
||||||
|
threshold: 0.1,
|
||||||
|
rootMargin: '0px 0px -50px 0px'
|
||||||
|
};
|
||||||
|
|
||||||
|
const observer = new IntersectionObserver((entries) => {
|
||||||
|
entries.forEach(entry => {
|
||||||
|
if (entry.isIntersecting) {
|
||||||
|
entry.target.style.opacity = '1';
|
||||||
|
entry.target.style.transform = 'translateY(0)';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, observerOptions);
|
||||||
|
|
||||||
|
// Наблюдаем за карточками
|
||||||
|
document.querySelectorAll('.fact-card, .interest-card, .project-card, .blog-card').forEach(card => {
|
||||||
|
card.style.opacity = '0';
|
||||||
|
card.style.transform = 'translateY(20px)';
|
||||||
|
card.style.transition = 'opacity 0.6s ease, transform 0.6s ease';
|
||||||
|
observer.observe(card);
|
||||||
|
});
|
||||||
|
});
|
||||||
2
html/robots.txt
Normal file
2
html/robots.txt
Normal file
@@ -0,0 +1,2 @@
|
|||||||
|
User-agent: *
|
||||||
|
Disallow: /
|
||||||
25
html/start.html
Normal file
25
html/start.html
Normal file
@@ -0,0 +1,25 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Page Title</title>
|
||||||
|
<!-- Link to an external CSS file -->
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>Welcome</h1>
|
||||||
|
</header>
|
||||||
|
<main>
|
||||||
|
<p>This is the main content of the page.</p>
|
||||||
|
</main>
|
||||||
|
<footer>
|
||||||
|
<p>© 2026 My Website</p>
|
||||||
|
</footer>
|
||||||
|
<!-- Link to an external JavaScript file -->
|
||||||
|
<script src="script.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
86
html/stop.html
Normal file
86
html/stop.html
Normal file
@@ -0,0 +1,86 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="ru">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="description" content="Это пример HTML5">
|
||||||
|
<meta name="keywords" content="HTML5, CSS3, JavaScript">
|
||||||
|
<title>Этот текст — заголовок документа</title>
|
||||||
|
<link rel="stylesheet" href="mystyles.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.round {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<h1>Это главный заголовок веб-сайта</h1>
|
||||||
|
</header>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li>домой</li>
|
||||||
|
<li>фотографии href="http://google.com"</li>
|
||||||
|
<li>видео</li>
|
||||||
|
<li>контакты</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
<section>
|
||||||
|
<article>
|
||||||
|
<header>
|
||||||
|
<hgroup>
|
||||||
|
<h1>Заголовок статьи 1</h1>
|
||||||
|
<h2>подзаголовок статьи 1</h2>
|
||||||
|
</hgroup>
|
||||||
|
<p>опубликовано 10.12.2011</p>
|
||||||
|
</header>
|
||||||
|
Это текст моей первой статьи
|
||||||
|
|
||||||
|
<span>I love the movie <cite>Temptations</cite></span>
|
||||||
|
|
||||||
|
<address>
|
||||||
|
<a href="http://www.jdgauchat.com">JD Gauchat</a>
|
||||||
|
</addres>
|
||||||
|
|
||||||
|
<figure>
|
||||||
|
<img src="http://minkbooks.com/content/myimage.jpg">
|
||||||
|
<figcaption>
|
||||||
|
Это изображение для первой статьи
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
<footer>
|
||||||
|
<p>комментарии (0)</p>
|
||||||
|
</footer>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<img src="images/avatar.jpg" width="200px" height="200px" alt="" class="round">
|
||||||
|
<img src="images/avatar.jpg" alt="" class="round">
|
||||||
|
<img src="images/avatar.jpg" alt="" class="round">
|
||||||
|
|
||||||
|
<article>
|
||||||
|
<header>
|
||||||
|
<hgroup>
|
||||||
|
<h1>Заголовок статьи 2</h1>
|
||||||
|
<h2>подзаголовок статьи 2</h2>
|
||||||
|
</hgroup>
|
||||||
|
<p>опубликовано 15.12.2011</p>
|
||||||
|
</header>
|
||||||
|
Это текст моей второй статьи
|
||||||
|
<footer>
|
||||||
|
<p>комментарии (0)</p>
|
||||||
|
</footer>
|
||||||
|
</article>
|
||||||
|
</section>
|
||||||
|
<aside>
|
||||||
|
<blockquote>Статья номер 1</blockquote>
|
||||||
|
<blockquote>Статья номер 2</blockquote>
|
||||||
|
</aside>
|
||||||
|
<footer>
|
||||||
|
Copyright © 2010-2011
|
||||||
|
<small>Copyright © 2011 MinkBooks</small>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user