mobile
This commit is contained in:
Родитель
3dc8966bfa
Коммит
627cbb82a5
|
@ -2,7 +2,7 @@
|
|||
<title>{{ page.title }}</title>
|
||||
<meta name="description" content="{{ site.name }}: {{ site.description }}">
|
||||
<meta name="author" content="{{ site.authors }}">
|
||||
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
|
||||
<link rel="shortcut icon" href="{{ page.base_url }}favicon.ico">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
||||
|
|
|
@ -26,6 +26,7 @@ body {
|
|||
.docs-header {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
min-height: 620px;
|
||||
background-image: linear-gradient(45deg, #0a1855 0%, #da0024 100%);
|
||||
}
|
||||
.docs-header:before {
|
||||
|
@ -40,15 +41,14 @@ body {
|
|||
content: '';
|
||||
}
|
||||
|
||||
.docs-logo {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
margin: 0 auto 15px;
|
||||
.docs-title {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
color: #fff;
|
||||
font-weight: 300;
|
||||
line-height: 68px;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 40px;
|
||||
font-size: 22px;
|
||||
font-weight: 100;
|
||||
opacity: .4;
|
||||
}
|
||||
|
||||
.docs-nav {
|
||||
|
@ -56,9 +56,24 @@ body {
|
|||
right: 20px;
|
||||
top: 20px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.docs-logo {
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
margin: 0 auto 15px;
|
||||
color: #fff;
|
||||
font-size: 35px;
|
||||
font-weight: 300;
|
||||
line-height: 72px;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 40px;
|
||||
}
|
||||
|
||||
.docs-header-content {
|
||||
position: relative;
|
||||
top: 40px;
|
||||
text-align: center;
|
||||
padding: 50px 10px;
|
||||
-webkit-animation-name: fadeintext;
|
||||
|
@ -113,16 +128,16 @@ body {
|
|||
.carbonad {
|
||||
position: absolute !important;
|
||||
bottom: 90px !important;
|
||||
left: 50% !important;
|
||||
width: 330px !important;
|
||||
width: 100% !important;
|
||||
height: auto !important;
|
||||
padding: 15px !important;
|
||||
margin-left: -165px !important;
|
||||
font-size: 13px !important;
|
||||
line-height: 16px !important;
|
||||
border-radius: 3px !important;
|
||||
background: transparent !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
border-right: 0 !important;
|
||||
border-bottom: 0 !important;
|
||||
border-left: 0 !important;
|
||||
-webkit-animation-name: fadeintext;
|
||||
-moz-animation-name: fadeintext;
|
||||
animation-name: fadeintext;
|
||||
|
@ -522,27 +537,26 @@ hr {
|
|||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.docs-logo {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
font-size: 30px;
|
||||
line-height: 68px;
|
||||
}
|
||||
|
||||
.docs-header {
|
||||
min-height: 770px;
|
||||
}
|
||||
|
||||
.docs-title {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
color: #fff;
|
||||
font-size: 22px;
|
||||
font-weight: 100;
|
||||
opacity: .4;
|
||||
}
|
||||
|
||||
.docs-header-content {
|
||||
position: relative;
|
||||
top: 37%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
-ms-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.docs-header-content .btn {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.docs-subtitle {
|
||||
margin-bottom: 30px;
|
||||
|
@ -550,8 +564,14 @@ hr {
|
|||
line-height: 60px;
|
||||
}
|
||||
|
||||
.docs-header-content .btn {
|
||||
display: inline-block;
|
||||
.carbonad {
|
||||
left: 50% !important;
|
||||
width: 330px !important;
|
||||
margin-left: -165px !important;
|
||||
border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
border-left: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
border-radius: 3px !important;
|
||||
}
|
||||
|
||||
.social .twitter-follow-button {
|
||||
|
|
|
@ -26,6 +26,7 @@ body {
|
|||
.docs-header {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
min-height: 620px;
|
||||
background-image: linear-gradient(45deg, #0a1855 0%,#da0024 100%);
|
||||
|
||||
&:before {
|
||||
|
@ -40,23 +41,36 @@ body {
|
|||
content: '';
|
||||
}
|
||||
}
|
||||
.docs-logo {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
margin: 0 auto 15px;
|
||||
.docs-title {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
color: #fff;
|
||||
font-weight: 300;
|
||||
line-height: 68px;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 40px;
|
||||
font-size: 22px;
|
||||
font-weight: 100;
|
||||
opacity: .4;
|
||||
}
|
||||
.docs-nav {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 20px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
.docs-logo {
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
margin: 0 auto 15px;
|
||||
color: #fff;
|
||||
font-size: 35px;
|
||||
font-weight: 300;
|
||||
line-height: 72px;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 40px;
|
||||
}
|
||||
.docs-header-content {
|
||||
position: relative;
|
||||
top: 40px;
|
||||
text-align: center;
|
||||
padding: 50px 10px;
|
||||
@include animation-name(fadeintext);
|
||||
|
@ -108,16 +122,16 @@ body {
|
|||
.carbonad {
|
||||
position: absolute !important;
|
||||
bottom: 90px !important;
|
||||
left: 50% !important;
|
||||
width: 330px !important;
|
||||
width: 100% !important;
|
||||
height: auto !important;
|
||||
padding: 15px !important;
|
||||
margin-left: -165px !important;
|
||||
font-size: 13px !important;
|
||||
line-height: 16px !important;
|
||||
border-radius: 3px !important;
|
||||
background: transparent !important;
|
||||
border: 1px solid rgba(255,255,255,.1) !important;
|
||||
border-top: 1px solid rgba(255,255,255,.1) !important;
|
||||
border-right: 0 !important;
|
||||
border-bottom: 0 !important;
|
||||
border-left: 0 !important;
|
||||
@include animation-name(fadeintext);
|
||||
@include animation-duration(3s);
|
||||
}
|
||||
|
@ -548,33 +562,38 @@ hr {
|
|||
|
||||
// Tablet to desktop
|
||||
@media screen and (min-width: 768px) {
|
||||
// Jumbotron
|
||||
.docs-logo {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
font-size: 30px;
|
||||
line-height: 68px;
|
||||
}
|
||||
.docs-header {
|
||||
min-height: 770px;
|
||||
}
|
||||
.docs-title {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
color: #fff;
|
||||
font-size: 22px;
|
||||
font-weight: 100;
|
||||
opacity: .4;
|
||||
}
|
||||
.docs-header-content {
|
||||
position: relative;
|
||||
top: 37%;
|
||||
@include transform(translateY(-50%));
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
.docs-subtitle {
|
||||
margin-bottom: 30px;
|
||||
font-size: 41px;
|
||||
line-height: 60px;
|
||||
}
|
||||
.docs-header-content {
|
||||
.btn {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
// Ads
|
||||
.carbonad {
|
||||
left: 50% !important;
|
||||
width: 330px !important;
|
||||
margin-left: -165px !important;
|
||||
border-right: 1px solid rgba(255,255,255,.1) !important;
|
||||
border-bottom: 1px solid rgba(255,255,255,.1) !important;
|
||||
border-left: 1px solid rgba(255,255,255,.1) !important;
|
||||
border-radius: 3px !important;
|
||||
}
|
||||
|
||||
// Social
|
||||
|
|
Загрузка…
Ссылка в новой задаче