Skip to content

Commit 5347474

Browse files
dominicdominic
committed
explore and ask images
1 parent 315fc46 commit 5347474

4 files changed

Lines changed: 55 additions & 34 deletions

File tree

‎app/assets/images/ask.png‎

76 KB
Loading

‎app/assets/images/explore.png‎

59.4 KB
Loading

‎app/assets/stylesheets/home.css.scss‎

Lines changed: 32 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -70,20 +70,26 @@
7070
}
7171
}
7272

73-
#home-top {
73+
.body-home #content-wrap {
74+
.container {
75+
padding-top: 0;
76+
}
77+
78+
border-top: none;
7479
section {
75-
@include container;
80+
@include clearfix;
7681
background: white;
7782
padding-bottom: 1em;
7883

7984
p {
8085
font-size: 1.25em;
8186
line-height: 1.75em;
87+
padding-bottom: 0.75em;
8288
}
8389

8490
h1 {
8591
font-size: 3em;
86-
margin: 0 -18px 0.25em;
92+
margin: 0 -18px 0.5em;
8793
padding: 0.5em 18px;
8894
color: white;
8995
border-bottom: 6px solid black;
@@ -92,15 +98,14 @@
9298
}
9399

94100
#download {
95-
@include clearfix;
96101
background: white url("download.png") 0 4em no-repeat;
97102
h1 {
98103
background: $green;
99104
border-color: $green - #222;
100105
}
101106
.btn {
102107
@include columns(4);
103-
@include offset(4);
108+
@include offset(5);
104109
text-align: center;
105110
margin-top: 1em;
106111
margin-bottom: 1em;
@@ -114,29 +119,41 @@
114119
}
115120
}
116121
.content {
117-
@include columns(11);
118-
@include offset(4);
122+
@include columns(10);
123+
@include offset(5);
119124
}
120125
}
121126

122127
#explore {
123-
h1 {
124-
background: $heading;
125-
border-color: $heading - #111;
126-
}
128+
background: white url("explore.png") 95% 7em no-repeat;
129+
h1 {
130+
background: $heading;
131+
border-color: $heading - #111;
132+
}
133+
.content {
134+
@include columns(10);
135+
margin-left: 2em;
136+
}
127137
}
128138

129139
#ask {
140+
background: white url("ask.png") 0 7em no-repeat;
141+
min-height: 340px;
142+
130143
h1 {
131144
background: $orangered;
132145
border-color: $orangered - #222;
133146
}
147+
.content {
148+
@include columns(10);
149+
@include offset(5);
150+
}
134151
}
135152
}
136153

137-
.body-home #content-wrap {
138-
border-top: none;
139-
section {
154+
/*.body-home #content-wrap {
155+
border-top: none;*/
156+
/* section {
140157
@include clearfix;
141158
margin: 0 36px 36px 18px;
142159
padding-bottom: 36px;
@@ -169,4 +186,4 @@
169186
border: none;
170187
margin-bottom: 0;
171188
}
172-
}
189+
}*/

‎app/views/static/root.html.haml‎

Lines changed: 23 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -14,26 +14,30 @@
1414
.container
1515
= image_tag "splash.jpg"
1616

17-
#home-top
18-
%section#download
19-
%h1 Download
20-
.content
21-
%p
22-
Hackety Hack will teach you the absolute basics of programming from the ground up. No previous programming experience is needed!
23-
%p
24-
With Hackety Hack, you'll learn the <a href="http://www.ruby-lang.org/en/">Ruby programming language</a>. Ruby is used for all kinds of programs, including desktop applications and websites.
25-
%a.btn.primary.large{:href => ""}
26-
%b.download Download Now
27-
%br
28-
%span.version Version 1.0.1
29-
30-
%section#explore
31-
%h1 Explore
32-
%p Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis interdum. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec ullamcorper nulla non metus auctor fringilla. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
17+
/ #home-top
3318
34-
%section#ask
35-
%h1 Ask
36-
%p Vestibulum id ligula porta felis euismod semper. Aenean lacinia bibendum nulla sed consectetur. Aenean lacinia bibendum nulla sed consectetur. Curabitur blandit tempus porttitor.
19+
%section#download
20+
%h1 Download
21+
.content
22+
%p
23+
Hackety Hack will teach you the absolute basics of programming from the ground up. No previous programming experience is needed!
24+
%p
25+
With Hackety Hack, you'll learn the <a href="http://www.ruby-lang.org/en/">Ruby programming language</a>. Ruby is used for all kinds of programs, including desktop applications and websites.
26+
%a.btn.primary.large{:href => ""}
27+
%b.download Download Now
28+
%br
29+
%span.version Version 1.0.1
30+
31+
%section#explore
32+
%h1 Explore
33+
.content
34+
%p Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis interdum. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec ullamcorper nulla non metus auctor fringilla. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
35+
36+
%section#ask
37+
%h1 Ask
38+
.content
39+
%p Vestibulum id ligula porta felis euismod semper. Aenean lacinia bibendum nulla sed consectetur. Aenean lacinia bibendum nulla sed consectetur. Curabitur blandit tempus porttitor.
40+
%p Vestibulum id ligula porta felis euismod semper. Aenean lacinia bibendum nulla sed consectetur. Aenean lacinia bibendum nulla sed consectetur. Curabitur blandit tempus porttitor.
3741

3842
/ %section
3943
/ %img.left.new_program{:src => "assets/screenshots/new_program.png"}

0 commit comments

Comments
 (0)