news page
This commit is contained in:
parent
50a8b5389f
commit
05cabdf108
51
news.html
51
news.html
|
@ -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>
|
||||||
|
<a class="content_butt" href="news/">read more...</a>
|
||||||
</div>
|
</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>
|
||||||
|
|
31
style.css
31
style.css
|
@ -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 строки */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue