news page

This commit is contained in:
Nikita 2024-11-18 17:08:10 +02:00
parent 50a8b5389f
commit 05cabdf108
2 changed files with 71 additions and 11 deletions

View file

@ -14,7 +14,7 @@
<div class="page_container"> <div class="page_container">
<div class="nav_box"> <div class="nav_box">
<a href="index.html" class="logo_home"><img src="logo.svg" class="logo" alt="logo"></a> <a href="index.html" class="logo_home"><img src="logo.svg" class="logo" alt="logo"></a>
<h2>About Us</h2> <h2>News</h2>
<div class="navigation"> <div class="navigation">
<a class="nav_butt_2" href="about.html">About Us</a> <a class="nav_butt_2" href="about.html">About Us</a>
<a class="nav_butt_2" href="download.html">Download</a> <a class="nav_butt_2" href="download.html">Download</a>
@ -27,12 +27,57 @@
<div class="content_wrap"> <div class="content_wrap">
<div class="content_box"> <div class="content_box">
<!-- Дроп новости -->
<!-- Дроп/блок новости 1-->
<div class="post_box"> <div class="post_box">
<div class="post_name"> <div class="post_name">
123 <h3>Loaded post header</h3>
</div> </div>
<div class="post_description multiline">
<p>only 2 first lines will be shown</p>
</div> </div>
<a class="content_butt" href="news/">read more...</a>
</div>
<!-- Дроп/блок новости 2-->
<div class="post_box">
<div class="post_name">
<h3>Loaded post header</h3>
</div>
<div class="post_description multiline">
<p>only 2 first lines will be shown</p>
</div>
<a class="content_butt" href="news/">read more...</a>
</div>
<!-- Дроп/блок новости 3-->
<div class="post_box">
<div class="post_name">
<h3>Loaded post header</h3>
</div>
<div class="post_description multiline">
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Tempora suscipit non exercitationem consequatur, animi eveniet enim. Nam, error. Facilis iusto amet id architecto est, praesentium velit quibusdam enim deleniti ipsam ea molestias ullam tempore aperiam.</p>
</div>
<a class="content_butt" href="news/">read more...</a>
</div>
<!-- Дроп/блок новости 4-->
<div class="post_box">
<div class="post_name">
<h3>Loaded post header</h3>
</div>
<div class="post_description multiline">
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Tempora suscipit non exercitationem consequatur, animi eveniet enim. Nam, error. Facilis iusto amet id architecto est, praesentium velit quibusdam enim deleniti ipsam ea molestias ullam tempore aperiam.</p>
</div>
<a class="content_butt" href="news/">read more...</a>
</div>
</div> </div>
</div> </div>
</div> </div>

View file

@ -18,7 +18,12 @@ h1{
h2{ h2{
font-family: "Geist mono"; font-family: "Geist mono";
font-weight: 700; font-weight: 700;
font-size: 25px; font-size: 32px;
}
h3{
font-family: "Geist mono";
font-weight: 700;
font-size: 20px;
} }
p, a, ul, li{ p, a, ul, li{
font-family: "Geist mono"; font-family: "Geist mono";
@ -124,7 +129,7 @@ p, a, ul, li{
position: relative; position: relative;
} }
.navigation{ .navigation{
padding-top: 50px; padding-top: 48px;
width: 130px; width: 130px;
margin:0 auto; margin:0 auto;
} }
@ -140,10 +145,20 @@ p, a, ul, li{
/*новости и посты*/ /*новости и посты*/
.post_box{ .post_box{
width: 100%;
width: 90%; padding: 10px;
padding-bottom: 10px; border: solid 1px rgba(238, 238, 238, 0.2); /*обводка новостного дропа*/
border: solid 1px #eee; margin-bottom: 20px;
}
.post_name{
margin-bottom: 20px;
}
.post_description{
margin-bottom: 20px;
}
.multiline{
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 2; /* Ограничение на 2 строки */
} }