Browse Source

add docs button

pull/249/head
connors 11 years ago
parent
commit
24891dcdfb
  1. 30
      docs-assets/css/docs.css
  2. 5
      index.html
  3. 32
      lib/sass/docs.scss

30
docs-assets/css/docs.css

@ -667,10 +667,35 @@ body {
padding-bottom: 50px;
}
.docs-header-content .button {
padding: 15px 30px;
font-size: 18px;
color: #00d1fe;
border-color: #00d1fe;
-webkit-transition: all 0.2s linear;
transition: all 0.2s linear;
}
.docs-header-content .button:hover {
color: #63e3ff;
border-color: #63e3ff;
}
.docs-header-content .button:active {
opacity: .5;
background-color: transparent;
}
.docs-header-content .button-primary {
margin-left: 10px;
color: #fff;
border-color: #00d1fe;
background-color: #00d1fe;
}
.docs-header-content .button-primary:hover {
color: #fff;
border-color: #63e3ff;
background-color: #63e3ff;
}
.docs-header-content .button-primary:active {
background-color: #63e3ff;
}
.docs-title,
.docs-subtitle {
@ -943,11 +968,6 @@ hr {
padding-top: 100px;
padding-bottom: 130px;
}
.docs-header-content .button {
max-width: 300px;
margin-right: auto;
margin-left: auto;
}
.docs-subtitle {
margin-bottom: 30px;

5
index.html

@ -15,8 +15,9 @@ base_url: "./"
</div>
<div class="docs-header-content">
<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="button button-filled button-block" onClick="_gaq.push(['_trackEvent', 'Downloads', 'V2.0']);">Download Ratchet</a>
<p class="docs-subtitle">Build mobile apps with simple HTML, CSS, and JS components.</p>
<a data-ignore="push" href="/components" class="button button-outlined">View the docs</a>
<a data-ignore="push" href="http://maker.github.com/ratchet/ratchet.zip" class="button button-primary" onClick="_gaq.push(['_trackEvent', 'Downloads', 'V2.0']);">Download Ratchet</a>
</div>
</div>

32
lib/sass/docs.scss

@ -59,9 +59,35 @@ body {
padding-bottom: 50px;
.button {
padding: 15px 30px;
font-size: 18px;
color: #00d1fe;
border-color: #00d1fe;
@include transition(all .2s linear);
&:hover {
color: #63e3ff;
border-color: #63e3ff;
}
&:active {
opacity: .5;
background-color: transparent;
}
}
.button-primary {
margin-left: 10px;
color: #fff;
border-color: #00d1fe;
background-color: #00d1fe;
&:hover {
color: #fff;
border-color: #63e3ff;
background-color: #63e3ff;
}
&:active {
background-color: #63e3ff;
}
}
}
.docs-title,
@ -353,12 +379,6 @@ hr {
.docs-header-content {
padding-top: 100px;
padding-bottom: 130px;
.button {
max-width: 300px;
margin-right: auto;
margin-left: auto;
}
}
.docs-subtitle {
margin-bottom: 30px;

Loading…
Cancel
Save