removing pattern for now.
This commit is contained in:
connors
Родитель
1851beaa0f
Коммит
bd69324fb1
|
|
@ -38,8 +38,7 @@ body {
|
|||
background-image: url(../img/pattern.png);
|
||||
background-size: 30%;
|
||||
background-position: center center;
|
||||
opacity: .035;
|
||||
content: '';
|
||||
opacity: .038;
|
||||
}
|
||||
|
||||
.docs-header {
|
||||
|
|
@ -47,20 +46,28 @@ body {
|
|||
min-height: 620px;
|
||||
}
|
||||
|
||||
.docs-masthead {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.docs-title {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
top: 14px;
|
||||
left: 50%;
|
||||
margin-bottom: 0;
|
||||
color: #fff;
|
||||
font-size: 22px;
|
||||
font-weight: 100;
|
||||
opacity: .4;
|
||||
-webkit-transform: translateX(-50%);
|
||||
-ms-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.docs-nav {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 20px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
-webkit-transition: opacity 0.2s linear;
|
||||
|
|
@ -72,21 +79,9 @@ body {
|
|||
opacity: .5;
|
||||
}
|
||||
|
||||
.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;
|
||||
top: 30px;
|
||||
text-align: center;
|
||||
padding: 50px 10px;
|
||||
-webkit-animation-name: fadeintext;
|
||||
|
|
@ -101,7 +96,7 @@ body {
|
|||
padding: 15px 60px 16px;
|
||||
font-size: 18px;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
border-color: rgba(255, 255, 255, 0.7);
|
||||
border: 0;
|
||||
-webkit-transition: all 0.2s linear;
|
||||
-moz-transition: all 0.2s linear;
|
||||
transition: all 0.2s linear;
|
||||
|
|
@ -117,7 +112,6 @@ body {
|
|||
.docs-header-content .btn-primary {
|
||||
margin-bottom: 0;
|
||||
color: #0a1855;
|
||||
border-color: rgba(255, 255, 255, 0.85);
|
||||
background-color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
.docs-header-content .btn-primary:hover {
|
||||
|
|
@ -132,20 +126,10 @@ body {
|
|||
.docs-subtitle {
|
||||
max-width: 750px;
|
||||
margin: 0 auto 20px;
|
||||
font-size: 26px;
|
||||
font-size: 28px;
|
||||
font-weight: 100;
|
||||
color: #fff;
|
||||
line-height: 34px;
|
||||
}
|
||||
|
||||
.docs-masthead {
|
||||
position: relative;
|
||||
}
|
||||
.docs-masthead .docs-title {
|
||||
left: 0;
|
||||
}
|
||||
.docs-masthead .docs-nav {
|
||||
right: 0;
|
||||
line-height: 38px;
|
||||
}
|
||||
|
||||
.carbonad {
|
||||
|
|
@ -155,7 +139,7 @@ body {
|
|||
height: auto !important;
|
||||
padding: 15px !important;
|
||||
font-size: 13px !important;
|
||||
line-height: 16px !important;
|
||||
line-height: 18px !important;
|
||||
background: transparent !important;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
border-right: 0 !important;
|
||||
|
|
@ -181,7 +165,7 @@ body {
|
|||
height: auto !important;
|
||||
margin-left: 145px !important;
|
||||
color: rgba(255, 255, 255, 0.65) !important;
|
||||
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important;
|
||||
font-family: "adelle-sans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
|
||||
}
|
||||
|
||||
.carbonad-text {
|
||||
|
|
@ -202,18 +186,19 @@ body {
|
|||
}
|
||||
|
||||
.docs-sub-content {
|
||||
padding-top: 100px;
|
||||
padding-bottom: 100px;
|
||||
padding-top: 55px;
|
||||
padding-bottom: 65px;
|
||||
color: #fff;
|
||||
}
|
||||
.docs-sub-content .page-title,
|
||||
.docs-sub-content .page-description {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-weight: 300;
|
||||
font-weight: 100;
|
||||
}
|
||||
.docs-sub-content .page-title {
|
||||
font-size: 40px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.docs-sub-content .page-description {
|
||||
color: #fff;
|
||||
|
|
@ -226,17 +211,6 @@ body {
|
|||
padding-bottom: 80px;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
text-align: center;
|
||||
}
|
||||
.section-header:after {
|
||||
display: block;
|
||||
content: '';
|
||||
width: 200px;
|
||||
margin: 50px auto 80px;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.section-heading,
|
||||
.section-lead {
|
||||
margin-top: 0;
|
||||
|
|
@ -569,8 +543,15 @@ hr {
|
|||
min-height: 770px;
|
||||
}
|
||||
|
||||
.docs-title {
|
||||
position: static;
|
||||
-webkit-transform: translateX(0);
|
||||
-ms-transform: translateX(0);
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.docs-header-content {
|
||||
top: 37%;
|
||||
top: 32%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
-ms-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
|
|
@ -586,6 +567,7 @@ hr {
|
|||
}
|
||||
|
||||
.carbonad {
|
||||
bottom: 130px !important;
|
||||
left: 50% !important;
|
||||
width: 330px !important;
|
||||
margin-left: -165px !important;
|
||||
|
|
@ -717,6 +699,8 @@ hr {
|
|||
.container {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.column-group {
|
||||
|
|
|
|||
|
|
@ -4,14 +4,17 @@ title: Components · Ratchet
|
|||
---
|
||||
|
||||
<div class="docs-sub-header">
|
||||
<header class="docs-masthead">
|
||||
<div class="container">
|
||||
<div class="column units-2">
|
||||
<a class="docs-nav icon icon-bars pull-right" href="/components" data-ignore="push"></a>
|
||||
<h1 class="docs-title">Ratchet</h1>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="container">
|
||||
<div class="column-group">
|
||||
<div class="column units-2">
|
||||
<header class="docs-masthead">
|
||||
<h1 class="docs-title">Ratchet</h1>
|
||||
<a class="docs-nav icon icon-bars" href="/components" data-ignore="push"></a>
|
||||
</header>
|
||||
|
||||
<div class="docs-sub-content">
|
||||
<h2 class="page-title">Components</h2>
|
||||
<p class="page-description">Design patterns that serve as basic building blocks</p>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,15 @@ title: Ratchet
|
|||
---
|
||||
|
||||
<div class="docs-header">
|
||||
<h1 class="docs-title">Ratchet</h1>
|
||||
<a class="docs-nav icon icon-bars" href="/components" data-ignore="push"></a>
|
||||
<header class="docs-masthead">
|
||||
<div class="container">
|
||||
<div class="column units-2">
|
||||
<a class="docs-nav icon icon-bars pull-right" href="/components" data-ignore="push"></a>
|
||||
<h1 class="docs-title">Ratchet</h1>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="docs-header-content">
|
||||
<h2 class="docs-logo">R</h2>
|
||||
<p class="docs-subtitle">Build mobile apps with simple HTML‚ CSS‚ and JS components.</p>
|
||||
<a data-ignore="push" href="http://maker.github.com/ratchet/ratchet.zip" class="btn btn-primary" onClick="_gaq.push(['_trackEvent', 'Downloads', 'V2.0']);">Download Ratchet</a>
|
||||
</div>
|
||||
|
|
@ -20,7 +25,7 @@ title: Ratchet
|
|||
<iframe src="http://ghbtns.com/github-btn.html?user=maker&repo=ratchet&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
|
||||
</li>
|
||||
<li>
|
||||
<a data-ignore="push" href="https://twitter.com/share" class="twitter-share-button" data-url="http://maker.github.com/ratchet/" data-text="Ratchet: Build mobile apps with simple HTML, CSS, and JS components." data-via="GoRatchet">Tweet</a>
|
||||
<a data-ignore="push" href="https://twitter.com/share" class="twitter-share-button" data-url="http://goratchet.com" data-text="Ratchet – Build mobile apps with simple HTML, CSS, and JS components." data-via="GoRatchet">Tweet</a>
|
||||
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
|
||||
</li>
|
||||
<li><a data-ignore="push" href="https://twitter.com/GoRatchet" class="twitter-follow-button" data-show-count="true">
|
||||
|
|
|
|||
|
|
@ -36,27 +36,34 @@ body {
|
|||
background-image: url(../img/pattern.png);
|
||||
background-size: 30%;
|
||||
background-position: center center;
|
||||
opacity: .035;
|
||||
content: '';
|
||||
opacity: .038;
|
||||
// content: '';
|
||||
}
|
||||
}
|
||||
.docs-header {
|
||||
height: 100vh;
|
||||
min-height: 620px;
|
||||
}
|
||||
|
||||
// Masthead
|
||||
.docs-masthead {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: 1px solid rgba(255,255,255,.1);
|
||||
}
|
||||
.docs-title {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
top: 14px;
|
||||
left: 50%;
|
||||
margin-bottom: 0;
|
||||
color: #fff;
|
||||
font-size: 22px;
|
||||
font-weight: 100;
|
||||
opacity: .4;
|
||||
@include transform(translateX(-50%));
|
||||
}
|
||||
.docs-nav {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 20px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
@include transition(opacity .2s linear);
|
||||
|
|
@ -66,20 +73,9 @@ body {
|
|||
opacity: .5;
|
||||
}
|
||||
}
|
||||
.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;
|
||||
top: 30px;
|
||||
text-align: center;
|
||||
padding: 50px 10px;
|
||||
@include animation-name(fadeintext);
|
||||
|
|
@ -90,7 +86,7 @@ body {
|
|||
padding: 15px 60px 16px;
|
||||
font-size: 18px;
|
||||
color: rgba(255,255,255,.7);
|
||||
border-color: rgba(255,255,255,.7);
|
||||
border: 0;
|
||||
@include transition(all .2s linear);
|
||||
|
||||
&:hover {
|
||||
|
|
@ -105,7 +101,6 @@ body {
|
|||
.btn-primary {
|
||||
margin-bottom: 0;
|
||||
color: #0a1855;
|
||||
border-color: rgba(255,255,255,.85);
|
||||
background-color: rgba(255,255,255,.85);
|
||||
|
||||
&:hover {
|
||||
|
|
@ -121,20 +116,10 @@ body {
|
|||
.docs-subtitle {
|
||||
max-width: 750px;
|
||||
margin: 0 auto 20px;
|
||||
font-size: 26px;
|
||||
font-size: 28px;
|
||||
font-weight: 100;
|
||||
color: #fff;
|
||||
line-height: 34px;
|
||||
}
|
||||
.docs-masthead {
|
||||
position: relative;
|
||||
|
||||
.docs-title {
|
||||
left: 0;
|
||||
}
|
||||
.docs-nav {
|
||||
right: 0;
|
||||
}
|
||||
line-height: 38px;
|
||||
}
|
||||
|
||||
// Ads
|
||||
|
|
@ -145,7 +130,7 @@ body {
|
|||
height: auto !important;
|
||||
padding: 15px !important;
|
||||
font-size: 13px !important;
|
||||
line-height: 16px !important;
|
||||
line-height: 18px !important;
|
||||
background: transparent !important;
|
||||
border-top: 1px solid rgba(255,255,255,.1) !important;
|
||||
border-right: 0 !important;
|
||||
|
|
@ -165,7 +150,7 @@ body {
|
|||
height: auto !important;
|
||||
margin-left: 145px !important;
|
||||
color: rgba(255,255,255,.65) !important;
|
||||
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important;
|
||||
font-family: "adelle-sans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
|
||||
}
|
||||
.carbonad-text {
|
||||
padding-top: 0 !important;
|
||||
|
|
@ -185,18 +170,19 @@ body {
|
|||
// --------------------------------------------------
|
||||
|
||||
.docs-sub-content {
|
||||
padding-top: 100px;
|
||||
padding-bottom: 100px;
|
||||
padding-top: 55px; // Visually centers the content.
|
||||
padding-bottom: 65px; // Visually centers the content.
|
||||
color: #fff;
|
||||
|
||||
.page-title,
|
||||
.page-description {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-weight: 300;
|
||||
font-weight: 100;
|
||||
}
|
||||
.page-title {
|
||||
font-size: 40px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.page-description {
|
||||
color: #fff;
|
||||
|
|
@ -212,17 +198,6 @@ body {
|
|||
padding-top: 80px;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
.section-header {
|
||||
text-align: center;
|
||||
|
||||
&:after {
|
||||
display: block;
|
||||
content: '';
|
||||
width: 200px;
|
||||
margin: 50px auto 80px;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
}
|
||||
.section-heading,
|
||||
.section-lead {
|
||||
margin-top: 0;
|
||||
|
|
@ -588,8 +563,12 @@ hr {
|
|||
.docs-header {
|
||||
min-height: 770px;
|
||||
}
|
||||
.docs-title {
|
||||
position: static;
|
||||
@include transform(translateX(0));
|
||||
}
|
||||
.docs-header-content {
|
||||
top: 37%;
|
||||
top: 32%;
|
||||
@include transform(translateY(-50%));
|
||||
|
||||
.btn {
|
||||
|
|
@ -604,6 +583,7 @@ hr {
|
|||
|
||||
// Ads
|
||||
.carbonad {
|
||||
bottom: 130px !important;
|
||||
left: 50% !important;
|
||||
width: 330px !important;
|
||||
margin-left: -165px !important;
|
||||
|
|
@ -740,6 +720,8 @@ hr {
|
|||
.container {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
.column-group {
|
||||
width: auto;
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче