diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 0000000..13566b8
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,8 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
+# Datasource local storage ignored files
+/dataSources/
+/dataSources.local.xml
diff --git a/.idea/discord.xml b/.idea/discord.xml
new file mode 100644
index 0000000..30bab2a
--- /dev/null
+++ b/.idea/discord.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="DiscordProjectSettings">
+    <option name="show" value="ASK" />
+    <option name="description" value="" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000..d843f34
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings" defaultProject="true" />
+</project>
\ No newline at end of file
diff --git a/README.md b/README.md
index efa9294..2e71ed4 100644
--- a/README.md
+++ b/README.md
@@ -60,7 +60,9 @@ NeTube/
 - **Улучшение дизайна:** Сделайте интерфейс более привлекательным и удобным.
 - **Расширенная система поиска:** Внедрите более мощный поиск видео по названию, описанию, тегам.
 
-**Лицензия:** [[MIT]](https://github.com/SL1dee36/NeTube/blob/main/LICENSE)
+**Лицензия:**
+
+[MIT]
 
 
 ![image](https://github.com/user-attachments/assets/b7629010-373d-4c55-8780-b8cdce19d24d)
diff --git a/app.py b/app.py
new file mode 100644
index 0000000..0428ee0
--- /dev/null
+++ b/app.py
@@ -0,0 +1,57 @@
+# app.py
+import traceback
+
+from flask import Flask, render_template
+from markupsafe import Markup
+
+from helpers.utils import get_current_user
+from models import db
+import logging
+from config import Config
+from routes import register_routes
+
+app = Flask(__name__)
+app.config.from_object(Config)
+db.init_app(app)
+
+# Конфигурация логгера
+logging.basicConfig(level=logging.DEBUG)
+
+# Register routes
+register_routes(app)
+
+
+# Регистрация обработчиков ошибок
+@app.errorhandler(400)
+def bad_request_error(error):
+    current_user = get_current_user()
+    return render_template('errors/400.html',current_user=current_user, Markup=Markup), 400
+
+@app.errorhandler(401)
+def unauthorized_error(error):
+    current_user = get_current_user()
+    return render_template('errors/401.html',current_user=current_user, Markup=Markup), 401
+
+@app.errorhandler(403)
+def forbidden_error(error):
+    current_user = get_current_user()
+    return render_template('errors/403.html',current_user=current_user, Markup=Markup), 403
+
+@app.errorhandler(404)
+def not_found_error(error):
+    current_user = get_current_user()
+    return render_template('errors/404.html',current_user=current_user, Markup=Markup), 404
+
+
+@app.errorhandler(500)
+def internal_server_error(error):
+    current_user = get_current_user()
+
+    return render_template('errors/500.html', current_user=current_user, Markup=Markup, error=error), 500
+
+
+
+if __name__ == '__main__':
+    with app.app_context():
+        db.create_all()
+    app.run(debug=True)
diff --git a/config.py b/config.py
new file mode 100644
index 0000000..4a609f5
--- /dev/null
+++ b/config.py
@@ -0,0 +1,15 @@
+import os
+
+class Config:
+    SQLALCHEMY_DATABASE_URI = 'sqlite:///netube.db'
+    SQLALCHEMY_TRACK_MODIFICATIONS = False
+    UPLOAD_FOLDER = os.path.join(os.getcwd(), 'static/videos')
+    THUMBNAIL_FOLDER = os.path.join(os.getcwd(), 'static/thumbnails')
+    ICONS_FOLDER = os.path.join(os.getcwd(), 'static/avatars')
+    AVATARS_FOLDER = os.path.join(os.getcwd(), 'static/avatars/users')
+    VIDEOS_FOLDER = os.path.join(os.getcwd(), 'static/videos')
+    MAX_CONTENT_LENGTH = 8 * 1024 * 1024 * 1024  # 8GB
+    SECRET_KEY = 'your_secret_key'  # Change to a secure key
+    ALLOWED_EXTENSIONS = {'png', 'jpg', 'jpeg', 'mp4'}
+    ADMIN_SECRET_KEY = "123"  # Change this in production
+
diff --git a/helpers/utils.py b/helpers/utils.py
new file mode 100644
index 0000000..7dd71a7
--- /dev/null
+++ b/helpers/utils.py
@@ -0,0 +1,82 @@
+# utils.py
+
+import random
+import string
+from flask import session
+from fuzzywuzzy import process, fuzz
+from moviepy.editor import VideoFileClip
+from PIL import Image
+
+from config import Config
+from models import User, Video  # Импортируйте модель User
+
+
+
+def allowed_file(filename):
+    """Проверяет, является ли файл допустимого формата."""
+    return '.' in filename and filename.rsplit('.', 1)[1].lower() in Config.ALLOWED_EXTENSIONS
+
+
+def generate_thumbnail(video_path, thumbnail_path):
+    """
+    Генерирует миниатюру видео, сохраняя ее в нужном размере и соотношении сторон.
+
+    Args:
+        video_path (str): Путь к видеофайлу.
+        thumbnail_path (str): Путь для сохранения миниатюры.
+    """
+    video = VideoFileClip(video_path)
+    frame = video.get_frame(t=0.0)
+    image = Image.fromarray(frame)
+    width, height = image.size
+
+    # Обрезка для сохранения соотношения 16:9
+    if width / height != 16 / 9:
+        crop_width = width if width > height else int(height * 16 / 9)
+        crop_height = int(crop_width * 9 / 16) if width > height else height
+        left_offset = (width - crop_width) // 2
+        top_offset = (height - crop_height) // 2
+        image = image.crop((left_offset, top_offset, left_offset + crop_width, top_offset + crop_height))
+
+    # Сжатие до 1280x720, если необходимо
+    if width > 1280 or height > 720:
+        image = image.resize((1280, 720))
+
+    image.save(thumbnail_path)
+
+
+def generate_random_name(length=10):
+    """Генерирует случайное имя заданной длины из букв и цифр."""
+    letters = string.ascii_letters + string.digits
+    return ''.join(random.choice(letters) for _ in range(length))
+
+
+def get_current_user():
+    """Возвращает текущего пользователя на основе данных сессии."""
+    user_id = session.get('user_id')
+    if user_id:
+        return User.query.get(user_id)
+    return None
+
+
+def search_videos(search_query, videos):
+    """
+    Выполняет нечеткий поиск видео по названию.
+
+    Args:
+        search_query (str): Поисковый запрос.
+        videos (list): Список видео объектов.
+
+    Returns:
+        list: Список найденных видео.
+    """
+    # Получаем заголовки видео для поиска
+    video_titles = [(video, video.title) for video in videos]
+
+    # Выполняем нечеткий поиск по названиям видео
+    matches = process.extract(search_query, [title for video, title in video_titles], scorer=fuzz.token_sort_ratio)
+
+    # Оставляем только те результаты, где совпадение больше или равно 20
+    search_results = [video for (video, title), score in zip(video_titles, matches) if score[1] >= 20]
+
+    return search_results
diff --git a/images/demo (1).png b/images/demo (1).png
deleted file mode 100644
index dc815b3..0000000
Binary files a/images/demo (1).png and /dev/null differ
diff --git a/images/demo (2).png b/images/demo (2).png
deleted file mode 100644
index a4e920e..0000000
Binary files a/images/demo (2).png and /dev/null differ
diff --git a/instance/netube.db b/instance/netube.db
deleted file mode 100644
index dcf0f47..0000000
Binary files a/instance/netube.db and /dev/null differ
diff --git a/src/models.py b/models.py
similarity index 97%
rename from src/models.py
rename to models.py
index 298bb6b..ce6bab1 100644
--- a/src/models.py
+++ b/models.py
@@ -1,55 +1,54 @@
-from flask_sqlalchemy import SQLAlchemy
-import datetime
-from datetime import datetime, timezone
-
-db = SQLAlchemy()
-
-# Association table for subscriptions
-subscriptions = db.Table('subscriptions',
-    db.Column('subscriber_id', db.Integer, db.ForeignKey('user.id')),
-    db.Column('subscribed_to_id', db.Integer, db.ForeignKey('user.id'))
-)
-
-class User(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    username = db.Column(db.String(80), unique=True, nullable=False)
-    password = db.Column(db.String(120), nullable=False)
-    avatar = db.Column(db.String(255), nullable=True)
-    videos = db.relationship('Video', backref='author', lazy=True)
-    # Relationships for subscribers and subscriptions
-    subscribed_to = db.relationship('User', secondary='subscriptions',
-                                  primaryjoin=(subscriptions.c.subscriber_id == id),
-                                  secondaryjoin=(subscriptions.c.subscribed_to_id == id),
-                                  backref=db.backref('subscribers', lazy='dynamic'),
-                                  lazy='dynamic')
-
-class Video(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    title = db.Column(db.String(120), nullable=False)
-    url = db.Column(db.String(200), nullable=False)
-    description = db.Column(db.Text(500), nullable=True)
-    user_id = db.Column(db.Integer, db.ForeignKey('user.id'), nullable=False)
-    likes = db.Column(db.Integer, default=0)
-    dislikes = db.Column(db.Integer, default=0)
-    comments = db.relationship('Comment', lazy=True)  # Removed backref
-    views = db.Column(db.Integer, default=0)
-
-class Like(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    user_id = db.Column(db.Integer, db.ForeignKey('user.id'), nullable=False)
-    video_id = db.Column(db.Integer, db.ForeignKey('video.id'), nullable=False)
-
-class DisLike(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    user_id = db.Column(db.Integer, db.ForeignKey('user.id'), nullable=False)
-    video_id = db.Column(db.Integer, db.ForeignKey('video.id'), nullable=False)
-
-class Comment(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    content = db.Column(db.Text, nullable=False)
-    user_id = db.Column(db.Integer, db.ForeignKey('user.id'), nullable=False)
-    timestamp = db.Column(db.DateTime, default=datetime.now(timezone.utc))
-    user = db.relationship('User', backref='comments') 
-
-    video_id = db.Column(db.Integer, db.ForeignKey('video.id'), nullable=False)
+from flask_sqlalchemy import SQLAlchemy
+import datetime
+from datetime import datetime, timezone
+
+db = SQLAlchemy()
+
+# Association table for subscriptions
+subscriptions = db.Table('subscriptions',
+    db.Column('subscriber_id', db.Integer, db.ForeignKey('user.id')),
+    db.Column('subscribed_to_id', db.Integer, db.ForeignKey('user.id'))
+)
+
+class User(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    username = db.Column(db.String(80), unique=True, nullable=False)
+    password = db.Column(db.String(120), nullable=False)
+    avatar = db.Column(db.String(255), nullable=True)
+    videos = db.relationship('Video', backref='author', lazy=True)
+    # Relationships for subscribers and subscriptions
+    subscribed_to = db.relationship('User', secondary='subscriptions',
+                                  primaryjoin=(subscriptions.c.subscriber_id == id),
+                                  secondaryjoin=(subscriptions.c.subscribed_to_id == id),
+                                  backref=db.backref('subscribers', lazy='dynamic'),
+                                  lazy='dynamic')
+
+class Video(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    title = db.Column(db.String(120), nullable=False)
+    url = db.Column(db.String(200), nullable=False)
+    description = db.Column(db.Text(500), nullable=True)
+    user_id = db.Column(db.Integer, db.ForeignKey('user.id'), nullable=False)
+    likes = db.Column(db.Integer, default=0)
+    dislikes = db.Column(db.Integer, default=0)
+    comments = db.relationship('Comment', lazy=True)  # Removed backref
+    views = db.Column(db.Integer, default=0)
+class Like(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    user_id = db.Column(db.Integer, db.ForeignKey('user.id'), nullable=False)
+    video_id = db.Column(db.Integer, db.ForeignKey('video.id'), nullable=False)
+
+class DisLike(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    user_id = db.Column(db.Integer, db.ForeignKey('user.id'), nullable=False)
+    video_id = db.Column(db.Integer, db.ForeignKey('video.id'), nullable=False)
+
+class Comment(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    content = db.Column(db.Text, nullable=False)
+    user_id = db.Column(db.Integer, db.ForeignKey('user.id'), nullable=False)
+    timestamp = db.Column(db.DateTime, default=datetime.now(timezone.utc))
+    user = db.relationship('User', backref='comments') 
+
+    video_id = db.Column(db.Integer, db.ForeignKey('video.id'), nullable=False)
     video = db.relationship('Video') 
\ No newline at end of file
diff --git a/routes/__init__.py b/routes/__init__.py
new file mode 100644
index 0000000..6a19d47
--- /dev/null
+++ b/routes/__init__.py
@@ -0,0 +1,19 @@
+from .channel_routes import channel_bp
+from .main_routes import main_bp
+from .static_routes import static_bp
+from .video_like_routes import video_like_bp
+from .video_routes import video_bp
+from .subscription_routes import subscription_bp
+from .user_routes import user_bp
+from .admin_routes import admin_bp
+
+def register_routes(app):
+    app.register_blueprint(video_bp)
+    app.register_blueprint(user_bp)
+    app.register_blueprint(admin_bp)
+    app.register_blueprint(main_bp)
+    app.register_blueprint(channel_bp)
+    app.register_blueprint(subscription_bp)
+    app.register_blueprint(static_bp)
+    app.register_blueprint(video_like_bp)
+
diff --git a/routes/admin_routes.py b/routes/admin_routes.py
new file mode 100644
index 0000000..1bd0554
--- /dev/null
+++ b/routes/admin_routes.py
@@ -0,0 +1,90 @@
+# routes/admin_routes.py
+
+from flask import Blueprint, render_template, request, redirect, url_for, flash, current_app as app, abort
+
+from config import Config
+from models import User, Video, db
+from helpers.utils import get_current_user, allowed_file
+from werkzeug.utils import secure_filename
+import os
+
+admin_bp = Blueprint('admin_bp', __name__)
+
+@admin_bp.route('/edit_user/<int:user_id>', methods=['GET', 'POST'])
+def edit_user(user_id):
+    user = User.query.get_or_404(user_id)
+    current_user = get_current_user()
+
+    if request.method == 'POST':
+        username = request.form.get('username')
+        password = request.form.get('password')
+        avatar = request.files.get('avatar')
+
+        user.username = username
+        if password:
+            user.password = password
+        if avatar and allowed_file(avatar.filename):
+            filename = secure_filename(avatar.filename)
+            avatar.save(os.path.join(app.config['AVATARS_FOLDER'], filename))
+            user.avatar = filename
+
+        # Добавление/удаление подписчиков
+        add_subscriber = request.form.get('add_subscriber')
+        remove_subscriber = request.form.get('remove_subscriber')
+        if add_subscriber:
+            subscriber = User.query.filter_by(username=add_subscriber).first()
+            if subscriber and subscriber not in user.subscribers:
+                user.subscribers.append(subscriber)
+        if remove_subscriber:
+            subscriber = User.query.filter_by(username=remove_subscriber).first()
+            if subscriber and subscriber in user.subscribers:
+                user.subscribers.remove(subscriber)
+
+        # Удаление видео
+        delete_video_id = request.form.get('delete_video_id')
+        if delete_video_id:
+            video_to_delete = Video.query.get(int(delete_video_id))
+            if video_to_delete and video_to_delete.author == user:
+                db.session.delete(video_to_delete)
+                # Удаляем файл видео и миниатюру
+                video_path = os.path.join(app.config['UPLOAD_FOLDER'], video_to_delete.url)
+                thumbnail_path = os.path.join(app.config['THUMBNAIL_FOLDER'], video_to_delete.url[:-4] + ".jpg")
+                if os.path.exists(video_path):
+                    os.remove(video_path)
+                if os.path.exists(thumbnail_path):
+                    os.remove(thumbnail_path)
+
+        db.session.commit()
+        flash('Пользователь успешно обновлен!', 'success')
+        return redirect(url_for('admin_bp.administration'))
+
+    return render_template('admin/edit_user.html', user=user, current_user=current_user)
+
+@admin_bp.route('/edit_video/<int:video_id>', methods=['GET', 'POST'])
+def edit_video(video_id):
+    video = Video.query.get_or_404(video_id)
+    current_user = get_current_user()
+
+    if request.method == 'POST':
+        title = request.form.get('title')
+        description = request.form.get('description')
+
+        video.title = title
+        video.description = description
+        db.session.commit()
+        flash('Видео успешно обновлено!', 'success')
+        return redirect(url_for('admin_bp.administration'))
+
+    return render_template('admin/edit_video.html', video=video, current_user=current_user)
+
+@admin_bp.route('/administration', methods=['GET', 'POST'])
+def administration():
+    if request.method == 'POST':
+        entered_key = request.form.get('admin_key')
+        if entered_key == Config.ADMIN_SECRET_KEY:
+            users = User.query.all()
+            videos = Video.query.all()
+            return render_template('admin/administration.html', users=users, videos=videos)
+        else:
+            return "Неверный пароль!"
+    return render_template('admin/admin_login.html')
\ No newline at end of file
diff --git a/routes/channel_routes.py b/routes/channel_routes.py
new file mode 100644
index 0000000..75ddc64
--- /dev/null
+++ b/routes/channel_routes.py
@@ -0,0 +1,33 @@
+# routes/channel_routes.py
+
+from flask import Blueprint, render_template, redirect, url_for, request, flash, current_app as app
+from markupsafe import Markup
+
+from models import User, Video, db
+from helpers.utils import get_current_user, allowed_file
+import os
+
+channel_bp = Blueprint('channel_bp', __name__)
+
+@channel_bp.route('/channel/<username>')
+def channel(username):
+    user = User.query.filter_by(username=username).first_or_404()
+    videos = Video.query.filter_by(user_id=user.id).all()
+    current_user = get_current_user()
+    avatar = current_user.avatar if current_user else None
+    return render_template('channel/channel.html', user=user, videos=videos, avatar=avatar, current_user=current_user,
+                           Markup=Markup)
+
+@channel_bp.route('/channel/<username>/avatar', methods=['GET', 'POST'])
+def upload_avatar(username):
+    user = User.query.filter_by(username=username).first_or_404()
+    current_user = get_current_user()
+    if request.method == 'POST':
+        avatar = request.files.get('avatar')
+        if avatar and allowed_file(avatar.filename):
+            filename = f"{user.username}_avatar.{avatar.filename.rsplit('.', 1)[1]}"
+            avatar.save(os.path.join(app.config['AVATARS_FOLDER'], filename))
+            user.avatar = filename
+            db.session.commit()
+            flash('Аватар успешно обновлен!', 'success')
+    return redirect(url_for('channel_bp.channel', username=username, user=user, current_user=current_user))
diff --git a/routes/main_routes.py b/routes/main_routes.py
new file mode 100644
index 0000000..2318b66
--- /dev/null
+++ b/routes/main_routes.py
@@ -0,0 +1,32 @@
+# routes/main_routes.py
+
+from flask import Blueprint, render_template, request
+from markupsafe import Markup
+
+from helpers.utils import search_videos
+from models import Video
+from helpers.utils import get_current_user
+
+main_bp = Blueprint('main_bp', __name__)
+
+
+@main_bp.route('/', methods=['GET', 'POST'])
+def index():
+    current_user = get_current_user()
+    videos = Video.query.order_by(Video.likes.desc()).all()
+    search_results = []
+    search_query = ''
+    if request.method == 'POST':
+        search_query = request.form.get('search_query')
+        if search_query:
+            search_results = search_videos(search_query, videos)
+
+
+    return render_template(
+        'index.html',
+        videos=videos,
+        search_results=search_results,
+        Markup=Markup,
+        current_user=current_user,
+        search_query=search_query
+    )
diff --git a/routes/static_routes.py b/routes/static_routes.py
new file mode 100644
index 0000000..8e517e1
--- /dev/null
+++ b/routes/static_routes.py
@@ -0,0 +1,21 @@
+# routes/static_routes.py
+
+from flask import Blueprint, send_from_directory, current_app as app
+
+static_bp = Blueprint('static_bp', __name__)
+
+@static_bp.route('/static/videos/<path:filename>')
+def serve_videos(filename):
+    return send_from_directory(app.config['VIDEOS_FOLDER'], filename)
+
+@static_bp.route('/static/thumbnails/<path:filename>')
+def serve_thumbnails(filename):
+    return send_from_directory(app.config['THUMBNAIL_FOLDER'], filename)
+
+@static_bp.route('/static/avatars/<path:filename>')
+def serve_icons(filename):
+    return send_from_directory(app.config['ICONS_FOLDER'], filename)
+
+@static_bp.route('/static/avatars/users/<path:filename>')
+def serve_avatars(filename):
+    return send_from_directory(app.config['AVATARS_FOLDER'], filename)
diff --git a/routes/subscription_routes.py b/routes/subscription_routes.py
new file mode 100644
index 0000000..22c96b3
--- /dev/null
+++ b/routes/subscription_routes.py
@@ -0,0 +1,27 @@
+# routes/subscription_routes.py
+
+from flask import Blueprint, request, jsonify, session
+from models import User
+from helpers.utils import get_current_user
+from services.video_service import update_subscription
+
+subscription_bp = Blueprint('subscription_bp', __name__)
+
+@subscription_bp.route('/api/subscribe/<int:user_id>', methods=['POST'])
+def subscribe(user_id):
+    current_user = get_current_user()
+    if current_user:
+        user_to_subscribe = User.query.get(user_id)
+        response = update_subscription(current_user, user_to_subscribe, subscribe=True)
+        return jsonify(response)
+    return jsonify({'status': 'error', 'message': 'User not logged in'}), 401
+
+
+@subscription_bp.route('/api/unsubscribe/<int:user_id>', methods=['POST'])
+def unsubscribe(user_id):
+    current_user = get_current_user()
+    if current_user:
+        user_to_unsubscribe = User.query.get(user_id)
+        response = update_subscription(current_user, user_to_unsubscribe, subscribe=False)
+        return jsonify(response)
+    return jsonify({'status': 'error', 'message': 'User not logged in'}), 401
diff --git a/routes/user_routes.py b/routes/user_routes.py
new file mode 100644
index 0000000..b959cac
--- /dev/null
+++ b/routes/user_routes.py
@@ -0,0 +1,46 @@
+# routes/user_routes.py
+
+from flask import Blueprint, render_template, request, redirect, url_for, session
+from markupsafe import Markup
+
+from models import User, db
+from helpers.utils import get_current_user
+
+user_bp = Blueprint('user_bp', __name__)
+
+@user_bp.route('/login', methods=['GET', 'POST'])
+def login():
+    if request.method == 'POST':
+        username = request.form['username']
+        password = request.form['password']
+        user = User.query.filter_by(username=username).first()
+        if user and user.password == password:
+            session['logged_in'] = True
+            session['user_id'] = user.id
+            return redirect(url_for('main_bp.index'))
+        else:
+            return render_template('user/login.html', error="Неверный логин или пароль")
+    current_user = get_current_user()
+    return render_template('user/login.html', current_user=current_user,
+                           Markup=Markup)
+
+@user_bp.route('/logout')
+def logout():
+    session.pop('logged_in', None)
+    session.pop('user_id', None)
+    return redirect(url_for('main_bp.index'))
+
+@user_bp.route('/register', methods=['GET', 'POST'])
+def register():
+    if request.method == 'POST':
+        username = request.form['username']
+        password = request.form['password']
+        if User.query.filter_by(username=username).first():
+            return render_template('user/register.html', error="Пользователь с таким именем уже существует")
+        new_user = User(username=username, password=password)
+        db.session.add(new_user)
+        db.session.commit()
+        return redirect(url_for('user_bp.login'))
+    current_user = get_current_user()
+    return render_template('user/register.html', current_user=current_user,
+                           Markup=Markup, )
diff --git a/routes/video_like_routes.py b/routes/video_like_routes.py
new file mode 100644
index 0000000..09f9d89
--- /dev/null
+++ b/routes/video_like_routes.py
@@ -0,0 +1,65 @@
+from flask import Blueprint, jsonify, request
+from models import Video, Like, DisLike, db
+from helpers.utils import get_current_user
+
+video_like_bp = Blueprint('video_like_bp', __name__)
+
+
+@video_like_bp.route('/api/like/<video_name>', methods=['POST'])
+def like_video(video_name):
+    video = Video.query.filter_by(url=video_name).first_or_404()
+    user = get_current_user()
+    if user:
+        existing_like = Like.query.filter_by(user_id=user.id, video_id=video.id).first()
+        existing_dislike = DisLike.query.filter_by(user_id=user.id, video_id=video.id).first()
+
+        if existing_like:
+            # Убираем лайк
+            db.session.delete(existing_like)
+            video.likes -= 1
+            liked = False
+        else:
+            # Ставим лайк
+            if existing_dislike:
+                # Убираем дизлайк
+                db.session.delete(existing_dislike)
+                video.dislikes -= 1
+            new_like = Like(user_id=user.id, video_id=video.id)
+            db.session.add(new_like)
+            video.likes += 1
+            liked = True
+
+        db.session.commit()
+
+        return jsonify({'status': 'success', 'liked': liked, 'likes': video.likes, 'dislikes': video.dislikes})
+    return jsonify({'status': 'error', 'message': 'User not authenticated'}), 401
+
+
+@video_like_bp.route('/api/dislike/<video_name>', methods=['POST'])
+def dislike_video(video_name):
+    video = Video.query.filter_by(url=video_name).first_or_404()
+    user = get_current_user()
+    if user:
+        existing_like = Like.query.filter_by(user_id=user.id, video_id=video.id).first()
+        existing_dislike = DisLike.query.filter_by(user_id=user.id, video_id=video.id).first()
+
+        if existing_dislike:
+            # Убираем дизлайк
+            db.session.delete(existing_dislike)
+            video.dislikes -= 1
+            disliked = False
+        else:
+            # Ставим дизлайк
+            if existing_like:
+                # Убираем лайк
+                db.session.delete(existing_like)
+                video.likes -= 1
+            new_dislike = DisLike(user_id=user.id, video_id=video.id)
+            db.session.add(new_dislike)
+            video.dislikes += 1
+            disliked = True
+
+        db.session.commit()
+
+        return jsonify({'status': 'success', 'disliked': disliked, 'likes': video.likes, 'dislikes': video.dislikes})
+    return jsonify({'status': 'error', 'message': 'User not authenticated'}), 401
diff --git a/routes/video_routes.py b/routes/video_routes.py
new file mode 100644
index 0000000..7bfeec1
--- /dev/null
+++ b/routes/video_routes.py
@@ -0,0 +1,50 @@
+# routes/video_routes.py
+
+from flask import Blueprint, request, render_template, redirect, url_for, jsonify, session
+from markupsafe import Markup
+from models import Video
+from helpers.utils import get_current_user, allowed_file
+from services.video_service import save_video, increment_video_views, add_comment_to_video
+video_bp = Blueprint('video_bp', __name__)
+
+@video_bp.route('/upload', methods=['GET', 'POST'])
+def upload():
+    current_user = get_current_user()
+    if 'logged_in' in session:
+        if request.method == 'POST':
+            title = request.form['title']
+            description = request.form['description'][:500]
+            file = request.files['file']
+            if file and allowed_file(file.filename):
+                video = save_video(file, title, description, session['user_id'])
+                return redirect(url_for('video_bp.video', video_name=video))
+        return render_template('video/upload.html', current_user=current_user, Markup=Markup, )
+    else:
+        return redirect(url_for('user_bp.login'))
+
+
+@video_bp.route('/video/<video_name>')
+def video(video_name):
+    video = Video.query.filter_by(url=video_name).first_or_404()
+    current_user = get_current_user()
+    increment_video_views(video)
+
+    related_videos = Video.query.filter(Video.id != video.id).limit(9).all()
+    return render_template('video/video.html', video=video, Markup=Markup, current_user=current_user, related_videos=related_videos)
+
+@video_bp.route('/api/video/<video_name>/comment', methods=['POST'])
+def add_comment(video_name):
+    video = Video.query.filter_by(url=video_name).first_or_404()
+    current_user = get_current_user()
+
+    if current_user:
+        content = request.json.get('content')  # Изменено для работы с JSON
+        if content:
+            new_comment = add_comment_to_video(video, current_user, content)
+            return jsonify({
+                "message": "Comment added successfully.",
+                "comment": new_comment
+            }), 200
+        else:
+            return jsonify({"message": "Content is required."}), 400
+    return jsonify({"message": "Unauthorized access."}), 401
diff --git a/services/video_service.py b/services/video_service.py
new file mode 100644
index 0000000..ba93fe2
--- /dev/null
+++ b/services/video_service.py
@@ -0,0 +1,111 @@
+from moviepy.video.io.VideoFileClip import VideoFileClip
+
+from config import Config
+from models import Video, Comment, User, db
+from helpers.utils import allowed_file, generate_random_name, generate_thumbnail
+from flask import session, jsonify, redirect, url_for
+import os
+import subprocess
+
+
+def save_video(file, title, description, user_id):
+    """
+    Сохраняет загруженное видео и создает соответствующую запись в базе данных.
+
+    Args:
+        file: Загружаемый файл.
+        title (str): Название видео.
+        description (str): Описание видео.
+        user_id (int): ID пользователя, который загружает видео.
+
+    Returns:
+        str: Имя файла.
+    """
+    filename = generate_random_name() + ".mp4"
+    video_path = os.path.join(Config.UPLOAD_FOLDER, filename)
+    temp_path = os.path.join(Config.UPLOAD_FOLDER, "temp_" + filename)
+
+    file.save(video_path)
+
+
+    # Заменяем исходное видео на измененное
+    os.rename(temp_path, video_path)
+
+    thumbnail_path = os.path.join(Config.THUMBNAIL_FOLDER, filename[:-4] + ".jpg")
+    generate_thumbnail(video_path, thumbnail_path)
+
+    new_video = Video(
+        title=title,
+        url=filename,
+        description=description,
+        user_id=user_id
+    )
+    db.session.add(new_video)
+    db.session.commit()
+
+    return filename
+
+
+def increment_video_views(video):
+    """
+    Увеличивает количество просмотров видео.
+
+    Args:
+        video (Video): Объект видео.
+    """
+    video.views += 1
+    db.session.commit()
+
+
+def add_comment_to_video(video, current_user, content):
+    """
+    Добавляет комментарий к видео и возвращает созданный комментарий.
+
+    Args:
+        video (Video): Объект видео.
+        current_user (User): Текущий пользователь.
+        content (str): Содержимое комментария.
+
+    Returns:
+        dict: Данные созданного комментария, включая ID, содержимое и информацию о пользователе.
+    """
+    comment = Comment(content=content, user=current_user, video=video)
+    db.session.add(comment)
+    db.session.commit()
+
+    # Возвращаем словарь с данными комментария
+    return {
+        "id": comment.id,
+        "content": comment.content,
+        "user": {
+            "username": current_user.username,
+            "avatar": current_user.avatar or None
+        }
+    }
+
+
+def update_subscription(user, user_to_subscribe, subscribe=True):
+    """
+    Обновляет подписку пользователя.
+
+    Args:
+        user (User): Текущий пользователь.
+        user_to_subscribe (User): Пользователь, на которого подписываются или отписываются.
+        subscribe (bool): True для подписки, False для отписки.
+
+    Returns:
+        dict: Результат обновления подписки.
+    """
+    if subscribe:
+        user.subscribed_to.append(user_to_subscribe)
+    else:
+        user.subscribed_to.remove(user_to_subscribe)
+
+    db.session.commit()
+    new_count = user_to_subscribe.subscribers.count()
+
+    return {
+        'status': 'success',
+        'subscribed': subscribe,
+        'subscribers': new_count
+    }
\ No newline at end of file
diff --git a/src/app.py b/src/app.py
deleted file mode 100644
index 5a7ce9d..0000000
--- a/src/app.py
+++ /dev/null
@@ -1,429 +0,0 @@
-from flask import Flask, request, render_template, redirect, url_for, send_from_directory, session, flash, jsonify
-
-from models import db, User, Video, Like, Comment, DisLike
-import os
-from moviepy.editor import VideoFileClip
-from PIL import Image
-import random
-import string
-from markupsafe import Markup
-from werkzeug.utils import secure_filename
-import base64
-from flask import current_app as app
-from fuzzywuzzy import fuzz, process
-from os import system as s
-
-s('cls')
-
-app = Flask(__name__)
-app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///netube.db'
-app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False
-app.config['UPLOAD_FOLDER'] = os.path.join(app.root_path, 'src/static/videos')
-app.config['THUMBNAIL_FOLDER'] = os.path.join(app.root_path, 'static/thumbnails')
-app.config['ICONS_FOLDER'] = os.path.join(app.root_path, 'static/avatars')
-app.config['AVATARS_FOLDER'] = os.path.join(app.root_path, 'static/avatars/users')
-app.config['VIDEOS_FOLDER'] = os.path.join(app.root_path, 'static/videos')
-app.config['MAX_CONTENT_LENGTH'] = 8 * 1024 * 1024 * 1024  # 8GB
-app.secret_key = 'your_secret_key'  # Замените на ваш случайный секретный ключ
-admin_secret_key = "123"  # Секретный ключ для админ-панели
-db.init_app(app)
-
-app.config['ALLOWED_EXTENSIONS'] = {'png', 'jpg', 'jpeg', 'mp4'}
-
-
-def allowed_file(filename):
-    return '.' in filename and \
-           filename.rsplit('.', 1)[1].lower() in app.config['ALLOWED_EXTENSIONS']
-
-def generate_thumbnail(video_path, thumbnail_path):
-    """
-    Генерирует миниатюру видео, сохраняя ее в нужном размере и соотношении сторон.
-
-    Args:
-        video_path (str): Путь к видеофайлу.
-        thumbnail_path (str): Путь для сохранения миниатюры.
-    """
-    video = VideoFileClip(video_path)
-
-    frame = video.get_frame(t=0.0)
-    image = Image.fromarray(frame)
-
-    width, height = image.size
-
-    # Обрезка для сохранения соотношения 16:9
-    if width / height != 16 / 9:
-        # Вычисляем целевую ширину, чтобы получить соотношение 16:9
-        if width > height:
-            crop_width = width
-            crop_height = int(crop_width * 9 / 16)
-        else:
-            crop_height = height
-            crop_width = int(crop_height * 16 / 9)
-
-        # Вычисляем разницу в ширине и высоте
-        width_diff = width - crop_width
-        height_diff = height - crop_height
-
-        # Вычисляем смещения для обрезки
-        left_offset = width_diff // 2
-        top_offset = height_diff // 2
-
-        # Обрезка изображения
-        left = left_offset
-        right = left + crop_width
-        top = top_offset
-        bottom = top + crop_height
-
-        image = image.crop((left, top, right, bottom))
-    
-    # Сжатие, если необходимо
-    if width > 1280 or height > 720:
-        new_width = 1280
-        new_height = int(new_width * 9 / 16)
-
-        image = image.resize((new_width, new_height), Image.LANCZOS)  # Используем LANCZOS для лучшего качества сжатия
-
-    # Сохранение миниатюры
-    image.save(thumbnail_path)
-
-
-def generate_random_name(length=10):
-    letters = string.ascii_letters + string.digits
-    return ''.join(random.choice(letters) for i in range(length))
-
-
-def get_current_user():
-    user_id = session.get('user_id')
-    if user_id is not None:
-        return User.query.get(user_id)
-    return None
-
-
-@app.route('/', methods=['GET', 'POST'])
-def index():
-    current_user = get_current_user()
-    videos = Video.query.order_by(Video.likes.desc()).all()
-    search_results = []
-
-    if request.method == 'POST':
-        search_query = request.form.get('search_query')
-        if search_query:
-            app.logger.debug(f"Search query: {search_query}")
-            matches = process.extract(search_query, [video.title for video in videos], scorer=fuzz.token_sort_ratio)
-            app.logger.debug(f"FuzzyWuzzy matches: {matches}")
-            search_results = [video for video, score in matches if score >= 20]
-            search_results = [Video.query.filter_by(
-                title=video.title if isinstance(video.title, str) else str(video.title)).first() for video in
-                             search_results]
-            search_results = [video for video in search_results if video is not None]
-
-    return render_template('index.html',
-                           videos=videos,
-                           search_results=search_results,
-                           Markup=Markup,
-                           current_user=current_user)
-
-@app.route('/base', methods=['GET', 'POST'])
-def base():
-    current_user = get_current_user()
-
-    return render_template('base.html',
-                           Markup=Markup,
-                           current_user=current_user)
-
-@app.route('/upload', methods=['GET', 'POST'])
-def upload():
-    current_user = get_current_user()
-    if 'logged_in' in session:
-        if request.method == 'POST':
-            title = request.form['title']
-            description = request.form['description'][:500]  # Обрезаем описание до 500 символов
-            file = request.files['file']
-            if file and allowed_file(file.filename):
-                filename = generate_random_name() + ".mp4"
-                video_path = os.path.join('src/static/videos', filename)
-                app.logger.debug(f"Saving file to: {video_path}")
-                file.save(video_path)
-                thumbnail_path = os.path.join('src/static/thumbnails', filename[:-4] + ".jpg")
-                generate_thumbnail(video_path, thumbnail_path)
-                user_id = session['user_id']
-                new_video = Video(title=title, url=filename, description=description, user_id=user_id)
-                db.session.add(new_video)
-                db.session.commit()
-                return redirect(url_for('channel', username=User.query.get(user_id).username))
-        return render_template('upload.html', current_user=current_user)
-    else:
-        return redirect(url_for('login'))
-
-@app.route('/video/<video_name>')
-def video(video_name):
-    video = Video.query.filter_by(url=video_name).first_or_404()
-    current_user = get_current_user()
-    # Увеличиваем количество просмотров
-    video.views += 1
-    db.session.commit()
-
-    related_videos = Video.query.filter(Video.id != video.id).limit(9).all()
-
-    return render_template('video.html',
-                           video=video,
-                           Markup=Markup,
-                           current_user=current_user,
-                           related_videos=related_videos)
-
-@app.route('/video/<video_name>/comment', methods=['POST'])
-def add_comment(video_name):
-    video = Video.query.filter_by(url=video_name).first_or_404()
-    current_user = get_current_user()
-    if current_user:
-        content = request.form.get('content')
-        comment = Comment(content=content, user=current_user, video=video)
-        db.session.add(comment)
-        db.session.commit()
-    return redirect(url_for('video', video_name=video_name))
-
-@app.route('/subscribe/<int:user_id>', methods=['POST'])
-def subscribe(user_id):
-    user = get_current_user()
-    if user:
-        user_to_subscribe = User.query.get(user_id)
-        user.subscribed_to.append(user_to_subscribe)
-        db.session.commit()
-        new_count = user_to_subscribe.subscribers.count()  # Получаем обновленное количество
-        return jsonify({'status': 'success', 'subscribed': True, 'subscribers': new_count})
-    return jsonify({'status': 'error', 'message': 'User not logged in'}), 401
-
-@app.route('/unsubscribe/<int:user_id>', methods=['POST'])
-def unsubscribe(user_id):
-    user = get_current_user()
-    if user:
-        user_to_unsubscribe = User.query.get(user_id)
-        user.subscribed_to.remove(user_to_unsubscribe)
-        db.session.commit()
-        new_count = user_to_unsubscribe.subscribers.count()  # Получаем обновленное количество
-        return jsonify({'status': 'success', 'subscribed': False, 'subscribers': new_count})
-    return jsonify({'status': 'error', 'message': 'User not logged in'}), 401
-
-
-
-@app.route('/static/videos/<path:filename>')
-def serve_videos(filename):
-    return send_from_directory(app.config['VIDEOS_FOLDER'], filename)
-
-
-@app.route('/static/thumbnails/<path:filename>')
-def serve_thumbnails(filename):
-    return send_from_directory(app.config['THUMBNAIL_FOLDER'], filename)
-
-
-@app.route('/static/avatars/<path:filename>')
-def serve_icons(filename):
-    return send_from_directory(app.config['ICONS_FOLDER'], filename)
-
-@app.route('/static/avatars/users/<path:filename>')
-def serve_avatars(filename):
-    return send_from_directory(app.config['AVATARS_FOLDER'], filename)
-
-@app.route('/like/<video_name>')
-def like_video(video_name):
-    video = Video.query.filter_by(url=video_name).first_or_404()
-    user = get_current_user()
-    if user:
-        existing_like = Like.query.filter_by(user_id=user.id, video_id=video.id).first()
-        existing_dislike = DisLike.query.filter_by(user_id=user.id, video_id=video.id).first()
-
-        if existing_like:
-            # Убираем лайк
-            db.session.delete(existing_like)
-            video.likes -= 1
-        else:
-            # Ставим лайк
-            if existing_dislike:
-                # Убираем дизлайк
-                db.session.delete(existing_dislike)
-                video.dislikes -= 1
-            new_like = Like(user_id=user.id, video_id=video.id)
-            db.session.add(new_like)
-            video.likes += 1
-
-        db.session.commit()
-
-    return redirect(url_for('video', video_name=video_name))
-
-
-@app.route('/dislike/<video_name>')
-def dislike_video(video_name):
-    video = Video.query.filter_by(url=video_name).first_or_404()
-    user = get_current_user()
-    if user:
-        existing_like = Like.query.filter_by(user_id=user.id, video_id=video.id).first()
-        existing_dislike = DisLike.query.filter_by(user_id=user.id, video_id=video.id).first()
-
-        if existing_dislike:
-            # Убираем дизлайк
-            db.session.delete(existing_dislike)
-            video.dislikes -= 1
-        else:
-            # Ставим дизлайк
-            if existing_like:
-                # Убираем лайк
-                db.session.delete(existing_like)
-                video.likes -= 1
-            new_dislike = DisLike(user_id=user.id, video_id=video.id)
-            db.session.add(new_dislike)
-            video.dislikes += 1
-
-        db.session.commit()
-
-    return redirect(url_for('video', video_name=video_name))
-
-
-@app.route('/login', methods=['GET', 'POST'])
-def login():
-    if request.method == 'POST':
-        username = request.form['username']
-        password = request.form['password']
-        user = User.query.filter_by(username=username).first()
-        if user and user.password == password:
-            session['logged_in'] = True
-            session['user_id'] = user.id
-            return redirect(url_for('index'))
-        else:
-            return render_template('login.html', error="Неверный логин или пароль")
-    current_user = get_current_user()
-    return render_template('login.html', current_user=current_user)
-
-
-@app.route('/logout')
-def logout():
-    session.pop('logged_in', None)
-    session.pop('user_id', None)
-    return redirect(url_for('index'))
-
-
-@app.route('/register', methods=['GET', 'POST'])
-def register():
-    if request.method == 'POST':
-        username = request.form['username']
-        password = request.form['password']
-        if User.query.filter_by(username=username).first():
-            return render_template('register.html', error="Пользователь с таким именем уже существует")
-        new_user = User(username=username, password=password)
-        db.session.add(new_user)
-        db.session.commit()
-        return redirect(url_for('login'))
-    current_user = get_current_user()
-    return render_template('register.html', current_user=current_user)
-
-
-@app.route('/channel/<username>')
-def channel(username):
-    user = User.query.filter_by(username=username).first_or_404()
-    videos = Video.query.filter_by(user_id=user.id).all()
-    current_user = get_current_user()
-    if current_user:
-        avatar = current_user.avatar
-    else:
-        avatar = None
-    return render_template('channel.html', user=user, videos=videos, avatar=avatar, Markup=Markup,
-                           current_user=current_user)
-
-@app.route('/channel/<username>/avatar', methods=['GET', 'POST'])  # Используем один маршрут
-def upload_avatar(username):
-    user = User.query.filter_by(username=username).first_or_404()
-    current_user = get_current_user()
-    if request.method == 'POST':
-        avatar = request.files.get('avatar')
-
-        if avatar and allowed_file(avatar.filename):
-            filename = f"{user.username}_avatar.{avatar.filename.rsplit('.', 1)[1]}"
-            avatar.save(os.path.join(app.config['AVATARS_FOLDER'], filename))
-            user.avatar = filename
-            db.session.commit()
-            flash('Аватар успешно обновлен!', 'success')
-    return redirect(url_for('channel', username=username, user=user, current_user=current_user)) 
-
-@app.route('/edit_user/<int:user_id>', methods=['GET', 'POST'])
-def edit_user(user_id):
-    user = User.query.get_or_404(user_id)
-    current_user = get_current_user()
-
-    if request.method == 'POST':
-        username = request.form.get('username')
-        password = request.form.get('password')
-        avatar = request.files.get('avatar')
-
-        user.username = username
-        if password:
-            user.password = password
-        if avatar and allowed_file(avatar.filename):
-            filename = secure_filename(avatar.filename)
-            avatar.save(os.path.join(app.config['AVATARS_FOLDER'], filename))
-            user.avatar = filename
-
-        # Добавление/удаление подписчиков
-        add_subscriber = request.form.get('add_subscriber')
-        remove_subscriber = request.form.get('remove_subscriber')
-        if add_subscriber:
-            subscriber = User.query.filter_by(username=add_subscriber).first()
-            if subscriber and subscriber not in user.subscribers:
-                user.subscribers.append(subscriber)
-        if remove_subscriber:
-            subscriber = User.query.filter_by(username=remove_subscriber).first()
-            if subscriber and subscriber in user.subscribers:
-                user.subscribers.remove(subscriber)
-
-        # Удаление видео
-        delete_video_id = request.form.get('delete_video_id')
-        if delete_video_id:
-            video_to_delete = Video.query.get(int(delete_video_id))
-            if video_to_delete and video_to_delete.author == user:
-                db.session.delete(video_to_delete)
-
-                # Удаляем файл видео и миниатюру
-                video_path = os.path.join(app.config['UPLOAD_FOLDER'], video_to_delete.url)
-                thumbnail_path = os.path.join(app.config['THUMBNAIL_FOLDER'], video_to_delete.url[:-4] + ".jpg")
-                if os.path.exists(video_path):
-                    os.remove(video_path)
-                if os.path.exists(thumbnail_path):
-                    os.remove(thumbnail_path)
-
-        db.session.commit()
-        flash('Пользователь успешно обновлен!', 'success')
-        return redirect(url_for('administration'))
-
-    return render_template('edit_user.html', user=user, current_user=current_user)
-
-@app.route('/edit_video/<int:video_id>', methods=['GET', 'POST'])
-def edit_video(video_id):
-    video = Video.query.get_or_404(video_id)
-    current_user = get_current_user()
-
-    if request.method == 'POST':
-        title = request.form.get('title')
-        description = request.form.get('description')
-
-        video.title = title
-        video.description = description
-        db.session.commit()
-        flash('Видео успешно обновлено!', 'success')
-        return redirect(url_for('administration'))
-
-    return render_template('edit_video.html', video=video, current_user=current_user)
-
-@app.route('/administration', methods=['GET', 'POST'])
-def administration():
-    if request.method == 'POST':
-        entered_key = request.form.get('admin_key')
-        if entered_key == admin_secret_key:
-            users = User.query.all()
-            videos = Video.query.all()
-            return render_template('Administration.html', users=users, videos=videos)
-        else:
-            return "Неверный пароль!"
-    return render_template('admin_login.html')
-
-if __name__ == '__main__':
-    with app.app_context():
-        db.create_all()
-    app.run(debug=True)
\ No newline at end of file
diff --git a/src/instance/netube.db b/src/instance/netube.db
deleted file mode 100644
index fbe249f..0000000
Binary files a/src/instance/netube.db and /dev/null differ
diff --git a/src/static/auth_page.css b/src/static/auth_page.css
deleted file mode 100644
index 60205a8..0000000
--- a/src/static/auth_page.css
+++ /dev/null
@@ -1,71 +0,0 @@
-/* src/static/auth_page.css */
-body {
-    font-family: 'Roboto', sans-serif; /* Use Roboto font */
-    background-color: #f9f9f9;
-    margin: 0;
-    padding: 0;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    height: auto;
-}
-
-h1 {
-    margin-top: 100px; 
-    margin-bottom: 20px;
-    font-size: 24px;
-    color: #333;
-    font-weight: 700; /* Bold title */
-}
-
-form {
-    display: flex;
-    flex-direction: column;
-    width: 300px;
-    padding: 20px;
-    border: 1px solid #ccc;
-    border-radius: 5px;
-    background-color: #fff;
-}
-
-input[type="text"], input[type="password"] {
-    padding: 10px;
-    margin-bottom: 10px;
-    border: 1px solid #ccc;
-    border-radius: 3px;
-    font-size: 16px; /* Slightly larger input font size */
-    color: #333;
-}
-
-button[type="submit"] {
-    padding: 10px;
-    border: none;
-    border-radius: 3px;
-    background-color: #4CAF50;
-    color: white;
-    cursor: pointer;
-    font-size: 16px; /* Larger button font size */
-    font-weight: 700; /* Bold button text */
-    transition: background-color 0.3s ease; /* Smooth transition for hover effect */
-}
-
-button[type="submit"]:hover {
-    background-color: #45a049; /* Slightly darker green on hover */
-}
-
-p {
-    margin-top: 10px;
-    font-size: 14px; /* Smaller font size for paragraphs */
-    color: #555; /* Darker gray for paragraphs */
-}
-
-p a {
-    text-decoration: none;
-    color: #386125; /* Green for links */
-    transition: color 0.3s ease; /* Smooth transition for hover effect */
-}
-
-p a:hover {
-    color: #45a049; /* Darker green on hover */
-}
\ No newline at end of file
diff --git a/src/static/channel_page.css b/src/static/channel_page.css
deleted file mode 100644
index 3c24503..0000000
--- a/src/static/channel_page.css
+++ /dev/null
@@ -1,236 +0,0 @@
-body {
-    font-family: 'Material Icons', sans-serif;
-    background-color: #f9f9f9;
-    margin: 0;
-    padding: 0;
-}
-
-
-
-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 20px;
-    background-color: #fff;
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-}
-
-header h1 {
-    margin: 0;
-    font-size: 24px;
-    color: #333;
-}
-
-header nav {
-    display: flex;
-    align-items: center;
-}
-
-header nav a {
-    display: flex;
-    align-items: center;
-    text-decoration: none;
-    color: inherit;
-    margin-left: 15px;
-}
-
-header nav a img {
-    border-radius: 50%;
-    width: 30px;
-    height: 30px;
-}
-
-.channel-container {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin-top: 20px;
-}
-
-.channel-container h2 {
-    margin-bottom: 10px;
-    font-size: 22px;
-    color: #333;
-}
-
-.upload-form {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin-bottom: 20px;
-}
-
-.upload-button, .submit-button {
-    display: inline-flex;
-    align-items: center;
-    padding: 10px 20px;
-    margin: 10px 0;
-    font-size: 16px;
-    font-weight: bold;
-    color: #fff;
-    background-color: #4CAF50; /* Зеленый цвет */
-    border: none;
-    border-radius: 4px; /* Более скругленные углы */
-    cursor: pointer;
-    text-align: center;
-    text-decoration: none;
-    transition: background-color 0.3s ease, box-shadow 0.3s ease; /* Добавляем transition для box-shadow */
-    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); /* Тень */
-}
-
-.upload-button:hover, .submit-button:hover {
-    background-color: #45a049; /* Более темный зеленый при наведении */
-    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); /* Увеличиваем тень при наведении */
-}
-
-.upload-button i, .submit-button i {
-    margin-right: 5px;
-    font-size: 18px;
-}
-
-.upload-button:hover, .submit-button:hover {
-    background-color: #0056b3;
-}
-
-.upload-button i, .submit-button i {
-    margin-right: 5px;
-    font-size: 18px;
-}
-
-.video-container {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    padding: 20px;
-    color: inherit;
-    text-decoration: none;
-}
-
-.video-preview {
-    width: 320px;
-    margin: 15px;
-    border-radius: 10px;
-    overflow: hidden;
-    background-color: #ffffff00;
-    transition: transform 0.3s, box-shadow 0.3s;
-    padding: 5px;
-    color: inherit;
-    text-decoration: none;
-}
-
-header a:link, header a:visited {
-    color: inherit;
-    text-decoration: none;
-}
-
-header a:hover, header a:active {
-    color: inherit;
-    text-decoration: none;
-}
-
-.video-preview:hover {
-    transform: scale(1.0);
-    background-color: #fff;
-    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
-    color: inherit;
-    text-decoration: none;
-}
-
-.video-preview img {
-    width: 100%;
-    height: auto;
-    object-fit: cover;
-    border-radius: 10px;
-    transition: transform 0.3s;
-}
-
-.video-preview:hover img {
-    transform: scale(1.01);
-    color: inherit;
-    text-decoration: none;
-}
-
-.video-preview h3 {
-    margin: 10px 0 5px;
-    font-size: 16px;
-    color: #333;
-    display: flex;
-    align-items: center;
-}
-
-.video-preview h3 img {
-    width: 30px;
-    height: 30px;
-    object-fit: cover;
-    border-radius: 50%;
-    margin-right: 10px;
-}
-
-.video-preview p {
-    margin: 0;
-    font-size: 14px;
-    color: #666;
-}
-
-header a:link, header a:visited {
-    color: inherit;
-    text-decoration: none;
-}
-
-header a:hover, header a:active {
-    color: inherit;
-    text-decoration: none;
-}
-
-#avatar-button {
-    border-radius: 50%; /* Скругление в форме круга */
-    border: none; /* Убираем границу */
-    padding: 0; /* Убираем внутренние отступы */
-    background: none; /* Убираем фоновый цвет */
-    cursor: pointer; /* Изменяем курсор на указатель */
-}
-
-#avatar-button:hover {
-    /* Добавьте стили при наведении курсора, например, изменение цвета */
-    transform: scale(1.01);
-}
-
-.subscribe-button {
-    background-color: #ff0000; /* Синий цвет */
-    color: white;
-    border: none;
-    padding: 10px 20px;
-    text-align: center;
-    text-decoration: none;
-    display: inline-block;
-    font-size: 12px;
-    border-radius: 5px; /* Скругленные углы */
-    cursor: pointer;
-}
-
-.unsubscribe-button {
-    background-color: #3e3e3e; /* Красный цвет */
-    color: white;
-    border: none;
-    padding: 10px 20px;
-    text-align: center;
-    text-decoration: none;
-    display: inline-block;
-    font-size: 12px;
-    border-radius: 5px; /* Скругленные углы */
-    cursor: pointer;
-}
-
-a {
-    text-decoration: none;
-    color: inherit;
-}
-a:hover, a:active {
-    text-decoration: none;
-    color: inherit;
-}
-
-img {
-    border-radius: 50%
-}
\ No newline at end of file
diff --git a/src/static/index_page.css b/src/static/index_page.css
deleted file mode 100644
index 2914897..0000000
--- a/src/static/index_page.css
+++ /dev/null
@@ -1,268 +0,0 @@
-/* src/static/index_page.css */
-
-header .search-container {
-    display: flex;
-    justify-content: center; /* Горизонтальное центрирование */
-    align-items: center;    /* Вертикальное центрирование */
-    margin: 0 auto; /* Центрируем контейнер */
-}
-
-header .search-container input[type="text"] {
-    padding: 8px;
-    width: 500px; 
-    max-width: 500px;
-    border: 1px solid #ccc;
-    border-radius: 5px 0 0 5px;
-    font-size: 13px;
-}
- 
-header .search-container button {
-    background-color: #ffffff;
-    border: 1px solid #ccc;
-    border-radius: 0 5px 5px 0;
-    padding: 8px 12px;
-    cursor: pointer;
-}
-
-/* Медиа-запрос для телефонов */
-@media (max-width: 768px) {
-    header .search-container input[type="text"] {
-        width: 80%;
-        max-width: 150px; 
-    }
-}
-
-body {
-    font-family: 'Material Icons', sans-serif;
-    background-color: #f9f9f9;
-    margin: 0;
-    padding: 0;
-}
-
-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 20px;
-    background-color: #fff;
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-}
-
-header h1 {
-    margin: 0;
-    font-size: 24px;
-    color: #333;
-}
-
-header nav {
-    display: flex;
-    align-items: center;
-}
-
-header nav a {
-    display: flex;
-    align-items: center;
-    text-decoration: none;
-    color: inherit;
-    margin-left: 15px;
-}
-
-header nav a img {
-    border-radius: 50%;
-    width: 30px;
-    height: 30px;
-}
-
-.channel-container {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin-top: 20px;
-}
-
-.channel-container h2 {
-    margin-bottom: 10px;
-    font-size: 22px;
-    color: #333;
-}
-
-.upload-form {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin-bottom: 20px;
-}
-
-.upload-button, .submit-button {
-    display: inline-flex;
-    align-items: center;
-    padding: 10px 20px;
-    margin: 10px 0;
-    font-size: 16px;
-    font-weight: bold;
-    color: #fff;
-    background-color: #4CAF50; /* Зеленый цвет */
-    border: none;
-    border-radius: 4px; /* Более скругленные углы */
-    cursor: pointer;
-    text-align: center;
-    text-decoration: none;
-    transition: background-color 0.3s ease, box-shadow 0.3s ease; /* Добавляем transition для box-shadow */
-    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); /* Тень */
-}
-
-.upload-button:hover, .submit-button:hover {
-    background-color: #45a049; /* Более темный зеленый при наведении */
-    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); /* Увеличиваем тень при наведении */
-}
-
-.upload-button i, .submit-button i {
-    margin-right: 5px;
-    font-size: 18px;
-}
-
-.upload-button:hover, .submit-button:hover {
-    background-color: #0056b3;
-}
-
-.upload-button i, .submit-button i {
-    margin-right: 5px;
-    font-size: 18px;
-}
-
-.video-container {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    padding: 20px;
-    color: inherit;
-    text-decoration: none;
-}
-
-.video-preview {
-    width: 320px;
-    margin: 15px;
-    border-radius: 10px;
-    overflow: hidden;
-    background-color: #ffffff00;
-    transition: transform 0.3s, box-shadow 0.3s;
-    padding: 5px;
-    color: inherit;
-    text-decoration: none;
-}
-
-header a:link, header a:visited {
-    color: inherit;
-    text-decoration: none;
-}
-
-header a:hover, header a:active {
-    color: inherit;
-    text-decoration: none;
-}
-
-.video-preview:hover {
-    transform: scale(1.0);
-    background-color: #fff;
-    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
-    color: inherit;
-    text-decoration: none;
-}
-
-.video-preview img {
-    width: 100%;
-    height: auto;
-    object-fit: cover;
-    border-radius: 10px;
-    transition: transform 0.3s;
-}
-
-.video-preview:hover img {
-    transform: scale(1.01);
-    color: inherit;
-    text-decoration: none;
-}
-
-.video-preview h3 {
-    margin: 10px 0 5px;
-    font-size: 16px;
-    color: #333;
-    display: flex;
-    align-items: center;
-}
-
-.video-preview h3 img {
-    width: 30px;
-    height: 30px;
-    object-fit: cover;
-    border-radius: 50%;
-    margin-right: 10px;
-}
-
-.video-preview p {
-    margin: 0;
-    font-size: 14px;
-    color: #666;
-}
-
-header a:link, header a:visited {
-    color: inherit;
-    text-decoration: none;
-}
-
-header a:hover, header a:active {
-    color: inherit;
-    text-decoration: none;
-}
-
-#avatar-button {
-    border-radius: 50%; /* Скругление в форме круга */
-    border: none; /* Убираем границу */
-    padding: 0; /* Убираем внутренние отступы */
-    background: none; /* Убираем фоновый цвет */
-    cursor: pointer; /* Изменяем курсор на указатель */
-}
-
-#avatar-button:hover {
-    /* Добавьте стили при наведении курсора, например, изменение цвета */
-    transform: scale(1.01);
-}
-
-.subscribe-button {
-    background-color: #ff0000; /* Синий цвет */
-    color: white;
-    border: none;
-    padding: 10px 20px;
-    text-align: center;
-    text-decoration: none;
-    display: inline-block;
-    font-size: 12px;
-    border-radius: 5px; /* Скругленные углы */
-    cursor: pointer;
-}
-
-.unsubscribe-button {
-    background-color: #3e3e3e; /* Красный цвет */
-    color: white;
-    border: none;
-    padding: 10px 20px;
-    text-align: center;
-    text-decoration: none;
-    display: inline-block;
-    font-size: 12px;
-    border-radius: 5px; /* Скругленные углы */
-    cursor: pointer;
-}
-
-a {
-    text-decoration: none;
-    color: inherit;
-}
-a:hover, a:active {
-    text-decoration: none;
-    color: inherit;
-}
-
-img {
-    border-radius: 50%
-}
\ No newline at end of file
diff --git a/src/static/style.css b/src/static/style.css
deleted file mode 100644
index 599be1c..0000000
--- a/src/static/style.css
+++ /dev/null
@@ -1,115 +0,0 @@
-/* src/static/styles.css */
-
-.body {
-    font-family: 'Material Icons', sans-serif;
-}
-
-#menu-overlay {
-    position: fixed; 
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0); /* Начальное состояние: прозрачный фон */
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    z-index: 1000; 
-    opacity: 0; /* Начальное состояние: невидимый */
-    pointer-events: none; /* Начальное состояние: не реагирует на клики */
-    transition: opacity 0.15s ease-in-out; /* Плавное изменение прозрачности */
-}
-
-#menu-overlay.open {
-    opacity: 1; /* Открытое состояние: видимый */
-    pointer-events: auto; /* Открытое состояние: реагирует на клики */
-    background-color: rgba(0, 0, 0, 0.5); /* Открытое состояние: полупрозрачный фон */
-}
-
-#menu-content {
-    background-color: white;
-    padding: 20px;
-    border-radius: 10px; /* Скругленные углы */
-    width: 400px;
-    height: 400px;
-    display: flex;
-    flex-direction: column; /* Располагаем блоки вертикально */
-}
-
-#menu-content > * { /* Выбираем все прямые дочерние элементы #menu-content */
-    margin-bottom: 15px; /* Отступ между блоками */
-    /* border-bottom: 1px solid #ccc; Разделительная линия */
-    /* padding-bottom: 15px; Отступ снизу от линии */
-}
-
-#menu-content > *:last-child { /* Убираем линию у последнего блока */
-    border-bottom: none;
-    margin-bottom: 0;
-}
-
-.menu-block { 
-    /* padding: 10px;  */
-    box-sizing: border-box; /* Добавляем эту строку */
-}
-
-.separator { 
-    width: auto; /* Например, 90% от ширины #menu-content */
-    border-bottom: 1px solid #ccc; 
-}
-
-.vert-separator {
-    height: 30px; /* Высота сепаратора */
-    width: 1px; /* Толщина линии */
-    background-color: #ccc; /* Цвет линии */
-    margin: 15px auto; /* Отступы сверху/снизу, центрирование по горизонтали */
-}
-
-.hidden {
-    display: none;
-}
-
-
-.user-info {
-    display: flex; /* Располагаем аватарку и детали пользователя в строку */
-    align-items: center; /* Вертикальное выравнивание */
-}
-
-.user-details {
-    margin-left: 10px;
-    display: flex;
-    flex-direction: column; /* Располагаем тег и подписчиков вертикально */
-}
-
-.username {
-    font-size: 18px; /* Уменьшаем размер шрифта для подписчиков */
-    margin-bottom: 5px;
-    font-weight: 500; /* Выделяем имя пользователя */
-}
-
-.subscribers {
-    font-size: 15px; /* Уменьшаем размер шрифта для подписчиков */
-    color: #666; /* Делаем текст подписчиков менее заметным */
-}
-
-a {
-    display: flex;
-    align-items: center; 
-}
-
-.a img {
-    border-radius: 0%;
-}
-
-
-#subscribe-button {
-    background-color: #bdbdbdf9;
-    border-radius: 50px;
-    width: 140px;
-    height: 30px;
-    border: none;
-}
-
-#subscribe-button:hover {
-    background-color: #808080;
-    color: #fff;
-}
\ No newline at end of file
diff --git a/src/static/upload_page.css b/src/static/upload_page.css
deleted file mode 100644
index 80ebb7a..0000000
--- a/src/static/upload_page.css
+++ /dev/null
@@ -1,288 +0,0 @@
-body {
-    font-family: 'Roboto', sans-serif;
-    background-color: #f9f9f9;
-    margin: 0;
-    padding: 0;
-}
-
-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 20px;
-    background-color: #fff;
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-}
-
-header .search-container {
-    display: flex;
-    align-items: center;
-    vertical-align: center;
-    margin: 0 auto; /* Центрируем контейнер */
-}
-
-header .search-container input[type="text"] {
-    padding: 8px;
-    width: 400px;
-    vertical-align: center;
-    border: 1px solid #ccc;
-    border-radius: 5px 0 0 5px;
-    font-size: 13px;
-}
-
-header .search-container button {
-    background-color: #ffffff;
-    border: 1px solid #ccc;
-    vertical-align: center;
-    border-radius: 0 5px 5px 0;
-    padding: 8px 12px;
-    cursor: pointer;
-}
-
-header h1 {
-    margin: 0;
-    font-size: 24px;
-    color: #333;
-}
-
-header nav {
-    display: flex;
-    align-items: center;
-}
-
-header nav a {
-    display: flex;
-    align-items: center;
-    text-decoration: none;
-    color: inherit;
-    margin-left: 15px;
-}
-
-header nav a img {
-    border-radius: 50%;
-    width: 30px;
-    height: 30px;
-}
-
-.channel-container {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin-top: 20px;
-}
-
-.channel-container h2 {
-    margin-bottom: 10px;
-    font-size: 22px;
-    color: #333;
-}
-
-.upload-form {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin-bottom: 20px;
-}
-
-.upload-button, .submit-button {
-    display: inline-flex;
-    align-items: center;
-    padding: 10px 20px;
-    margin: 10px 0;
-    font-size: 16px;
-    font-weight: bold;
-    color: #fff;
-    background-color: #4CAF50; /* Зеленый цвет */
-    border: none;
-    border-radius: 4px; /* Более скругленные углы */
-    cursor: pointer;
-    text-align: center;
-    text-decoration: none;
-    transition: background-color 0.3s ease, box-shadow 0.3s ease; /* Добавляем transition для box-shadow */
-    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); /* Тень */
-}
-
-.upload-button:hover, .submit-button:hover {
-    background-color: #45a049; /* Более темный зеленый при наведении */
-    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); /* Увеличиваем тень при наведении */
-}
-
-.upload-button i, .submit-button i {
-    margin-right: 5px;
-    font-size: 18px;
-}
-
-.upload-button:hover, .submit-button:hover {
-    background-color: #0056b3;
-}
-
-.upload-button i, .submit-button i {
-    margin-right: 5px;
-    font-size: 18px;
-}
-
-.video-container {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    padding: 20px;
-}
-
-.video-preview {
-    width: 320px;
-    margin: 15px;
-    border-radius: 10px;
-    overflow: hidden;
-    background-color: #ffffff00;
-    transition: transform 0.3s, box-shadow 0.3s;
-    padding: 5px;
-}
-
-header a:link, header a:visited {
-    color: inherit;
-    text-decoration: none;
-}
-
-header a:hover, header a:active {
-    color: inherit;
-    text-decoration: none;
-}
-
-.video-preview:hover {
-    transform: scale(1.0);
-    background-color: #fff;
-    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
-}
-
-.video-preview img {
-    width: 100%;
-    height: auto;
-    object-fit: cover;
-    border-radius: 10px;
-    transition: transform 0.3s;
-}
-
-.video-preview:hover img {
-    transform: scale(1.01);
-}
-
-.video-preview h3 {
-    margin: 10px 0 5px;
-    font-size: 16px;
-    color: #333;
-    display: flex;
-    align-items: center;
-}
-
-.video-preview h3 img {
-    width: 30px;
-    height: 30px;
-    object-fit: cover;
-    border-radius: 50%;
-    margin-right: 10px;
-}
-
-.video-preview p {
-    margin: 0;
-    font-size: 14px;
-    color: #666;
-}
-
-.subscribe-button {
-    background-color: #ff0000; /* Синий цвет */
-    color: white;
-    border: none;
-    padding: 10px 20px;
-    text-align: center;
-    text-decoration: none;
-    display: inline-block;
-    font-size: 12px;
-    border-radius: 5px; /* Скругленные углы */
-    cursor: pointer;
-}
-
-.unsubscribe-button {
-    background-color: #3e3e3e; /* Красный цвет */
-    color: white;
-    border: none;
-    padding: 10px 20px;
-    text-align: center;
-    text-decoration: none;
-    display: inline-block;
-    font-size: 12px;
-    border-radius: 5px; /* Скругленные углы */
-    cursor: pointer;
-}
-
-h1 {
-    color: #333;
-}
-main {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    min-height: calc(100vh - 250px); /* Высота окна браузера минус высота header */
-    padding-top: 10px; /* Отступ сверху */
-}
-form {
-    width: 100%;
-    max-width: 500px;
-    padding: 30px;
-    background-color: #fff;
-    border-radius: 8px;
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-}
-
-input[type="text"],
-textarea {
-    width: 100%;
-    padding: 12px;
-    margin-bottom: 15px;
-    border: 1px solid #ddd;
-    border-radius: 4px;
-    box-sizing: border-box;
-}
-
-input[type="file"] {
-    margin-bottom: 15px;
-}
-
-button[type="submit"] {
-    padding: 12px 20px;
-    background-color: #448aff;
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-}
-
-button[type="submit"]:hover {
-    background-color: #3367d6;
-}
-
-.loading-animation {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0.5);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    z-index: 1000; 
-}
-
-.loading-spinner {
-    width: 60px;
-    height: 60px;
-    border: 5px solid #ccc;
-    border-radius: 50%;
-    border-top-color: #007bff;
-    animation: spin 1s linear infinite;
-}
-
-@keyframes spin {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(360deg); }
-}
\ No newline at end of file
diff --git a/src/static/video_page.css b/src/static/video_page.css
deleted file mode 100644
index e841ddd..0000000
--- a/src/static/video_page.css
+++ /dev/null
@@ -1,266 +0,0 @@
-/* src/static/video_page.css */
-body {
-    font-family: 'Moderustic', sans-serif;
-    background-color: #fff;
-    margin: 0;
-    padding: 0;
-}
-
-header {
-    display: flex;
-    flex: 1;
-    justify-content: space-between;
-    align-items: center;
-    padding: 20px;
-    background-color: #fff;
-}
-
-
-header h1 {
-    margin: 0;
-    font-size: 24px;
-    color: #333;
-}
-
-header a {
-    display: flex;
-    align-items: center;
-    text-decoration: none;
-    color: inherit;
-}
-
-header a:link, header a:visited {
-    color: inherit;
-    text-decoration: none;
-}
-
-header a:hover, header a:active {
-    color: inherit;
-    text-decoration: none;
-}
-
-header img {
-    border-radius: 50%;
-    width: 30px;
-    height: 30px;
-}
-
-.main-container {
-    display: flex;
-    padding: 20px;
-}
-
-.video-section {
-    flex: 2;
-    margin-right: 20px;
-    margin-left: 10px; /* Отступ справа от левого края экрана */
-    margin-top: 10px; /* Отступ снизу от шапки */
-}
-
-.video-info {
-    /* background-color: #fff; */
-    /* padding: 20px; */
-    border-radius: 10px;
-    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
-    max-width: 1280px; 
-}
-
-.video-info video {
-    width: 100%;
-    height: 100%;
-    max-width: 1280px;
-    max-height: 720px;
-    border-radius: 10px;
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-}
-
-.video-info h2 {
-    margin: 20px 0 10px;
-    font-size: 24px;
-    color: #333;
-}
-
-.author-info {
-    display: flex;
-    align-items: center;
-    margin-bottom: 10px;
-}
-
-.author-info img {
-    border-radius: 50%;
-    margin-right: 10px;
-}
-
-.author-info span {
-    font-size: 16px;
-    color: #333;
-    margin-right: 20px;
-    align-self: center; /* Центрирование тега автора по вертикали */
-}
-
-.likes-dislikes {
-    display: flex;
-    align-items: center;
-    /* gap: 10px; */
-    width: 150px;
-    height: 30px;
-    border-radius: 50px;
-}
-
-.likes-dislikes button {
-    background-color: transparent;
-    border: none;
-    cursor: pointer;
-    display: flex;
-    align-items: center;
-    font-size: 16px;
-    color: #333;
-    height: 30px;
-}
-
-.description {
-    color: #000000;
-    background-color: #bdbdbd9f;
-    padding: 10px;
-    border-radius: 10px; 
-    font-size: 16px;
-    max-height: 60px;
-    overflow: hidden;
-    transition: max-height 0.3s;
-}
-
-.description.expanded {
-    max-height: none;
-}
-
-.show-more {
-    color: #000000;
-    font-weight: 770;
-    background-color: transparent;
-    border: none;
-    cursor: pointer;
-}
-
-.related-videos {
-    width: auto;
-    height: auto;
-    padding: 20px;
-    margin-top: 10px;
-}
-
-.related-videos h3 {
-    font-size: 20px;
-    color: #333;
-    margin-bottom: 10px;
-}
-
-.related-videos ul {
-    list-style: none;
-    padding: 0;
-}
-
-.related-videos ul li {
-    display: flex;
-    align-items: flex-start;
-    margin-bottom: 10px;
-    color: inherit;
-}
-
-.related-videos ul li * {
-    margin-top: 0;
-    vertical-align: top;
-    color: inherit;
-}
-
-.related-videos ul li div {
-    display: flex;
-    flex-direction: column;
-}
-
-.related-videos ul li img {
-    width: 120px;
-    height: 70px;
-    border-radius: 5px;
-    margin-right: 10px;
-}
-
-.related-videos ul li a {
-    font-size: 16px;
-    color: inherit;
-    text-decoration: none;
-}
-
-.related-videos ul li a:hover {
-    text-decoration: underline;
-    color: inherit;
-}
-
-/* video_page.css или channel_page.css */
-.related-videos, .related-videos-mobile {
-    position: relative; /*  Для абсолютного позиционирования */
-    right: 0; /* Привязываем к правой границе */
-    width: 25%; /* Ширина 25% */
-    top: 0px; /* Позиционируем ниже видеоплеера */
-    max-height: 80%; /* Максимальная высота */
-    overflow-y: auto; /* Добавляем вертикальную прокрутку */
-    display: none; /* Скрываем по умолчанию */
-    z-index: 1; /* Устанавливаем z-index для наложения */
-}
-
-.video-section {
-    width: 75%; /* Ограничиваем ширину видео */
-    position: relative; /* Устанавливаем позиционирование для видео */
-}
-
-@media (max-width: 1080px) {
-    .related-videos {
-        display: block; /* Отображаем предложенные видео на экранах меньше 800px */
-    }
-
-    .video-section {
-        width: calc(100% - 25%); /* Изменяем ширину видео */
-    }
-}
-
-a {
-    text-decoration: none; /* Убираем подчеркивания у всех ссылок */
-    color: inherit;
-}
-a:link, a:visited, a:hover, a:active {
-    text-align: left;
-    color: inherit;
-    text-decoration: none;
-}
-
-.vert-separator-description {
-    height: 30px; /* Высота сепаратора */
-    width: 1px; /* Толщина линии */
-    background-color: #ccc; /* Цвет линии */
-    /* margin: 15px auto; Отступы сверху/снизу, центрирование по горизонтали */
-}
-
-.comments {
-    color: #000000;
-    padding: 10px;
-    border-radius: 10px; 
-    font-size: 16px;
-}
-
-.comment-item {
-    display: flex;
-    align-items: flex-start; 
-    margin-bottom: 10px;
-}
-
-.comment-item img {
-    margin-right: 10px; 
-}
-
-.comment-content {
-    flex: 1; /* Занимаем оставшееся пространство */
-}
-
-.comment-content a {
-    text-decoration: none;
-    color: rgb(0, 0, 0); 
-}
\ No newline at end of file
diff --git a/src/templates/base.html b/src/templates/base.html
deleted file mode 100644
index 14a1536..0000000
--- a/src/templates/base.html
+++ /dev/null
@@ -1,91 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <title>NeTube</title>
-    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"> 
-    <link rel="stylesheet" href="{{ url_for('static', filename='channel_page.css') }}">
-</head>
-<body>
-    <header>
-        <h1><a href="/">NeTube</a></h1>
-        <nav>
-            {% if current_user %}
-            <form action="{{ url_for('upload_avatar', username=current_user.username) }}" method="POST" enctype="multipart/form-data" style="display: inline-block;">
-                <label for="mini-avatar" id="menu-button"> 
-                  <img src="{{ url_for('serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('serve_avatars', filename='plus.png') }}" width="30" height="30">
-                </label>
-                <button id="menu-button" style="display: none;"></button></form>
-                <a>•</a>
-                <a href="/upload"> <img src="{{ url_for('serve_icons', filename='upload.png') }}" width="30" height="30"></a>
-                <a>•</a>
-                <a href="{{ url_for('logout') }}"> <img src="{{ url_for('serve_icons', filename='log-out.png') }}" width="30" height="30" ></a>
-            
-            {% else %}
-                <a href="/login">
-                    <img src="{{ url_for('serve_avatars', filename='question.png') }}" width="30" height="30">
-                </a>
-            {% endif %}
-
-        </nav>
-    </header>
-
-    <div id="menu-overlay"> 
-        <div id="menu-content">
-            <div class="menu-block">
-                <div class="user-info">
-                    {% if current_user %}
-                    <form action="{{ url_for('upload_avatar', username=current_user.username) }}" method="POST" enctype="multipart/form-data" style="display: inline-block;">
-                        <label for="avatar" id="avatar-button"> 
-                          <img src="{{ url_for('serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('serve_avatars', filename='plus.png') }}" width="60" height="60">
-                        </label>
-                        <input type="file" id="avatar" name="avatar" style="display: none;"></form>
-                            <div class="user-details">
-                                <span class="username" >@{{ Markup(current_user.username) }}</span>
-                                <span class="subscribers" >{{ current_user.subscribers.count() }} подписчиков</span>
-                            </div> 
-                            <div class="vert-separator"></div>
-                            <a href="{{ url_for('channel', username=current_user.username) }}" style="color: rgb(0, 110, 255);">Перейти на канал</a>
-                        </p>
-
-                    {% else %}
-                        <a href="/login">
-                            <img src="{{ url_for('serve_avatars', filename='question.png') }}" width="60" height="60">
-                        </a>
-                    {% endif %}
-                </div>
-
-            </div>
-            <div class="separator"></div> 
-            <div class="menu-block">
-
-                <a> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='changeuser.png') }}" width="30" height="30">Ваши данные на NeTube</a>
-                <a href="{{ url_for('login') }} "> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='switchacc.png') }}" width="30" height="30">Сменить аккаунт</a>                 
-                <a href="{{ url_for('logout') }}"> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='log-out.png') }}" width="30" height="30" >Выйти</a>
-
-            </div>
-            <div class="separator"></div> 
-            <div class="menu-block">
-
-                <p>Тема: Светлая</p>
-                <p>Язык: Русский</p>
-                <p>Настройки</p>
-            
-            </div>
-        </div>
-    </div>
-    </body>
-<script>
-    const menuButton = document.getElementById('menu-button');
-    const menuOverlay = document.getElementById('menu-overlay');
-
-    menuButton.addEventListener('click', () => {
-        menuOverlay.classList.toggle('open');
-    });
-
-    menuOverlay.addEventListener('click', (event) => {
-        if (event.target === menuOverlay) {
-            menuOverlay.classList.remove('open');
-        }
-    });
-</script>
-</html>
\ No newline at end of file
diff --git a/src/templates/channel.html b/src/templates/channel.html
deleted file mode 100644
index b812aba..0000000
--- a/src/templates/channel.html
+++ /dev/null
@@ -1,162 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>{{ user.username }} Channel</title>
-    <link rel="stylesheet" href="{{ url_for('static', filename='channel_page.css') }}">
-    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-</head>
-<body>
-    <header>
-        <h1><a href="/">NeTube</a></h1> 
-        <nav>
-            {% if current_user %}
-                <form action="{{ url_for('upload_avatar', username=current_user.username) }}" method="POST" enctype="multipart/form-data" style="display: inline-block;">
-                    <label for="mini-avatar" id="menu-button"> 
-                        <img src="{{ url_for('serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('serve_avatars', filename='plus.png') }}" width="30" height="30" style="border-radius: 50%;object-fit: cover;">
-                    </label>
-                    <button id="menu-button" style="display: none;"></button>
-                </form>
-                <a>•</a>
-                <a href="/upload"> <img src="{{ url_for('serve_icons', filename='upload.png') }}" width="30" height="30"></a>
-                <a>•</a>
-                <a href="{{ url_for('logout') }}"> <img src="{{ url_for('serve_icons', filename='log-out.png') }}" width="30" height="30" ></a>
-            {% else %}
-                <a href="/login">
-                    <img src="{{ url_for('serve_avatars', filename='question.png') }}" width="30" height="30">
-                </a>
-            {% endif %}
-        </nav>
-    </header>
-
-    <div id="menu-overlay"> 
-        <div id="menu-content">
-            <div class="menu-block">
-                <div class="user-info">
-                    {% if current_user %}
-                        <form action="{{ url_for('upload_avatar', username=current_user.username) }}" method="POST" enctype="multipart/form-data" style="display: inline-block;">
-                            <label for="avatar" id="avatar-button"> 
-                                <img src="{{ url_for('serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('serve_avatars', filename='plus.png') }}" width="60" height="60" style="border-radius: 50%;object-fit: cover;">
-                            </label>
-                            <input type="file" id="avatar" name="avatar" style="display: none;">
-                        </form>
-                        <div class="user-details">
-                            <span class="username" >@{{ Markup(current_user.username) }}</span>
-                            <span class="subscribers" >{{ current_user.subscribers.count() }} подписчиков</span>
-                        </div> 
-                        <div class="vert-separator"></div>
-                        <a href="{{ url_for('channel', username=current_user.username) }}" style="color: rgb(0, 110, 255);">Перейти на канал</a>
-                    {% else %}
-                        <a href="/login">
-                            <img src="{{ url_for('serve_avatars', filename='question.png') }}" width="60" height="60">
-                        </a>
-                    {% endif %}
-                </div>
-            </div>
-            <div class="separator"></div> 
-            <div class="menu-block">
-                <a> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='changeuser.png') }}" width="30" height="30">Ваши данные на NeTube</a>
-                <a href="{{ url_for('login') }}"> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='switchacc.png') }}" width="30" height="30">Сменить аккаунт</a>                 
-                <a href="{{ url_for('logout') }}"> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='log-out.png') }}" width="30" height="30">Выйти</a>
-            </div>
-            <div class="separator"></div> 
-            <div class="menu-block">
-                <p>Тема: Светлая</p>
-                <p>Язык: Русский</p>
-                <p>Настройки</p>
-            </div>
-        </div>
-    </div>
-
-    <div class="channel-container">
-        <h2>@{{ Markup(user.username) }}</h2>
-        <p style="font-size: 12px;">{{ user.subscribers.count() }} подписчиков</p> 
-
-        {% if current_user and current_user.username != user.username %}
-            <button id="subscribe-button" data-user-id="{{ user.id }}">
-                {% if current_user and user in current_user.subscribed_to %}
-                    Отписаться
-                {% else %}
-                    Подписаться
-                {% endif %}
-            </button>
-        {% endif %}
-
-        <div class="video-container">
-            {% for video in videos %}
-                <div class="video-preview">
-                    <a href="{{ url_for('video', video_name=video.url) }}">
-                        <img src="{{ url_for('serve_thumbnails', filename=video.url[:-4] + '.jpg') }}" alt="{{ video.title }}" width="320" height="180">
-                    </a>
-                    <h3>
-                        <a href="{{ url_for('channel', username=video.author.username) }}">
-                            <img src="{{ url_for('serve_avatars', filename=video.author.avatar) if video.author.avatar else url_for('serve_avatars', filename='plus.png') }}"> 
-                        </a>
-                        {{ video.title }}
-                    </h3>
-                    <p><a href="{{ url_for('channel', username=video.author.username) }}" style="color: inherit; text-decoration: none;">@{{ Markup(video.author.username) }} • {{ video.views }} views • {{ video.likes }} Likes </a></p>
-                </div>
-            {% endfor %}
-        </div>
-    </div>
-</body>
-
-<script>
-    const menuButton = document.getElementById('menu-button');
-    const menuOverlay = document.getElementById('menu-overlay');
-    const subscribeButton = document.getElementById('subscribe-button');
-
-    menuButton.addEventListener('click', () => {
-        menuOverlay.classList.toggle('open');
-    });
-
-    menuOverlay.addEventListener('click', (event) => {
-        if (event.target === menuOverlay) {
-            menuOverlay.classList.remove('open');
-        }
-    });
-
-    document.getElementById('avatar').addEventListener('change', function() {
-        console.log("Файл выбран:", this.files[0].name);
-        handleAvatarChange(); 
-    });
-
-    function handleAvatarChange() {
-        const fileInput = document.getElementById('avatar');
-        const form = fileInput.closest('form'); 
-        if (fileInput.files && fileInput.files[0]) {
-            form.submit();
-        }
-    }
-
-    if (subscribeButton) {
-        subscribeButton.addEventListener('click', function() {
-            const userId = this.dataset.userId;
-            const isSubscribed = this.innerText === 'Отписаться';
-
-            fetch(isSubscribed ? `/unsubscribe/${userId}` : `/subscribe/${userId}`, {
-                method: 'POST'
-            })
-            .then(response => response.json())
-            .then(data => {
-                if (data.status === 'success') {
-                    subscribeButton.innerText = data.subscribed ? 'Отписаться' : 'Подписаться';
-
-                    // Обновляем количество подписчиков
-                    const subscribersSpan = document.querySelector('.channel-container .subscribers'); // Или другой селектор, если нужно
-                    if (subscribersSpan) {
-                        subscribersSpan.innerText = data.subscribers + ' подписчиков'; // Используем data.subscribers
-                    }
-                } else {
-                    console.error(data.message);
-                }
-            })
-            .catch(error => {
-                console.error('Ошибка:', error);
-            });
-        });
-    }
-</script>
-</html>
\ No newline at end of file
diff --git a/src/templates/index.html b/src/templates/index.html
deleted file mode 100644
index df780cb..0000000
--- a/src/templates/index.html
+++ /dev/null
@@ -1,166 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>NeTube</title>
-    <link rel="stylesheet" href="{{ url_for('static', filename='index_page.css') }}">
-    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"> 
-
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-
-    <style>
-        a {
-            text-decoration: none;
-            color: inherit;
-        }
-        a:hover, a:active {
-            text-decoration: none;
-            color: inherit;
-        }
-    </style>
-</head>
-<body>
-    <header>
-        <h1 style="text-align: center;">
-            <a href="/">NeTube</a>
-            <a style="vertical-align: top; font-size: 8px; color: #666; text-decoration: none" href="https://github.com/SL1dee36"><b>by Nazaryan ART</b></a>
-          </h1>
-        <form action="/" method="POST" class="search-container">
-            <input type="text" name="search_query" placeholder="Поиск...">
-            <button type="submit">Искать</button>
-        </form>
-
-        <nav>
-            {% if current_user %}
-            <form action="{{ url_for('upload_avatar', username=current_user.username) }}" method="POST" enctype="multipart/form-data" style="display: inline-block;">
-                <label for="mini-avatar" id="menu-button"> 
-                  <img src="{{ url_for('serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('serve_avatars', filename='plus.png') }}" style="border-radius: 50%;object-fit: cover;" width="30" height="30">
-                </label>
-                <button id="menu-button" style="display: none;"></button></form>
-                <a>•</a>
-                <a href="/upload"> <img src="{{ url_for('serve_icons', filename='upload.png') }}" width="30" height="30"></a>
-                <a>•</a>
-                <a href="{{ url_for('logout') }}"> <img src="{{ url_for('serve_icons', filename='log-out.png') }}" width="30" height="30" ></a>
-            
-            {% else %}
-                <a href="/login">
-                    <img src="{{ url_for('serve_avatars', filename='question.png') }}" width="30" height="30">
-                </a>
-            {% endif %}
-
-        </nav>
-    </header>
-
-    <div id="menu-overlay"> 
-        <div id="menu-content">
-            <div class="menu-block">
-                <div class="user-info">
-                    {% if current_user %}
-                    <form action="{{ url_for('upload_avatar', username=current_user.username) }}" method="POST" enctype="multipart/form-data" style="display: inline-block;">
-                        <label for="avatar" id="avatar-button"> 
-                          <img src="{{ url_for('serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('serve_avatars', filename='plus.png') }}" width="60" height="60"  style="border-radius: 50%;object-fit: cover;">
-                        </label>
-                        <input type="file" id="avatar" name="avatar" style="display: none;"></form>
-                            <div class="user-details">
-                                <span class="username" >@{{ Markup(current_user.username) }}</span>
-                                <span class="subscribers" >{{ current_user.subscribers.count() }} подписчиков</span>
-                            </div> 
-                            <div class="vert-separator"></div>
-                            <a href="{{ url_for('channel', username=current_user.username) }}" style="color: rgb(0, 110, 255);">Перейти на канал</a>
-                        </p>
-
-                    {% else %}
-                        <a href="/login">
-                            <img src="{{ url_for('serve_avatars', filename='question.png') }}" width="60" height="60">
-                        </a>
-                    {% endif %}
-                </div>
-
-            </div>
-            <div class="separator"></div> 
-            <div class="menu-block">
-
-                <a> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='changeuser.png') }}" width="30" height="30">Ваши данные на NeTube</a>
-                <a href="{{ url_for('login') }} "> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='switchacc.png') }}" width="30" height="30">Сменить аккаунт</a>                 
-                <a href="{{ url_for('logout') }}"> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='log-out.png') }}" width="30" height="30" >Выйти</a>
-
-            </div>
-            <div class="separator"></div> 
-            <div class="menu-block">
-
-                <p>Тема: Светлая</p>
-                <p>Язык: Русский</p>
-                <p>Настройки</p>
-            
-            </div>
-        </div>
-    </div>
-
-    {% if search_results %}
-        <h2>Результаты поиска:</h2>
-        <div class="video-container">
-            {% for video in search_results %}
-            <div class="video-preview">
-                <a href="{{ url_for('video', video_name=search_results.url) }}">
-                    <img src="{{ url_for('serve_thumbnails', filename=search_results.url[:-4] + '.jpg') }}" alt="{{ search_results.title }}" width="320" height="180">
-                </a>
-                <h3>
-                    <a href="{{ url_for('channel', username=search_results.author.username) }}">
-                        <img src="{{ url_for('serve_avatars', filename=search_results.author.avatar) if search_results.author.avatar else url_for('serve_avatars', filename='plus.png') }}"> 
-                    </a>
-                    {{ video.title }}
-                </h3>
-                <p><a href="{{ url_for('channel', username=video.author.username) }}"  style="color: inherit; text-decoration: none;" >@{{ Markup(video.author.username) }} • {{ video.views }} views • {{ video.likes }} Likes </a></p>
-            </div>
-            {% endfor %}
-        </div>
-    {% else %}
-        <div class="video-container">
-            {% for video in videos %}
-            <div class="video-preview">
-                <a href="{{ url_for('video', video_name=video.url) }}">
-                    <img src="{{ url_for('serve_thumbnails', filename=video.url[:-4] + '.jpg') }}" alt="{{ video.title }}" width="320" height="180">
-                </a>
-                <h3>
-                    <a href="{{ url_for('channel', username=video.author.username) }}">
-                        <img src="{{ url_for('serve_avatars', filename=video.author.avatar) if video.author.avatar else url_for('serve_avatars', filename='plus.png') }}"> 
-                    </a>
-                    {{ video.title }}
-                </h3>
-                <p><a href="{{ url_for('channel', username=video.author.username) }}"  style="color: inherit; text-decoration: none;" >@{{ Markup(video.author.username) }} • {{ video.views }} views • {{ video.likes }} Likes </a></p>
-            </div>
-            {% endfor %}
-        </div>
-    {% endif %}
-
-    
-</body>
-<script>
-    const menuButton = document.getElementById('menu-button');
-    const menuOverlay = document.getElementById('menu-overlay');
-
-    menuButton.addEventListener('click', () => {
-        menuOverlay.classList.toggle('open');
-    });
-
-    menuOverlay.addEventListener('click', (event) => {
-        if (event.target === menuOverlay) {
-            menuOverlay.classList.remove('open');
-        }
-    });
-
-    document.getElementById('avatar').addEventListener('change', function() {
-        console.log("Файл выбран:", this.files[0].name);
-        handleAvatarChange(); // Вызываем функцию, чтобы отправить форму
-    });
-
-    function handleAvatarChange() {
-        const fileInput = document.getElementById('avatar');
-        const form = fileInput.closest('form'); 
-        if (fileInput.files && fileInput.files[0]) {
-            form.submit();
-        }
-    }
-</script>
-</html>
\ No newline at end of file
diff --git a/src/templates/login.html b/src/templates/login.html
deleted file mode 100644
index 17c5f29..0000000
--- a/src/templates/login.html
+++ /dev/null
@@ -1,24 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Вход</title>
-    <link rel="stylesheet" href="{{ url_for('static', filename='auth_page.css') }}">
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-</head>
-<body>
-    
-    <h1>Вход</h1>
-    {% if error %}
-        <p>{{ error }}</p>
-    {% endif %}
-    <form action="/login" method="post">
-        <input type="text" name="username" placeholder="Имя пользователя">
-        <input type="password" name="password" placeholder="Пароль">
-        <button type="submit">Войти</button>
-
-        <p>Нет аккаунта? <a href="/register">Зарегистрируйтесь</a></p>
-    </form>
-</body>
-</html>
\ No newline at end of file
diff --git a/src/templates/register.html b/src/templates/register.html
deleted file mode 100644
index 3fc93a1..0000000
--- a/src/templates/register.html
+++ /dev/null
@@ -1,24 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Регистрация</title>
-    <link rel="stylesheet" href="{{ url_for('static', filename='auth_page.css') }}">
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-</head>
-<body>
-    <h1>Регистрация</h1>
-        {% if error %}
-            <p>{{ error }}</p>
-        {% endif %}
-    <form action="/register" method="post">
-        
-        <input type="text" name="username" placeholder="Имя пользователя">
-        <input type="password" name="password" placeholder="Пароль">
-        <button type="submit">Зарегистрироваться</button>
-
-        <p>Уже есть аккаунт? <a href="/login">Войдите</a></p>
-    </form>
-</body>
-</html>
\ No newline at end of file
diff --git a/src/templates/upload.html b/src/templates/upload.html
deleted file mode 100644
index 76e25d3..0000000
--- a/src/templates/upload.html
+++ /dev/null
@@ -1,115 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="{{ url_for('static', filename='upload_page.css') }}">
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-    <title>Загрузить видео</title>
-</head>
-
-<body>
-    <header>
-        <h1><a href="/">NeTube</a></h1>
-        <nav>
-            {% if current_user %}
-                <!-- <a href="{{ url_for('channel', username=current_user.username) }}">
-                    <img src="{{ url_for('serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('serve_avatars', filename='plus.png') }}" alt="Аватар" width="30" height="30">
-                </a> -->
-                <!-- <a href="{{ url_for('channel', username=current_user.username) }}">Профиль</a> -->
-
-                <a href="/upload"> <img src="{{ url_for('serve_icons', filename='upload.png') }}" width="30" height="30"></a>
-                <a>•</a>
-                <a href="{{ url_for('logout') }}"> <img src="{{ url_for('serve_icons', filename='log-out.png') }}" width="30" height="30"></a>
-            {% else %}
-                <a href="/login">
-                    <img src="{{ url_for('serve_avatars', filename='question.png') }}" width="30" height="30">
-                </a>
-            {% endif %}
-        </nav>
-    </header>
-
-    <main>
-      <form action="/upload" method="post" enctype="multipart/form-data" id="upload-form">
-        <h1>Загрузить видео</h1>
-
-        <label for="title">Название видео:</label>
-        <input type="text" id="title" name="title" placeholder="Введите название видео">
-
-        <label for="description">Описание:</label>
-        <textarea id="description" name="description" placeholder="Добавьте описание видео"></textarea>
-        <p id="description-count">0 / 500</p>
-        <p id="description-warning" style="color: red; display: none;">Предупреждение: Длина описания превышает 500 символов.</p>
-
-        <input type="file" name="file">
-
-        <button type="submit" id="upload-button">Загрузить</button>
-      </form>
-    </main>
-
-    <div id="loading-overlay" class="loading-animation" style="display: none;">
-        <div class="loading-spinner"></div>
-    </div>
-
-    <script>
-        const descriptionInput = document.getElementById('description');
-        const descriptionCount = document.getElementById('description-count');
-        const descriptionWarning = document.getElementById('description-warning');
-        const uploadButton = document.getElementById('upload-button');
-        const uploadForm = document.getElementById('upload-form');
-        const loadingOverlay = document.getElementById('loading-overlay');
-
-        descriptionInput.addEventListener('input', () => {
-            const currentLength = descriptionInput.value.length;
-            descriptionCount.textContent = `${currentLength} / 500`;
-
-            if (currentLength > 500) {
-                descriptionWarning.style.display = 'block';
-            } else {
-                descriptionWarning.style.display = 'none';
-            }
-        });
-
-        uploadButton.addEventListener('click', (event) => { 
-            event.preventDefault(); // Предотвращаем стандартную отправку формы
-            loadingOverlay.style.display = 'flex';
-            uploadForm.submit();
-        });
-
-        uploadForm.addEventListener('submit', () => { 
-            loadingOverlay.style.display = 'none'; 
-        });
-    </script>
-
-    <style>
-        .loading-animation {
-            position: fixed;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            background-color: rgba(0, 0, 0, 0.5);
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            z-index: 1000;
-        }
-
-        .loading-spinner {
-            width: 60px;
-            height: 60px;
-            border: 5px solid #ccc;
-            border-radius: 50%;
-            border-top-color: #007bff;
-            animation: spin 1s linear infinite;
-        }
-
-        @keyframes spin {
-            0% { transform: rotate(0deg); }
-            100% { transform: rotate(360deg); }
-        }
-    </style>
-
-</body>
-</html>
\ No newline at end of file
diff --git a/src/templates/video.html b/src/templates/video.html
deleted file mode 100644
index ce0a58d..0000000
--- a/src/templates/video.html
+++ /dev/null
@@ -1,258 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>{{ video.title }}</title>
-    <link rel="stylesheet" href="{{ url_for('static', filename='video_page.css') }}">
-    <link rel="stylesheet" href="{{ url_for('static', filename='channel_page.css') }}">
-    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-</head>
-<body>
-    <header>
-        <h1><a href="/">NeTube</a></h1> 
-        <nav>
-            {% if current_user %}
-                <form action="{{ url_for('upload_avatar', username=current_user.username) }}" method="POST" enctype="multipart/form-data" style="display: inline-block;">
-                    <label for="mini-avatar" id="menu-button"> 
-                        <img src="{{ url_for('serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('serve_avatars', filename='plus.png') }}" width="30" height="30" style="border-radius: 50%;object-fit: cover;">
-                    </label>
-                    <button id="menu-button" style="display: none;"></button>
-                </form>
-                <a>•</a>
-                <a href="/upload"> <img src="{{ url_for('serve_icons', filename='upload.png') }}" width="30" height="30"></a>
-                <a>•</a>
-                <a href="{{ url_for('logout') }}"> <img src="{{ url_for('serve_icons', filename='log-out.png') }}" width="30" height="30" ></a>
-            {% else %}
-                <a href="/login">
-                    <img src="{{ url_for('serve_avatars', filename='question.png') }}" width="30" height="30">
-                </a>
-            {% endif %}
-        </nav>
-    </header>
-
-    <div id="menu-overlay"> 
-        <div id="menu-content">
-            <div class="menu-block">
-                <div class="user-info">
-                    {% if current_user %}
-                        <form action="{{ url_for('upload_avatar', username=current_user.username) }}" method="POST" enctype="multipart/form-data" style="display: inline-block;">
-                            <label for="avatar" id="avatar-button"> 
-                                <img src="{{ url_for('serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('serve_avatars', filename='plus.png') }}" width="60" height="60" style="border-radius: 50%;object-fit: cover;">
-                            </label>
-                            <input type="file" id="avatar" name="avatar" style="display: none;">
-                        </form>
-                        <div class="user-details">
-                            <span class="username" >@{{ Markup(current_user.username) }}</span>
-                            <span class="subscribers" >{{ current_user.subscribers.count() }} подписчиков</span>
-                        </div> 
-                        <div class="vert-separator"></div>
-                        <a href="{{ url_for('channel', username=current_user.username) }}" style="color: rgb(0, 110, 255);">Перейти на канал</a>
-                    {% else %}
-                        <a href="/login">
-                            <img src="{{ url_for('serve_avatars', filename='question.png') }}" width="60" height="60">
-                        </a>
-                    {% endif %}
-                </div>
-            </div>
-            <div class="separator"></div> 
-            <div class="menu-block">
-                <a> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='changeuser.png') }}" width="30" height="30">Ваши данные на NeTube</a>
-                <a href="{{ url_for('login') }}"> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='switchacc.png') }}" width="30" height="30">Сменить аккаунт</a>                 
-                <a href="{{ url_for('logout') }}"> <img style="margin-right: 15px;" src="{{ url_for('serve_icons', filename='log-out.png') }}" width="30" height="30">Выйти</a>
-            </div>
-            <div class="separator"></div> 
-            <div class="menu-block">
-                <p>Тема: Светлая</p>
-                <p>Язык: Русский</p>
-                <p>Настройки</p>
-            </div>
-        </div>
-    </div>
-
-    <div class="main-container">
-        <div class="video-section">
-            <div class="video-info">
-                <video id="NeTubeVideoPlayer" width="1280" height="720" controls>
-                    <source src="{{ url_for('serve_videos', filename=video.url) }}" type="video/mp4">
-                    Your browser does not support the video tag.
-                </video>
-                <h2>{{ video.title }}</h2>
-                <div class="author-info">
-                    <a href="{{ url_for('channel', username=video.author.username) }}">
-                        <img src="{{ url_for('serve_avatars', filename=video.author.avatar) if video.author.avatar else url_for('serve_avatars', filename='plus.png') }}" alt="Аватар автора" width="30" height="30" style="border-radius: 50%;object-fit: cover;">
-                        <a style="flex-direction: column; text-align: left;" href="{{ url_for('channel', username=video.author.username) }}">@{{ Markup(video.author.username) }} 
-                            <span style="font-size: 12px;">{{ video.author.subscribers.count() }} подписчиков</span>
-                        </a>
-                    </a>
-
-                    {% if current_user != video.author %}
-                        <button id="subscribe-button" style="margin-right: 30px;" data-user-id="{{ video.author.id }}">
-                            {% if current_user and video.author in current_user.subscribed_to %}
-                                Отписаться
-                            {% else %}
-                                Подписаться
-                            {% endif %}
-                        </button>
-                    {% endif %}
-
-                    <p style="width: auto;min-width: 100px;
-                    text-align: center;margin-left: 15px;margin-right: 15px; 
-                    border-radius: 50px; background-color: #bdbdbd9f; 
-                    padding: 5px;height: 20px;text-align: center;">
-                    
-                        {{ video.views }} views </p>
-
-                    <div class="likes-dislikes" >
-                        <a href="{{ url_for('like_video', video_name=video.url) }}">
-                            <button style="width: auto;max-width: 200px;min-width: 80px;; border-top-left-radius: 50px; border-bottom-left-radius: 50px; background-color: #bdbdbd9f; padding: 5px;" 
-                            class="like-button">
-                                <img src="{{ url_for('serve_icons', filename='like.png') }}" 
-                                width="18" height="18" style="margin-right: 15px; margin-left: 5px;"> {{ video.likes }}
-                            </button>
-                        </a>
-                        <a href="{{ url_for('dislike_video', video_name=video.url) }}">
-                            <div class="vert-separator" style="background-color: #b6b6b6; height: 30px;"></div>
-                            <button class="dislike-button" 
-                            style="border-top-right-radius: 50px; border-bottom-right-radius: 50px; background-color: #bdbdbd9f; padding: 5px;"> 
-                                <!-- {{ video.dislikes }}  -->
-                                <img style="margin-left: 5px; margin-right: 5px;" src="{{ url_for('serve_icons', filename='dislike.png') }}" 
-                                width="18" height="18">
-                            </button>
-                        </a>
-                    </div>
-                    
-                </div>
-                <p class="description">{{ video.description }}<button class="show-more">...ещё</button></p>
-
-                <div class="comments">
-
-                    <form action="{{ url_for('add_comment', video_name=video.url) }}" method="post">
-                        <textarea style="width: 100%;height: auto;min-width: 100%;max-width: 100%;min-height: 20px;border: none; background-color: transparent;border-bottom: 1px solid #ccc; " name="content" placeholder="Оставьте комментарий"></textarea>
-                        <button style="cursor: pointer;width: 100px;height: auto;border-radius: 50px;border: none;padding: 5px; background-color: #bdbdbd9f;" type="submit">Отправить</button>
-                    </form>
-
-                
-                    <h3>Комментарии</h3>
-                    <ul>
-                        {% for comment in video.comments %}
-                        <li class="comment-item">
-                            <a href="{{ url_for('channel', username=comment.user.username) }}">
-                                <img src="{{ url_for('serve_avatars', filename=comment.user.avatar) if comment.user.avatar else url_for('serve_avatars', filename='plus.png') }}" 
-                                     alt="Аватар автора" width="30" height="30" style="border-radius: 50%;object-fit: cover;">
-                            </a>
-                            <div class="comment-content">
-                                <a href="{{ url_for('channel', username=comment.user.username) }}">
-                                    @{{ Markup(comment.user.username) }}
-                                </a>
-                                <span style="color: #4d4d4d;">{{ comment.content }}</span>
-                            </div>
-                        </li>
-                        {% endfor %}
-                    </ul>
-                </div> 
-            </div>
-        </div>
-
-        <div class="related-videos" style="display: none;">
-            <h2>Другие видео</h2>
-            <ul>
-                {% for related_video in related_videos %}
-                    <li>
-                        <a href="{{ url_for('video', video_name=related_video.url) }}">
-                            <img src="{{ url_for('serve_thumbnails', filename=related_video.url[:-4] + '.jpg') }}" alt="{{ related_video.title }}" width="180" height="150">
-                        </a>
-                        <div>
-                            <a href="{{ url_for('video', video_name=related_video.url) }}">
-                                <span><b>{{ related_video.title }}</b></span>
-                            </a>
-    
-                            <p style="color:#242424;font-size: small;"><br><a href="{{ url_for('channel', username=related_video.author.username) }}">@{{ Markup(related_video.author.username) }} • {{ related_video.views }} views </a></p>
-                        </div>
-                    </li>
-                {% endfor %}
-            </ul>
-        </div>
-    </div>
-
-    <script>
-        const menuButton = document.getElementById('menu-button');
-        const menuOverlay = document.getElementById('menu-overlay');
-        const subscribeButton = document.getElementById('subscribe-button');
-    
-        menuButton.addEventListener('click', () => {
-            menuOverlay.classList.toggle('open');
-        });
-    
-        menuOverlay.addEventListener('click', (event) => {
-            if (event.target === menuOverlay) {
-                menuOverlay.classList.remove('open');
-            }
-        });
-    
-        document.querySelector('.show-more').addEventListener('click', function() {
-            const description = document.querySelector('.description');
-            description.classList.toggle('expanded');
-            this.textContent = description.classList.contains('expanded') ? 'Свернуть' : '...ещё';
-        });
-    
-        document.getElementById('avatar').addEventListener('change', function() {
-            console.log("Файл выбран:", this.files[0].name);
-            handleAvatarChange(); 
-        });
-    
-        function handleAvatarChange() {
-            const fileInput = document.getElementById('avatar');
-            const form = fileInput.closest('form'); 
-            if (fileInput.files && fileInput.files[0]) {
-                form.submit();
-            }
-        }
-    
-        subscribeButton.addEventListener('click', function() {
-            const userId = this.dataset.userId;
-            const isSubscribed = this.innerText === 'Отписаться';
-    
-            fetch(isSubscribed ? `/unsubscribe/${userId}` : `/subscribe/${userId}`, {
-                method: 'POST'
-            })
-            .then(response => response.json())
-            .then(data => {
-                if (data.status === 'success') {
-                    subscribeButton.innerText = data.subscribed ? 'Отписаться' : 'Подписаться';
-
-                    // Обновляем количество подписчиков
-                    const subscribersSpan = document.querySelector('.author-info .subscribers'); // Или другой селектор, если нужно
-                    if (subscribersSpan) {
-                        subscribersSpan.innerText = '{{ video.author.subscribers.count() }} подписчиков'; // Используем data.subscribers
-                    }
-
-                    location.reload(); // Перезагрузка страницы
-
-                } else {
-                    console.error(data.message);
-                }
-            })
-            .catch(error => {
-                console.error('Ошибка:', error);
-            });
-        });
-    
-        // Скрываем "Другие видео" на больших экранах
-        const relatedVideos = document.querySelector('.related-videos');
-        const relatedVideosMobile = document.querySelector('.related-videos-mobile');
-        
-        window.addEventListener('resize', function() {
-            if (window.innerWidth >= 1080) {
-                relatedVideos.style.display = 'block'; 
-                relatedVideosMobile.style.display = 'none'; 
-            } else {
-                relatedVideos.style.display = 'none'; 
-                relatedVideosMobile.style.display = 'block'; 
-            }
-        });
-
-    </script>
-</body>
-</html>
\ No newline at end of file
diff --git a/src/static/avatars/changeuser.png b/static/avatars/changeuser.png
similarity index 100%
rename from src/static/avatars/changeuser.png
rename to static/avatars/changeuser.png
diff --git a/src/static/avatars/dislike.png b/static/avatars/dislike.png
similarity index 100%
rename from src/static/avatars/dislike.png
rename to static/avatars/dislike.png
diff --git a/src/static/avatars/exit.png b/static/avatars/exit.png
similarity index 100%
rename from src/static/avatars/exit.png
rename to static/avatars/exit.png
diff --git a/src/static/avatars/like.png b/static/avatars/like.png
similarity index 100%
rename from src/static/avatars/like.png
rename to static/avatars/like.png
diff --git a/src/static/avatars/log-out.png b/static/avatars/log-out.png
similarity index 100%
rename from src/static/avatars/log-out.png
rename to static/avatars/log-out.png
diff --git a/src/static/avatars/persdata.png b/static/avatars/persdata.png
similarity index 100%
rename from src/static/avatars/persdata.png
rename to static/avatars/persdata.png
diff --git a/src/static/avatars/plus.png b/static/avatars/plus.png
similarity index 100%
rename from src/static/avatars/plus.png
rename to static/avatars/plus.png
diff --git a/src/static/avatars/question.png b/static/avatars/question.png
similarity index 100%
rename from src/static/avatars/question.png
rename to static/avatars/question.png
diff --git a/src/static/avatars/switchacc.png b/static/avatars/switchacc.png
similarity index 100%
rename from src/static/avatars/switchacc.png
rename to static/avatars/switchacc.png
diff --git a/src/static/avatars/upload.png b/static/avatars/upload.png
similarity index 100%
rename from src/static/avatars/upload.png
rename to static/avatars/upload.png
diff --git a/static/avatars/users/Listex2_avatar.jpg b/static/avatars/users/Listex2_avatar.jpg
new file mode 100644
index 0000000..736667e
Binary files /dev/null and b/static/avatars/users/Listex2_avatar.jpg differ
diff --git a/static/avatars/users/Listex_avatar.jpg b/static/avatars/users/Listex_avatar.jpg
new file mode 100644
index 0000000..736667e
Binary files /dev/null and b/static/avatars/users/Listex_avatar.jpg differ
diff --git a/static/avatars/users/Listex_avatar.png b/static/avatars/users/Listex_avatar.png
new file mode 100644
index 0000000..f398bbb
Binary files /dev/null and b/static/avatars/users/Listex_avatar.png differ
diff --git a/src/static/avatars/users/Slidee36_avatar.png b/static/avatars/users/Slidee36_avatar.png
similarity index 100%
rename from src/static/avatars/users/Slidee36_avatar.png
rename to static/avatars/users/Slidee36_avatar.png
diff --git a/src/static/avatars/users/plus.png b/static/avatars/users/plus.png
similarity index 100%
rename from src/static/avatars/users/plus.png
rename to static/avatars/users/plus.png
diff --git a/src/static/avatars/users/question.png b/static/avatars/users/question.png
similarity index 100%
rename from src/static/avatars/users/question.png
rename to static/avatars/users/question.png
diff --git a/static/css/video_player.css b/static/css/video_player.css
new file mode 100644
index 0000000..19e493e
--- /dev/null
+++ b/static/css/video_player.css
@@ -0,0 +1,41 @@
+#settingsMenu {
+    border: 1px solid rgba(255, 255, 255, 0.2);
+}
+/* Контейнер плеера */
+#videoPlayerContainer {
+    position: relative;
+    width: 100%;
+    height: 600px; /* Высота для обычного режима */
+    background: black; /* Черный фон для черных полос */
+    overflow: hidden;
+}
+
+/* Видео */
+#NeTubeVideoPlayer {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 100%;
+    height: 100%;
+    object-fit: contain; /* Сохранение соотношения сторон */
+}
+
+/* Полноэкранный режим */
+#videoPlayerContainer.fullscreen {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    height: 100vh; /* Высота во весь экран */
+    z-index: 9999; /* Положение поверх других элементов */
+    margin: 0;
+    padding: 0;
+    background: black;
+}
+
+#NeTubeVideoPlayer.fullscreen {
+    width: 100%;
+    height: 100%;
+    object-fit: contain; /* Сохранение соотношения сторон в полноэкранном режиме */
+}
diff --git a/static/js/subscribe_handler.js b/static/js/subscribe_handler.js
new file mode 100644
index 0000000..67c5f30
--- /dev/null
+++ b/static/js/subscribe_handler.js
@@ -0,0 +1,35 @@
+document.querySelector('#subscribe-button').addEventListener('click', function() {
+    const userId = this.dataset.userId;
+    const isSubscribed = this.innerText === 'Отписаться';
+
+    fetch(isSubscribed ? `/api/unsubscribe/${userId}` : `/api/subscribe/${userId}`, {
+        method: 'POST'
+    })
+    .then(response => response.json())
+    .then(data => {
+        if (data.status === 'success') {
+            // Обновляем текст кнопки и ее цвет в зависимости от состояния подписки
+            this.innerText = data.subscribed ? 'Отписаться' : 'Подписаться';
+
+            // Обновляем цвет кнопки
+            if (data.subscribed) {
+                this.classList.add('bg-gray-200', 'text-gray-600', 'border-gray-300');
+                this.classList.remove('bg-red-500', 'text-white', 'border-red-500');
+            } else {
+                this.classList.add('bg-red-500', 'text-white', 'border-red-500');
+                this.classList.remove('bg-gray-200', 'text-gray-600', 'border-gray-300');
+            }
+
+            // Обновляем количество подписчиков
+            const subscribersSpans = document.querySelectorAll('.subscribers');
+            subscribersSpans.forEach(span => {
+                span.innerText = data.subscribers + ' подписчиков';
+            });
+        } else {
+            console.error(data.message);
+        }
+    })
+    .catch(error => {
+        console.error('Ошибка:', error);
+    });
+});
diff --git a/static/js/video_player.js b/static/js/video_player.js
new file mode 100644
index 0000000..c098d51
--- /dev/null
+++ b/static/js/video_player.js
@@ -0,0 +1,124 @@
+// Get references to DOM elements
+const video = document.getElementById('NeTubeVideoPlayer');
+const playPauseButton = document.getElementById('playPause');
+const muteUnmuteButton = document.getElementById('muteUnmute');
+const fullscreenButton = document.getElementById('fullscreen');
+const videoPlayerContainer = document.getElementById('videoPlayerContainer');
+const seekBar = document.getElementById('seekBar');
+const volumeSlider = document.getElementById('volume');
+const volumeText = document.getElementById('volumeText');
+const currentTimeDisplay = document.getElementById('currentTime');
+const durationDisplay = document.getElementById('duration');
+const pipButton = document.getElementById('pip');
+const settingsButton = document.getElementById('settings');
+const settingsMenu = document.getElementById('settingsMenu');
+const speedSelect = document.getElementById('speed');
+const autoplayCheckbox = document.getElementById('autoplay');
+
+// Play or pause video
+const updatePlayPauseButton = () => {
+    playPauseButton.innerHTML = video.paused ? '<i class="fas fa-play"></i>' : '<i class="fas fa-pause"></i>';
+};
+
+playPauseButton.addEventListener('click', () => {
+    video.paused ? video.play() : video.pause();
+});
+
+
+video.addEventListener('click', () => {
+    if (video.paused) {
+        video.play();
+        playPauseButton.innerHTML = '<i class="fas fa-pause"></i>';
+    } else {
+        video.pause();
+        playPauseButton.innerHTML = '<i class="fas fa-play"></i>';
+    }
+});
+
+
+video.addEventListener('play', updatePlayPauseButton);
+video.addEventListener('pause', updatePlayPauseButton);
+
+// Mute or unmute video
+muteUnmuteButton.addEventListener('click', () => {
+    video.muted = !video.muted;
+    muteUnmuteButton.innerHTML = video.muted ? '<i class="fas fa-volume-mute"></i>' : '<i class="fas fa-volume-up"></i>';
+    volumeSlider.value = video.muted ? 0 : video.volume;
+    volumeText.innerText = Math.round(video.volume * 100);
+});
+
+// Fullscreen mode
+fullscreenButton.addEventListener('click', () => {
+    if (!document.fullscreenElement) {
+        videoPlayerContainer.requestFullscreen().catch(err => {
+            console.log("Error attempting to enable full-screen mode:", err);
+        });
+        fullscreenButton.innerHTML = '<i class="fas fa-compress"></i>'; // Иконка для выхода из полноэкранного режима
+    } else {
+        document.exitFullscreen();
+        fullscreenButton.innerHTML = '<i class="fas fa-expand"></i>'; // Иконка для входа в полноэкранный режим
+    }
+});
+
+document.addEventListener('fullscreenchange', () => {
+    if (document.fullscreenElement) {
+        videoPlayerContainer.classList.add('fullscreen');
+        document.body.style.overflow = 'hidden'; // Предотвращение прокрутки
+    } else {
+        videoPlayerContainer.classList.remove('fullscreen');
+        document.body.style.overflow = ''; // Восстановление прокрутки
+    }
+});
+// Picture-in-Picture mode
+pipButton.addEventListener('click', async () => {
+    if (document.pictureInPictureElement) {
+        await document.exitPictureInPicture();
+    } else if (video.requestPictureInPicture) {
+        await video.requestPictureInPicture();
+    }
+});
+
+// Toggle visibility of settings menu
+settingsButton.addEventListener('click', () => {
+    settingsMenu.classList.toggle('hidden');
+});
+
+// Change playback speed
+speedSelect.addEventListener('change', (event) => {
+    video.playbackRate = parseFloat(event.target.value);
+});
+
+// Toggle autoplay
+autoplayCheckbox.addEventListener('change', (event) => {
+    video.loop = event.target.checked;
+});
+
+// Update seek bar and current time
+video.addEventListener('timeupdate', () => {
+    seekBar.value = (video.currentTime / video.duration) * 100;
+    currentTimeDisplay.textContent = formatTime(video.currentTime);
+});
+
+// Seek video when seek bar changes
+seekBar.addEventListener('input', () => {
+    video.currentTime = (seekBar.value / 100) * video.duration;
+});
+
+// Update volume
+volumeSlider.addEventListener('input', () => {
+    video.volume = volumeSlider.value;
+    muteUnmuteButton.innerHTML = video.volume === 0 ? '<i class="fas fa-volume-mute"></i>' : '<i class="fas fa-volume-up"></i>';
+    volumeText.innerText = Math.round(video.volume * 100);
+});
+
+// Display video duration
+video.addEventListener('loadedmetadata', () => {
+    durationDisplay.textContent = formatTime(video.duration);
+});
+
+// Format time in MM:SS
+function formatTime(time) {
+    const minutes = Math.floor(time / 60).toString().padStart(2, '0');
+    const seconds = Math.floor(time % 60).toString().padStart(2, '0');
+    return `${minutes}:${seconds}`;
+}
diff --git a/static/thumbnails/3agjcnYUdH.jpg b/static/thumbnails/3agjcnYUdH.jpg
new file mode 100644
index 0000000..0947303
Binary files /dev/null and b/static/thumbnails/3agjcnYUdH.jpg differ
diff --git a/src/static/thumbnails/R8OCDOIyLO.jpg b/static/thumbnails/R8OCDOIyLO.jpg
similarity index 100%
rename from src/static/thumbnails/R8OCDOIyLO.jpg
rename to static/thumbnails/R8OCDOIyLO.jpg
diff --git a/src/static/thumbnails/h4uZGGbqMw.jpg b/static/thumbnails/h4uZGGbqMw.jpg
similarity index 100%
rename from src/static/thumbnails/h4uZGGbqMw.jpg
rename to static/thumbnails/h4uZGGbqMw.jpg
diff --git a/src/static/thumbnails/ppieSeyay3.jpg b/static/thumbnails/ppieSeyay3.jpg
similarity index 100%
rename from src/static/thumbnails/ppieSeyay3.jpg
rename to static/thumbnails/ppieSeyay3.jpg
diff --git a/static/videos/0P5xmwY0TP.mp4 b/static/videos/0P5xmwY0TP.mp4
new file mode 100644
index 0000000..40ad26f
Binary files /dev/null and b/static/videos/0P5xmwY0TP.mp4 differ
diff --git a/static/videos/3agjcnYUdH.mp4 b/static/videos/3agjcnYUdH.mp4
new file mode 100644
index 0000000..40ad26f
Binary files /dev/null and b/static/videos/3agjcnYUdH.mp4 differ
diff --git a/src/static/videos/R8OCDOIyLO.mp4 b/static/videos/R8OCDOIyLO.mp4
similarity index 100%
rename from src/static/videos/R8OCDOIyLO.mp4
rename to static/videos/R8OCDOIyLO.mp4
diff --git a/static/videos/SyjpHkA0mC.mp4 b/static/videos/SyjpHkA0mC.mp4
new file mode 100644
index 0000000..40ad26f
Binary files /dev/null and b/static/videos/SyjpHkA0mC.mp4 differ
diff --git a/static/videos/bOnvU5h2pO.mp4 b/static/videos/bOnvU5h2pO.mp4
new file mode 100644
index 0000000..40ad26f
Binary files /dev/null and b/static/videos/bOnvU5h2pO.mp4 differ
diff --git a/static/videos/eNdSoHYu31.mp4 b/static/videos/eNdSoHYu31.mp4
new file mode 100644
index 0000000..40ad26f
Binary files /dev/null and b/static/videos/eNdSoHYu31.mp4 differ
diff --git a/static/videos/hRHe8uHVrJ.mp4 b/static/videos/hRHe8uHVrJ.mp4
new file mode 100644
index 0000000..716592b
Binary files /dev/null and b/static/videos/hRHe8uHVrJ.mp4 differ
diff --git a/static/videos/jMvIoNB1f3.mp4 b/static/videos/jMvIoNB1f3.mp4
new file mode 100644
index 0000000..40ad26f
Binary files /dev/null and b/static/videos/jMvIoNB1f3.mp4 differ
diff --git a/src/templates/admin_login.html b/templates/admin/admin_login.html
similarity index 97%
rename from src/templates/admin_login.html
rename to templates/admin/admin_login.html
index efabc87..75ebaf2 100644
--- a/src/templates/admin_login.html
+++ b/templates/admin/admin_login.html
@@ -1,19 +1,19 @@
-<!-- src/templates/admin_login.html -->
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <title>Вход в панель администрирования</title>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
-        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-    </head>
-<body>
-    <h1>Вход в панель администрирования</h1>
-    <form method="post">
-        <label for="admin_key">Секретный ключ:</label>
-        <input type="password" id="admin_key" name="admin_key" required>
-        <button type="submit">Войти</button>
-    </form>
-</body>
+<!-- src/templates/admin_login.html -->
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>Вход в панель администрирования</title>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
+        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
+    </head>
+<body>
+    <h1>Вход в панель администрирования</h1>
+    <form method="post">
+        <label for="admin_key">Секретный ключ:</label>
+        <input type="password" id="admin_key" name="admin_key" required>
+        <button type="submit">Войти</button>
+    </form>
+</body>
 </html>
\ No newline at end of file
diff --git a/src/templates/administration.html b/templates/admin/administration.html
similarity index 97%
rename from src/templates/administration.html
rename to templates/admin/administration.html
index 5e5fd63..4d55d1a 100644
--- a/src/templates/administration.html
+++ b/templates/admin/administration.html
@@ -1,34 +1,34 @@
-<!-- src/templates/Administration.html -->
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <title>Страница администрирования</title>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
-        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-    </head>
-<body>
-    <h1>Панель администрирования</h1>
-
-    <h2>Пользователи:</h2>
-    <ul>
-        {% for user in users %}
-            <li>
-                <a href="{{ url_for('channel', username=user.username) }}">{{ user.username }}</a> 
-                <a href="{{ url_for('edit_user', user_id=user.id) }}"><img src="{{ url_for('static', filename='edit.png') }}" alt="Редактировать" width="20"></a> 
-            </li>
-        {% endfor %}
-    </ul>
-
-    <h2>Видео:</h2>
-    <ul>
-        {% for video in videos %}
-            <li>
-                {{ video.title }} (автор: <a href="{{ url_for('channel', username=video.author.username) }}">{{ video.author.username }}</a>) 
-                <a href="{{ url_for('edit_video', video_id=video.id) }}"><img src="{{ url_for('static', filename='edit.png') }}" alt="Редактировать" width="20"></a> 
-            </li>
-        {% endfor %}
-    </ul>
-</body>
+<!-- src/templates/Administration.html -->
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>Страница администрирования</title>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
+        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
+    </head>
+<body>
+    <h1>Панель администрирования</h1>
+
+    <h2>Пользователи:</h2>
+    <ul>
+        {% for user in users %}
+            <li>
+                <a href="{{ url_for('channel', username=user.username) }}">{{ user.username }}</a> 
+                <a href="{{ url_for('edit_user', user_id=user.id) }}"><img src="{{ url_for('static', filename='edit.png') }}" alt="Редактировать" width="20"></a> 
+            </li>
+        {% endfor %}
+    </ul>
+
+    <h2>Видео:</h2>
+    <ul>
+        {% for video in videos %}
+            <li>
+                {{ video.title }} (автор: <a href="{{ url_for('channel', username=video.author.username) }}">{{ video.author.username }}</a>) 
+                <a href="{{ url_for('edit_video', video_id=video.id) }}"><img src="{{ url_for('static', filename='edit.png') }}" alt="Редактировать" width="20"></a> 
+            </li>
+        {% endfor %}
+    </ul>
+</body>
 </html>
\ No newline at end of file
diff --git a/src/templates/edit_user.html b/templates/admin/edit_user.html
similarity index 97%
rename from src/templates/edit_user.html
rename to templates/admin/edit_user.html
index 59c8a84..d024b78 100644
--- a/src/templates/edit_user.html
+++ b/templates/admin/edit_user.html
@@ -1,58 +1,58 @@
-<!-- src/templates/edit_user.html -->
-<!DOCTYPE html>
-<html>
-<head>
-    <title>Редактировать пользователя</title>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-</head>
-<body>
-    <h1>Редактировать пользователя {{ user.username }}</h1>
-
-    {% with messages = get_flashed_messages(with_categories=true) %}
-        {% if messages %}
-            <ul class="flashes">
-                {% for category, message in messages %}
-                    <li class="{{ category }}">{{ message }}</li>
-                {% endfor %}
-            </ul>
-        {% endif %}
-    {% endwith %}
-
-    <form method="post" enctype="multipart/form-data">
-        <label for="username">Имя пользователя:</label>
-        <input type="text" id="username" name="username" value="{{ user.username }}">
-
-        <label for="password">Пароль:</label>
-        <input type="password" id="password" name="password" placeholder="Введите новый пароль (необязательно)">
-
-        <label for="avatar">Аватар:</label>
-        <input type="file" id="avatar" name="avatar">
-
-        <h2>Подписчики:</h2>
-        <ul>
-            {% for subscriber in user.subscribers %}
-                <li>{{ subscriber.username }}
-                    <button type="submit" name="remove_subscriber" value="{{ subscriber.username }}">Удалить</button>
-                </li>
-            {% endfor %}
-        </ul>
-        <label for="add_subscriber">Добавить подписчика:</label>
-        <input type="text" id="add_subscriber" name="add_subscriber">
-        <button type="submit" name="add_subscriber">Добавить</button>
-
-        <h2>Видео:</h2>
-        <ul>
-            {% for video in user.videos %}
-                <li>{{ video.title }}
-                    <button type="submit" name="delete_video_id" value="{{ video.id }}">Удалить</button>
-                </li>
-            {% endfor %}
-        </ul>
-
-        <button type="submit">Сохранить изменения</button>
-    </form>
-</body>
+<!-- src/templates/edit_user.html -->
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Редактировать пользователя</title>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
+    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
+</head>
+<body>
+    <h1>Редактировать пользователя {{ user.username }}</h1>
+
+    {% with messages = get_flashed_messages(with_categories=true) %}
+        {% if messages %}
+            <ul class="flashes">
+                {% for category, message in messages %}
+                    <li class="{{ category }}">{{ message }}</li>
+                {% endfor %}
+            </ul>
+        {% endif %}
+    {% endwith %}
+
+    <form method="post" enctype="multipart/form-data">
+        <label for="username">Имя пользователя:</label>
+        <input type="text" id="username" name="username" value="{{ user.username }}">
+
+        <label for="password">Пароль:</label>
+        <input type="password" id="password" name="password" placeholder="Введите новый пароль (необязательно)">
+
+        <label for="avatar">Аватар:</label>
+        <input type="file" id="avatar" name="avatar">
+
+        <h2>Подписчики:</h2>
+        <ul>
+            {% for subscriber in user.subscribers %}
+                <li>{{ subscriber.username }}
+                    <button type="submit" name="remove_subscriber" value="{{ subscriber.username }}">Удалить</button>
+                </li>
+            {% endfor %}
+        </ul>
+        <label for="add_subscriber">Добавить подписчика:</label>
+        <input type="text" id="add_subscriber" name="add_subscriber">
+        <button type="submit" name="add_subscriber">Добавить</button>
+
+        <h2>Видео:</h2>
+        <ul>
+            {% for video in user.videos %}
+                <li>{{ video.title }}
+                    <button type="submit" name="delete_video_id" value="{{ video.id }}">Удалить</button>
+                </li>
+            {% endfor %}
+        </ul>
+
+        <button type="submit">Сохранить изменения</button>
+    </form>
+</body>
 </html>
\ No newline at end of file
diff --git a/src/templates/edit_video.html b/templates/admin/edit_video.html
similarity index 97%
rename from src/templates/edit_video.html
rename to templates/admin/edit_video.html
index a486771..1b74754 100644
--- a/src/templates/edit_video.html
+++ b/templates/admin/edit_video.html
@@ -1,34 +1,34 @@
-<!-- src/templates/edit_video.html -->
-<!DOCTYPE html>
-<html>
-    <head>
-        <title>Редактировать видео</title>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
-        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
-    </head>
-<body>
-    <h1>Редактировать видео {{ video.title }}</h1>
-
-    {% with messages = get_flashed_messages(with_categories=true) %}
-        {% if messages %}
-            <ul class="flashes">
-                {% for category, message in messages %}
-                    <li class="{{ category }}">{{ message }}</li>
-                {% endfor %}
-            </ul>
-        {% endif %}
-    {% endwith %}
-
-    <form method="post" enctype="multipart/form-data">
-        <label for="title">Название видео:</label>
-        <input type="text" id="title" name="title" value="{{ video.title }}">
-
-        <label for="description">Описание:</label>
-        <textarea id="description" name="description">{{ video.description }}</textarea>
-
-        <button type="submit">Сохранить изменения</button>
-    </form>
-</body>
+<!-- src/templates/edit_video.html -->
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>Редактировать видео</title>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
+        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
+    </head>
+<body>
+    <h1>Редактировать видео {{ video.title }}</h1>
+
+    {% with messages = get_flashed_messages(with_categories=true) %}
+        {% if messages %}
+            <ul class="flashes">
+                {% for category, message in messages %}
+                    <li class="{{ category }}">{{ message }}</li>
+                {% endfor %}
+            </ul>
+        {% endif %}
+    {% endwith %}
+
+    <form method="post" enctype="multipart/form-data">
+        <label for="title">Название видео:</label>
+        <input type="text" id="title" name="title" value="{{ video.title }}">
+
+        <label for="description">Описание:</label>
+        <textarea id="description" name="description">{{ video.description }}</textarea>
+
+        <button type="submit">Сохранить изменения</button>
+    </form>
+</body>
 </html>
\ No newline at end of file
diff --git a/templates/base.html b/templates/base.html
new file mode 100644
index 0000000..ba0062b
--- /dev/null
+++ b/templates/base.html
@@ -0,0 +1,145 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{% block title %}NeTube{% endblock %}</title>
+ <script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio,line-clamp,container-queries"></script>
+    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+
+</head>
+<body class="bg-gray-100 text-gray-900 font-roboto">
+<header class="bg-white shadow-md p-4">
+    <div class="container mx-auto flex flex-col md:flex-row justify-between items-center">
+        <h1 class="text-2xl font-bold mb-4 md:mb-0">
+            <a href="{{ url_for('main_bp.index') }}">NeTube</a>
+        </h1>
+        <div class="flex-1 flex justify-center mb-4 md:mb-0">
+            <form action="{{ url_for('main_bp.index') }}" method="POST" class="flex w-full max-w-md">
+                <input type="text" name="search_query" placeholder="Поиск..." class="border border-gray-300 rounded-l-md px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 w-full">
+                <button type="submit" class="bg-blue-500 text-white rounded-r-md px-4 py-2 hover:bg-blue-600">Искать</button>
+            </form>
+        </div>
+        <nav class="flex items-center space-x-4">
+            {% if current_user %}
+                <label for="mini-avatar" id="menu-button" class="cursor-pointer">
+                    <img src="{{ url_for('static_bp.serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('static_bp.serve_avatars', filename='plus.png') }}" class="w-8 h-8 rounded-full object-cover">
+                </label>
+                <a>•</a>
+                <a href="{{ url_for('video_bp.upload') }}" class="text-blue-500">
+                    <img src="{{ url_for('static_bp.serve_icons', filename='upload.png') }}" class="w-8 h-8">
+                </a>
+                <a>•</a>
+                <a href="{{ url_for('user_bp.logout') }}" class="text-red-500">
+                    <img src="{{ url_for('static_bp.serve_icons', filename='log-out.png') }}" class="w-8 h-8">
+                </a>
+            {% else %}
+                <a href="{{ url_for('user_bp.login') }}">
+                    <img src="{{ url_for('static_bp.serve_icons', filename='question.png') }}" class="w-8 h-8">
+                </a>
+            {% endif %}
+        </nav>
+    </div>
+</header>
+
+    <main class="container mx-auto mt-4">
+
+        <div id="menu-overlay" class="fixed inset-0 bg-gray-900 bg-opacity-75 hidden z-50 flex justify-center items-center">
+    <div id="menu-content" class="bg-white w-96 p-6 rounded-lg shadow-lg">
+        <!-- User Info Block -->
+        <div class="menu-block">
+            <div class="user-info flex items-center space-x-4">
+                {% if current_user %}
+                    <div class="flex-shrink-0">
+                        <form action="{{ url_for('channel_bp.upload_avatar', username=current_user.username) }}" method="POST" enctype="multipart/form-data" class="inline-block">
+                            <label for="avatar" id="avatar-button" class="cursor-pointer">
+                                <img src="{{ url_for('static_bp.serve_avatars', filename=current_user.avatar) if current_user.avatar else url_for('static_bp.serve_avatars', filename='plus.png') }}"
+                                     class="w-16 h-16 rounded-full object-cover border border-gray-300"
+                                     alt="Avatar">
+                            </label>
+                            <input type="file" id="avatar" name="avatar" class="hidden">
+                        </form>
+                    </div>
+                    <div class="user-details flex-grow">
+                        <span class="username block font-bold">@{{ Markup(current_user.username) }}</span>
+                        <span class="text-gray-500">{{ current_user.subscribers.count() }} подписчиков</span>
+                    </div>
+                    <div class="vert-separator h-12 w-px bg-gray-300 mx-2"></div>
+                    <a href="{{ url_for('channel_bp.channel', username=current_user.username) }}" class="text-blue-600 whitespace-nowrap overflow-hidden text-ellipsis">Перейти на канал</a>
+                {% else %}
+                    <a href="{{ url_for('user_bp.login') }}">
+                        <img src="{{ url_for('static_bp.serve_avatars', filename='question.png') }}" class="w-16 h-16 rounded-full border border-gray-300" alt="Login">
+                    </a>
+                {% endif %}
+            </div>
+        </div>
+
+        <!-- Separator -->
+        <div class="separator border-t border-gray-300 my-4"></div>
+
+        <!-- Menu Block -->
+        <div class="menu-block space-y-4">
+            <a class="flex items-center space-x-3 cursor-pointer">
+                <img src="{{ url_for('static_bp.serve_icons', filename='changeuser.png') }}" class="w-8 h-8" alt="Change User">
+                <span>Ваши данные на NeTube</span>
+            </a>
+            <a href="{{ url_for('user_bp.login') }}" class="flex items-center space-x-3 cursor-pointer">
+                <img src="{{ url_for('static_bp.serve_icons', filename='switchacc.png') }}" class="w-8 h-8" alt="Switch Account">
+                <span>Сменить аккаунт</span>
+            </a>
+            <a href="{{ url_for('user_bp.logout') }}" class="flex items-center space-x-3 cursor-pointer">
+                <img src="{{ url_for('static_bp.serve_icons', filename='log-out.png') }}" class="w-8 h-8" alt="Logout">
+                <span>Выйти</span>
+            </a>
+        </div>
+
+        <!-- Separator -->
+        <div class="separator border-t border-gray-300 my-4"></div>
+
+        <!-- Settings Block -->
+        <div class="menu-block space-y-2">
+            <p>Тема: Светлая</p>
+            <p>Язык: Русский</p>
+            <p>Настройки</p>
+        </div>
+    </div>
+</div>
+
+
+
+        {% block content %}{% endblock %}
+    </main>
+
+    <script>
+    const menuButton = document.getElementById('menu-button');
+    const menuOverlay = document.getElementById('menu-overlay');
+
+    menuButton.addEventListener('click', (event) => {
+                event.stopPropagation()
+        menuOverlay.classList.toggle('hidden');
+    });
+
+    menuOverlay.addEventListener('click', (event) => {
+             if (event.target === menuOverlay) {
+                 event.stopPropagation()
+                 menuOverlay.classList.add('hidden');
+             }
+    });
+
+    document.getElementById('avatar').addEventListener('change', function() {
+        console.log("Файл выбран:", this.files[0].name);
+        handleAvatarChange(); // Вызываем функцию, чтобы отправить форму
+    });
+
+    function handleAvatarChange() {
+        const fileInput = document.getElementById('avatar');
+        const form = fileInput.closest('form');
+        if (fileInput.files && fileInput.files[0]) {
+            form.submit();
+        }
+    }
+
+    </script>
+</body>
+</html>
diff --git a/templates/channel/channel.html b/templates/channel/channel.html
new file mode 100644
index 0000000..70b643a
--- /dev/null
+++ b/templates/channel/channel.html
@@ -0,0 +1,55 @@
+{% extends "base.html" %}
+
+{% block content %}
+<div class="min-h-screen bg-gray-100">
+
+    <!-- Контейнер канала -->
+    <div class="p-6 bg-white shadow-lg rounded-lg">
+
+        <!-- Заголовок с именем пользователя и количеством подписчиков -->
+        <div class="text-center mb-6">
+            <h2 class="text-2xl font-bold text-gray-800">@{{ user.username }}</h2>
+            <p class="subscribers text-sm text-gray-500">{{ user.subscribers.count() }} подписчиков</p>
+
+            <!-- Кнопка подписки/отписки -->
+            {% if current_user and current_user.username != user.username %}
+                        <button id="subscribe-button" class="ml-4 px-4 py-2 rounded-full border bg-gray-300 hover:bg-gray-400" data-user-id="{{ user.id }}">
+                    {% if current_user and user in current_user.subscribed_to %}
+                                Отписаться
+                            {% else %}
+                                Подписаться
+                            {% endif %}
+                        </button>
+                    {% endif %}
+        </div>
+
+        <!-- Контейнер видео -->
+        <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
+
+            {% for video in videos %}
+                <div class="video-preview bg-white shadow-md rounded-lg hover:shadow-xl transition duration-300">
+
+                    <!-- Превью видео -->
+                    <a href="{{ url_for('video_bp.video', video_name=video.url) }}" class="block">
+                        <img src="{{ url_for('static_bp.serve_thumbnails', filename=video.url[:-4] + '.jpg') }}" alt="{{ video.title }}" class="w-full h-48 object-cover rounded-t-lg">
+                    </a>
+
+                    <!-- Описание видео -->
+                    <div class="p-4">
+                        <h3 class="text-lg font-semibold text-gray-800">
+                            <a href="{{ url_for('channel_bp.channel', username=video.author.username) }}" class="flex items-center space-x-2">
+                                <img src="{{ url_for('static_bp.serve_avatars', filename=video.author.avatar) if video.author.avatar else url_for('static_bp.serve_avatars', filename='plus.png') }}" class="w-8 h-8 rounded-full object-cover">
+                                <span>{{ video.title }}</span>
+                            </a>
+                        </h3>
+                        <p class="text-sm text-gray-600">
+                            <a href="{{ url_for('channel_bp.channel', username=video.author.username) }}" class="hover:underline">@{{ video.author.username }} • {{ video.views }} просмотров • {{ video.likes }} лайков</a>
+                        </p>
+                    </div>
+                </div>
+            {% endfor %}
+        </div>
+    </div>
+</div>
+<script src="{{ url_for('static', filename='js/subscribe_handler.js') }}"></script>
+{% endblock %}
diff --git a/templates/errors/400.html b/templates/errors/400.html
new file mode 100644
index 0000000..35e299b
--- /dev/null
+++ b/templates/errors/400.html
@@ -0,0 +1,14 @@
+{% extends 'base.html' %}
+
+{% block title %}Ошибка 400 - NeTube{% endblock %}
+
+{% block content %}
+    <div class="min-h-screen flex items-center justify-center bg-gray-100">
+        <div class="text-center p-6 bg-white shadow-md rounded-md">
+            <h1 class="text-4xl font-bold text-red-500">400</h1>
+            <h2 class="text-xl font-semibold text-gray-700">Неверный запрос</h2>
+            <p class="mt-4 text-gray-600">Кажется, вы отправили неверный запрос. Пожалуйста, проверьте введенные данные и попробуйте снова.</p>
+            <a href="{{ url_for('main_bp.index') }}" class="mt-4 inline-block px-6 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">На главную</a>
+        </div>
+    </div>
+{% endblock %}
diff --git a/templates/errors/401.html b/templates/errors/401.html
new file mode 100644
index 0000000..a586991
--- /dev/null
+++ b/templates/errors/401.html
@@ -0,0 +1,14 @@
+{% extends 'base.html' %}
+
+{% block title %}Ошибка 401 - NeTube{% endblock %}
+
+{% block content %}
+    <div class="min-h-screen flex items-center justify-center bg-gray-100">
+        <div class="text-center p-6 bg-white shadow-md rounded-md">
+            <h1 class="text-4xl font-bold text-red-500">401</h1>
+            <h2 class="text-xl font-semibold text-gray-700">Неавторизован</h2>
+            <p class="mt-4 text-gray-600">Для доступа к этой странице требуется авторизация. Пожалуйста, войдите в систему или зарегистрируйтесь.</p>
+            <a href="{{ url_for('user_bp.login') }}" class="mt-4 inline-block px-6 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">Войти</a>
+        </div>
+    </div>
+{% endblock %}
diff --git a/templates/errors/403.html b/templates/errors/403.html
new file mode 100644
index 0000000..604e890
--- /dev/null
+++ b/templates/errors/403.html
@@ -0,0 +1,14 @@
+{% extends 'base.html' %}
+
+{% block title %}Ошибка 403 - NeTube{% endblock %}
+
+{% block content %}
+    <div class="min-h-screen flex items-center justify-center bg-gray-100">
+        <div class="text-center p-6 bg-white shadow-md rounded-md">
+            <h1 class="text-4xl font-bold text-red-500">403</h1>
+            <h2 class="text-xl font-semibold text-gray-700">Доступ запрещен</h2>
+            <p class="mt-4 text-gray-600">У вас нет прав для доступа к этой странице. Пожалуйста, свяжитесь с администратором, если считаете, что это ошибка.</p>
+            <a href="{{ url_for('main_bp.index') }}" class="mt-4 inline-block px-6 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">На главную</a>
+        </div>
+    </div>
+{% endblock %}
diff --git a/templates/errors/404.html b/templates/errors/404.html
new file mode 100644
index 0000000..14dee89
--- /dev/null
+++ b/templates/errors/404.html
@@ -0,0 +1,14 @@
+{% extends 'base.html' %}
+
+{% block title %}Ошибка 404 - NeTube{% endblock %}
+
+{% block content %}
+    <div class="min-h-screen flex items-center justify-center bg-gray-100">
+        <div class="text-center p-6 bg-white shadow-md rounded-md">
+            <h1 class="text-4xl font-bold text-red-500">404</h1>
+            <h2 class="text-xl font-semibold text-gray-700">Страница не найдена</h2>
+            <p class="mt-4 text-gray-600">Извините, но страница, которую вы ищете, не найдена. Проверьте URL или вернитесь на главную страницу.</p>
+            <a href="{{ url_for('main_bp.index') }}" class="mt-4 inline-block px-6 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">На главную</a>
+        </div>
+    </div>
+{% endblock %}
diff --git a/templates/errors/500.html b/templates/errors/500.html
new file mode 100644
index 0000000..2baac46
--- /dev/null
+++ b/templates/errors/500.html
@@ -0,0 +1,20 @@
+{% extends 'base.html' %}
+
+{% block title %}Ошибка 500 - NeTube{% endblock %}
+
+{% block content %}
+    <div class="min-h-screen flex items-center justify-center bg-gray-100">
+        <div class="text-center p-6 bg-white shadow-md rounded-md">
+            <h1 class="text-4xl font-bold text-red-500">500</h1>
+            <h2 class="text-xl font-semibold text-gray-700">Внутренняя ошибка сервера</h2>
+            <p class="mt-4 text-gray-600">Произошла ошибка на сервере. Мы уже работаем над её исправлением. Пожалуйста, попробуйте позже.</p>
+            {% if error %}
+                <div class="mt-6 p-4 bg-gray-200 border border-gray-300 rounded">
+                    <h3 class="text-lg font-semibold text-gray-800">Детали ошибки:</h3>
+                    <pre class="text-sm text-gray-700 overflow-x-auto">{{ error }}</pre>
+                </div>
+            {% endif %}
+            <a href="{{ url_for('main_bp.index') }}" class="mt-4 inline-block px-6 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">На главную</a>
+        </div>
+    </div>
+{% endblock %}
diff --git a/templates/index.html b/templates/index.html
new file mode 100644
index 0000000..a49459d
--- /dev/null
+++ b/templates/index.html
@@ -0,0 +1,67 @@
+{% extends 'base.html' %}
+
+{% block title %}Главная - NeTube{% endblock %}
+
+{% block content %}
+{% if search_results %}
+    <h2 class="text-xl font-bold mb-4">Результаты поиска: {{ search_query }}</h2>
+    <div class="flex flex-col space-y-6">
+        {% for video in search_results %}
+        <div class="flex bg-white shadow-md rounded-md overflow-hidden">
+            <!-- Видео превью -->
+            <a href="{{ url_for('video_bp.video', video_name=video.url) }}" class="w-64 flex-shrink-0">
+                <img src="{{ url_for('static_bp.serve_thumbnails', filename=video.url[:-4] + '.jpg') }}" alt="{{ video.title }}" class="w-full h-40 object-cover">
+            </a>
+
+            <!-- Описание видео -->
+            <div class="flex flex-col justify-between p-4 flex-grow">
+                <div>
+                    <!-- Название видео -->
+                    <h3 class="text-xl font-semibold">
+                        <a href="{{ url_for('video_bp.video', video_name=video.url) }}" class="hover:text-blue-600">
+                            {{ video.title }}
+                        </a>
+                    </h3>
+                    <!-- Автор видео -->
+                    <p class="text-base text-gray-600 mb-2">
+                        <a href="{{ url_for('channel_bp.channel', username=video.author.username) }}" class="inline-flex items-center">
+                            <img src="{{ url_for('static_bp.serve_avatars', filename=video.author.avatar) if video.author.avatar else url_for('static_bp.serve_avatars', filename='plus.png') }}" class="w-8 h-8 rounded-full object-cover mr-2">
+                            @{{ video.author.username }}
+                        </a>
+                    </p>
+                </div>
+                <!-- Статистика -->
+                <p class="text-base text-gray-600">
+                    {{ video.views }} просмотров • {{ video.likes }} лайков
+                </p>
+            </div>
+        </div>
+        {% endfor %}
+    </div>
+{% else %}
+    <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+  {% for video in videos %}
+                <div class="video-preview bg-white shadow-md rounded-lg hover:shadow-xl transition duration-300">
+
+                    <!-- Превью видео -->
+                    <a href="{{ url_for('video_bp.video', video_name=video.url) }}" class="block">
+                        <img src="{{ url_for('static_bp.serve_thumbnails', filename=video.url[:-4] + '.jpg') }}" alt="{{ video.title }}" class="w-full h-48 object-cover rounded-t-lg">
+                    </a>
+
+                    <!-- Описание видео -->
+                    <div class="p-4">
+                        <h3 class="text-lg font-semibold text-gray-800">
+                            <a href="{{ url_for('channel_bp.channel', username=video.author.username) }}" class="flex items-center space-x-2">
+                                <img src="{{ url_for('static_bp.serve_avatars', filename=video.author.avatar) if video.author.avatar else url_for('static_bp.serve_avatars', filename='plus.png') }}" class="w-8 h-8 rounded-full object-cover">
+                                <span>{{ video.title }}</span>
+                            </a>
+                        </h3>
+                        <p class="text-sm text-gray-600">
+                            <a href="{{ url_for('channel_bp.channel', username=video.author.username) }}" class="hover:underline">@{{ video.author.username }} • {{ video.views }} просмотров • {{ video.likes }} лайков</a>
+                        </p>
+                    </div>
+                </div>
+            {% endfor %}
+    </div>
+{% endif %}
+{% endblock %}
diff --git a/templates/user/login.html b/templates/user/login.html
new file mode 100644
index 0000000..59cee6b
--- /dev/null
+++ b/templates/user/login.html
@@ -0,0 +1,21 @@
+{% extends "base.html" %}
+
+{% block content %}
+<div class="flex items-center justify-center h-screen bg-gray-100">
+    <div class="w-full max-w-md p-8 bg-white shadow-lg rounded-lg">
+        <h1 class="text-2xl font-bold mb-4 text-center">Вход</h1>
+
+        {% if error %}
+            <p class="text-red-500 text-center mb-4">{{ error }}</p>
+        {% endif %}
+
+        <form action="{{ url_for('user_bp.login') }}" method="post" class="space-y-4">
+            <input type="text" name="username" placeholder="Имя пользователя" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
+            <input type="password" name="password" placeholder="Пароль" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
+            <button type="submit" class="w-full py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600">Войти</button>
+        </form>
+
+        <p class="mt-4 text-center">Нет аккаунта? <a href="{{ url_for('user_bp.register') }}" class="text-blue-500 hover:underline">Зарегистрируйтесь</a></p>
+    </div>
+</div>
+{% endblock %}
diff --git a/templates/user/register.html b/templates/user/register.html
new file mode 100644
index 0000000..5bc1199
--- /dev/null
+++ b/templates/user/register.html
@@ -0,0 +1,21 @@
+{% extends "base.html" %}
+
+{% block content %}
+<div class="flex items-center justify-center h-screen bg-gray-100">
+    <div class="w-full max-w-md p-8 bg-white shadow-lg rounded-lg">
+        <h1 class="text-2xl font-bold mb-4 text-center">Регистрация</h1>
+
+        {% if error %}
+            <p class="text-red-500 text-center mb-4">{{ error }}</p>
+        {% endif %}
+
+        <form action="{{ url_for('user_bp.register') }}" method="post" class="space-y-4">
+            <input type="text" name="username" placeholder="Имя пользователя" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
+            <input type="password" name="password" placeholder="Пароль" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
+            <button type="submit" class="w-full py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600">Зарегистрироваться</button>
+        </form>
+
+        <p class="mt-4 text-center">Уже есть аккаунт? <a href="{{ url_for('user_bp.login') }}" class="text-blue-500 hover:underline">Войдите</a></p>
+    </div>
+</div>
+{% endblock %}
diff --git a/templates/video/upload.html b/templates/video/upload.html
new file mode 100644
index 0000000..e105b6d
--- /dev/null
+++ b/templates/video/upload.html
@@ -0,0 +1,87 @@
+{% extends 'base.html' %}
+
+{% block title %}Загрузка видео - NeTube{% endblock %}
+
+{% block content %}
+    <style>
+        @keyframes spin {
+            0% { transform: rotate(0deg); }
+            100% { transform: rotate(360deg); }
+        }
+    </style>
+
+    <main class="flex flex-col items-center justify-center min-h-screen bg-gray-100">
+        <form action="{{ url_for('video_bp.upload') }}" method="post" enctype="multipart/form-data" id="upload-form" class="bg-white p-8 rounded-lg shadow-xl w-full max-w-lg">
+            <h1 class="text-3xl font-bold mb-6 text-gray-800 text-center">Загрузить видео</h1>
+
+            <label for="title" class="block text-gray-700 mb-2 font-semibold">Название видео:</label>
+            <input type="text" id="title" name="title" placeholder="Введите название видео" class="w-full mb-4 px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 text-gray-700">
+
+            <label for="description" class="block text-gray-700 mb-2 font-semibold">Описание:</label>
+            <textarea id="description" name="description" placeholder="Добавьте описание видео" class="w-full h-32 mb-2 px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 text-gray-700"></textarea>
+            <p id="description-count" class="text-sm text-gray-500 mb-2">0 / 500</p>
+            <p id="description-warning" class="text-red-500 text-sm hidden mb-4">Предупреждение: Длина описания превышает 500 символов.</p>
+
+            <!-- Custom styled file input with file name display -->
+            <label for="file" class="block text-gray-700 mb-2 font-semibold">Выберите файл:</label>
+            <label for="file" class="w-full flex items-center justify-center py-3 mb-2 border border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-100 transition duration-200">
+                <span id="file-name" class="text-blue-600 font-semibold">Нажмите для выбора файла</span>
+                <input type="file" name="file" id="file" class="hidden">
+            </label>
+            <p id="selected-file-name" class="text-sm text-gray-500 mb-6 hidden"></p>
+
+            <button type="submit" id="upload-button" class="w-full bg-blue-600 text-white py-3 rounded-lg hover:bg-blue-700 transition duration-200 font-semibold">Загрузить</button>
+        </form>
+    </main>
+
+    <!-- Loading overlay -->
+    <div id="loading-overlay" class="fixed inset-0 bg-black bg-opacity-50 hidden z-50 flex items-center justify-center">
+        <div class="loading-spinner w-16 h-16 border-4 border-gray-200 border-t-blue-600 rounded-full animate-spin"></div>
+    </div>
+
+    <script>
+        const descriptionInput = document.getElementById('description');
+        const descriptionCount = document.getElementById('description-count');
+        const descriptionWarning = document.getElementById('description-warning');
+        const uploadButton = document.getElementById('upload-button');
+        const uploadForm = document.getElementById('upload-form');
+        const loadingOverlay = document.getElementById('loading-overlay');
+
+        const fileInput = document.getElementById('file');
+        const fileNameLabel = document.getElementById('file-name');
+        const selectedFileName = document.getElementById('selected-file-name');
+
+        descriptionInput.addEventListener('input', () => {
+            const currentLength = descriptionInput.value.length;
+            descriptionCount.textContent = `${currentLength} / 500`;
+
+            if (currentLength > 500) {
+                descriptionWarning.classList.remove('hidden');
+            } else {
+                descriptionWarning.classList.add('hidden');
+            }
+        });
+
+        fileInput.addEventListener('change', () => {
+            if (fileInput.files.length > 0) {
+                const fileName = fileInput.files[0].name;
+                selectedFileName.textContent = `Выбран файл: ${fileName}`;
+                selectedFileName.classList.remove('hidden');
+                fileNameLabel.textContent = "Изменить файл";
+            } else {
+                fileNameLabel.textContent = "Нажмите для выбора файла";
+                selectedFileName.classList.add('hidden');
+            }
+        });
+
+        uploadButton.addEventListener('click', (event) => {
+            event.preventDefault(); // Предотвращаем стандартную отправку формы
+            loadingOverlay.classList.remove('hidden');
+            uploadForm.submit();
+        });
+
+        uploadForm.addEventListener('submit', () => {
+            loadingOverlay.classList.add('hidden');
+        });
+    </script>
+{% endblock %}
diff --git a/templates/video/video.html b/templates/video/video.html
new file mode 100644
index 0000000..ff3d66e
--- /dev/null
+++ b/templates/video/video.html
@@ -0,0 +1,362 @@
+{% extends 'base.html' %}
+
+{% block title %}{{ video.title }} - NeTube{% endblock %}
+
+{% block content %}
+    <link rel="stylesheet" href="{{ url_for('static', filename='css/video_player.css') }}">
+<div class="container mx-auto p-4 space-y-6">
+    <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
+        <!-- Main Video Section -->
+        <div class="lg:col-span-2">
+     <!-- Custom Video Player -->
+<div id="videoPlayerContainer" class="relative group bg-black rounded overflow-hidden">
+    <video id="NeTubeVideoPlayer" class="w-full rounded-md">
+        <source src="{{ url_for('static_bp.serve_videos', filename=video.url) }}" type="video/mp4">
+        Your browser does not support the video tag.
+    </video>
+
+    <!-- Player Controls -->
+    <div id="playerControls" class="absolute bottom-0 left-0 right-0 flex items-center justify-between p-2 bg-black bg-opacity-50 transition-opacity opacity-0 group-hover:opacity-100 z-50">
+<div class="flex items-center space-x-2 w-full">
+    <!-- Play/Pause Button -->
+    <button id="playPause" class="text-white hover:text-gray-300">
+        <i class="fas fa-play"></i>
+    </button>
+
+    <!-- Mute/Unmute Button -->
+    <button id="muteUnmute" class="text-white hover:text-gray-300">
+        <i class="fas fa-volume-up"></i>
+    </button>
+
+    <!-- Volume Slider and Display -->
+    <div class="flex items-center space-x-2">
+        <input type="range" id="volume" min="0" max="1" step="0.01" value="1" class="w-16 h-1 bg-gray-600 rounded cursor-pointer">
+        <span id="volumeText" class="text-xs text-white">100</span>
+    </div>
+
+        <input type="range" id="seekBar" value="0" class="w-full h-1 bg-gray-600 rounded cursor-pointer">
+    <!-- Current Time and Duration -->
+    <span id="currentTime" class="text-xs text-white">00:00</span>
+    <span class="text-xs text-white">/</span>
+    <span id="duration" class="text-xs text-white">00:00</span>
+</div>
+
+        <div class="flex items-center space-x-2">
+
+
+
+<!-- Settings Button (for speed and autoplay) -->
+<div class="relative ml-2">
+    <button id="settings" class="text-white hover:text-gray-300">
+        <i class="fas fa-cog"></i>
+    </button>
+<div id="settingsMenu" class="absolute border hidden bottom-0 right-0 ml-2 mb-8 w-40 bg-black bg-opacity-80 text-white rounded-lg shadow-lg z-50">
+    <div class="px-4 py-2">
+        <label for="speed" class="block text-sm">Скорость:</label>
+<select id="speed" class="w-full mt-1 p-2 rounded-lg bg-black text-white border border-gray-700">
+            <option value="0.5">0.5x</option>
+            <option value="1" selected>1x</option>
+            <option value="1.5">1.5x</option>
+            <option value="2">2x</option>
+        </select>
+    </div>
+    <div class="px-4 py-2">
+        <label for="autoplay" class="inline-flex items-center">
+<input type="checkbox" id="autoplay" class="form-checkbox text-blue-400 bg-black border-gray-700">
+            <span class="ml-2 text-sm">Повтор</span>
+        </label>
+    </div>
+</div>
+
+
+</div>
+
+            <!-- Picture-in-Picture Button -->
+            <button id="pip" class="text-white hover:text-gray-300">
+                <i class="fas fa-clone"></i>
+            </button>
+
+            <button id="fullscreen" class="text-white hover:text-gray-300">
+                <i class="fas fa-expand"></i>
+            </button>
+        </div>
+    </div>
+</div>
+
+<!-- Video Title -->
+<h2 class="text-2xl font-bold mt-4 mb-4">{{ video.title }}</h2>
+
+            <!-- Video Details -->
+            <div class="flex items-center justify-between mt-4 space-x-4">
+                <div class="flex items-center space-x-4">
+                    <a href="{{ url_for('channel_bp.channel', username=video.author.username) }}" class="flex items-center space-x-2">
+                        <img src="{{ url_for('static_bp.serve_avatars', filename=video.author.avatar) if video.author.avatar else url_for('static_bp.serve_avatars', filename='plus.png') }}" alt="Аватар автора" class="w-10 h-10 rounded-full border border-gray-300">
+                        <div class="text-left">
+<span class="font-semibold hover:text-blue-500">@{{ video.author.username }}</span>
+<span class="text-sm text-gray-500 hover:text-gray-700 subscribers">{{ video.author.subscribers.count() }} подписчиков</span>
+
+                        </div>
+                    </a>
+
+<!-- Subscribe Button -->
+{% if current_user != video.author %}
+    <button id="subscribe-button" class="px-4 py-2 rounded-full border transition-colors duration-300 {{ 'bg-gray-200 text-gray-600 border-gray-300' if current_user and video.author in current_user.subscribed_to else 'bg-red-500 text-white border-red-500' }}" data-user-id="{{ video.author.id }}" data-subscribed="{{ current_user and video.author in current_user.subscribed_to }}">
+        {% if current_user and video.author in current_user.subscribed_to %}
+            Отписаться
+        {% else %}
+            Подписаться
+        {% endif %}
+    </button>
+{% endif %}
+
+
+                </div>
+
+                <div class="flex items-center space-x-4">
+                    <p class="text-gray-700">{{ video.views }} просмотров</p>
+
+<!-- Like/Dislike Buttons -->
+<div class="flex items-center ml-4 space-x-2">
+    <button id="like-button" class="flex items-center px-4 py-2 rounded-full {{ 'bg-blue-500 text-white' if video.liked else 'bg-gray-200 hover:bg-blue-100' }}" data-liked="{{ video.liked }}">
+        <img src="{{ url_for('static_bp.serve_icons', filename='like.png') }}" class="w-6 h-6 mr-2">
+        <span id="like-count">{{ video.likes }}</span>
+    </button>
+    <button id="dislike-button" class="flex items-center px-4 py-2 rounded-full {{ 'bg-red-500 text-white' if video.disliked else 'bg-gray-200 hover:bg-red-100' }}" data-disliked="{{ video.disliked }}">
+        <img src="{{ url_for('static_bp.serve_icons', filename='dislike.png') }}" class="w-6 h-6 mr-2">
+        <span id="dislike-count">{{ video.dislikes }}</span>
+    </button>
+</div>
+
+                </div>
+            </div>
+
+<!-- Video Description -->
+<div class="mt-4">
+    <p id="description" class="text-gray-700">
+        <span id="short-description">{{ video.description[:200] }}...</span>
+        <span id="full-description" class="hidden">{{ video.description }}</span>
+    </p>
+    <button id="show-more-button" class="text-blue-500">
+        Показать больше
+    </button>
+</div>
+
+<!-- Comments Section -->
+<div class="mt-6 bg-white p-4 rounded-lg shadow-md">
+    <h3 class="text-lg font-semibold mb-4">Комментарии</h3>
+    <form id="comment-form" data-video-url="{{ video.url }}" class="mb-4">
+        <textarea id="comment-content" class="w-full p-2 border border-gray-300 rounded-lg" name="content" placeholder="Оставьте комментарий"></textarea>
+        <button id="submit-comment" class="mt-2 px-4 py-2 bg-blue-500 text-white rounded-full hover:bg-blue-600" type="button">Отправить</button>
+    </form>
+
+    <ul id="comments-list" class="space-y-4">
+        {% for comment in video.comments %}
+            <li id="comment-{{ comment.id }}" class="bg-gray-100 p-4 rounded-lg shadow-sm">
+                <div class="flex items-start space-x-3">
+                    <a href="{{ url_for('channel_bp.channel', username=comment.user.username) }}" class="flex-shrink-0">
+                        <img src="{{ url_for('static_bp.serve_avatars', filename=comment.user.avatar) if comment.user.avatar else url_for('static_bp.serve_avatars', filename='plus.png') }}" alt="Аватар автора" class="w-10 h-10 rounded-full object-cover border-2 border-gray-300">
+                    </a>
+                    <div class="flex-1">
+                        <a href="{{ url_for('channel_bp.channel', username=comment.user.username) }}" class="font-semibold text-blue-500">@{{ Markup(comment.user.username) }}</a>
+                        <p class="text-gray-700 mt-1">{{ comment.content }}</p>
+                    </div>
+                </div>
+            </li>
+        {% endfor %}
+    </ul>
+</div>
+
+        </div>
+
+        <!-- Related Videos Section -->
+        <div class="lg:col-span-1">
+            <h2 class="text-xl font-bold mb-4">Другие видео</h2>
+            <ul class="space-y-4">
+                {% for related_video in related_videos %}
+                <div class="video-preview bg-white shadow-md rounded-lg hover:shadow-xl transition duration-300">
+
+                    <!-- Превью видео -->
+                    <a href="{{ url_for('video_bp.video', video_name=related_video.url) }}" class="block">
+                        <img src="{{ url_for('static_bp.serve_thumbnails', filename=related_video.url[:-4] + '.jpg') }}" alt="{{ related_video.title }}" class="w-full h-48 object-cover rounded-t-lg">
+                    </a>
+
+                    <!-- Описание видео -->
+                    <div class="p-4">
+                        <h3 class="text-lg font-semibold text-gray-800">
+                            <a href="{{ url_for('channel_bp.channel', username=related_video.author.username) }}" class="flex items-center space-x-2">
+                                <img src="{{ url_for('static_bp.serve_avatars', filename=video.author.avatar) if video.author.avatar else url_for('static_bp.serve_avatars', filename='plus.png') }}" class="w-8 h-8 rounded-full object-cover">
+                                <span>{{ related_video.title }}</span>
+                            </a>
+                        </h3>
+                        <p class="text-sm text-gray-600">
+                            <a href="{{ url_for('channel_bp.channel', username=related_video.author.username) }}" class="hover:underline">@{{ related_video.author.username }} • {{ related_video.views }} просмотров • {{ related_video.likes }} лайков</a>
+                        </p>
+                    </div>
+                </div>
+                {% endfor %}
+            </ul>
+        </div>
+    </div>
+</div>
+
+
+    <script>
+
+    document.getElementById('show-more-button').addEventListener('click', function() {
+        var shortDescription = document.getElementById('short-description');
+        var fullDescription = document.getElementById('full-description');
+        var button = document.getElementById('show-more-button');
+
+        if (fullDescription.classList.contains('hidden')) {
+            // Show full description
+            shortDescription.classList.add('hidden');
+            fullDescription.classList.remove('hidden');
+            button.textContent = 'Скрыть';
+        } else {
+            // Show short description
+            shortDescription.classList.remove('hidden');
+            fullDescription.classList.add('hidden');
+            button.textContent = 'Показать больше';
+        }
+    });
+
+
+     const likeButton = document.getElementById('like-button');
+        likeButton.addEventListener('click', function() {
+const isLiked = this.dataset.liked === 'true';
+            fetch(`{{ url_for('video_like_bp.like_video', video_name=video.url) }}`, {
+            method: 'POST'
+        })
+        .then(response => response.json())
+        .then(data => {
+            if (data.status === 'success') {
+                likeButton.dataset.liked = !isLiked;
+                document.getElementById('like-count').textContent = data.likes;
+                document.getElementById('dislike-count').textContent = data.dislikes;
+            } else {
+                console.error(data.message);
+            }
+        })
+        .catch(error => console.error('Ошибка:', error));
+    });
+
+    const dislikeButton = document.getElementById('dislike-button');
+    dislikeButton.addEventListener('click', function() {
+        const isDisliked = this.dataset.disliked === 'true';
+
+            fetch(`{{ url_for('video_like_bp.dislike_video', video_name=video.url) }}`, {
+            method: 'POST'
+        })
+        .then(response => response.json())
+        .then(data => {
+            if (data.status === 'success') {
+                dislikeButton.dataset.disliked = !isDisliked;
+                document.getElementById('like-count').textContent = data.likes;
+                document.getElementById('dislike-count').textContent = data.dislikes;
+            } else {
+                console.error(data.message);
+            }
+        })
+        .catch(error => console.error('Ошибка:', error));
+    });
+
+            const commentsList = document.getElementById('comments-list');
+            const submitCommentBtn = document.getElementById('submit-comment')
+            // Добавление комментария в список
+    submitCommentBtn.addEventListener('click', async () => {
+    const content = document.getElementById('comment-content').value;
+    if (content.trim() === '') {
+        alert('Комментарий не может быть пустым');
+        return;
+    }
+
+    try {
+        const addCommentUrl = '{{ url_for("video_bp.add_comment", video_name=video.url) }}'
+        const response = await fetch(addCommentUrl, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({ content }),
+        });
+
+        // Логируем полный ответ для проверки
+        const text = await response.text();
+
+        // Пробуем парсить JSON
+        const comment = JSON.parse(text);
+
+        if (response.ok) {
+            addCommentToList(comment.comment);
+            document.getElementById('comment-content').value = ''; // Очистка поля ввода
+        } else {
+            alert(comment.message);
+        }
+    } catch (error) {
+        console.error('Ошибка при отправке комментария:', error);
+        alert('Произошла ошибка. Пожалуйста, попробуйте снова.');
+    }
+});
+
+function addCommentToList(comment) {
+    // Получаем элемент списка, куда будут добавляться комментарии
+    const commentList = document.querySelector('#comments-list');
+
+    // Создаем новый элемент <li>
+    const li = document.createElement('li');
+    li.id = `comment-${comment.id}`;
+    li.classList.add('bg-gray-100', 'p-4', 'rounded-lg', 'shadow-sm');
+
+    // Создаем div для выравнивания элементов
+    const containerDiv = document.createElement('div');
+    containerDiv.classList.add('flex', 'items-start', 'space-x-3');
+
+    // Создаем ссылку для аватара
+    const avatarLink = document.createElement('a');
+    avatarLink.href = `/channel/${comment.user.username}`;
+    avatarLink.classList.add('flex-shrink-0');
+
+    // Создаем изображение аватара
+    const avatarImage = document.createElement('img');
+    avatarImage.src = comment.user.avatar ? `/static/avatars/users/${comment.user.avatar}` : `/static/avatars/plus.png`;
+    avatarImage.alt = 'Аватар автора';
+    avatarImage.classList.add('w-10', 'h-10', 'rounded-full', 'object-cover', 'border-2', 'border-gray-300');
+
+    // Добавляем аватар в ссылку
+    avatarLink.appendChild(avatarImage);
+
+    // Создаем div для содержимого комментария
+    const contentDiv = document.createElement('div');
+    contentDiv.classList.add('flex-1');
+
+    // Создаем ссылку на канал автора
+    const usernameLink = document.createElement('a');
+    usernameLink.href = `/channel/${comment.user.username}`;
+    usernameLink.classList.add('font-semibold', 'text-blue-500');
+    usernameLink.textContent = `@${comment.user.username}`;
+
+    // Создаем параграф для текста комментария
+    const commentContent = document.createElement('p');
+    commentContent.classList.add('text-gray-700', 'mt-1');
+    commentContent.textContent = comment.content;
+
+    // Добавляем ссылку на автора и текст комментария в div
+    contentDiv.appendChild(usernameLink);
+    contentDiv.appendChild(commentContent);
+
+    // Добавляем аватар и содержимое комментария в контейнер
+    containerDiv.appendChild(avatarLink);
+    containerDiv.appendChild(contentDiv);
+
+    // Добавляем контейнер в <li>
+    li.appendChild(containerDiv);
+
+    // Добавляем <li> в список комментариев
+    commentList.appendChild(li);
+}
+
+
+    </script>
+    <script src="{{ url_for('static', filename='js/subscribe_handler.js') }}"></script>
+    <script src="{{ url_for('static', filename='js/video_player.js') }}"></script>
+{% endblock %}