Skip to content

Commit 0007839

Browse files
ajpianoajpiano
committed
Merge pull request #159 from anthonybruno/css-scaffold-new
Styles and Theme to support brand guide
2 parents 629da37 + ece1730 commit 0007839

File tree

6 files changed

+211
-9
lines changed

6 files changed

+211
-9
lines changed

‎sites.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -200,7 +200,7 @@ function jquery_sites() {
200200
'brand.jquery.org' => array(
201201
'blog_id' => 18,
202202
'cookie_domain' => '.jquery.org',
203-
'body_class' => 'jquery-project',
203+
'body_class' => 'jquery-foundation',
204204
'options' => array(
205205
'blogname' => 'jQuery Branding Guidelines',
206206
'stylesheet' => 'brand.jquery.org',

‎themes/brand.jquery.org/index.php

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎themes/brand.jquery.org/page.php

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<?php get_header(); ?>
2+
3+
<?php the_post(); ?>
4+
5+
<div class="content-right">
6+
<div id="content">
7+
<?php get_template_part( 'content', 'page' ); ?>
8+
</div>
9+
<?php get_sidebar(); ?>
10+
</div>
11+
12+
<?php get_footer(); ?>

‎themes/brand.jquery.org/sidebar.php

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
<?php
2+
/**
3+
* The Sidebar containing the main widget area.
4+
*/
5+
?>
6+
<div id="sidebar" class="widget-area" role="complementary">
7+
<aside class="widget">
8+
<h3 class="widget-title"><a href="/logos">Logos</a></h3>
9+
<ul>
10+
<li><a href="/logos#the-mark">The mark</a></li>
11+
<li><a href="/logos#spacing-guidelines">Spacing guidelines</a></li>
12+
<li><a href="/logos#incorrect-logo-usage">Incorrect usage</a></li>
13+
<li><a href="/logos#proper-usage">Proper usage</a></li>
14+
</ul>
15+
</aside>
16+
<aside class="widget">
17+
<h3 class="widget-title"><a href="/colors">Colors</a></h3>
18+
<ul>
19+
<li><a href="/colors#jquery-black">jQuery black</a></li>
20+
<li><a href="/colors#jquery-blue">jQuery blue</a></li>
21+
<li><a href="/colors#jquery-ui-orange">jQuery UI orange</a></li>
22+
<li><a href="/colors#jquery-mobile-green">jQuery Mobile green</a></li>
23+
<li><a href="/colors#sizzle-orange-red">Sizzle orange/red</a></li>
24+
<li><a href="/colors#qunit-purple">QUnit purple</a></li>
25+
</ul>
26+
</aside>
27+
<aside class="widget">
28+
<h3 class="widget-title"><a href="/typography">Typography</a></h3>
29+
<ul>
30+
<li><a href="/typography#klavika">Klavika</a></li>
31+
<li><a href="/typography#helvetica">Helvetica</a></li>
32+
<li><a href="/typography#quagmire">Quagmire</a></li>
33+
</ul>
34+
</aside>
35+
<aside class="widget">
36+
<h3 class="widget-title"><a href="/naming-conventions">Naming Conventions</a></h3>
37+
<ul>
38+
<li><a href="/naming-conventions#branding-your-tagline">Branding your tagline</a></li>
39+
<li><a href="/naming-conventions#using-jquery-in-your-name">Using jQuery in your name</a></li>
40+
<li><a href="/naming-conventions#what-do-avoid">What to avoid</a></li>
41+
</ul>
42+
</aside>
43+
<aside class="widget">
44+
<h3 class="widget-title"><a href="/events-conferences">Events &amp; Conferences</a></h3>
45+
<ul>
46+
<li><a href="/events-conferences#naming-your-jquery-event">Naming</a></li>
47+
<li><a href="/events-conferences#promoting-your-jquery-event">Promoting</a></li>
48+
<li><a href="/events-conferences#event-rules">Rules</a></li>
49+
<li><a href="/events-conferences#jquery-developer-summit">jQuery Developer Summit</a></li>
50+
</ul>
51+
</aside>
52+
<aside class="widget">
53+
<h3 class="widget-title"><a href="/press-contact">Press &amp; Contact</a></h3>
54+
<ul>
55+
<li><a href="/press-contact#visit-jquery-online">Online</a></li>
56+
<li><a href="/press-contact#jquery-social-networks">Facebook &amp; Twitter</a></li>
57+
<li><a href="/press-contact#journalists">Journalists</a></li>
58+
<li><a href="/press-contact#questions">Questions</a></li>
59+
<li><a href="/press-contact#bugs">Bugs</a></li>
60+
</ul>
61+
</aside>
62+
</div>

‎themes/brand.jquery.org/style.css

Lines changed: 130 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,133 @@ Theme Name: brand-jquery-org
33
Template: jquery
44
*/
55

6-
h1 { color: purple; }
6+
/* Structure */
7+
8+
#content {
9+
padding-bottom: 40px;
10+
}
11+
#banner-secondary.large-banner {
12+
text-align: left;
13+
}
14+
15+
/* Headlines */
16+
17+
#content h2 {
18+
font-size: 30px;
19+
line-height: 1.8;
20+
color: #333;
21+
text-transform: uppercase;
22+
margin-bottom: 20px;
23+
}
24+
#content h3 {
25+
font-size: 22px;
26+
line-height: 1.5;
27+
color: #444;
28+
}
29+
#banner-secondary.large-banner h1,
30+
#banner-secondary.large-banner h2 {
31+
font-size: 42px;
32+
text-transform: uppercase;
33+
}
34+
35+
h6.h-klavika {
36+
font-size: 46px;
37+
line-height: 1.2;
38+
margin-bottom: 30px;
39+
}
40+
h6.h-klavika em {
41+
color: #333;
42+
}
43+
44+
h6.h-helvetica {
45+
font: 400 46px/1.2 Helvetica, "Helvetica Neue", Arial, sans-serif !important;
46+
margin-bottom: 30px;
47+
}
48+
49+
/* Custom Structure */
50+
.color {
51+
display: block;
52+
margin: 30px 0;
53+
color: #fff;
54+
padding: 20px;
55+
}
56+
.color * {
57+
opacity: 0.9;
58+
}
59+
#content .color h6 {
60+
font: 800 14px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif !important;
61+
margin-bottom: 4px;
62+
}
63+
#content .color ul {
64+
margin: 0;
65+
padding: 0;
66+
}
67+
#content .color li {
68+
list-style-type: none;
69+
background: none;
70+
margin: 0;
71+
padding: 0;
72+
font-size: 14px;
73+
line-height: 20px;
74+
}
75+
76+
.color.black { background-color: #333; }
77+
.color.primary-blue { background-color: #0769AD; }
78+
.color.secondary-blue { background-color: #7ACEF4; }
79+
.color.primary-orange { background-color: #FAA523; }
80+
.color.secondary-orange { background-color: #B24926; }
81+
.color.primary-green { background-color: #3EB249; }
82+
.color.secondary-green { background-color: #108040; }
83+
.color.sizzle-orange { background-color: #FAA523; }
84+
.color.sizzle-red { background-color: #9A1B1E; }
85+
.color.qunit-primary-purple { background-color: #9C3493; }
86+
.color.qunit-secondary-purple { background-color: #390F39; }
87+
88+
89+
/* Misc Content */
90+
p {
91+
font: 16px/1.5 Helvetica, "Helvetica Neue", Arial, sans-serif;
92+
}
93+
.figcaption {
94+
padding-top: 20px;
95+
padding-bottom: 20px;
96+
}
97+
98+
#banner-secondary p {
99+
padding-left: 0;
100+
color: #fff;
101+
}
102+
hr {
103+
display: block;
104+
clear: both;
105+
margin: 50px 0;
106+
}
107+
108+
/* Links */
109+
a {
110+
color: #032A42;
111+
}
112+
113+
/* Lists */
114+
#content dt {
115+
font-weight: bold;
116+
}
117+
#content dd {
118+
margin: 10px 0 20px;
119+
}
120+
121+
/* Buttons */
122+
a.button, #content a.button, .button, input[type="submit"] {
123+
float: none;
124+
display: inline-block;
125+
}
126+
127+
/* Helpers */
128+
.db {
129+
display: inline-block;
130+
float: none !important;
131+
clear: both;
132+
}
133+
.p-small {
134+
padding-bottom: 20px;
135+
}

‎themes/jquery/menu-header.php

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -80,8 +80,12 @@ function menu_header_jquery_org() {
8080

8181
function menu_header_brand_jquery_org() {
8282
return array(
83-
'http://brand.jquery.org/' => 'Home',
84-
'http://brand.jquery.org/trademark/' => 'Trademark'
83+
'http://brand.jquery.org/logos' => 'Logos',
84+
'http://brand.jquery.org/colors/' => 'Colors',
85+
'http://brand.jquery.org/typography/' => 'Typography',
86+
'http://brand.jquery.org/naming-conventions/' => 'Naming Conventions',
87+
'http://brand.jquery.org/events-conferences/' => 'Events &amp; Conferences',
88+
'http://brand.jquery.org/press-contact/' => 'Press &amp; Contact'
8589
);
8690
}
8791

0 commit comments

Comments
 (0)