From f0d917a432f776598fd98e660a21ca5cc652c505 Mon Sep 17 00:00:00 2001 From: connors Date: Sun, 16 Feb 2014 21:12:54 -0800 Subject: [PATCH] derping --- README.md | 2 +- dist/ratchet.css | 9 ++++-- dist/template.html | 66 ++++++++++++++++++---------------------- docs/assets/css/docs.css | 12 +++++--- docs/assets/js/docs.js | 2 +- docs/components.html | 2 +- docs/dist/ratchet.css | 9 ++++-- sass/docs.scss | 19 +++++++----- sass/type.scss | 12 ++++++-- 9 files changed, 76 insertions(+), 57 deletions(-) diff --git a/README.md b/README.md index d11804a..bf2a753 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # Ratchet v2.0 WIP [![devDependencies](https://david-dm.org/maker/ratchet/dev-status.png?theme=shields.io)](https://david-dm.org/maker/ratchet#info=devDependencies) -Prototype mobile apps with simple HTML, CSS, and JS components. +Build mobile apps with simple HTML, CSS, and JS components. ## Getting Started diff --git a/dist/ratchet.css b/dist/ratchet.css index 5b3ea55..ae2ce6d 100644 --- a/dist/ratchet.css +++ b/dist/ratchet.css @@ -314,7 +314,7 @@ strong { } h1, h2, h3, h4, h5, h6 { - margin: 10px 15px; + margin: 10px 10px; line-height: 1; } @@ -345,11 +345,16 @@ h6, .h6 { } p { - margin: 10px 15px; + margin: 10px 10px; font-size: 14px; color: #777; } +.container > h1, .container h2, .container h3, .container h4, .container h5, .container h6, .container p { + margin-left: 0; + margin-right: 0; +} + .btn { position: relative; display: inline-block; diff --git a/dist/template.html b/dist/template.html index e690b94..d89b5cc 100644 --- a/dist/template.html +++ b/dist/template.html @@ -36,45 +36,39 @@ - -
-

Ratchet

-
+ +
+

Ratchet

+
- -
-
+ +

Thanks for downloading Ratchet. This is an example HTML page that's linked up to compiled Ratchet CSS and JS, has the proper meta tags and the HTML structure. Need some more help before you start filling this with your own content? Check out some Ratchet resources:

+
+ +
- - -
- \ No newline at end of file diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index f00eadc..30059d3 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -138,6 +138,9 @@ body { font-size: 24px; opacity: .7; } +.docs-sub-content.with-padding { + padding-bottom: 80px; +} .docs-section { padding-top: 80px; @@ -525,11 +528,6 @@ hr { -moz-transition: background-image 0.1s linear; transition: background-image 0.1s linear; } - .device:after { - content: ''; - background-image: url("../img/iphone5s.png"); - opacity: 0; - } .device.device-fixed { position: fixed; right: auto; @@ -614,6 +612,10 @@ hr { text-shadow: 0 0 10px rgba(0, 0, 0, 0.5); } } +.example-device { + margin: 0 auto; +} + .container { margin-left: auto; margin-right: auto; diff --git a/docs/assets/js/docs.js b/docs/assets/js/docs.js index b2f6fbe..d3f90b8 100644 --- a/docs/assets/js/docs.js +++ b/docs/assets/js/docs.js @@ -21,7 +21,7 @@ $(function() { win = $(window); doc = $(document); bod = $(document.body) - device = device || $('.device'); + device = device || $('.js-device'); navComponentLinks = $('.docs-nav'); componentsList = $('.components-list'); componentLinks = $('.component-example a'); diff --git a/docs/components.html b/docs/components.html index 589899f..d858f75 100644 --- a/docs/components.html +++ b/docs/components.html @@ -39,7 +39,7 @@ title: Components · Ratchet
-
+
diff --git a/docs/dist/ratchet.css b/docs/dist/ratchet.css index 5b3ea55..ae2ce6d 100644 --- a/docs/dist/ratchet.css +++ b/docs/dist/ratchet.css @@ -314,7 +314,7 @@ strong { } h1, h2, h3, h4, h5, h6 { - margin: 10px 15px; + margin: 10px 10px; line-height: 1; } @@ -345,11 +345,16 @@ h6, .h6 { } p { - margin: 10px 15px; + margin: 10px 10px; font-size: 14px; color: #777; } +.container > h1, .container h2, .container h3, .container h4, .container h5, .container h6, .container p { + margin-left: 0; + margin-right: 0; +} + .btn { position: relative; display: inline-block; diff --git a/sass/docs.scss b/sass/docs.scss index 7987378..a935b84 100644 --- a/sass/docs.scss +++ b/sass/docs.scss @@ -4,6 +4,7 @@ // // Documentation // -------------------------------------------------- + html, body { width: 100%; @@ -134,6 +135,9 @@ body { font-size: 24px; opacity: .7; } + &.with-padding { + padding-bottom: 80px; + } } @@ -194,6 +198,7 @@ body { // Benefits // -------------------------------------------------- + .docs-benefits { padding-bottom: 0; text-align: center; @@ -499,11 +504,11 @@ hr { clear: both; } + // Docs media queries // -------------------------------------------------- // Tablet to desktop -// -------------------------------------------------- @media screen and (min-width: 768px) { // Jumbotron .docs-header-content { @@ -564,12 +569,6 @@ hr { background-repeat: no-repeat; @include transition(background-image .1s linear); - // Pre-load device backgrounds so we stop the flicker. - &:after { - content: ''; - background-image: url("../img/iphone5s.png"); - opacity: 0; - } &.device-fixed { position: fixed; right: auto; @@ -647,6 +646,12 @@ hr { } } +// Example devices + +.example-device { + margin: 0 auto; +} + // The Chassis grid // -------------------------------------------------- diff --git a/sass/type.scss b/sass/type.scss index ee62ebc..58b8f95 100644 --- a/sass/type.scss +++ b/sass/type.scss @@ -3,7 +3,7 @@ // -------------------------------------------------- h1, h2, h3, h4, h5, h6 { - margin: 10px 15px; + margin: 10px $bar-side-spacing; line-height: 1; } h1, .h1 { font-size: 36px; } @@ -15,7 +15,15 @@ h6, .h6 { font-size: 12px; margin-top: 20px } // Paragraphs p { - margin: 10px 15px; + margin: 10px $bar-side-spacing; font-size: 14px; color: #777; +} + +// Take on the container's side spacing +.container { + > h1, h2, h3, h4, h5, h6, p { + margin-left: 0; + margin-right: 0; + } } \ No newline at end of file