playground
/
ratchet
mirror of https://github.com/twbs/ratchet.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

basic components header

pull/249/head
connors 11 years ago
parent
70bd392c9e
commit
c9a7accd60
9 changed files with 130 additions and 13 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      _includes/header.html
  2. 27
      components.html
  3. 2
      dist/android-theme.css
  4. 2
      dist/ios-theme.css
  5. 2
      dist/ratchet-theme.css
  6. 2
      dist/ratchet.css
  7. 2
      dist/ratchet.js
  8. 46
      docs-assets/css/docs.css
  9. 58
      lib/sass/docs.scss

2
_includes/header.html
Unescape View File

@ -8,7 +8,7 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="{{ page.base_url }}dist/ratchet.css"> <link rel="stylesheet" href="{{ page.base_url }}dist/ratchet.css">
<link rel="stylesheet" href="{{ page.base_url }}dist/ios-theme.css"> <!-- <link rel="stylesheet" href="{{ page.base_url }}dist/ios-theme.css"> -->
<link rel="stylesheet" href="{{ page.base_url }}docs-assets/css/docs.css"> <link rel="stylesheet" href="{{ page.base_url }}docs-assets/css/docs.css">
<link rel="stylesheet" href="{{ page.base_url }}docs-assets/css/pygments.css"> <link rel="stylesheet" href="{{ page.base_url }}docs-assets/css/pygments.css">
<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--> <!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

27
components.html
Unescape View File

@ -4,6 +4,29 @@ title: Ratchet ~ Components
base_url: "../" base_url: "../"
--- ---
<!-- Docs masthead -->
<header class="docs-masthead">
<div class="container column-group">
<div class="column units-2">
<nav class="docs-navigation">
<a class="nav-item" href="#">Get started</a>
<a class="nav-item" href="#">Components</a>
<a class="nav-item" href="#">View on GitHub</a>
</nav>
<h1 class="logotype">Ratchet</h1>
</div>
</div>
</header>
<div class="docs-section-header">
<div class="container column-group">
<div class="column units-2">
<h2 class="section-title">Components</h2>
<p class="section-description">Design patterns that serve as basic building blocks.</p>
</div>
</div>
</div>
<!-- Banner for Mozilla/IE --> <!-- Banner for Mozilla/IE -->
<p class="notice-banner"> <p class="notice-banner">
<strong>Heads up!</strong> Ratchet components are written only for iPhone, so many are broken in non-Webkit browsers. <strong>Heads up!</strong> Ratchet components are written only for iPhone, so many are broken in non-Webkit browsers.
@ -19,10 +42,6 @@ base_url: "../"
<!-- Components --> <!-- Components -->
<div class="column-group"> <div class="column-group">
<div class="column units-2 lg-units-7"> <div class="column units-2 lg-units-7">
<div class="section-header">
<h2 class="section-title">Components</h2>
<p class="section-description">Design patterns that serve as basic building blocks.</p>
</div>
<!-- In iPhone examples --> <!-- In iPhone examples -->
<div class="iphone"> <div class="iphone">
<div class="iphone-content"> <div class="iphone-content">

2
dist/android-theme.css vendored
Unescape View File

@ -1,7 +1,7 @@
/* /*
* ===================================================== * =====================================================
* Ratchet v2.0.0 * Ratchet v2.0.0
* Copyright 2013 Connor Sears, Dave Gamache, and Jacob Thornton * Copyright 2014 Connor Sears, Dave Gamache, and Jacob Thornton
* Licensed under http://www.opensource.org/licenses/MIT * Licensed under http://www.opensource.org/licenses/MIT
* *
* Designed and built by @connors, @dhg, and @fat. * Designed and built by @connors, @dhg, and @fat.

2
dist/ios-theme.css vendored
Unescape View File

@ -1,7 +1,7 @@
/* /*
* ===================================================== * =====================================================
* Ratchet v2.0.0 * Ratchet v2.0.0
* Copyright 2013 Connor Sears, Dave Gamache, and Jacob Thornton * Copyright 2014 Connor Sears, Dave Gamache, and Jacob Thornton
* Licensed under http://www.opensource.org/licenses/MIT * Licensed under http://www.opensource.org/licenses/MIT
* *
* Designed and built by @connors, @dhg, and @fat. * Designed and built by @connors, @dhg, and @fat.

2
dist/ratchet-theme.css vendored
Unescape View File

@ -1,7 +1,7 @@
/* /*
* ===================================================== * =====================================================
* Ratchet v2.0.0 * Ratchet v2.0.0
* Copyright 2013 Connor Sears, Dave Gamache, and Jacob Thornton * Copyright 2014 Connor Sears, Dave Gamache, and Jacob Thornton
* Licensed under http://www.opensource.org/licenses/MIT * Licensed under http://www.opensource.org/licenses/MIT
* *
* Designed and built by @connors, @dhg, and @fat. * Designed and built by @connors, @dhg, and @fat.

2
dist/ratchet.css vendored
Unescape View File

@ -1,7 +1,7 @@
/* /*
* ===================================================== * =====================================================
* Ratchet v2.0.0 * Ratchet v2.0.0
* Copyright 2013 Connor Sears, Dave Gamache, and Jacob Thornton * Copyright 2014 Connor Sears, Dave Gamache, and Jacob Thornton
* Licensed under http://www.opensource.org/licenses/MIT * Licensed under http://www.opensource.org/licenses/MIT
* *
* Designed and built by @connors, @dhg, and @fat. * Designed and built by @connors, @dhg, and @fat.

2
dist/ratchet.js vendored
Unescape View File

@ -1,7 +1,7 @@
/* /*
* ===================================================== * =====================================================
* Ratchet v2.0.0 * Ratchet v2.0.0
* Copyright 2013 Connor Sears, Dave Gamache, and Jacob Thornton * Copyright 2014 Connor Sears, Dave Gamache, and Jacob Thornton
* Licensed under http://www.opensource.org/licenses/MIT * Licensed under http://www.opensource.org/licenses/MIT
* *
* Designed and built by @connors, @dhg, and @fat. * Designed and built by @connors, @dhg, and @fat.

46
docs-assets/css/docs.css
Unescape View File

@ -1,7 +1,7 @@
/* /*
* ===================================================== * =====================================================
* Ratchet v2.0.0 * Ratchet v2.0.0
* Copyright 2013 Connor Sears, Dave Gamache, and Jacob Thornton * Copyright 2014 Connor Sears, Dave Gamache, and Jacob Thornton
* Licensed under http://www.opensource.org/licenses/MIT * Licensed under http://www.opensource.org/licenses/MIT
* *
* Designed and built by @connors, @dhg, and @fat. * Designed and built by @connors, @dhg, and @fat.
@ -81,6 +81,49 @@ h1, h2, h3, h4, h5, h6 {
border: 0; border: 0;
} }
.docs-masthead {
padding-top: 10px;
padding-bottom: 10px;
border-bottom: 1px solid #ddd;
}
.docs-masthead .logotype {
margin-top: 0;
margin-bottom: 0;
color: #999;
font-size: 18px;
font-weight: normal;
}
.docs-navigation {
float: right;
padding-top: 5px;
}
.docs-navigation .nav-item {
margin-left: 20px;
}
.docs-section-header {
padding-top: 50px;
padding-bottom: 60px;
text-align: center;
border-bottom: 1px solid #ddd;
background-color: #fcfcfc;
}
.docs-section-header .section-title,
.docs-section-header .section-description {
margin-top: 0;
margin-bottom: 0;
font-weight: 300;
}
.docs-section-header .section-title {
color: #333;
font-size: 30px;
}
.docs-section-header .section-description {
color: #777;
font-size: 18px;
}
.component { .component {
padding: 50px 15px; padding: 50px 15px;
margin-left: -15px; margin-left: -15px;
@ -194,7 +237,6 @@ hr {
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.iphone { .iphone {
display: block;
position: fixed; position: fixed;
top: 50px; top: 50px;
left: 50%; left: 50%;

58
lib/sass/docs.scss
Unescape View File

@ -60,6 +60,7 @@ h1, h2, h3, h4, h5, h6 {
} }
} }
// Overriding the button styles for the social // Overriding the button styles for the social
// -------------------------------------------------- // --------------------------------------------------
@ -83,8 +84,63 @@ h1, h2, h3, h4, h5, h6 {
} }
} }
// Masthead
// --------------------------------------------------
.docs-masthead {
padding-top: 10px;
padding-bottom: 10px;
border-bottom: 1px solid #ddd;
.logotype {
margin-top: 0;
margin-bottom: 0;
color: #999;
font-size: 18px;
font-weight: normal;
}
}
.docs-navigation {
float: right;
padding-top: 5px;
.nav-item {
margin-left: 20px;
}
}
// Section header
// --------------------------------------------------
.docs-section-header {
padding-top: 50px;
padding-bottom: 60px; // Vertically center it optically
text-align: center;
border-bottom: 1px solid #ddd;
background-color: #fcfcfc;
.section-title,
.section-description {
margin-top: 0;
margin-bottom: 0;
font-weight: 300;
}
.section-title {
color: #333;
font-size: 30px;
}
.section-description {
color: #777;
font-size: 18px;
}
}
// Components // Components
// -------------------------------------------------- // --------------------------------------------------
.component { .component {
padding: 50px 15px; padding: 50px 15px;
margin-left: -15px; margin-left: -15px;
@ -195,7 +251,7 @@ hr {
// -------------------------------------------------- // --------------------------------------------------
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.iphone { .iphone {
display: block; // display: block;
position: fixed; position: fixed;
top: 50px; top: 50px;
left: 50%; left: 50%;

Write Preview
Loading…
Cancel
Save