full site EasyAccess

This commit is contained in:
Egor Deev 2025-05-19 16:03:23 +03:00 committed by GitHub
parent eb65182ee0
commit cb7280c3c1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
75 changed files with 8655 additions and 0 deletions

320
site/about.html Normal file
View file

@ -0,0 +1,320 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>О проекте - EasyAccess</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/about.css">
<link rel="icon" href="images/icons/favicon.ico" type="image/x-icon">
<meta name="description" content="Подробная информация о проекте EasyAccess - браузерном расширении для повышения доступности веб-сайтов для людей с ограниченными возможностями здоровья">
</head>
<body>
<header>
<div class="container">
<nav class="main-nav">
<div class="logo">
<a href="index.html">
<img src="images/logo.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</a>
</div>
<ul class="nav-links">
<li><a href="index.html">Главная</a></li>
<li><a href="about.html" class="active">О проекте</a></li>
<li><a href="team.html">Участники</a></li>
<li><a href="journal.html">Журнал</a></li>
<li><a href="resources.html">Ресурсы</a></li>
</ul>
<button class="mobile-menu-toggle" aria-label="Открыть меню">
<span></span>
<span></span>
<span></span>
</button>
</nav>
</div>
</header>
<main>
<section class="page-hero">
<div class="container">
<h1>О проекте EasyAccess</h1>
<p class="page-subtitle">Инновационное решение для повышения доступности веб-сайтов</p>
</div>
</section>
<section class="about-intro">
<div class="container">
<div class="about-content">
<div class="about-text">
<h2>Что такое EasyAccess?</h2>
<p>
EasyAccess представляет собой комплексное браузерное расширение, разработанное для универсальной
модификации веб-страниц с целью повышения доступности контента, отраженного на сайте.
Приложения предназначено для лиц с ограниченными возможностями здоровья.
</p>
<p>
Расширение объединяет в себе возможности нескольких специализированных решений и предоставляет
дополнительные функции, включая работу с документами и распознавание голоса. Основная цель проекта -
сделать интернет более доступным для всех пользователей, независимо от их физических ограничений.
</p>
</div>
<div class="about-image">
<img src="images/extension.png" alt="Иллюстрация концепции EasyAccess">
</div>
</div>
</div>
</section>
<section class="accessibility-info">
<div class="container">
<h2>Проблема веб-доступности</h2>
<div class="info-blocks">
<div class="info-block">
<div class="info-icon">
<img src="images/icons/problem.svg" alt="Иконка проблемы">
</div>
<h3>Статистика</h3>
<p>
По данным Всемирной организации здравоохранения, более 1 миллиарда людей в мире живут с той или иной
формой инвалидности. В России насчитывается около 11,9 миллионов людей с ограниченными возможностями.
Все эти люди могут испытывать трудности при использовании веб-ресурсов, не адаптированных должным образом.
</p>
</div>
<div class="info-block">
<div class="info-icon">
<img src="images/icons/standards.svg" alt="Иконка стандартов">
</div>
<h3>Стандарты</h3>
<p>
Существуют международные стандарты и рекомендации по обеспечению веб-доступности, такие как WCAG
(Web Content Accessibility Guidelines), разработанные W3C. В Российской Федерации вопросы доступности
веб-ресурсов регулируются ГОСТ Р 52872-2019, который устанавливает требования к доступности интернет-ресурсов.
</p>
</div>
<div class="info-block">
<div class="info-icon">
<img src="images/icons/solution.svg" alt="Иконка решения">
</div>
<h3>Решение</h3>
<p>
EasyAccess предлагает уникальный подход к решению проблемы веб-доступности через систему пакетов
модификаций, которые могут быть применены к определенным веб-сайтам для повышения их доступности.
Это позволяет адаптировать контент под конкретные потребности пользователей с различными ограничениями.
</p>
</div>
</div>
</div>
</section>
<section class="project-goals">
<div class="container">
<h2>Цели и задачи проекта</h2>
<div class="goals-content">
<div class="goal-main">
<h3>Основная цель</h3>
<p>
Разработать универсальное браузерное расширение EasyAccess, способное повышать доступность веб-сайтов
и добавлять к ним новую функциональность через систему пакетов модификаций.
</p>
</div>
<div class="goals-list">
<h3>Задачи проекта</h3>
<ul>
<li>Провести анализ существующих решений по обеспечению доступности веб-ресурсов</li>
<li>Разработать архитектуру расширения, позволяющую гибко настраивать его функциональность</li>
<li>Спроектировать и реализовать базу данных для хранения пакетов модификаций</li>
<li>Разработать серверную инфраструктуру для обеспечения работы расширения</li>
<li>Создать систему пакетов модификаций для повышения доступности веб-сайтов</li>
<li>Реализовать модули для сканирования документов и обработки аудио файлов</li>
<li>Обеспечить удобный пользовательский интерфейс, соответствующий принципам доступности</li>
<li>Разработать веб-редактор для создания пакетов модификаций</li>
<li>Подготовить инфраструктуру для развертывания проекта с использованием Docker</li>
<li>Сформировать документацию проекта и поддерживать её актуальность</li>
</ul>
</div>
</div>
</div>
</section>
<section class="project-architecture">
<div class="container">
<h2>Архитектура проекта</h2>
<p class="section-intro">
Разрабатываемое расширение EasyAccess имеет многокомпонентную архитектуру, которая обеспечивает
эффективное разделение функциональности, безопасность и высокую производительность приложения.
</p>
<div class="architecture-diagram">
<img src="images/architecture-diagram.png" alt="Диаграмма архитектуры EasyAccess">
</div>
<div class="architecture-description">
<div class="arch-component">
<h3>Клиентская часть (Frontend)</h3>
<p>
Разработана с использованием TypeScript и библиотек React/Solid.js. Клиентская часть включает интерфейс браузерного расширения,
компоненты для редактирования пакетов модификаций и взаимодействие с Chrome Extension API. Ключевые компоненты разработаны
с применением реактивной архитектуры для оптимальной производительности.
</p>
</div>
<div class="arch-component">
<h3>Серверная часть (Backend)</h3>
<p>
Реализована на языке Go для основной серверной части и взаимодействия с базой данных. Выбор Go обусловлен
высокой производительностью и эффективностью при обработке параллельных запросов. Дополнительные модули
на Python отвечают за обработку данных, распознавание голоса и документов с использованием библиотек машинного обучения.
</p>
</div>
<div class="arch-component">
<h3>База данных</h3>
<p>
Основана на PostgreSQL с расширением TimescaleDB для эффективной работы с временными рядами данных.
База данных включает 12 основных таблиц и использует материализованные представления для оптимизации
запросов. Применяется Supabase для управления пользователями и аутентификации.
</p>
</div>
<div class="arch-component">
<h3>Система пакетов модификаций</h3>
<p>
Ключевой компонент расширения, позволяющий создавать, управлять и применять наборы CSS/JavaScript
модификаций к веб-страницам. Система пакетов реализует изоляцию скриптов и механизмы безопасности
при внедрении в DOM-структуру страниц.
</p>
</div>
</div>
</div>
</section>
<section class="unique-features">
<div class="container">
<h2>Уникальные преимущества EasyAccess</h2>
<div class="features-comparison">
<div class="features-table">
<div class="table-row table-header">
<div class="table-cell feature-name">Функциональность</div>
<div class="table-cell">EasyAccess</div>
<div class="table-cell">Другие решения</div>
</div>
<div class="table-row">
<div class="table-cell feature-name">Универсальный подход</div>
<div class="table-cell"><span class="check"></span></div>
<div class="table-cell"><span class="cross"></span></div>
</div>
<div class="table-row">
<div class="table-cell feature-name">Система пакетов модификаций</div>
<div class="table-cell"><span class="check"></span></div>
<div class="table-cell"><span class="cross"></span></div>
</div>
<div class="table-row">
<div class="table-cell feature-name">Расширенная функциональность</div>
<div class="table-cell"><span class="check"></span></div>
<div class="table-cell"><span class="partial">~</span></div>
</div>
<div class="table-row">
<div class="table-cell feature-name">Фокус на российский рынок</div>
<div class="table-cell"><span class="check"></span></div>
<div class="table-cell"><span class="cross"></span></div>
</div>
<div class="table-row">
<div class="table-cell feature-name">Открытая платформа</div>
<div class="table-cell"><span class="check"></span></div>
<div class="table-cell"><span class="partial">~</span></div>
</div>
</div>
</div>
<p class="features-note">
В результате сравнительного анализа подтверждена актуальность разработки EasyAccess как комплексного
решения, объединяющего возможности существующих специализированных расширений и предлагающего
дополнительную функциональность для повышения доступности веб-ресурсов.
</p>
</div>
</section>
<section class="practical-significance">
<div class="container">
<h2>Практическая значимость</h2>
<p class="section-intro">
Практическая значимость проекта заключается в создании универсального инструмента, который может быть
использован для решения широкого спектра задач по повышению доступности веб-ресурсов:
</p>
<div class="significance-points">
<div class="point-card">
<div class="point-icon">
<img src="images/icons/visual-impaired.svg" alt="Нарушения зрения">
</div>
<h3>Для пользователей с нарушениями зрения</h3>
<p>
Изменение внешнего вида веб-сайтов: настройка контрастности, размера текста, цветовых схем.
Добавление альтернативного текста к изображениям и распознавание текста из изображений.
</p>
</div>
<div class="point-card">
<div class="point-icon">
<img src="images/icons/motor-impaired.svg" alt="Двигательные нарушения">
</div>
<h3>Для пользователей с двигательными нарушениями</h3>
<p>
Улучшение навигации и обеспечение полной доступности сайта с клавиатуры.
Голосовое управление для пользователей с ограниченными возможностями самостоятельного ввода.
</p>
</div>
<div class="point-card">
<div class="point-icon">
<img src="images/icons/cognitive-impaired.svg" alt="Когнитивные нарушения">
</div>
<h3>Для пользователей с когнитивными нарушениями</h3>
<p>
Персонализация интерфейсов: упрощение навигации, удаление отвлекающих элементов,
структурирование информации для лучшего восприятия.
</p>
</div>
<div class="point-card">
<div class="point-icon">
<img src="images/icons/organizations.svg" alt="Организации">
</div>
<h3>Для организаций</h3>
<p>
Обеспечение доступности веб-ресурсов для всех категорий пользователей без необходимости
значительной переработки существующих сайтов и приложений.
</p>
</div>
</div>
</div>
</section>
</main>
<footer>
<div class="container">
<div class="footer-content">
<div class="footer-logo">
<img src="images/logo-white.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</div>
<div class="footer-links">
<div class="footer-nav">
<h4>Навигация</h4>
<ul>
<li><a href="index.html">Главная</a></li>
<li><a href="about.html">О проекте</a></li>
<li><a href="team.html">Участники</a></li>
<li><a href="journal.html">Журнал</a></li>
<li><a href="resources.html">Ресурсы</a></li>
</ul>
</div>
<div class="footer-nav">
<h4>Контакты</h4>
<ul>
<li><a href="mailto:admin@new-devs.ru">Email</a></li>
<li><a href="https://github.com/easyaccess-team" target="_blank">GitHub</a></li>
</ul>
</div>
</div>
</div>
<div class="footer-bottom">
<p>&copy; 2025 EasyAccess. Проектная деятельность, Московский Политех</p>
</div>
</div>
</footer>
<script src="js/main.js"></script>
</body>
</html>

525
site/css/about.css Normal file
View file

@ -0,0 +1,525 @@
/* Database Structure */
.database-structure {
padding: 5rem 0;
background-color: var(--bg-secondary);
}
.database-tables {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
margin: 3rem 0;
}
.table-card {
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
padding: 1.75rem;
box-shadow: var(--shadow-md);
transition: transform var(--transition-normal);
}
.table-card:hover {
transform: translateY(-5px);
}
.table-card h3 {
font-size: 1.1rem;
color: var(--primary-color);
margin-bottom: 0.75rem;
}
.table-card p {
font-size: 0.95rem;
color: var(--text-secondary);
margin-bottom: 0;
}
.database-features {
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
padding: 2rem;
box-shadow: var(--shadow-md);
margin-bottom: 3rem;
}
.database-features h3 {
font-size: 1.25rem;
margin-bottom: 1rem;
}
.database-features ul {
list-style-type: none;
padding: 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1rem;
}
.database-features li {
position: relative;
padding-left: 1.75rem;
font-size: 0.95rem;
color: var(--text-secondary);
}
.database-features li::before {
content: '✓';
position: absolute;
left: 0;
color: var(--accent-color);
font-weight: bold;
}
.database-diagram {
max-width: 900px;
margin: 0 auto;
border-radius: var(--border-radius-lg);
overflow: hidden;
box-shadow: var(--shadow-lg);
}
.database-diagram img {
width: 100%;
height: auto;
display: block;
}
.image-caption {
display: block;
padding: 0.75rem;
text-align: center;
background-color: var(--bg-tertiary);
color: var(--text-tertiary);
font-size: 0.875rem;
}
@media (max-width: 768px) {
.database-features ul {
grid-template-columns: 1fr;
}
}/* Стили для страницы О проекте */
/* Page Hero */
.page-hero {
padding: 8rem 0 4rem;
background: linear-gradient(135deg, var(--secondary-color) 0%, #f0f7ff 100%);
text-align: center;
position: relative;
overflow: hidden;
}
.page-hero::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('../images/pattern.svg');
background-size: cover;
opacity: 0.1;
z-index: 1;
}
.page-hero .container {
position: relative;
z-index: 2;
}
.page-subtitle {
font-size: 1.25rem;
color: var(--text-secondary);
max-width: 700px;
margin: 0 auto;
}
/* About Intro */
.about-intro {
padding: 5rem 0;
}
.about-content {
display: flex;
align-items: center;
gap: 4rem;
}
.about-text {
flex: 1;
}
.about-text p {
font-size: 1.125rem;
color: var(--text-secondary);
margin-bottom: 1.5rem;
}
.about-image {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
}
.about-image img {
max-width: 100%;
height: auto;
border-radius: var(--border-radius-lg);
box-shadow: var(--shadow-lg);
}
/* Accessibility Info */
.accessibility-info {
padding: 5rem 0;
background-color: var(--bg-secondary);
}
.info-blocks {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
margin-top: 3rem;
}
.info-block {
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
padding: 2rem;
box-shadow: var(--shadow-md);
transition: transform var(--transition-normal);
}
.info-block:hover {
transform: translateY(-5px);
}
.info-icon {
width: 64px;
height: 64px;
background-color: var(--secondary-color);
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}
.info-icon img {
width: 32px;
height: 32px;
}
.info-block h3 {
margin-bottom: 1rem;
font-size: 1.25rem;
}
.info-block p {
color: var(--text-secondary);
font-size: 1rem;
}
/* Project Goals */
.project-goals {
padding: 5rem 0;
}
.goals-content {
display: flex;
gap: 4rem;
margin-top: 3rem;
}
.goal-main, .goals-list {
flex: 1;
}
.goal-main {
background-color: var(--bg-secondary);
border-radius: var(--border-radius-lg);
padding: 2.5rem;
box-shadow: var(--shadow-md);
}
.goal-main h3 {
color: var(--primary-color);
margin-bottom: 1rem;
}
.goal-main p {
font-size: 1.125rem;
color: var(--text-secondary);
}
.goals-list h3 {
margin-bottom: 1.5rem;
}
.goals-list ul {
list-style: none;
padding: 0;
}
.goals-list li {
position: relative;
padding-left: 2rem;
margin-bottom: 1rem;
font-size: 1.05rem;
color: var(--text-secondary);
}
.goals-list li::before {
content: '✓';
position: absolute;
left: 0;
color: var(--accent-color);
font-weight: bold;
}
/* Project Architecture */
.project-architecture {
padding: 5rem 0;
background-color: var(--bg-secondary);
}
.section-intro {
font-size: 1.125rem;
color: var(--text-secondary);
max-width: 800px;
margin: 0 auto 3rem;
text-align: center;
}
.architecture-diagram {
max-width: 900px;
margin: 0 auto 4rem;
border-radius: var(--border-radius-lg);
overflow: hidden;
box-shadow: var(--shadow-lg);
}
.architecture-description {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
}
.arch-component {
background-color: var(--bg-color);
border-radius: var(--border-radius-md);
padding: 1.5rem;
box-shadow: var(--shadow-md);
}
.arch-component h3 {
color: var(--primary-color);
font-size: 1.1rem;
margin-bottom: 0.75rem;
}
.arch-component p {
color: var(--text-secondary);
font-size: 0.95rem;
}
/* Unique Features */
.unique-features {
padding: 5rem 0;
}
.features-comparison {
max-width: 800px;
margin: 3rem auto;
}
.features-table {
width: 100%;
border-radius: var(--border-radius-lg);
overflow: hidden;
box-shadow: var(--shadow-md);
}
.table-row {
display: flex;
}
.table-row:nth-child(odd) {
background-color: var(--bg-color);
}
.table-row:nth-child(even) {
background-color: var(--bg-secondary);
}
.table-header {
background-color: var(--primary-color) !important;
color: white;
font-weight: var(--font-weight-bold);
}
.table-cell {
flex: 1;
padding: 1rem 1.5rem;
display: flex;
align-items: center;
justify-content: center;
}
.feature-name {
justify-content: flex-start;
font-weight: var(--font-weight-medium);
}
.check {
color: var(--accent-color);
font-size: 1.5rem;
}
.cross {
color: #e11d48;
font-size: 1.5rem;
}
.partial {
color: #f59e0b;
font-size: 1.5rem;
}
.features-note {
max-width: 800px;
margin: 2rem auto 0;
text-align: center;
color: var(--text-secondary);
font-size: 1rem;
}
/* Practical Significance */
.practical-significance {
padding: 5rem 0;
background-color: var(--bg-secondary);
}
.significance-points {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
margin-top: 3rem;
}
.point-card {
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
padding: 2rem;
box-shadow: var(--shadow-md);
display: flex;
flex-direction: column;
height: 100%;
}
.point-icon {
width: 64px;
height: 64px;
background-color: var(--secondary-color);
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}
.point-icon img {
width: 32px;
height: 32px;
}
.point-card h3 {
font-size: 1.1rem;
margin-bottom: 1rem;
}
.point-card p {
font-size: 0.95rem;
color: var(--text-secondary);
flex-grow: 1;
}
/* Responsive Styles */
@media (max-width: 1024px) {
.about-content {
gap: 3rem;
}
.goals-content {
gap: 3rem;
}
}
@media (max-width: 768px) {
.about-content {
flex-direction: column-reverse;
}
.about-image {
margin-bottom: 2rem;
}
.goals-content {
flex-direction: column;
}
.table-row {
flex-direction: column;
}
.table-header {
display: none;
}
.table-cell {
padding: 0.75rem;
}
.feature-name {
background-color: var(--primary-light);
color: white;
padding: 0.75rem;
font-weight: var(--font-weight-medium);
border-top-left-radius: var(--border-radius-sm);
border-top-right-radius: var(--border-radius-sm);
}
.table-cell:not(.feature-name) {
border-bottom: 1px solid var(--bg-tertiary);
}
.table-cell:nth-child(2)::before {
content: 'EasyAccess: ';
margin-right: 0.5rem;
font-weight: var(--font-weight-medium);
}
.table-cell:nth-child(3)::before {
content: 'Другие решения: ';
margin-right: 0.5rem;
font-weight: var(--font-weight-medium);
}
}
@media (max-width: 576px) {
.page-hero {
padding: 6rem 0 3rem;
}
.page-subtitle {
font-size: 1.1rem;
}
.info-blocks, .architecture-description, .significance-points {
grid-template-columns: 1fr;
}
.goal-main, .goals-list {
padding: 1.5rem;
}
}

429
site/css/home.css Normal file
View file

@ -0,0 +1,429 @@
/* Стили для главной страницы */
/* Hero Section */
.hero {
padding: 5rem 0;
background: linear-gradient(135deg, var(--secondary-color) 0%, #f0f7ff 100%);
position: relative;
overflow: hidden;
}
.hero::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('../images/pattern.svg');
background-size: cover;
opacity: 0.1;
z-index: 1;
}
.hero .container {
position: relative;
z-index: 2;
display: flex;
align-items: center;
justify-content: space-between;
gap: 2rem;
}
.hero-content {
flex: 1;
max-width: 600px;
}
.hero h1 {
font-size: 3.5rem;
line-height: 1.1;
margin-bottom: 1.5rem;
}
.hero-description {
font-size: 1.25rem;
color: var(--text-secondary);
margin-bottom: 2rem;
max-width: 500px;
}
.hero-cta {
display: flex;
gap: 1rem;
}
.hero-image {
flex: 1;
display: flex;
justify-content: flex-end;
align-items: center;
}
.hero-image img {
max-width: 550px;
width: 100%;
filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.1));
animation: float 6s ease-in-out infinite;
}
@keyframes float {
0% {
transform: translateY(0px);
}
50% {
transform: translateY(-20px);
}
100% {
transform: translateY(0px);
}
}
/* Project Summary */
.project-summary {
padding: 5rem 0;
}
.summary-content {
display: flex;
gap: 4rem;
align-items: flex-start;
}
.summary-text {
flex: 3;
}
.summary-text p {
font-size: 1.125rem;
margin-bottom: 1.5rem;
color: var(--text-secondary);
}
.summary-stats {
flex: 2;
display: flex;
flex-wrap: wrap;
gap: 2rem;
justify-content: space-between;
}
.stat-item {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
min-width: 120px;
}
.stat-number {
font-size: 3.5rem;
font-weight: var(--font-weight-bold);
color: var(--primary-color);
line-height: 1;
margin-bottom: 0.5rem;
}
.stat-label {
font-size: 1rem;
color: var(--text-tertiary);
}
/* Features Section */
.features {
padding: 5rem 0;
}
.features-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 2rem;
margin-top: 3rem;
}
.feature-card {
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
padding: 2rem;
box-shadow: var(--shadow-md);
transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}
.feature-card:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-lg);
}
.feature-icon {
width: 64px;
height: 64px;
background-color: var(--secondary-color);
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}
.feature-icon img {
width: 32px;
height: 32px;
}
.feature-card h3 {
font-size: 1.25rem;
margin-bottom: 1rem;
}
.feature-card p {
color: var(--text-tertiary);
font-size: 0.95rem;
}
/* Tech Stack */
.tech-stack {
padding: 5rem 0;
}
.tech-grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 3rem;
margin-top: 3rem;
}
.tech-item {
display: flex;
flex-direction: column;
align-items: center;
width: 120px;
}
.tech-item img {
width: 60px;
height: 60px;
margin-bottom: 1rem;
filter: grayscale(30%);
transition: all var(--transition-normal);
}
.tech-item:hover img {
filter: grayscale(0%);
transform: scale(1.1);
}
.tech-item span {
font-size: 0.95rem;
color: var(--text-tertiary);
}
/* Latest Updates */
.latest-updates {
padding: 5rem 0;
}
.updates-grid {
margin-top: 3rem;
display: flex;
flex-direction: column;
gap: 2rem;
}
.update-card {
display: flex;
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
overflow: hidden;
box-shadow: var(--shadow-md);
}
.update-date {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: var(--primary-color);
color: white;
padding: 1.5rem;
min-width: 100px;
text-align: center;
}
.update-date .day {
font-size: 2rem;
font-weight: var(--font-weight-bold);
line-height: 1;
}
.update-date .month,
.update-date .year {
font-size: 0.875rem;
text-transform: uppercase;
}
.update-content {
padding: 2rem;
flex: 1;
}
.update-content h3 {
margin-bottom: 0.75rem;
}
.update-content p {
color: var(--text-secondary);
margin-bottom: 1rem;
}
.view-all-updates {
margin-top: 3rem;
text-align: center;
}
/* CTA Section */
.cta-section {
padding: 6rem 0;
background: linear-gradient(to right, var(--primary-color), var(--primary-dark));
position: relative;
overflow: hidden;
}
.cta-section::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('../images/pattern-light.svg');
background-size: cover;
opacity: 0.1;
z-index: 1;
}
.cta-content {
position: relative;
z-index: 2;
max-width: 700px;
margin: 0 auto;
text-align: center;
color: white;
}
.cta-section h2 {
color: white;
}
.cta-section p {
font-size: 1.125rem;
margin-bottom: 2rem;
opacity: 0.9;
}
.cta-section .btn.primary {
background-color: white;
color: var(--primary-color);
border-color: white;
}
.cta-section .btn.primary:hover {
background-color: rgba(255, 255, 255, 0.9);
border-color: rgba(255, 255, 255, 0.9);
}
/* Responsive Styles */
@media (max-width: 1024px) {
.hero h1 {
font-size: 3rem;
}
.stat-number {
font-size: 3rem;
}
}
@media (max-width: 768px) {
.hero .container {
flex-direction: column-reverse;
}
.hero-content, .hero-image {
max-width: 100%;
text-align: center;
}
.hero-image {
justify-content: center;
margin-bottom: 2rem;
}
.hero-image img {
max-width: 400px;
}
.hero-cta {
justify-content: center;
}
.summary-content {
flex-direction: column;
gap: 3rem;
}
.summary-stats {
width: 100%;
justify-content: space-around;
}
.features-grid {
grid-template-columns: 1fr;
}
.update-card {
flex-direction: column;
}
.update-date {
flex-direction: row;
padding: 1rem;
gap: 0.5rem;
}
.update-date .day,
.update-date .month,
.update-date .year {
font-size: 1rem;
}
}
@media (max-width: 576px) {
.hero h1 {
font-size: 2.5rem;
}
.hero-description {
font-size: 1.125rem;
}
.hero-cta {
flex-direction: column;
}
.feature-card {
padding: 1.5rem;
}
.tech-grid {
gap: 2rem;
}
.tech-item {
width: 90px;
}
.tech-item img {
width: 50px;
height: 50px;
}
}

239
site/css/journal.css Normal file
View file

@ -0,0 +1,239 @@
/* Стили для страницы журнала */
/* Journal Timeline */
.journal-timeline {
padding: 5rem 0;
}
.timeline {
position: relative;
max-width: 1000px;
margin: 0 auto;
padding: 2rem 0;
}
.timeline::before {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 120px;
width: 4px;
background-color: var(--secondary-color);
border-radius: 2px;
}
.timeline-entry {
position: relative;
margin-bottom: 4rem;
padding-top: 1rem;
}
.timeline-entry:last-child {
margin-bottom: 0;
}
.entry-date {
position: absolute;
top: 0;
left: 0;
width: 120px;
}
.date-box {
width: 80px;
height: 80px;
background-color: var(--primary-color);
border-radius: var(--border-radius-md);
color: white;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
box-shadow: var(--shadow-md);
}
.date-box .day {
font-size: 1.75rem;
font-weight: var(--font-weight-bold);
line-height: 1;
}
.date-box .month {
font-size: 0.875rem;
text-transform: uppercase;
margin-top: 0.25rem;
}
.date-box .year {
font-size: 0.75rem;
opacity: 0.8;
}
.entry-content {
margin-left: 170px;
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
padding: 2rem;
box-shadow: var(--shadow-md);
position: relative;
}
.entry-content::before {
content: '';
position: absolute;
top: 2rem;
left: -20px;
border: 10px solid transparent;
border-right-color: var(--bg-color);
}
.entry-content h2 {
font-size: 1.75rem;
margin-bottom: 1rem;
color: var(--primary-color);
}
.entry-meta {
display: flex;
gap: 1.5rem;
margin-bottom: 1.5rem;
font-size: 0.95rem;
color: var(--text-tertiary);
}
.entry-body {
color: var(--text-secondary);
}
.entry-body p {
margin-bottom: 1.25rem;
line-height: 1.6;
}
.entry-body h3 {
font-size: 1.25rem;
margin: 2rem 0 1rem;
color: var(--text-primary);
}
.entry-body ul {
margin-bottom: 2rem;
}
.entry-body li {
margin-bottom: 0.75rem;
}
.entry-gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1.5rem;
margin: 2rem 0;
}
.gallery-item {
border-radius: var(--border-radius-md);
overflow: hidden;
box-shadow: var(--shadow-md);
}
.gallery-item img {
width: 100%;
height: auto;
display: block;
}
.image-caption {
display: block;
padding: 0.75rem;
background-color: var(--bg-secondary);
color: var(--text-tertiary);
font-size: 0.875rem;
text-align: center;
}
.entry-conclusion {
background-color: var(--bg-secondary);
border-radius: var(--border-radius-md);
padding: 1.5rem;
margin-top: 2rem;
}
.entry-conclusion p {
margin-bottom: 0;
font-style: italic;
}
/* Responsive Styles */
@media (max-width: 768px) {
.timeline::before {
left: 30px;
}
.entry-date {
width: 60px;
}
.date-box {
width: 60px;
height: 60px;
}
.date-box .day {
font-size: 1.25rem;
}
.date-box .month,
.date-box .year {
font-size: 0.75rem;
}
.entry-content {
margin-left: 80px;
}
.entry-content h2 {
font-size: 1.5rem;
}
.entry-meta {
flex-direction: column;
gap: 0.5rem;
}
}
@media (max-width: 576px) {
.timeline::before {
left: 20px;
}
.entry-date {
width: 40px;
}
.date-box {
width: 40px;
height: 70px;
padding: 0.25rem;
}
.date-box .day {
font-size: 1rem;
}
.date-box .month,
.date-box .year {
font-size: 0.65rem;
}
.entry-content {
margin-left: 60px;
padding: 1.5rem;
}
.entry-gallery {
grid-template-columns: 1fr;
}
}

200
site/css/resources.css Normal file
View file

@ -0,0 +1,200 @@
/* Стили для страницы ресурсов */
/* Resources Section */
.resources-section {
padding: 5rem 0;
}
.resources-grid {
display: flex;
flex-direction: column;
gap: 4rem;
}
.resource-category {
margin-bottom: 2rem;
}
.resource-category h2 {
position: relative;
padding-bottom: 1rem;
margin-bottom: 2rem;
}
.resource-category h2::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 80px;
height: 4px;
background-color: var(--primary-color);
border-radius: 2px;
}
.resource-list {
display: flex;
flex-direction: column;
gap: 2rem;
}
.resource-card {
display: flex;
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
overflow: hidden;
box-shadow: var(--shadow-md);
transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}
.resource-card:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-lg);
}
.resource-icon {
width: 100px;
min-width: 100px;
display: flex;
align-items: center;
justify-content: center;
padding: 1.5rem;
background-color: var(--bg-secondary);
}
.resource-icon img {
width: 64px;
height: 64px;
object-fit: contain;
}
.resource-info {
padding: 1.5rem;
flex-grow: 1;
}
.resource-info h3 {
font-size: 1.25rem;
margin-bottom: 0.75rem;
color: var(--primary-color);
}
.resource-info p {
color: var(--text-secondary);
margin-bottom: 1.25rem;
font-size: 0.95rem;
}
.resource-link {
display: inline-flex;
align-items: center;
font-weight: var(--font-weight-medium);
color: var(--primary-color);
margin-right: 1.5rem;
transition: all var(--transition-fast);
}
.resource-link:hover {
color: var(--primary-dark);
text-decoration: underline;
}
/* Resources Downloads */
.resources-downloads {
padding: 5rem 0;
background-color: var(--bg-secondary);
}
.downloads-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
margin-top: 3rem;
}
.download-card {
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
padding: 2rem;
box-shadow: var(--shadow-md);
display: flex;
flex-direction: column;
height: 100%;
transition: transform var(--transition-normal);
}
.download-card:hover {
transform: translateY(-5px);
}
.download-icon {
width: 64px;
height: 64px;
background-color: var(--secondary-color);
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}
.download-icon img {
width: 32px;
height: 32px;
}
.download-info {
flex-grow: 1;
display: flex;
flex-direction: column;
}
.download-info h3 {
font-size: 1.25rem;
margin-bottom: 0.75rem;
}
.download-info p {
color: var(--text-secondary);
margin-bottom: 1.5rem;
font-size: 0.95rem;
flex-grow: 1;
}
.download-info .btn {
align-self: flex-start;
}
/* Responsive Styles */
@media (max-width: 768px) {
.resource-card {
flex-direction: column;
}
.resource-icon {
width: 100%;
padding: 1rem;
}
.downloads-grid {
grid-template-columns: 1fr;
}
}
@media (max-width: 576px) {
.resource-list {
gap: 1.5rem;
}
.resource-info {
padding: 1.25rem;
}
.resource-info h3 {
font-size: 1.1rem;
}
.download-card {
padding: 1.5rem;
}
}

533
site/css/style.css Normal file
View file

@ -0,0 +1,533 @@
/* Основные стили для сайта EasyAccess */
:root {
/* Основная цветовая палитра */
--primary-color: #2563eb;
--primary-dark: #1d4ed8;
--primary-light: #3b82f6;
--secondary-color: #e6ecfa;
--accent-color: #059669;
/* Нейтральные цвета */
--text-primary: #111827;
--text-secondary: #4b5563;
--text-tertiary: #6b7280;
--bg-color: #ffffff;
--bg-secondary: #f3f4f6;
--bg-tertiary: #e5e7eb;
/* Структурные переменные */
--container-max-width: 1200px;
--container-padding: 1.5rem;
--border-radius-sm: 0.25rem;
--border-radius-md: 0.5rem;
--border-radius-lg: 1rem;
/* Типографика */
--font-family-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
--font-family-heading: 'Manrope', var(--font-family-base);
--font-weight-normal: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
/* Анимации */
--transition-fast: 150ms ease;
--transition-normal: 250ms ease;
--transition-slow: 350ms ease;
/* Тени */
--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
/* Базовые стили */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
@font-face {
font-family: 'Inter';
src: url('../fonts/Inter-Regular.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src: url('../fonts/Inter-Medium.woff2') format('woff2');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src: url('../fonts/Inter-SemiBold.woff2') format('woff2');
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src: url('../fonts/Inter-Bold.woff2') format('woff2');
font-weight: 700;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Manrope';
src: url('../fonts/Manrope-Bold.woff2') format('woff2');
font-weight: 700;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Manrope';
src: url('../fonts/Manrope-SemiBold.woff2') format('woff2');
font-weight: 600;
font-style: normal;
font-display: swap;
}
html {
font-size: 16px;
scroll-behavior: smooth;
}
body {
font-family: var(--font-family-base);
font-weight: var(--font-weight-normal);
line-height: 1.5;
color: var(--text-primary);
background-color: var(--bg-color);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
img {
max-width: 100%;
height: auto;
display: block;
}
a {
color: var(--primary-color);
text-decoration: none;
transition: color var(--transition-fast);
}
a:hover {
color: var(--primary-dark);
}
h1, h2, h3, h4, h5, h6 {
font-family: var(--font-family-heading);
font-weight: var(--font-weight-bold);
line-height: 1.2;
margin-bottom: 1rem;
color: var(--text-primary);
}
h1 {
font-size: 3rem;
margin-bottom: 1.5rem;
}
h2 {
font-size: 2.25rem;
margin-bottom: 1.25rem;
}
h3 {
font-size: 1.5rem;
margin-bottom: 1rem;
}
p {
margin-bottom: 1rem;
}
ul, ol {
padding-left: 1.5rem;
margin-bottom: 1rem;
}
/* Utility Classes */
.container {
width: 100%;
max-width: var(--container-max-width);
padding-left: var(--container-padding);
padding-right: var(--container-padding);
margin-left: auto;
margin-right: auto;
}
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.75rem 1.5rem;
border-radius: var(--border-radius-md);
font-weight: var(--font-weight-medium);
font-size: 1rem;
transition: all var(--transition-normal);
cursor: pointer;
text-align: center;
text-decoration: none;
}
.btn.primary {
background-color: var(--primary-color);
color: white;
border: 2px solid var(--primary-color);
}
.btn.primary:hover {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
.btn.secondary {
background-color: transparent;
color: var(--primary-color);
border: 2px solid var(--primary-color);
}
.btn.secondary:hover {
background-color: var(--secondary-color);
}
.read-more {
display: inline-flex;
align-items: center;
font-weight: var(--font-weight-medium);
color: var(--primary-color);
transition: all var(--transition-fast);
}
.read-more:hover {
color: var(--primary-dark);
text-decoration: underline;
}
.highlight {
color: var(--primary-color);
}
/* Header Styles */
header {
position: fixed;
top: 0;
left: 0;
width: 100%;
background-color: rgba(255, 255, 255, 0.95);
backdrop-filter: blur(10px);
z-index: 1000;
box-shadow: var(--shadow-sm);
transition: all var(--transition-normal);
}
header.scrolled {
box-shadow: var(--shadow-md);
}
.main-nav {
display: flex;
justify-content: space-between;
align-items: center;
height: 80px;
}
.logo {
display: flex;
}
.logo a {
display: flex;
align-items: center;
color: var(--text-primary);
font-weight: var(--font-weight-bold);
font-size: 1.25rem;
}
.logo img {
height: 36px;
width: auto;
margin-right: 0.75rem;
}
.nav-links {
display: flex;
list-style: none;
margin: 0;
padding: 0;
}
.nav-links li:not(:last-child) {
margin-right: 1.5rem;
}
.nav-links a {
display: block;
padding: 0.5rem 0;
color: var(--text-secondary);
position: relative;
}
.nav-links a:hover {
color: var(--primary-color);
}
.nav-links a.active {
color: var(--primary-color);
font-weight: var(--font-weight-medium);
}
.nav-links a.active::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2px;
background-color: var(--primary-color);
border-radius: 1px;
}
.mobile-menu-toggle {
display: none;
flex-direction: column;
justify-content: space-between;
width: 24px;
height: 18px;
background: none;
border: none;
cursor: pointer;
}
.mobile-menu-toggle span {
width: 100%;
height: 2px;
background-color: var(--text-primary);
border-radius: 1px;
transition: all var(--transition-fast);
}
/* Main Content Sections */
main {
margin-top: 80px; /* Компенсация фиксированного хедера */
}
section {
padding: 5rem 0;
}
section:nth-child(even) {
background-color: var(--bg-secondary);
}
/* Page Hero - общие стили для заголовков страниц */
.page-hero {
padding: 8rem 0 4rem;
background: linear-gradient(135deg, var(--secondary-color) 0%, #f0f7ff 100%);
text-align: center;
position: relative;
overflow: hidden;
}
.page-hero::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('../images/pattern.svg');
background-size: cover;
opacity: 0.1;
z-index: 1;
}
.page-hero .container {
position: relative;
z-index: 2;
}
.page-subtitle {
font-size: 1.25rem;
color: var(--text-secondary);
max-width: 700px;
margin: 0 auto;
}
/* Footer Styles */
footer {
background-color: var(--text-primary);
color: white;
padding: 4rem 0 2rem;
}
.footer-content {
display: flex;
justify-content: space-between;
margin-bottom: 3rem;
}
.footer-logo {
display: flex;
align-items: center;
margin-bottom: 1rem;
}
.footer-logo img {
height: 36px;
width: auto;
margin-right: 0.75rem;
border-radius: 10px;
}
.footer-logo span {
font-size: 1.25rem;
font-weight: var(--font-weight-bold);
color: white;
}
.footer-links {
display: flex;
}
.footer-nav {
margin-left: 3rem;
}
.footer-nav h4 {
color: white;
margin-bottom: 1rem;
font-size: 1rem;
}
.footer-nav ul {
list-style: none;
padding: 0;
margin: 0;
}
.footer-nav li:not(:last-child) {
margin-bottom: 0.5rem;
}
.footer-nav a {
color: rgba(255, 255, 255, 0.7);
transition: color var(--transition-fast);
}
.footer-nav a:hover {
color: white;
}
.footer-bottom {
padding-top: 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
text-align: center;
color: rgba(255, 255, 255, 0.6);
font-size: 0.875rem;
}
/* Responsive Design */
@media (max-width: 1024px) {
h1 {
font-size: 2.5rem;
}
h2 {
font-size: 2rem;
}
}
@media (max-width: 768px) {
h1 {
font-size: 2.25rem;
}
h2 {
font-size: 1.75rem;
}
.mobile-menu-toggle {
display: flex;
}
.nav-links {
position: fixed;
top: 80px;
left: 0;
width: 100%;
flex-direction: column;
background-color: white;
box-shadow: var(--shadow-md);
padding: 1rem 0;
transform: translateY(-100%);
opacity: 0;
visibility: hidden;
transition: all var(--transition-normal);
}
.nav-links.active {
transform: translateY(0);
opacity: 1;
visibility: visible;
}
.nav-links li {
width: 100%;
margin: 0 !important;
}
.nav-links a {
padding: 1rem 1.5rem;
}
.footer-content {
flex-direction: column;
}
.footer-links {
margin-top: 2rem;
}
.footer-nav {
margin-left: 0;
margin-right: 2rem;
}
}
@media (max-width: 576px) {
h1 {
font-size: 2rem;
}
h2 {
font-size: 1.5rem;
}
section {
padding: 3rem 0;
}
.footer-links {
flex-direction: column;
}
.footer-nav {
margin-right: 0;
margin-bottom: 2rem;
}
}

202
site/css/team.css Normal file
View file

@ -0,0 +1,202 @@
/* Стили для страницы участников проекта */
/* Team Section */
.team-section {
padding: 5rem 0;
}
.team-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
gap: 2rem;
margin-top: 3rem;
}
.team-card {
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
overflow: hidden;
box-shadow: var(--shadow-md);
display: flex;
flex-direction: column;
height: 100%;
transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}
.team-card:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-lg);
}
.member-photo {
width: 100%;
aspect-ratio: 4/3;
overflow: hidden;
}
.member-photo img {
width: 100%;
height: 100%;
object-fit: contain;
aspect-ratio: 1;
}
.team-card:hover .member-photo img {
transform: scale(1.05);
}
.member-info {
padding: 1.5rem;
flex-grow: 1;
display: flex;
flex-direction: column;
}
.member-info h3 {
font-size: 1.25rem;
margin-bottom: 0.5rem;
}
.member-role {
color: var(--primary-color);
font-weight: var(--font-weight-medium);
margin-bottom: 1.5rem;
}
.contribution {
margin-top: auto;
}
.contribution h4 {
font-size: 1rem;
margin-bottom: 0.75rem;
color: var(--text-secondary);
}
.contribution ul {
list-style: none;
padding: 0;
margin: 0;
}
.contribution li {
position: relative;
padding-left: 1.5rem;
margin-bottom: 0.5rem;
font-size: 0.95rem;
color: var(--text-tertiary);
}
.contribution li::before {
content: '•';
position: absolute;
left: 0.5rem;
color: var(--primary-color);
}
/* Curators Section */
.curators-section {
padding: 5rem 0;
background-color: var(--bg-secondary);
}
.curators-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
margin-top: 3rem;
}
.curator-card {
background-color: var(--bg-color);
border-radius: var(--border-radius-lg);
overflow: hidden;
box-shadow: var(--shadow-md);
transition: transform var(--transition-normal);
}
.curator-card:hover {
transform: translateY(-5px);
}
.curator-photo {
width: 100%;
aspect-ratio: 1/1;
overflow: hidden;
}
.curator-photo img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform var(--transition-slow);
}
.curator-card:hover .curator-photo img {
transform: scale(1.05);
}
.curator-info {
padding: 1.5rem;
text-align: center;
}
.curator-info h3 {
font-size: 1.25rem;
margin-bottom: 0.5rem;
}
.curator-role {
color: var(--primary-color);
font-weight: var(--font-weight-medium);
margin-bottom: 0.25rem;
}
.curator-title {
color: var(--text-tertiary);
font-size: 0.95rem;
}
/* Team Structure */
.team-structure {
padding: 5rem 0;
}
.structure-diagram {
max-width: 900px;
margin: 3rem auto;
border-radius: var(--border-radius-lg);
overflow: hidden;
box-shadow: var(--shadow-lg);
}
.structure-diagram img {
width: 100%;
height: auto;
display: block;
}
.section-outro {
max-width: 800px;
margin: 2rem auto 0;
text-align: center;
color: var(--text-secondary);
font-size: 1.125rem;
}
/* Responsive Styles */
@media (max-width: 768px) {
.team-grid, .curators-grid {
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
}
@media (max-width: 576px) {
.team-grid, .curators-grid {
grid-template-columns: 1fr;
}
.member-photo, .curator-photo {
aspect-ratio: 3/2;
}
}

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 247 KiB

BIN
site/images/db.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 118 KiB

View file

@ -0,0 +1,13 @@
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- Белый фон с padding -->
<rect width="48" height="48" fill="white" />
<!-- Группа элементов лого со сдвигом (transform) -->
<g transform="translate(6.5, 6)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.5383 7.16335C9.47047 6.09551 7.73915 6.09551 6.67131 7.16335C5.60348 8.23119 5.60348 9.96249 6.67131 11.0303L9.18638 13.5454C11.6432 16.0023 11.6433 19.9856 9.18638 22.4425L6.66344 24.9655C5.59561 26.0333 5.5956 27.7646 6.66344 28.8324C7.73128 29.9003 9.46259 29.9003 10.5304 28.8325L13.0564 26.3065C15.5116 23.8513 19.4922 23.8513 21.9474 26.3065L24.4594 28.8185C25.5273 29.8863 27.2586 29.8863 28.3264 28.8185C29.3943 27.7506 29.3943 26.0193 28.3264 24.9515L25.8105 22.4355C23.3575 19.9825 23.3575 16.0054 25.8105 13.5524L28.3186 11.0443C29.3864 9.97646 29.3864 8.24515 28.3186 7.17731C27.2507 6.10947 25.5194 6.10948 24.4516 7.17732L21.9435 9.6854C19.4905 12.1384 15.5134 12.1384 13.0603 9.6854L10.5383 7.16335Z" fill="#2563EB"/>
<ellipse cx="17.4999" cy="3.43125" rx="2.93124" ry="2.93125" fill="#2563EB"/>
<ellipse cx="32.0687" cy="18" rx="2.93124" ry="2.93125" fill="#2563EB"/>
<ellipse cx="17.4999" cy="32.5687" rx="2.93124" ry="2.93125" fill="#2563EB"/>
<ellipse cx="2.93124" cy="18" rx="2.93124" ry="2.93125" fill="#2563EB"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
site/images/extension.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 211 KiB

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-accessible"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" /><path d="M10 16.5l2 -3l2 3m-2 -3v-2l3 -1m-6 0l3 1" /><circle cx="12" cy="7.5" r=".5" fill="#2563EB" /></svg>

After

Width:  |  Height:  |  Size: 469 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-chrome"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" /><path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" /><path d="M12 9h8.4" /><path d="M14.598 13.5l-4.2 7.275" /><path d="M9.402 13.5l-4.2 -7.275" /></svg>

After

Width:  |  Height:  |  Size: 516 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brain"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15.5 13a3.5 3.5 0 0 0 -3.5 3.5v1a3.5 3.5 0 0 0 7 0v-1.8" /><path d="M8.5 13a3.5 3.5 0 0 1 3.5 3.5v1a3.5 3.5 0 0 1 -7 0v-1.8" /><path d="M17.5 16a3.5 3.5 0 0 0 0 -7h-.5" /><path d="M19 9.3v-2.8a3.5 3.5 0 0 0 -7 0" /><path d="M6.5 16a3.5 3.5 0 0 1 0 -7h.5" /><path d="M5 9.3v-2.8a3.5 3.5 0 0 1 7 0v10" /></svg>

After

Width:  |  Height:  |  Size: 619 B

View file

@ -0,0 +1,17 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="1766.000000pt" height="1682.000000pt" viewBox="0 0 1766.000000 1682.000000"
preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,1682.000000) scale(0.100000,-0.100000)"
fill="#2563EB" stroke="none">
<path d="M12140 12600 l0 -940 929 0 929 0 4 51 c1 28 2 451 0 940 l-2 889
-930 0 -930 0 0 -940z"/>
<path d="M3730 7905 l0 -4695 4670 0 4670 0 0 3755 0 3755 -935 0 -935 0 0
-2815 0 -2815 -2805 0 -2805 0 2 2818 3 2817 2803 3 2802 2 0 935 0 935 -3735
0 -3735 0 0 -4695z"/>
<path d="M7550 7905 l0 -855 850 0 850 0 0 855 0 855 -850 0 -850 0 0 -855z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 789 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-text-scan-2"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 8v-2a2 2 0 0 1 2 -2h2" /><path d="M4 16v2a2 2 0 0 0 2 2h2" /><path d="M16 4h2a2 2 0 0 1 2 2v2" /><path d="M16 20h2a2 2 0 0 0 2 -2v-2" /><path d="M8 12h8" /><path d="M8 9h6" /><path d="M8 15h4" /></svg>

After

Width:  |  Height:  |  Size: 520 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-file-text"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M14 3v4a1 1 0 0 0 1 1h4" /><path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z" /><path d="M9 9l1 0" /><path d="M9 13l6 0" /><path d="M9 17l6 0" /></svg>

After

Width:  |  Height:  |  Size: 495 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 91 KiB

View file

@ -0,0 +1,13 @@
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- Белый фон с padding -->
<rect width="48" height="48" fill="white" />
<!-- Группа элементов лого со сдвигом (transform) -->
<g transform="translate(6.5, 6)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.5383 7.16335C9.47047 6.09551 7.73915 6.09551 6.67131 7.16335C5.60348 8.23119 5.60348 9.96249 6.67131 11.0303L9.18638 13.5454C11.6432 16.0023 11.6433 19.9856 9.18638 22.4425L6.66344 24.9655C5.59561 26.0333 5.5956 27.7646 6.66344 28.8324C7.73128 29.9003 9.46259 29.9003 10.5304 28.8325L13.0564 26.3065C15.5116 23.8513 19.4922 23.8513 21.9474 26.3065L24.4594 28.8185C25.5273 29.8863 27.2586 29.8863 28.3264 28.8185C29.3943 27.7506 29.3943 26.0193 28.3264 24.9515L25.8105 22.4355C23.3575 19.9825 23.3575 16.0054 25.8105 13.5524L28.3186 11.0443C29.3864 9.97646 29.3864 8.24515 28.3186 7.17731C27.2507 6.10947 25.5194 6.10948 24.4516 7.17732L21.9435 9.6854C19.4905 12.1384 15.5134 12.1384 13.0603 9.6854L10.5383 7.16335Z" fill="#2563EB"/>
<ellipse cx="17.4999" cy="3.43125" rx="2.93124" ry="2.93125" fill="#2563EB"/>
<ellipse cx="32.0687" cy="18" rx="2.93124" ry="2.93125" fill="#2563EB"/>
<ellipse cx="17.4999" cy="32.5687" rx="2.93124" ry="2.93125" fill="#2563EB"/>
<ellipse cx="2.93124" cy="18" rx="2.93124" ry="2.93125" fill="#2563EB"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-firefox"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4.028 7.82a9 9 0 1 0 12.823 -3.4c-1.636 -1.02 -3.064 -1.02 -4.851 -1.02h-1.647" /><path d="M4.914 9.485c-1.756 -1.569 -.805 -5.38 .109 -6.17c.086 .896 .585 1.208 1.111 1.685c.88 -.275 1.313 -.282 1.867 0c.82 -.91 1.694 -2.354 2.628 -2.093c-1.082 1.741 -.07 3.733 1.371 4.173c-.17 .975 -1.484 1.913 -2.76 2.686c-1.296 .938 -.722 1.85 0 2.234c.949 .506 3.611 -1 4.545 .354c-1.698 .102 -1.536 3.107 -3.983 2.727c2.523 .957 4.345 .462 5.458 -.34c1.965 -1.52 2.879 -3.542 2.879 -5.557c-.014 -1.398 .194 -2.695 -1.26 -4.75" /></svg>

After

Width:  |  Height:  |  Size: 845 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-checklist"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9.615 20h-2.615a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8" /><path d="M14 19l2 2l4 -4" /><path d="M9 8h4" /><path d="M9 12h2" /></svg>

After

Width:  |  Height:  |  Size: 460 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-app-window"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 5m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z" /><path d="M6 8h.01" /><path d="M9 8h.01" /></svg>

After

Width:  |  Height:  |  Size: 446 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-keyboard"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M2 6m0 2a2 2 0 0 1 2 -2h16a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-16a2 2 0 0 1 -2 -2z" /><path d="M6 10l0 .01" /><path d="M10 10l0 .01" /><path d="M14 10l0 .01" /><path d="M18 10l0 .01" /><path d="M6 14l0 .01" /><path d="M18 14l0 .01" /><path d="M10 14l4 .01" /></svg>

After

Width:  |  Height:  |  Size: 574 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-app-window"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 5m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z" /><path d="M6 8h.01" /><path d="M9 8h.01" /></svg>

After

Width:  |  Height:  |  Size: 446 B

File diff suppressed because it is too large Load diff

After

Width:  |  Height:  |  Size: 267 KiB

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-disabled"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M11 5m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M11 7l0 8l4 0l4 5" /><path d="M11 11l5 0" /><path d="M7 11.5a5 5 0 1 0 6 7.5" /></svg>

After

Width:  |  Height:  |  Size: 451 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-building-skyscraper"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 21l18 0" /><path d="M5 21v-14l8 -4v18" /><path d="M19 21v-10l-6 -4" /><path d="M9 9l0 .01" /><path d="M9 12l0 .01" /><path d="M9 15l0 .01" /><path d="M9 18l0 .01" /></svg>

After

Width:  |  Height:  |  Size: 498 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-device-ipad-horizontal-cog"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 20h-7a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v6" /><path d="M9 17h3" /><path d="M19.001 19m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M19.001 15.5v1.5" /><path d="M19.001 21v1.5" /><path d="M22.032 17.25l-1.299 .75" /><path d="M17.27 20l-1.3 .75" /><path d="M15.97 17.25l1.3 .75" /><path d="M20.733 20l1.3 .75" /></svg>

After

Width:  |  Height:  |  Size: 669 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-presentation"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 4l18 0" /><path d="M4 4v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-10" /><path d="M12 16l0 4" /><path d="M9 20l6 0" /><path d="M8 12l3 -3l2 2l3 -3" /></svg>

After

Width:  |  Height:  |  Size: 469 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-device-analytics"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 4m0 1a1 1 0 0 1 1 -1h16a1 1 0 0 1 1 1v10a1 1 0 0 1 -1 1h-16a1 1 0 0 1 -1 -1z" /><path d="M7 20l10 0" /><path d="M9 16l0 4" /><path d="M15 16l0 4" /><path d="M8 12l3 -3l2 2l3 -3" /></svg>

After

Width:  |  Height:  |  Size: 510 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-checklist"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9.615 20h-2.615a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8" /><path d="M14 19l2 2l4 -4" /><path d="M9 8h4" /><path d="M9 12h2" /></svg>

After

Width:  |  Height:  |  Size: 460 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-world-star"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M21 12a9 9 0 1 0 -9.968 8.948" /><path d="M3.6 9h16.8" /><path d="M3.6 15h6.4" /><path d="M11.5 3a17.001 17.001 0 0 0 -1.886 13.802" /><path d="M12.5 3a16.982 16.982 0 0 1 2.549 8.01" /><path d="M17.8 20.817l-2.172 1.138a.392 .392 0 0 1 -.568 -.41l.415 -2.411l-1.757 -1.707a.389 .389 0 0 1 .217 -.665l2.428 -.352l1.086 -2.193a.392 .392 0 0 1 .702 0l1.086 2.193l2.428 .352a.39 .39 0 0 1 .217 .665l-1.757 1.707l.414 2.41a.39 .39 0 0 1 -.567 .411l-2.172 -1.138z" /></svg>

After

Width:  |  Height:  |  Size: 783 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-circle-dashed-check"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M8.56 3.69a9 9 0 0 0 -2.92 1.95" /><path d="M3.69 8.56a9 9 0 0 0 -.69 3.44" /><path d="M3.69 15.44a9 9 0 0 0 1.95 2.92" /><path d="M8.56 20.31a9 9 0 0 0 3.44 .69" /><path d="M15.44 20.31a9 9 0 0 0 2.92 -1.95" /><path d="M20.31 15.44a9 9 0 0 0 .69 -3.44" /><path d="M20.31 8.56a9 9 0 0 0 -1.95 -2.92" /><path d="M15.44 3.69a9 9 0 0 0 -3.44 -.69" /><path d="M9 12l2 2l4 -4" /></svg>

After

Width:  |  Height:  |  Size: 704 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-eye-off"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M10.585 10.587a2 2 0 0 0 2.829 2.828" /><path d="M16.681 16.673a8.717 8.717 0 0 1 -4.681 1.327c-3.6 0 -6.6 -2 -9 -6c1.272 -2.12 2.712 -3.678 4.32 -4.674m2.86 -1.146a9.055 9.055 0 0 1 1.82 -.18c3.6 0 6.6 2 9 6c-.666 1.11 -1.379 2.067 -2.138 2.87" /><path d="M3 3l18 18" /></svg>

After

Width:  |  Height:  |  Size: 589 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-eye-cog"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0" /><path d="M12 18c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6" /><path d="M19.001 19m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M19.001 15.5v1.5" /><path d="M19.001 21v1.5" /><path d="M22.032 17.25l-1.299 .75" /><path d="M17.27 20l-1.3 .75" /><path d="M15.97 17.25l1.3 .75" /><path d="M20.733 20l1.3 .75" /></svg>

After

Width:  |  Height:  |  Size: 677 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-disabled"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M11 5m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M11 7l0 8l4 0l4 5" /><path d="M11 11l5 0" /><path d="M7 11.5a5 5 0 1 0 6 7.5" /></svg>

After

Width:  |  Height:  |  Size: 451 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-microphone"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 2m0 3a3 3 0 0 1 3 -3h0a3 3 0 0 1 3 3v5a3 3 0 0 1 -3 3h0a3 3 0 0 1 -3 -3z" /><path d="M5 10a7 7 0 0 0 14 0" /><path d="M8 21l8 0" /><path d="M12 17l0 4" /></svg>

After

Width:  |  Height:  |  Size: 478 B

20
site/images/icons/w3c.svg Normal file
View file

@ -0,0 +1,20 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="48.000000pt" height="48.000000pt" viewBox="0 0 48.000000 48.000000"
preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,48.000000) scale(0.100000,-0.100000)"
fill="#2563EB" stroke="#2563EB">
<path d="M5 411 c-7 -12 81 -331 96 -345 16 -17 33 13 54 98 11 42 22 76 25
76 3 0 14 -34 25 -76 10 -41 25 -83 32 -92 12 -16 14 -16 26 -1 6 9 30 82 52
163 l39 146 34 0 34 0 -23 -37 c-12 -21 -26 -42 -31 -47 -14 -16 -9 -46 7 -46
9 0 27 -11 40 -25 31 -30 34 -84 7 -108 -26 -24 -47 -21 -76 9 -22 25 -46 26
-46 3 0 -24 59 -69 90 -69 50 0 90 47 90 104 0 38 -6 52 -34 84 l-34 38 35 57
c19 31 32 61 28 67 -3 5 -37 10 -75 10 -82 0 -76 7 -116 -142 -16 -60 -32
-108 -35 -108 -3 0 -20 54 -38 120 -18 66 -37 123 -43 126 -20 12 -30 -13 -20
-49 8 -28 5 -53 -11 -116 -12 -45 -24 -81 -27 -81 -3 0 -18 48 -34 108 -16 59
-33 115 -38 125 -10 19 -24 22 -33 8z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 177 KiB

BIN
site/images/logo-white.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
site/images/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 185 KiB

BIN
site/images/team/deev.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 126 KiB

BIN
site/images/team/momina.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 129 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 150 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 85 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 188 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 177 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.4 KiB

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-golang"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15.695 14.305c1.061 1.06 2.953 .888 4.226 -.384c1.272 -1.273 1.444 -3.165 .384 -4.226c-1.061 -1.06 -2.953 -.888 -4.226 .384c-1.272 1.273 -1.444 3.165 -.384 4.226z" /><path d="M12.68 9.233c-1.084 -.497 -2.545 -.191 -3.591 .846c-1.284 1.273 -1.457 3.165 -.388 4.226c1.07 1.06 2.978 .888 4.261 -.384a3.669 3.669 0 0 0 1.038 -1.921h-2.427" /><path d="M5.5 15h-1.5" /><path d="M6 9h-2" /><path d="M5 12h-3" /></svg>

After

Width:  |  Height:  |  Size: 728 B

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 7.6 KiB

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-python"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 9h-7a2 2 0 0 0 -2 2v4a2 2 0 0 0 2 2h3" /><path d="M12 15h7a2 2 0 0 0 2 -2v-4a2 2 0 0 0 -2 -2h-3" /><path d="M8 9v-4a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v5a2 2 0 0 1 -2 2h-4a2 2 0 0 0 -2 2v5a2 2 0 0 0 2 2h4a2 2 0 0 0 2 -2v-4" /><path d="M11 6l0 .01" /><path d="M13 18l0 .01" /></svg>

After

Width:  |  Height:  |  Size: 597 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-react"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M6.306 8.711c-2.602 .723 -4.306 1.926 -4.306 3.289c0 2.21 4.477 4 10 4c.773 0 1.526 -.035 2.248 -.102" /><path d="M17.692 15.289c2.603 -.722 4.308 -1.926 4.308 -3.289c0 -2.21 -4.477 -4 -10 -4c-.773 0 -1.526 .035 -2.25 .102" /><path d="M6.305 15.287c-.676 2.615 -.485 4.693 .695 5.373c1.913 1.105 5.703 -1.877 8.464 -6.66c.387 -.67 .733 -1.339 1.036 -2" /><path d="M17.694 8.716c.677 -2.616 .487 -4.696 -.694 -5.376c-1.913 -1.105 -5.703 1.877 -8.464 6.66c-.387 .67 -.733 1.34 -1.037 2" /><path d="M12 5.424c-1.925 -1.892 -3.82 -2.766 -5 -2.084c-1.913 1.104 -1.226 5.877 1.536 10.66c.386 .67 .793 1.304 1.212 1.896" /><path d="M12 18.574c1.926 1.893 3.821 2.768 5 2.086c1.913 -1.104 1.226 -5.877 -1.536 -10.66c-.375 -.65 -.78 -1.283 -1.212 -1.897" /><path d="M11.5 12.866a1 1 0 1 0 1 -1.732a1 1 0 0 0 -1 1.732z" /></svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-solidjs"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M2 17.5c4.667 3 8 4.5 10 4.5c2.5 0 4 -1.5 4 -3.5s-1.5 -3.5 -4 -3.5c-2 0 -5.333 .833 -10 2.5z" /><path d="M5 13.5c4.667 -1.667 8 -2.5 10 -2.5c2.5 0 4 1.5 4 3.5c0 .738 -.204 1.408 -.588 1.96l-2.883 3.825" /><path d="M22 6.5c-4 -3 -8 -4.5 -10 -4.5c-2.04 0 -2.618 .463 -3.419 1.545" /><path d="M2 17.5l3 -4" /><path d="M22 6.5l-3 4" /><path d="M8.581 3.545l-2.953 3.711" /><path d="M7.416 12.662c-1.51 -.476 -2.416 -1.479 -2.416 -3.162c0 -2.5 1.5 -3.5 4 -3.5c1.688 0 5.087 1.068 8.198 3.204a114.76 114.76 0 0 1 1.802 1.296l-2.302 .785" /></svg>

After

Width:  |  Height:  |  Size: 858 B

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563EB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-typescript"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 17.5c.32 .32 .754 .5 1.207 .5h.543c.69 0 1.25 -.56 1.25 -1.25v-.25a1.5 1.5 0 0 0 -1.5 -1.5a1.5 1.5 0 0 1 -1.5 -1.5v-.25c0 -.69 .56 -1.25 1.25 -1.25h.543c.453 0 .887 .18 1.207 .5" /><path d="M9 12h4" /><path d="M11 12v6" /><path d="M21 19v-14a2 2 0 0 0 -2 -2h-14a2 2 0 0 0 -2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2 -2z" /></svg>

After

Width:  |  Height:  |  Size: 647 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 226 KiB

View file

@ -0,0 +1,266 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>EasyAccess - Браузерное расширение для повышения доступности веб-сайтов</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/home.css">
<link rel="icon" href="images/icons/favicon.ico" type="image/x-icon">
<meta name="description" content="EasyAccess - браузерное расширение для универсальной модификации веб-страниц с целью повышения доступности контента для лиц с ограниченными возможностями здоровья">
</head>
<body>
<header>
<div class="container">
<nav class="main-nav">
<div class="logo">
<a href="index.html">
<img src="images/logo.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</a>
</div>
<ul class="nav-links">
<li><a href="index.html" class="active">Главная</a></li>
<li><a href="about.html">О проекте</a></li>
<li><a href="team.html">Участники</a></li>
<li><a href="journal.html">Журнал</a></li>
<li><a href="resources.html">Ресурсы</a></li>
</ul>
<button class="mobile-menu-toggle" aria-label="Открыть меню">
<span></span>
<span></span>
<span></span>
</button>
</nav>
</div>
</header>
<main>
<section class="hero">
<div class="container">
<div class="hero-content">
<h1>Делаем<br>интернет доступным<br>для <span class="highlight">каждого</span></h1>
<p class="hero-description">
EasyAccess — браузерное расширение, которое повышает доступность веб-сайтов
для людей с ограниченными возможностями здоровья через систему пакетов модификаций
</p>
<div class="hero-cta">
<a href="#features" class="btn primary">Возможности</a>
<a href="about.html" class="btn secondary">Узнать больше</a>
</div>
</div>
<div class="hero-image">
<img src="images/work-ilustration.png" alt="Иллюстрация EasyAccess в работе">
</div>
</div>
</section>
<section class="project-summary">
<div class="container">
<h2>О проекте EasyAccess</h2>
<div class="summary-content">
<div class="summary-text">
<p>
EasyAccess представляет собой комплексное браузерное расширение, разработанное для универсальной модификации
веб-страниц с целью повышения доступности контента для лиц с ограниченными возможностями здоровья.
</p>
<p>
Расширение объединяет в себе возможности нескольких специализированных инструментов и предоставляет дополнительные
функции, включая настройку визуального отображения, голосовое управление, обработку документов и другие возможности.
</p>
<a href="about.html" class="read-more">Подробнее о проекте →</a>
</div>
<div class="summary-stats">
<div class="stat-item">
<span class="stat-number">14</span>
<span class="stat-label">Участников команды</span>
</div>
<div class="stat-item">
<span class="stat-number">5+</span>
<span class="stat-label">Технологий</span>
</div>
<div class="stat-item">
<span class="stat-number"></span>
<span class="stat-label">Возможностей</span>
</div>
</div>
</div>
</div>
</section>
<section id="features" class="features">
<div class="container">
<h2>Ключевые возможности</h2>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">
<img src="images/icons/visual.svg" alt="Иконка визуальных настроек">
</div>
<h3>Визуальные настройки</h3>
<p>Изменение размера текста, контрастности, цветовых схем и других визуальных элементов</p>
</div>
<div class="feature-card">
<div class="feature-icon">
<img src="images/icons/voice.svg" alt="Иконка голосового управления">
</div>
<h3>Голосовое управление</h3>
<p>Распознавание голосовых команд и чтение контента вслух для незрячих пользователей</p>
</div>
<div class="feature-card">
<div class="feature-icon">
<img src="images/icons/docs.svg" alt="Иконка работы с документами">
</div>
<h3>Работа с документами</h3>
<p>Распознавание текста из изображений и документов для облегчения доступа к информации</p>
</div>
<div class="feature-card">
<div class="feature-icon">
<img src="images/icons/keyboard.svg" alt="Иконка клавиатурной навигации">
</div>
<h3>Клавиатурная навигация</h3>
<p>Улучшенная доступность управления с клавиатуры для пользователей с двигательными нарушениями</p>
</div>
<div class="feature-card">
<div class="feature-icon">
<img src="images/icons/interface.svg" alt="Иконка упрощения интерфейса">
</div>
<h3>Упрощение интерфейса</h3>
<p>Удаление отвлекающих элементов для улучшения восприятия пользователями с когнитивными нарушениями</p>
</div>
<div class="feature-card">
<div class="feature-icon">
<img src="images/icons/packages.svg" alt="Иконка пакетов модификаций">
</div>
<h3>Пакеты модификаций</h3>
<p>Система пакетов для комплексной настройки доступности конкретных сайтов под нужды пользователя</p>
</div>
</div>
</div>
</section>
<section class="tech-stack">
<div class="container">
<h2>Используемые технологии</h2>
<div class="tech-grid">
<div class="tech-item">
<img src="images/tech/typescript.svg" alt="TypeScript">
<span>TypeScript</span>
</div>
<div class="tech-item">
<img src="images/tech/react.svg" alt="React">
<span>React</span>
</div>
<div class="tech-item">
<img src="images/tech/solidjs.svg" alt="Solid.js">
<span>Solid.js</span>
</div>
<div class="tech-item">
<img src="images/tech/golang.svg" alt="Go">
<span>Go</span>
</div>
<div class="tech-item">
<img src="images/tech/python.svg" alt="Python">
<span>Python</span>
</div>
<div class="tech-item">
<img src="images/tech/postgresql.svg" alt="PostgreSQL">
<span>PostgreSQL</span>
</div>
</div>
</div>
</section>
<section class="latest-updates">
<div class="container">
<h2>Последние обновления проекта</h2>
<div class="updates-grid">
<div class="update-card">
<div class="update-date">
<span class="day">28</span>
<span class="month">Февраля</span>
<span class="year">2025</span>
</div>
<div class="update-content">
<h3>Разработана база данных и серверная часть</h3>
<p>Завершена работа над базой данных с использованием PostgreSQL и расширения TimescaleDB. Реализована серверная часть на Go с API для взаимодействия с клиентом.</p>
<a href="journal.html#update-db" class="read-more">Читать полностью →</a>
</div>
</div>
<div class="update-card">
<div class="update-date">
<span class="day">10</span>
<span class="month">Марта</span>
<span class="year">2025</span>
</div>
<div class="update-content">
<h3>Создан интерфейс расширения и маркетплейс</h3>
<p>Разработан пользовательский интерфейс расширения с использованием TypeScript и Solid.js. Реализован маркетплейс для обмена пакетами модификаций.</p>
<a href="journal.html#update-ui" class="read-more">Читать полностью →</a>
</div>
</div>
<div class="update-card">
<div class="update-date">
<span class="day">25</span>
<span class="month">Марта</span>
<span class="year">2025</span>
</div>
<div class="update-content">
<h3>Проведен анализ предметной области</h3>
<p>Выполнено исследование веб-доступности и существующих решений. Определены ключевые потребности пользователей и разработана архитектура приложения.</p>
<a href="journal.html#update-research" class="read-more">Читать полностью →</a>
</div>
</div>
</div>
<div class="view-all-updates">
<a href="journal.html" class="btn secondary">Все обновления</a>
</div>
</div>
</section>
<section class="cta-section">
<div class="container">
<div class="cta-content">
<h2>Присоединяйтесь к разработке</h2>
<p>Проект EasyAccess находится в активной разработке, и мы всегда открыты для новых идей и сотрудничества. Если вы хотите внести свой вклад или у вас есть предложения по улучшению, свяжитесь с нами!</p>
<a href="mailto:admin@new-devs.ru" class="btn primary">Связаться с командой</a>
</div>
</div>
</section>
</main>
<footer>
<div class="container">
<div class="footer-content">
<div class="footer-logo">
<img src="images/logo-white.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</div>
<div class="footer-links">
<div class="footer-nav">
<h4>Навигация</h4>
<ul>
<li><a href="index.html">Главная</a></li>
<li><a href="about.html">О проекте</a></li>
<li><a href="team.html">Участники</a></li>
<li><a href="journal.html">Журнал</a></li>
<li><a href="resources.html">Ресурсы</a></li>
</ul>
</div>
<div class="footer-nav">
<h4>Контакты</h4>
<ul>
<li><a href="mailto:admin@new-devs.ru">Email</a></li>
<li><a href="https://github.com/easyaccess-team" target="_blank">GitHub</a></li>
</ul>
</div>
</div>
</div>
<div class="footer-bottom">
<p>&copy; 2025 EasyAccess. Проектная деятельность, Московский Политех</p>
</div>
</div>
</footer>
<script src="js/main.js"></script>
</body>
</html>

503
site/journal.html Normal file
View file

@ -0,0 +1,503 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Журнал проекта - EasyAccess</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/journal.css">
<link rel="icon" href="images/icons/favicon.ico" type="image/x-icon">
<meta name="description" content="Журнал разработки проекта EasyAccess - браузерного расширения для повышения доступности веб-сайтов">
</head>
<body>
<header>
<div class="container">
<nav class="main-nav">
<div class="logo">
<a href="index.html">
<img src="images/logo.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</a>
</div>
<ul class="nav-links">
<li><a href="index.html">Главная</a></li>
<li><a href="about.html">О проекте</a></li>
<li><a href="team.html">Участники</a></li>
<li><a href="journal.html" class="active">Журнал</a></li>
<li><a href="resources.html">Ресурсы</a></li>
</ul>
<button class="mobile-menu-toggle" aria-label="Открыть меню">
<span></span>
<span></span>
<span></span>
</button>
</nav>
</div>
</header>
<main>
<section class="page-hero">
<div class="container">
<h1>Журнал разработки</h1>
<p class="page-subtitle">Хроника разработки проекта EasyAccess</p>
</div>
</section>
<section class="journal-timeline">
<div class="container">
<div class="timeline">
<div class="timeline-entry" id="update-db">
<div class="entry-date">
<div class="date-box">
<span class="day">28</span>
<span class="month">Февраля</span>
<span class="year">2025</span>
</div>
</div>
<div class="entry-content">
<h2>Разработана база данных и серверная часть</h2>
<div class="entry-meta">
<span class="entry-author">Автор: Деев Егор</span>
<span class="entry-category">Категория: Backend</span>
</div>
<div class="entry-body">
<p>
Завершена работа над базой данных с использованием PostgreSQL и расширения TimescaleDB.
Структура базы данных спроектирована таким образом, чтобы обеспечить эффективное хранение и
управление пакетами модификаций, пользовательскими настройками и другими данными расширения.
</p>
<p>
Реализована серверная часть на языке Go, предоставляющая API для взаимодействия с клиентской
частью расширения. Серверная часть обеспечивает аутентификацию пользователей, управление пакетами
модификаций и сбор статистики использования.
</p>
<h3>Ключевые достижения:</h3>
<ul>
<li>
Спроектирована и реализована схема базы данных с учетом требований проекта
</li>
<li>
Разработаны миграции для базы данных, обеспечивающие простое развертывание
</li>
<li>
Реализована серверная часть на Go с использованием современных паттернов разработки
</li>
<li>
Протестирована производительность базы данных при высоких нагрузках
</li>
<li>
Настроена интеграция с Supabase для управления пользователями и аутентификации
</li>
</ul>
<div class="entry-gallery">
<div class="gallery-item">
<span class="image-caption">ER-диаграмма базы данных</span>
</div>
<div class="gallery-item">
<span class="image-caption">Основные API эндпоинты</span>
</div>
</div>
<div class="entry-conclusion">
<p>
Разработанная база данных и серверная часть обеспечивают надежную основу для
функционирования всего приложения. Следующим шагом будет интеграция серверной части
с клиентской частью расширения для обеспечения полной функциональности проекта.
</p>
</div>
</div>
</div>
</div>
<div class="timeline-entry" id="update-ui">
<div class="entry-date">
<div class="date-box">
<span class="day">10</span>
<span class="month">Марта</span>
<span class="year">2025</span>
</div>
</div>
<div class="entry-content">
<h2>Создан интерфейс расширения и маркетплейс</h2>
<div class="entry-meta">
<span class="entry-author">Автор: Сапрыкин Пётр</span>
<span class="entry-category">Категория: Frontend</span>
</div>
<div class="entry-body">
<p>
Разработан пользовательский интерфейс браузерного расширения с использованием TypeScript
и библиотеки Solid.js. Интерфейс расширения предоставляет удобный доступ к основной
функциональности проекта и обеспечивает интуитивно понятное управление пакетами модификаций.
</p>
<p>
Также создан маркетплейс для обмена пакетами модификаций, позволяющий пользователям
публиковать свои пакеты и устанавливать пакеты, созданные другими пользователями.
Маркетплейс включает систему рейтингов, поиск и фильтрацию пакетов по различным критериям.
</p>
<h3>Основные компоненты пользовательского интерфейса:</h3>
<ul>
<li>
Главный экран расширения с информацией о текущей вкладке и установленных пакетах
</li>
<li>
Экран управления пакетами модификаций
</li>
<li>
Редактор пакетов для создания и редактирования пакетов модификаций
</li>
<li>
Маркетплейс пакетов модификаций
</li>
<li>
Система настроек расширения
</li>
</ul>
<div class="entry-gallery">
<div class="gallery-item">
<span class="image-caption">Главный экран расширения</span>
</div>
<div class="gallery-item">
<span class="image-caption">Маркетплейс пакетов модификаций</span>
</div>
</div>
<div class="entry-conclusion">
<p>
Разработанный интерфейс расширения и маркетплейс обеспечивают основу для взаимодействия
пользователей с проектом EasyAccess. В следующих этапах разработки планируется расширение
функциональности интерфейса и улучшение пользовательского опыта на основе обратной связи.
</p>
</div>
</div>
</div>
</div>
<div class="timeline-entry" id="update-research">
<div class="entry-date">
<div class="date-box">
<span class="day">25</span>
<span class="month">Марта</span>
<span class="year">2025</span>
</div>
</div>
<div class="entry-content">
<h2>Проведен анализ предметной области</h2>
<div class="entry-meta">
<span class="entry-author">Автор: Старков Руслан</span>
<span class="entry-category">Категория: Исследование</span>
</div>
<div class="entry-body">
<p>
Проведено исследование предметной области веб-доступности и существующих решений для
повышения доступности веб-сайтов. Изучены стандарты и рекомендации по обеспечению
веб-доступности, такие как WCAG (Web Content Accessibility Guidelines) и ГОСТ Р 52872-2019.
</p>
<p>
Выполнен сравнительный анализ существующих аналогов, включая специализированные расширения
для доступности и универсальные расширения для модификации веб-страниц. На основе анализа
определены ключевые потребности пользователей и уникальные преимущества проекта EasyAccess.
</p>
<h3>Основные выводы исследования:</h3>
<ul>
<li>
Существующие решения либо специализируются на отдельных аспектах модификации веб-страниц,
либо на ограниченном наборе функций веб-доступности
</li>
<li>
Большинство решений в области веб-доступности предлагают лишь базовые настройки, не
обеспечивая глубокой модификации страниц
</li>
<li>
Отсутствуют комплексные решения, объединяющие CSS, JavaScript и конфигурацию в единые пакеты
</li>
<li>
Многие специализированные решения для доступности имеют ограниченную поддержку русского языка
</li>
</ul>
<div class="entry-gallery">
<div class="gallery-item">
<span class="image-caption">Сравнительная таблица аналогов</span>
</div>
<div class="gallery-item">
<span class="image-caption">Ключевые потребности пользователей</span>
</div>
</div>
<div class="entry-conclusion">
<p>
На основе проведенного исследования разработана архитектура проекта EasyAccess, определены
ключевые компоненты системы и спланированы этапы разработки. Результаты исследования
подтверждают актуальность проекта и его уникальные преимущества по сравнению с существующими
решениями.
</p>
</div>
</div>
</div>
</div>
<div class="timeline-entry">
<div class="entry-date">
<div class="date-box">
<span class="day">15</span>
<span class="month">Апреля</span>
<span class="year">2025</span>
</div>
</div>
<div class="entry-content">
<h2>Интеграция модулей обработки аудио и документов</h2>
<div class="entry-meta">
<span class="entry-author">Автор: Петрачков Владимир</span>
<span class="entry-category">Категория: Backend</span>
</div>
<div class="entry-body">
<p>
Завершена работа над модулями обработки аудио и документов для расширения EasyAccess.
Модули разработаны на Python с использованием современных библиотек машинного обучения и
контейнеризованы с помощью Docker для упрощения развертывания.
</p>
<p>
Компонент распознавания голоса позволяет пользователям управлять веб-сайтами с помощью голосовых
команд, что особенно важно для людей с двигательными нарушениями. Модуль обработки документов
обеспечивает распознавание текста из изображений и PDF-файлов, делая их содержимое доступным
для программ экранного доступа.
</p>
<h3>Ключевые особенности модулей:</h3>
<ul>
<li>
Использование gRPC для эффективного взаимодействия между компонентами на разных языках программирования
</li>
<li>
Оптимизация моделей распознавания для работы в браузерном окружении
</li>
<li>
Поддержка различных форматов документов (PNG, JPG, PDF) с извлечением структурированного текста
</li>
<li>
Реализация системы кэширования для улучшения производительности
</li>
<li>
Интеграция с основным API расширения через REST-интерфейсы
</li>
</ul>
<div class="entry-gallery">
<div class="gallery-item">
<span class="image-caption">Архитектура модуля обработки аудио</span>
</div>
<div class="gallery-item">
<span class="image-caption">Процесс оптического распознавания текста</span>
</div>
</div>
<div class="entry-conclusion">
<p>
Интеграция модулей обработки аудио и документов существенно расширяет функциональность
расширения EasyAccess, делая его полноценным решением для обеспечения доступности
веб-контента. Следующим шагом будет оптимизация производительности и улучшение
пользовательского опыта при работе с этими функциями.
</p>
</div>
</div>
</div>
</div>
<div class="timeline-entry">
<div class="entry-date">
<div class="date-box">
<span class="day">30</span>
<span class="month">Апреля</span>
<span class="year">2025</span>
</div>
</div>
<div class="entry-content">
<h2>Система безопасности и интеграция с Supabase</h2>
<div class="entry-meta">
<span class="entry-author">Автор: Шмыговский Никита</span>
<span class="entry-category">Категория: Безопасность</span>
</div>
<div class="entry-body">
<p>
Разработана система безопасности для расширения EasyAccess и интегрирована платформа Supabase
для аутентификации пользователей и хранения данных. Архитектура безопасности обеспечивает надежную
защиту пользовательской информации и предотвращает несанкционированный доступ к функциям расширения.
</p>
<p>
Особое внимание уделено безопасности при инъекции скриптов в веб-страницы, что является
критически важным аспектом работы расширения. Реализованы механизмы проверки и валидации
пакетов модификаций перед их применением, а также изоляция выполнения скриптов для
предотвращения конфликтов с основным кодом страницы.
</p>
<h3>Основные компоненты системы безопасности:</h3>
<ul>
<li>
Безопасная аутентификация через Supabase с использованием JWT-токенов
</li>
<li>
Разделение прав доступа и ролевая модель для разных типов пользователей
</li>
<li>
Валидация и санитизация всех пользовательских входных данных
</li>
<li>
Защищенное хранение пользовательских настроек в локальном хранилище
</li>
<li>
Система проверки пакетов модификаций на потенциально вредоносный код
</li>
<li>
Механизмы изоляции скриптов при их выполнении в контексте веб-страниц
</li>
</ul>
<div class="entry-gallery">
<div class="gallery-item">
<span class="image-caption">Схема архитектуры безопасности</span>
</div>
<div class="gallery-item">
<span class="image-caption">Интеграция аутентификации с Supabase</span>
</div>
</div>
<div class="entry-conclusion">
<p>
Реализованная система безопасности обеспечивает надежную защиту как пользовательских данных,
так и веб-страниц, на которых применяется расширение. Интеграция с Supabase предоставляет
масштабируемую и удобную инфраструктуру для управления пользователями и данными без
необходимости разрабатывать эти системы с нуля.
</p>
</div>
</div>
</div>
</div>
<div class="timeline-entry">
<div class="entry-date">
<div class="date-box">
<span class="day">10</span>
<span class="month">Мая</span>
<span class="year">2025</span>
</div>
</div>
<div class="entry-content">
<h2>Тестирование расширения и исправление ошибок</h2>
<div class="entry-meta">
<span class="entry-author">Авторы: Момина Антонина, Николенко Дарья, Старков Руслан</span>
<span class="entry-category">Категория: QA</span>
</div>
<div class="entry-body">
<p>
Проведено комплексное тестирование расширения EasyAccess на различных веб-сайтах
и в разных браузерах. В процессе тестирования были выявлены и исправлены различные
ошибки и проблемы с совместимостью, что позволило повысить стабильность и
надежность работы расширения.
</p>
<p>
Особое внимание было уделено тестированию доступности, чтобы убедиться, что
расширение действительно улучшает использование веб-сайтов для людей с
различными ограничениями. Для этого были привлечены потенциальные пользователи
с ограниченными возможностями, которые предоставили ценную обратную связь.
</p>
<h3>Основные направления тестирования:</h3>
<ul>
<li>
Функциональное тестирование всех компонентов расширения
</li>
<li>
Тестирование совместимости с различными браузерами (Chrome, Edge, Firefox)
</li>
<li>
Проверка работы на популярных веб-сайтах и порталах
</li>
<li>
Тестирование пользовательского интерфейса на доступность
</li>
<li>
Проверка корректности работы пакетов модификаций
</li>
<li>
Тестирование безопасности и производительности
</li>
</ul>
<div class="entry-gallery">
<div class="gallery-item">
<span class="image-caption">Схема процесса тестирования</span>
</div>
<div class="gallery-item">
<span class="image-caption">Система отслеживания ошибок</span>
</div>
</div>
<div class="entry-conclusion">
<p>
В результате тестирования было выявлено и исправлено более 30 ошибок и проблем,
что значительно повысило качество расширения. Обратная связь от потенциальных
пользователей позволила лучше понять их потребности и внести соответствующие
улучшения в интерфейс и функциональность расширения.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<footer>
<div class="container">
<div class="footer-content">
<div class="footer-logo">
<img src="images/logo-white.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</div>
<div class="footer-links">
<div class="footer-nav">
<h4>Навигация</h4>
<ul>
<li><a href="index.html">Главная</a></li>
<li><a href="about.html">О проекте</a></li>
<li><a href="team.html">Участники</a></li>
<li><a href="journal.html">Журнал</a></li>
<li><a href="resources.html">Ресурсы</a></li>
</ul>
</div>
<div class="footer-nav">
<h4>Контакты</h4>
<ul>
<li><a href="mailto:admin@new-devs.ru">Email</a></li>
<li><a href="https://github.com/easyaccess-team" target="_blank">GitHub</a></li>
</ul>
</div>
</div>
</div>
<div class="footer-bottom">
<p>&copy; 2025 EasyAccess. Проектная деятельность, Московский Политех</p>
</div>
</div>
</footer>
<script src="js/main.js"></script>
</body>
</html>

103
site/js/main.js Normal file
View file

@ -0,0 +1,103 @@
// Основной JavaScript-файл для сайта EasyAccess
document.addEventListener('DOMContentLoaded', function() {
// Мобильное меню
const mobileMenuToggle = document.querySelector('.mobile-menu-toggle');
const navLinks = document.querySelector('.nav-links');
if (mobileMenuToggle && navLinks) {
mobileMenuToggle.addEventListener('click', function() {
navLinks.classList.toggle('active');
mobileMenuToggle.classList.toggle('active');
});
}
// Изменение стиля хедера при прокрутке
const header = document.querySelector('header');
if (header) {
window.addEventListener('scroll', function() {
if (window.scrollY > 10) {
header.classList.add('scrolled');
} else {
header.classList.remove('scrolled');
}
});
}
// Плавная прокрутка для якорных ссылок
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
// Проверяем, что это не просто якорь
if (this.getAttribute('href') !== '#') {
e.preventDefault();
const targetId = this.getAttribute('href');
const targetElement = document.querySelector(targetId);
if (targetElement) {
// Закрываем мобильное меню, если оно открыто
if (navLinks && navLinks.classList.contains('active')) {
navLinks.classList.remove('active');
if (mobileMenuToggle) {
mobileMenuToggle.classList.remove('active');
}
}
// Прокручиваем до элемента
const headerHeight = header ? header.offsetHeight : 0;
const targetPosition = targetElement.getBoundingClientRect().top + window.scrollY - headerHeight;
window.scrollTo({
top: targetPosition,
behavior: 'smooth'
});
}
}
});
});
// Анимация появления элементов при прокрутке
const animatedElements = document.querySelectorAll('.feature-card, .tech-item, .update-card, .team-card, .curator-card, .point-card, .info-block, .resource-card, .download-card');
if (animatedElements.length > 0) {
// Функция для проверки видимости элемента
function isElementInViewport(el) {
const rect = el.getBoundingClientRect();
return (
rect.top <= (window.innerHeight || document.documentElement.clientHeight) * 0.85
);
}
// Функция для добавления класса анимации
function handleScroll() {
animatedElements.forEach(element => {
if (isElementInViewport(element)) {
element.classList.add('animate-in');
}
});
}
// Обработчик прокрутки
window.addEventListener('scroll', handleScroll);
// Вызываем обработчик сразу для элементов, которые видны при загрузке страницы
handleScroll();
}
// Дополнительные стили для анимаций
const style = document.createElement('style');
style.textContent = `
.feature-card, .tech-item, .update-card, .team-card, .curator-card, .point-card, .info-block, .resource-card, .download-card {
opacity: 0;
transform: translateY(20px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.animate-in {
opacity: 1;
transform: translateY(0);
}
`;
document.head.appendChild(style);
});

363
site/resources.html Normal file
View file

@ -0,0 +1,363 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ресурсы - EasyAccess</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/resources.css">
<link rel="icon" href="images/icons/favicon.ico" type="image/x-icon">
<meta name="description" content="Полезные ресурсы и материалы по проекту EasyAccess - браузерному расширению для повышения доступности веб-сайтов">
</head>
<body>
<header>
<div class="container">
<nav class="main-nav">
<div class="logo">
<a href="index.html">
<img src="images/logo.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</a>
</div>
<ul class="nav-links">
<li><a href="index.html">Главная</a></li>
<li><a href="about.html">О проекте</a></li>
<li><a href="team.html">Участники</a></li>
<li><a href="journal.html">Журнал</a></li>
<li><a href="resources.html" class="active">Ресурсы</a></li>
</ul>
<button class="mobile-menu-toggle" aria-label="Открыть меню">
<span></span>
<span></span>
<span></span>
</button>
</nav>
</div>
</header>
<main>
<section class="page-hero">
<div class="container">
<h1>Полезные ресурсы</h1>
<p class="page-subtitle">Источники информации по веб-доступности и разработке расширений</p>
</div>
</section>
<section class="resources-section">
<div class="container">
<div class="resources-grid">
<div class="resource-category">
<h2>Стандарты веб-доступности</h2>
<div class="resource-list">
<div class="resource-card">
<div class="resource-icon">
<img src="images/icons/w3c.svg" alt="W3C">
</div>
<div class="resource-info">
<h3>WCAG (Web Content Accessibility Guidelines)</h3>
<p>
Стандарты и рекомендации по обеспечению доступности веб-контента, разработанные
консорциумом W3C. Включают руководства по созданию доступных веб-сайтов для людей с
различными ограничениями.
</p>
<a href="https://www.w3.org/WAI/standards-guidelines/wcag/" target="_blank" class="resource-link">
Посетить ресурс
</a>
</div>
</div>
<div class="resource-card">
<div class="resource-icon">
<img src="images/icons/gost.svg" alt="ГОСТ">
</div>
<div class="resource-info">
<h3>ГОСТ Р 52872-2019</h3>
<p>
Российский стандарт «Интернет-ресурсы и другая информация, представленная в электронно-цифровой форме.
Приложения для стационарных и мобильных устройств, иные пользовательские интерфейсы.
Требования доступности для людей с инвалидностью и других лиц с ограничениями жизнедеятельности».
</p>
<a href="https://docs.cntd.ru/document/1200167693" target="_blank" class="resource-link">
Посетить ресурс
</a>
</div>
</div>
<div class="resource-card">
<div class="resource-icon">
<img src="images/icons/aria.svg" alt="ARIA">
</div>
<div class="resource-info">
<h3>WAI-ARIA (Web Accessibility Initiative - Accessible Rich Internet Applications)</h3>
<p>
Набор атрибутов, которые определяют способы создания веб-контента и веб-приложений
более доступными для людей с ограниченными возможностями. Особенно полезно для динамического
контента и интерфейсов, созданных с использованием JavaScript.
</p>
<a href="https://www.w3.org/WAI/standards-guidelines/aria/" target="_blank" class="resource-link">
Посетить ресурс
</a>
</div>
</div>
</div>
</div>
<div class="resource-category">
<h2>Разработка браузерных расширений</h2>
<div class="resource-list">
<div class="resource-card">
<div class="resource-icon">
<img src="images/icons/chrome.svg" alt="Chrome">
</div>
<div class="resource-info">
<h3>Chrome Extensions Documentation</h3>
<p>
Официальная документация по разработке расширений для браузера Chrome. Содержит
руководства, примеры кода и справочник по API для создания расширений.
</p>
<a href="https://developer.chrome.com/docs/extensions/" target="_blank" class="resource-link">
Посетить ресурс
</a>
</div>
</div>
<div class="resource-card">
<div class="resource-icon">
<img src="images/icons/firefox.svg" alt="Firefox">
</div>
<div class="resource-info">
<h3>Firefox Extensions Workshop</h3>
<p>
Портал для разработчиков расширений Firefox, содержащий документацию, руководства
и инструменты для создания расширений, совместимых с WebExtensions API.
</p>
<a href="https://extensionworkshop.com/" target="_blank" class="resource-link">
Посетить ресурс
</a>
</div>
</div>
<div class="resource-card">
<div class="resource-icon">
<img src="images/icons/mdn.svg" alt="MDN">
</div>
<div class="resource-info">
<h3>MDN Web Docs - Browser Extensions</h3>
<p>
Подробная документация по разработке кросс-браузерных расширений с использованием
стандарта WebExtensions API. Включает примеры кода, руководства и спецификации.
</p>
<a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions" target="_blank" class="resource-link">
Посетить ресурс
</a>
</div>
</div>
</div>
</div>
<div class="resource-category">
<h2>Партнёрские организации</h2>
<div class="resource-list">
<div class="resource-card">
<div class="resource-icon">
<img src="images/icons/mospolytech.svg" alt="Московский Политех">
</div>
<div class="resource-info">
<h3>Московский Политехнический Университет</h3>
<p>
Образовательное учреждение, на базе которого разрабатывается проект EasyAccess
в рамках дисциплины «Проектная деятельность».
</p>
<a href="https://mospolytech.ru/" target="_blank" class="resource-link">
Посетить сайт →
</a>
</div>
</div>
<div class="resource-card">
<div class="resource-icon">
<img src="images/icons/voi.svg" alt="ВОИ">
</div>
<div class="resource-info">
<h3>Всероссийское общество инвалидов (ВОИ)</h3>
<p>
Организация, которая помогает с тестированием проекта и предоставляет обратную
связь от пользователей с ограниченными возможностями здоровья.
</p>
<a href="https://voi.ru/" target="_blank" class="resource-link">
Посетить сайт →
</a>
</div>
</div>
<div class="resource-card">
<div class="resource-icon">
<img src="images/icons/digital.svg" alt="Минцифры">
</div>
<div class="resource-info">
<h3>Министерство цифрового развития, связи и массовых коммуникаций РФ</h3>
<p>
Государственный орган, осуществляющий функции по выработке и реализации государственной
политики и нормативно-правовому регулированию в сфере цифрового развития. Предоставляет
информацию о требованиях к доступности государственных информационных систем.
</p>
<a href="https://digital.gov.ru/" target="_blank" class="resource-link">
Посетить сайт →
</a>
</div>
</div>
</div>
</div>
<div class="resource-category">
<h2>Технологии и инструменты</h2>
<div class="resource-list">
<div class="resource-card">
<div class="resource-icon">
<img src="images/tech/typescript.svg" alt="TypeScript">
</div>
<div class="resource-info">
<h3>TypeScript</h3>
<p>
Строго типизированная надстройка над JavaScript, используемая для разработки
фронтенд-части расширения и веб-редактора.
</p>
<a href="https://www.typescriptlang.org/" target="_blank" class="resource-link">
Посетить сайт →
</a>
</div>
</div>
<div class="resource-card">
<div class="resource-icon">
<img src="images/tech/solidjs.svg" alt="Solid.js">
</div>
<div class="resource-info">
<h3>Solid.js</h3>
<p>
Декларативная библиотека для создания пользовательских интерфейсов с высокой
производительностью, используемая в проекте для разработки UI расширения.
</p>
<a href="https://www.solidjs.com/" target="_blank" class="resource-link">
Посетить сайт →
</a>
</div>
</div>
<div class="resource-card">
<div class="resource-icon">
<img src="images/tech/golang.svg" alt="Go">
</div>
<div class="resource-info">
<h3>Go (Golang)</h3>
<p>
Современный компилируемый язык программирования, разработанный для создания
эффективного и надежного серверного программного обеспечения.
</p>
<a href="https://golang.org/" target="_blank" class="resource-link">
Посетить сайт →
</a>
</div>
</div>
<div class="resource-card">
<div class="resource-icon">
<img src="images/tech/postgresql.svg" alt="PostgreSQL">
</div>
<div class="resource-info">
<h3>PostgreSQL и TimescaleDB</h3>
<p>
Система управления базами данных и расширение для работы с временными рядами,
используемые для хранения данных проекта.
</p>
<a href="https://www.postgresql.org/" target="_blank" class="resource-link">
PostgreSQL →
</a>
<a href="https://www.timescale.com/" target="_blank" class="resource-link">
TimescaleDB →
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="resources-downloads">
<div class="container">
<h2>Материалы для скачивания</h2>
<div class="downloads-grid">
<div class="download-card">
<div class="download-icon">
<img src="images/icons/presentation.svg" alt="Презентация">
</div>
<div class="download-info">
<h3>Презентация проекта</h3>
<p>Презентация с описанием проекта EasyAccess, его целей, задач и особенностей.</p>
<a href="downloads/easyaccess_presentation.pdf" class="btn secondary" download target="_blank">Скачать (PDF, 2.5 MB)</a>
</div>
</div>
<div class="download-card">
<div class="download-icon">
<img src="images/icons/document.svg" alt="Документация">
</div>
<div class="download-info">
<h3>Техническая документация</h3>
<p>Подробное описание архитектуры и технических решений проекта EasyAccess.</p>
<a href="downloads/easyaccess_technical_docs.pdf" class="btn secondary" download target="_blank">Скачать (PDF, 1.8 MB)</a>
</div>
</div>
<div class="download-card">
<div class="download-icon">
<img src="images/icons/report.svg" alt="Отчет">
</div>
<div class="download-info">
<h3>Отчет о проектной практике</h3>
<p>Отчет о выполнении проектной практики с описанием всех этапов работы.</p>
<a href="downloads/easyaccess_report.pdf" class="btn secondary" download target="_blank">Скачать (PDF, 3.2 MB)</a>
</div>
</div>
</div>
</div>
</section>
</main>
<footer>
<div class="container">
<div class="footer-content">
<div class="footer-logo">
<img src="images/logo-white.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</div>
<div class="footer-links">
<div class="footer-nav">
<h4>Навигация</h4>
<ul>
<li><a href="index.html">Главная</a></li>
<li><a href="about.html">О проекте</a></li>
<li><a href="team.html">Участники</a></li>
<li><a href="journal.html">Журнал</a></li>
<li><a href="resources.html">Ресурсы</a></li>
</ul>
</div>
<div class="footer-nav">
<h4>Контакты</h4>
<ul>
<li><a href="mailto:admin@new-devs.ru">Email</a></li>
<li><a href="https://github.com/easyaccess-team" target="_blank">GitHub</a></li>
</ul>
</div>
</div>
</div>
<div class="footer-bottom">
<p>&copy; 2025 EasyAccess. Проектная деятельность, Московский Политех</p>
</div>
</div>
</footer>
<script src="js/main.js"></script>
</body>
</html>

416
site/team.html Normal file
View file

@ -0,0 +1,416 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Участники проекта - EasyAccess</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/team.css">
<link rel="icon" href="images/icons/favicon.ico" type="image/x-icon">
<meta name="description" content="Информация об участниках проекта EasyAccess - браузерного расширения для повышения доступности веб-сайтов">
</head>
<body>
<header>
<div class="container">
<nav class="main-nav">
<div class="logo">
<a href="index.html">
<img src="images/logo.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</a>
</div>
<ul class="nav-links">
<li><a href="index.html">Главная</a></li>
<li><a href="about.html">О проекте</a></li>
<li><a href="team.html" class="active">Участники</a></li>
<li><a href="journal.html">Журнал</a></li>
<li><a href="resources.html">Ресурсы</a></li>
</ul>
<button class="mobile-menu-toggle" aria-label="Открыть меню">
<span></span>
<span></span>
<span></span>
</button>
</nav>
</div>
</header>
<main>
<section class="page-hero">
<div class="container">
<h1>Команда проекта</h1>
<p class="page-subtitle">Люди, работающие над созданием EasyAccess</p>
</div>
</section>
<section class="team-section">
<div class="container">
<h2>Участники разработки</h2>
<p class="section-intro">
Проект EasyAccess разрабатывается командой студентов Московского Политехнического Университета
в рамках дисциплины «Проектная деятельность» под руководством опытных кураторов.
</p>
<div class="team-grid">
<div class="team-card">
<div class="member-photo">
<img src="images/team/saprykin.jpg" alt="Фото Сапрыкина Петра">
</div>
<div class="member-info">
<h3>Сапрыкин Пётр Иванович</h3>
<p class="member-role">Frontend-разработчик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Вёрстка пользовательского интерфейса расширения</li>
<li>Реализация JavaScript-функциональности</li>
<li>Создание компонентов для редактора пакетов</li>
<li>Интеграция с Chrome Extension API</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/deev.jpg" alt="Фото Деева Егора">
</div>
<div class="member-info">
<h3>Деев Егор Викторович</h3>
<p class="member-role">Лидер команды, Python разработчик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Проектирование и имплементация базы данных</li>
<li>Настройка DevOps-инфраструктуры</li>
<li>Разработка серверных компонентов на Python</li>
<li>Создание диаграмм и схем архитектуры</li>
<li>Интеграция TimescaleDB</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/starkov.jpg" alt="Фото Старкова Руслана">
</div>
<div class="member-info">
<h3>Старков Руслан Владимирович</h3>
<p class="member-role">Тестировщик, JavaScript-разработчик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Тестирование функциональности расширения</li>
<li>Контейнеризация с использованием Docker</li>
<li>Разработка JavaScript-модулей</li>
<li>Участие в проверке доступности интерфейса</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/troshkin.jpg" alt="Фото Трошкина Дмитрия">
</div>
<div class="member-info">
<h3>Трошкин Дмитрий Александрович</h3>
<p class="member-role">Лидер команды, TypeScript/Go разработчик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Фронтенд разработка на TypeScript с использованием React</li>
<li>Разработка серверной части на Go</li>
<li>Интеграция с базой данных</li>
<li>Настройка DevOps-процессов</li>
<li>Координация работы команды</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/petrachkov.jpg" alt="Фото Петрачкова Владимира">
</div>
<div class="member-info">
<h3>Петрачков Владимир Владимирович</h3>
<p class="member-role">Python разработчик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Разработка модуля обработки аудио файлов</li>
<li>Контейнеризация компонентов с Docker</li>
<li>Интеграция речевых моделей</li>
<li>Оптимизация Python-скриптов</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/myasnikov.jpg" alt="Фото Мясникова Дмитрия">
</div>
<div class="member-info">
<h3>Мясников Дмитрий Сергеевич</h3>
<p class="member-role">Go разработчик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Разработка серверной части на Go</li>
<li>Проектирование и имплементация базы данных</li>
<li>Реализация API-интерфейсов</li>
<li>Оптимизация производительности</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/nochnoy.jpg" alt="Фото Ночного Максима">
</div>
<div class="member-info">
<h3>Ночной Максим Сергеевич</h3>
<p class="member-role">Python разработчик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Разработка модуля сканирования документов</li>
<li>Интеграция OCR-функциональности</li>
<li>Развитие серверных компонентов на Python</li>
<li>Тестирование модулей обработки данных</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/shmigovskiy.jpg" alt="Фото Шмыговского Никиты">
</div>
<div class="member-info">
<h3>Шмыговский Никита Сергеевич</h3>
<p class="member-role">Python разработчик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Интеграция gRPC для связи Django и Go</li>
<li>Разработка системы безопасности</li>
<li>Аудит безопасности кода</li>
<li>Защита от уязвимостей при инъекции скриптов</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/pahalyuk.jpg" alt="Фото Пахалюка Ильи">
</div>
<div class="member-info">
<h3>Пахалюк Илья Николаевич</h3>
<p class="member-role">Тестировщик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Тестирование компонентов расширения</li>
<li>Настройка Docker для тестового окружения</li>
<li>Автоматизация тестирования</li>
<li>Документирование тестовых сценариев</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/momina.jpg" alt="Фото Моминой Антонины">
</div>
<div class="member-info">
<h3>Момина Антонина Алексеевна</h3>
<p class="member-role">Frontend-разработчик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Анализ версий для слабовидящих на существующих сайтах</li>
<li>Создание WAI-ARIA справочника для команды</li>
<li>Тестирование пользовательского интерфейса</li>
<li>Проверка соответствия стандартам доступности</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/nikolenko.jpg" alt="Фото Николенко Дарьи">
</div>
<div class="member-info">
<h3>Николенко Дарья Романовна</h3>
<p class="member-role">Аналитик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Перевод и работа с документацией Accessibly</li>
<li>Разработка методологии тестирования</li>
<li>Тестирование функционала расширения</li>
<li>Выявление и документирование ошибок</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/ostapenko_v.jpg" alt="Фото Остапенко Владислава">
</div>
<div class="member-info">
<h3>Остапенко Владислав Русланович</h3>
<p class="member-role">Аналитик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Исследование фреймворков для распознавания голоса</li>
<li>Изучение аналогичных расширений</li>
<li>Анализ технических решений</li>
<li>Подготовка аналитических материалов</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/ostapenko_s.jpg" alt="Фото Остапенко Святослава">
</div>
<div class="member-info">
<h3>Остапенко Святослав Русланович</h3>
<p class="member-role">Аналитик</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Изучение функционала веб-редактора</li>
<li>Анализ аналогичных расширений</li>
<li>Документирование требований</li>
<li>Подготовка технических спецификаций</li>
</ul>
</div>
</div>
</div>
<div class="team-card">
<div class="member-photo">
<img src="images/team/popravkin.jpg" alt="Фото Поправкина Александра">
</div>
<div class="member-info">
<h3>Поправкин Александр Валентинович</h3>
<p class="member-role">Технический писатель</p>
<div class="contribution">
<h4>Вклад в проект:</h4>
<ul>
<li>Составление технической документации проекта</li>
<li>Создание руководств пользователя</li>
<li>Описание программных интерфейсов</li>
<li>Оформление отчетной документации</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="curators-section">
<div class="container">
<h2>Руководство проекта</h2>
<div class="curators-grid">
<div class="curator-card">
<div class="curator-photo">
<img src="images/team/kireeva.jpg" alt="Фото Киреевой Галины Ивановны">
</div>
<div class="curator-info">
<h3>Киреева Галина Ивановна</h3>
<p class="curator-role">Куратор проекта</p>
<p class="curator-title">к.т.н., доцент</p>
</div>
</div>
<div class="curator-card">
<div class="curator-photo">
<img src="images/team/budylina.jpg" alt="Фото Будылиной Евгении Александровны">
</div>
<div class="curator-info">
<h3>Будылина Евгения Александровна</h3>
<p class="curator-role">Куратор проекта</p>
<p class="curator-title">к.т.н., доцент</p>
</div>
</div>
<div class="curator-card">
<div class="curator-photo">
<img src="images/team/barinova.jpg" alt="Фото Бариновой Натальи Владимировны">
</div>
<div class="curator-info">
<h3>Баринова Наталья Владимировна</h3>
<p class="curator-role">Ответственный по проектной практике</p>
</div>
</div>
</div>
</div>
</section>
<section class="team-structure">
<div class="container">
<h2>Структура команды</h2>
<div class="structure-diagram">
<img src="images/journal/team-structure.png" alt="Диаграмма структуры команды проекта EasyAccess">
</div>
<p class="section-outro">
Командная работа и четкое распределение ролей помогают нам эффективно развивать проект,
обеспечивая высокое качество и своевременное достижение поставленных целей.
</p>
</div>
</section>
</main>
<footer>
<div class="container">
<div class="footer-content">
<div class="footer-logo">
<img src="images/logo-white.png" alt="EasyAccess логотип">
<span>EasyAccess</span>
</div>
<div class="footer-links">
<div class="footer-nav">
<h4>Навигация</h4>
<ul>
<li><a href="index.html">Главная</a></li>
<li><a href="about.html">О проекте</a></li>
<li><a href="team.html">Участники</a></li>
<li><a href="journal.html">Журнал</a></li>
<li><a href="resources.html">Ресурсы</a></li>
</ul>
</div>
<div class="footer-nav">
<h4>Контакты</h4>
<ul>
<li><a href="mailto:admin@new-devs.ru">Email</a></li>
<li><a href="https://github.com/easyaccess-team" target="_blank">GitHub</a></li>
</ul>
</div>
</div>
</div>
<div class="footer-bottom">
<p>&copy; 2025 EasyAccess. Проектная деятельность, Московский Политех</p>
</div>
</div>
</footer>
<script src="js/main.js"></script>
</body>
</html>