nazar/colweb-lw1
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Articles page content

Browse Source
This commit is contained in:
Nazar
2025-09-11 18:23:15 +03:00
parent 33cd3fd94b
commit c4da01b96a
2 changed files with 94 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
pages/articles.html
View File

@@ -17,5 +17,56 @@
<a href="/pages/about.html">Про нас</a> <a href="/pages/about.html">Про нас</a>
</div> </div>
</nav> </nav>
<!-- Content -->
<main>
<section class="articles-timeline">
<h1>Статті</h1>
<article class="timeline-item">
<div class="timeline-dot"></div>
<time>2025-09-20</time>
<div class="timeline-content">
<h2>Оптимізація продуктивності</h2>
<p>Провели оптимізацію коду та зображень, щоб сайт швидше завантажувався та працював плавніше на всіх пристроях.</p>
</div>
</article>
<article class="timeline-item">
<div class="timeline-dot"></div>
<time>2025-09-15</time>
<div class="timeline-content">
<h2>Додано нові функції</h2>
<p>Інтегрували нові функції, включаючи фільтри для галереї та адаптивний дизайн для мобільних пристроїв.</p>
</div>
</article>
<article class="timeline-item">
<div class="timeline-dot"></div>
<time>2025-09-10</time>
<div class="timeline-content">
<h2>Перші відгуки користувачів</h2>
<p>Отримали перші відгуки від тестових користувачів та виявили кілька дрібних багів, які потрібно виправити перед офіційним запуском.</p>
</div>
</article>
<article class="timeline-item">
<div class="timeline-dot"></div>
<time>2025-09-05</time>
<div class="timeline-content">
<h2>Запуск тестової версії</h2>
<p>Ми запустили тестову версію веб-сайту для внутрішнього тестування та перевірки основних функцій перед публічним релізом.</p>
</div>
</article>
<article class="timeline-item">
<div class="timeline-dot"></div>
<time>2025-09-01</time>
<div class="timeline-content">
<h2>Початок нового проекту</h2>
<p>Ми почали роботу над нашим новим веб-проектом. Це включає розробку сучасного дизайну та інтеграцію нових технологій.</p>
</div>
</article>
</section>
</main>
</body> </body>
</html> </html>

43
style.css
View File

@@ -174,3 +174,46 @@ button:active {
color: var(--primary); color: var(--primary);
font-weight: 600; font-weight: 600;
} }
/* Timeline Articles */
.articles-timeline {
position: relative;
margin: 2rem auto;
max-width: 50rem;
padding-left: 2rem;
border-left: 2px solid var(--primary);
}
.timeline-item {
position: relative;
margin-bottom: 2rem;
padding-left: 1.5rem;
}
.timeline-dot {
position: absolute;
left: calc(-2.5rem - 1px);
top: 1.5rem;
width: 1rem;
height: 1rem;
background-color: var(--primary);
border-radius: 50%;
}
.timeline-item time {
font-size: 0.875rem;
color: var(--secondary);
display: block;
margin-bottom: 0.25rem;
}
.timeline-content h2 {
margin: 0.25rem 0;
font-size: 1.25rem;
}
.timeline-content p {
margin: 0.25rem 0 0;
line-height: 1.5;
}