Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Add grid and some code samples

  • Loading branch information...
commit 4cb365971cd35355101924c460d9aed2d9124ff5 1 parent 87783ea
Tom Dale authored
6 config.rb
View
@@ -82,6 +82,12 @@ def table_of_contents
markdown.render(chapters.join(''))
end
+
+ def highlight(language, class_name, &block)
+ concat %Q{<div class="highlight #{class_name}">}
+ concat Pygments.highlight capture(&block), :lexer => language
+ concat %Q{</div>}
+ end
end
class HighlightedHTML < Redcarpet::Render::HTML
25 source/about.html.erb
View
@@ -1,3 +1,7 @@
+---
+title: "About"
+---
+
<img class="about-header-text" src="images/about_header_text.png" alt="A framework for creating ambitious web applications.">
<div id="download">
<div id="download-ember">
@@ -16,4 +20,23 @@
</a>
</div>
</div>
-
+
+<div class="about-section">
+ <h2>Getting Started with Ember.js is Easy</h2>
+
+ <% highlight :html, :left do %>
+ test<h1>
+ <% end %>
+
+ <% highlight :javascript, :right do %>
+ MyApp.president = Ember.Object.create({
+ firstName: "Barack",
+ lastName: "Obama",
+
+ fullName: function() {
+ return this.get('firstName') + " " + this.get('lastName');
+ }.property('firstName', 'lastName')
+ });
+ <% end %>
+</div>
+
BIN  source/images/grid.png
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2  source/layout.erb
View
@@ -35,7 +35,7 @@
<div id="github">
<a href="https://github.com/emberjs/ember.js"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://a248.e.akamai.net/assets.github.com/img/e6bef7a091f5f3138b8cd40bc3e114258dd68ddf/687474703a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67" alt="Fork me on GitHub"></a>
</div>
- <div id="content-wrapper">
+ <div id="content-wrapper" class="grid">
<% if content_for?(:sidebar) %>
<div id="sidebar">
<%= yield_content :sidebar %>
42 source/stylesheets/site.css.scss
View
@@ -8,11 +8,14 @@ that should be displayed in a monospace font. */
$code_background: #f2f2f2;
/* Calculated page dimensions. */
-$page_width: 960px;
+$page_width: 940px;
$content_width: $page_width / 1.4;
$sidebar_width: $page_width - $content_width;
$padding: 20px;
+$col_width: 40px;
+$col_spacing: 20px;
+
/* Calculate typography sizes. */
$ratio: 1.4;
$extra_small_font: 12px;
@@ -110,8 +113,12 @@ body {
#content-wrapper {
width: $page_width;
margin: 0 auto 40px auto;
- padding: 20px;
+ padding: 20px 0px;
position: relative;
+
+ &.grid {
+ background-image: url(/images/grid.png);
+ }
}
#content {
@@ -186,7 +193,7 @@ body {
}
#download {
- width: 460px;
+ width: 465px;
height: 125px;
margin: 0 auto;
font-size: $extra_small_font;
@@ -204,7 +211,7 @@ body {
}
#download-starter-kit {
- right: 0;
+ left: 240px;
}
.info {
@@ -222,6 +229,33 @@ body {
}
}
+.about-section {
+ margin: 90px 0;
+
+ h2 {
+ width: 100%;
+ text-align: center;
+ font-size: 18px;
+ color: black;
+ text-transform: uppercase;
+ font-family: "MavenProBold";
+ }
+
+ .highlight {
+ float: left;
+ width: $col_width * 7 + $col_spacing * 6;
+
+ &.right {
+ margin-left: $col_width * 2 + $col_spacing * 3;
+ }
+
+ &.right:after {
+ content: "";
+ break: both;
+ }
+ }
+}
+
/**
Typography styles.
**/
Please sign in to comment.
Something went wrong with that request. Please try again.