Skip to content

L
landing_pages
Commit e055faa8 by Iren
Options

add style for header (btn and video)

parent 46b992ea
Showing with 22 additions and 6 deletions
css/styles.css
......@@ -342,7 +342,7 @@ h1 {
color: white;
font-weight: 800;
line-height: 62px;
letter-spacing: 1px;
letter-spacing: 1.3px;
margin-bottom: 2.5%;
text-align: left;
}
......@@ -421,7 +421,8 @@ h1 {
}
.header-text-center {
text-align: center;
width: 50%;
/*width: 50%;*/
width: 49%;
}
@media (max-width: 576px) {
.header-text-center {
......@@ -456,6 +457,10 @@ h1 {
margin-bottom: 22px;
}
}
.header-btn-container {
display: flex;
justify-content: space-between;
}
.header-btn {
font-family: SFUIDisplay-Regular;
width: 290px;
......@@ -463,6 +468,7 @@ h1 {
border-radius: 26px;
background: #c94d4e;
margin-bottom: 20px;
margin-top: 30px;
color: #ffffff;
font-size: 18px;
font-weight: 400;
......@@ -560,6 +566,7 @@ h1 {
.header-video {
position: relative;
width: 50%;
padding-left: 80px;
}
@media (max-width: 576px) {
.header-video {
......
css/styles.less
......@@ -289,7 +289,7 @@ h1 {
color: white;
font-weight: 800;
line-height: 62px;
letter-spacing: 1px;
letter-spacing: 1.3px;
margin-bottom: 2.5%;
text-align: left;
@media (max-width: 992px) {
......@@ -350,7 +350,8 @@ h1 {
}
.header-text-center {
text-align: center;
width: 50%;
/*width: 50%;*/
width: 49%;
@media (max-width: 576px){
width: 100%;
}
......@@ -379,6 +380,10 @@ h1 {
margin-bottom: 22px;
}
}
.header-btn-container {
display: flex;
justify-content: space-between;
}
.header-btn {
font-family: SFUIDisplay-Regular;
width: 290px;
......@@ -386,6 +391,7 @@ h1 {
border-radius: 26px;
background: #c94d4e;
margin-bottom: 20px;
margin-top: 30px;
color: #ffffff;
font-size: 18px;
font-weight: 400;
......@@ -467,6 +473,7 @@ h1 {
.header-video {
position: relative;
width: 50%;
padding-left: 80px;
@media (max-width: 576px) {
display: none;
width: 150px;
......
index.html
......@@ -9,7 +9,7 @@
<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/styles.css" />
<link rel="stylesheet" href="vendors/fontawesome/web-fonts-with-css/css/fontawesome-all.css" />
<link rel="stylesheet" href="vendors/fontawesome/web-fonts-with-css/css/fontawesome-all.css"/>
</head>
<body>
......@@ -86,13 +86,15 @@
<div class="header-h1-line">
</div>
<p class="header-text">
MySmart office (MSO) – единая платформа с открытым API,гибкими инструментами адаптации под любой бизнес
MySmart office (MSO) – единая платформа с открытым API,<br>гибкими инструментами адаптации под любой бизнес
и неограниченными возможностями масштабирования.
С помощью MSO вы сможете автоматизировать любой бизнес-процесс.
</p>
<div class="header-btn-container">
<button type="button" class="header-btn">Зарегистрироваться</button>
<button type="button" class="header-btn-background header-btn">Узнать больше</button>
</div>
</div>
<div class="header-video">
<video controls="controls" poster="img/video.png">
<source src="video/duel.ogv" type='video/ogg; codecs="theora, vorbis"'>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment