Skip to content

Commit 966b0a6

Browse files
JonRoweJonRowe
committed
tweak styles
1 parent 8833807 commit 966b0a6

File tree

5 files changed

+102
-74
lines changed

5 files changed

+102
-74
lines changed

‎_layouts/default.html‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,7 @@ <h1>
2323
</span>
2424
</h1>
2525
</header>
26-
<section id="page">
27-
{{content}}
28-
</section>
26+
{{content}}
2927
<footer>
3028
<h1>&copy; 2012 Crafted Code Limited</h1>
3129
<p>Registered Company No: 7762190</p>

‎_styles/_page.sass‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
1-
#page
2-
@include outer-container
3-
min-height: 100%
1+
#page1
2+
@extend .page
43
margin-top: -15em
5-
margin-bottom: -4em
64
padding-top: 15em
5+
#page2
6+
@extend .page
7+
margin-bottom: -4em
78
padding-bottom: 4em
9+
.page
10+
@include outer-container
11+
min-height: 100%
812

913
blockquote
1014
@include span-columns(12)

‎_styles/default.sass‎

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,15 @@ html, body
1010
background: white
1111
color: black
1212

13+
a
14+
color: black
15+
text-decoration: underline
16+
1317
@import 'header'
1418
@import 'page'
1519
@import 'footer'
1620

17-
#page
21+
#page1, #page2
1822
section
1923
padding-top: 1em
2024
padding-bottom: 1em
@@ -24,14 +28,19 @@ html, body
2428
#about
2529
@include shift(3)
2630
@include span-columns(6)
27-
#more, #work, #contact
31+
#about, #work, #contact
2832
@include omega()
2933

30-
#about, #more
34+
#about, #contact
3135
text-align: justify
3236
padding-top: 1em
37+
line-height: 1.2em
38+
#about
39+
40+
font-weight: bold
41+
font-size: 2.4em
42+
#contact
3343
font-size: 1.5em
34-
line-height: 1.1em
3544

3645
#work
3746
ul

‎index.html‎

Lines changed: 39 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -2,40 +2,46 @@
22
layout: default
33
title: Crafted Code
44
---
5-
<section id="about">
6-
<p>
7-
Crafted Code creates applications with the web.
8-
<br>
9-
We build ideas, craft prototypes and polish them
10-
into products.
11-
</p>
12-
<p>
13-
We care about code, enthuse over experience and dig design.
14-
<br/>
15-
Checkout the projects we've been involved in.
16-
</p>
5+
<section id="page1">
6+
<section id="about">
7+
<p>
8+
Crafted Code creates applications with the web.
9+
<br>
10+
We build ideas, craft prototypes and polish them
11+
into products.
12+
</p>
13+
<p>
14+
We care about code, enthuse over experience and dig design.
15+
<br/>
16+
<a href="#work">
17+
Checkout the projects we've been involved in.
18+
</a>
19+
</p>
20+
</section>
1721
</section>
18-
<section id="work">
19-
<ul class='carousel'>
20-
<div class='carousel-inner'>
21-
<li id='folksy' class='item active'>
22-
<h2>Folksy</h2>
23-
</li>
24-
<li id='summer_of_cycling' class='item'>
25-
<h2>Summer Of Cycling (Challenge for Change)</h2>
26-
</li>
27-
<li id='helpout' class='item'>
28-
<h2>Help Out (FutureGov)</h2>
29-
</li>
30-
<li id='foodhospital' class='item'>
31-
<h2>Food Hospital (Mudlark/Channel4)</h2>
32-
</li>
33-
</div>
34-
</ul>
35-
</section>
36-
<section id="contact">
37-
If you think you have an interesting project, and would like to hire us, drop us an email to <a href='mailto:[email protected]'>[email protected]</a>
38-
or to our founder, Jon Rowe, <a href='mailto:[email protected]'>[email protected]</a> who's always happy to talk.
22+
<section id="page2">
23+
<section id="work">
24+
<ul class='carousel'>
25+
<div class='carousel-inner'>
26+
<li id='folksy' class='item active'>
27+
<h2>Folksy</h2>
28+
</li>
29+
<li id='summer_of_cycling' class='item'>
30+
<h2>Summer Of Cycling (Challenge for Change)</h2>
31+
</li>
32+
<li id='helpout' class='item'>
33+
<h2>Help Out (FutureGov)</h2>
34+
</li>
35+
<li id='foodhospital' class='item'>
36+
<h2>Food Hospital (Mudlark/Channel4)</h2>
37+
</li>
38+
</div>
39+
</ul>
40+
</section>
41+
<section id="contact">
42+
If you think you have an interesting project, and would like to hire us, drop us an email to <a href='mailto:[email protected]'>[email protected]</a>
43+
or to our founder, Jon Rowe, <a href='mailto:[email protected]'>[email protected]</a> who's always happy to talk.
44+
</section>
3945
</section>
4046
<script type="text/javascript">
4147
$(function() {

‎styles/default.css‎

Lines changed: 41 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -325,6 +325,9 @@ html, body {
325325
height: 100%;
326326
background: white;
327327
color: black; }
328+
html a, body a {
329+
color: black;
330+
text-decoration: underline; }
328331

329332
header {
330333
zoom: 1;
@@ -355,23 +358,27 @@ header {
355358
color: #ffe95e;
356359
text-shadow: -1px -1px 0px #d1bf4d, -2px -2px 0px #d1bf4d, -3px -3px 0px #d1bf4d, -4px -4px 0px #aaaaaa; }
357360

358-
#page {
361+
#page1 {
362+
margin-top: -15em;
363+
padding-top: 15em; }
364+
365+
#page2 {
366+
margin-bottom: -4em;
367+
padding-bottom: 4em; }
368+
369+
.page, #page1, #page2 {
359370
zoom: 1;
360371
max-width: 75.99879em;
361372
text-align: left;
362373
margin-left: auto;
363374
margin-right: auto;
364-
min-height: 100%;
365-
margin-top: -15em;
366-
margin-bottom: -4em;
367-
padding-top: 15em;
368-
padding-bottom: 4em; }
369-
#page:before, #page:after {
375+
min-height: 100%; }
376+
.page:before, #page1:before, #page2:before, .page:after, #page1:after, #page2:after {
370377
content: "";
371378
display: table; }
372-
#page:after {
379+
.page:after, #page1:after, #page2:after {
373380
clear: both; }
374-
#page blockquote {
381+
.page blockquote, #page1 blockquote, #page2 blockquote {
375382
display: block;
376383
float: left;
377384
margin-right: 2.35765%;
@@ -381,15 +388,15 @@ header {
381388
margin: 0;
382389
text-align: center;
383390
font-size: 1.2em; }
384-
#page blockquote:last-child {
391+
.page blockquote:last-child, #page1 blockquote:last-child, #page2 blockquote:last-child {
385392
margin-right: 0; }
386-
#page blockquote:before {
393+
.page blockquote:before, #page1 blockquote:before, #page2 blockquote:before {
387394
content: open-quote; }
388-
#page blockquote:after {
395+
.page blockquote:after, #page1 blockquote:after, #page2 blockquote:after {
389396
content: close-quote; }
390-
#page blockquote:before, #page blockquote:after {
397+
.page blockquote:before, #page1 blockquote:before, #page2 blockquote:before, .page blockquote:after, #page1 blockquote:after, #page2 blockquote:after {
391398
font-weight: bold; }
392-
#page section h1 {
399+
.page section h1, #page1 section h1, #page2 section h1 {
393400
border-bottom: 0.1em solid black;
394401
padding-bottom: 0.3em; }
395402

@@ -405,48 +412,52 @@ footer {
405412
footer h1, footer p {
406413
margin: 0; }
407414

408-
#page section {
415+
#page1 section, #page2 section {
409416
padding-top: 1em;
410417
padding-bottom: 1em; }
411-
#page #work, #page #contact {
418+
#page1 #work, #page1 #contact, #page2 #work, #page2 #contact {
412419
display: block;
413420
float: left;
414421
margin-right: 2.35765%;
415422
width: 100%; }
416-
#page #work:last-child, #page #contact:last-child {
423+
#page1 #work:last-child, #page1 #contact:last-child, #page2 #work:last-child, #page2 #contact:last-child {
417424
margin-right: 0; }
418-
#page #about {
425+
#page1 #about, #page2 #about {
419426
margin-left: 25.58941%;
420427
display: block;
421428
float: left;
422429
margin-right: 2.35765%;
423430
width: 48.82117%; }
424-
#page #about:last-child {
431+
#page1 #about:last-child, #page2 #about:last-child {
425432
margin-right: 0; }
426-
#page #more, #page #work, #page #contact {
433+
#page1 #about, #page1 #work, #page1 #contact, #page2 #about, #page2 #work, #page2 #contact {
427434
margin-right: 0; }
428-
#page #about, #page #more {
435+
#page1 #about, #page1 #contact, #page2 #about, #page2 #contact {
429436
text-align: justify;
430437
padding-top: 1em;
431-
font-size: 1.5em;
432-
line-height: 1.1em; }
433-
#page #work ul {
438+
line-height: 1.2em; }
439+
#page1 #about, #page2 #about {
440+
font-weight: bold;
441+
font-size: 2.4em; }
442+
#page1 #contact, #page2 #contact {
443+
font-size: 1.5em; }
444+
#page1 #work ul, #page2 #work ul {
434445
list-style: none;
435446
margin: 0;
436447
padding: 0; }
437-
#page #work li {
448+
#page1 #work li, #page2 #work li {
438449
height: 560px; }
439-
#page #work li h2 {
450+
#page1 #work li h2, #page2 #work li h2 {
440451
background: white;
441452
float: left;
442453
margin: 1em;
443454
padding: 0.5em;
444455
font-size: 1.5em; }
445-
#page #work #folksy {
456+
#page1 #work #folksy, #page2 #work #folksy {
446457
background: url("/images/folksy.png") no-repeat; }
447-
#page #work #summer_of_cycling {
458+
#page1 #work #summer_of_cycling, #page2 #work #summer_of_cycling {
448459
background: url("/images/summer_of_cycling.png") no-repeat; }
449-
#page #work #helpout {
460+
#page1 #work #helpout, #page2 #work #helpout {
450461
background: url("/images/helpout.png") no-repeat; }
451-
#page #work #foodhospital {
462+
#page1 #work #foodhospital, #page2 #work #foodhospital {
452463
background: url("/images/foodhospital.png") no-repeat; }

0 commit comments

Comments
 (0)