8000 Added lots hotness · hsavran/learn.jquery.com@0332337 · GitHub
Skip to content

Commit 0332337

Browse files
darcyclarkedarcyclarke
committed
Added lots hotness
1 parent ad44a62 commit 0332337

15 files changed

+21064
-18841
lines changed

‎content/assets/css/style.css

Lines changed: 104 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -181,15 +181,19 @@
181181
/*******************************************************************************/
182182
/* Article content
183183
/*******************************************************************************/
184-
.example
185-
{ margin-bottom: 15px;
184+
.example
185+
{ margin-bottom: 15px;
186186
background: #eee; }
187187

188-
.example .caption
189-
{ padding: .5em 0 .5em 33px;
190-
font-style: italic;
191-
color: #666;
192-
}
188+
.example .caption
189+
{ padding: .5em 0 .5em 33px;
190+
font-style: italic;
191+
color: #666;
192+
text-shadow: 0 1px 1px #fff;
193+
background: #e5e5e5;
194+
border: 1px solid #ccc;
195+
border-bottom: none; }
196+
193197
/*******************************************************************************/
194198
/* Syntax */
195199
/*******************************************************************************/
@@ -205,7 +209,10 @@
205209
-webkit-border-radius: 5px;
206210
-moz-border-radius: 5px;
207211
border-radius: 5px; }
208-
*/
212+
*/
213+
p code
214+
{ background: #FFC; }
215+
209216
pre
210217
{ border: 1px solid #ccc !important; }
211218

@@ -472,7 +479,7 @@
472479
/*******************************************************************************/
473480

474481
html.jquery-learning
475-
{ background: #000 url(http://farm3.static.flickr.com/2767/4030906858_576419bcf8_o.jpg) no-repeat center 0; }
482+
{ background: #000 url(../i/learning_bg.jpg) no-repeat center 0; }
476483

477484
.jquery-learning h1 a
478485
{ background: url(../i/logo-learning.png) no-repeat;
@@ -627,11 +634,12 @@
627634
text-decoration: none; }
628635

629636
.project-select ul li:hover a em
630-
{ opacity: 1.0; }
637+
{ opacity: 0.75; }
631638

632639
.project-select ul li a em
633640
{ display: block;
634-
color: #444;
641+
color: #fff;
642+
opacity: 0.25;
635643
text-shadow: black 0 -1px 0;
636644
line-height: 140%;
637645
font-size: 9pt;
@@ -640,7 +648,12 @@
640648
right: 20px;
641649
bottom: 15px;
642650
position: absolute;
643-
text-decoration: none; }
651+
text-decoration: none;
652+
-webkit-transition: all 500ms ease-in-out;
653+
-moz-transition: all 500ms ease-in-out;
654+
-o-transition: all 500ms ease-in-out;
655+
-ms-transition: all 500ms ease-in-out;
656+
transition: all 500ms ease-in-out; }
644657

645658
.project-select ul li a img
646659
{ width: 84%;
@@ -682,6 +695,9 @@
682695

683696
header nav.top ul.links li.dropdown:hover, header nav.top ul.dropdown.links li.active
684697
{ }
698+
699+
header nav.top ul.links li.dropdown:hover ul, header nav.top ul.links li.dropdown.active ul
700+
{ display: block; }
685701

686702
header nav.top li.dropdown:hover a, header nav.top li.dropdown.active a
687703
{ background: transparent url(../i/jq-global-noise-only.png); }
@@ -704,6 +720,9 @@
704720
z-index: 999;
705721
background: transparent url(../i/jq-global-noise-only.png); }
706722

723+
header nav.top li ul.last
724+
{ margin-left: -60px; }
725+
707726
header nav.top li ul li
708727
{ float: none;
709728
border: none;
@@ -826,7 +845,7 @@
826845
header nav.top li.toggle-projects.active a
827846
{ background-position: 100% -32px;
828847
background-color: transparent;
829-
text-shadow: rgba(0, 0, 0, 0.5) 0 -1px 0, rgba(255, 255, 255, 0.8) 0 0 6px; }
848+
/* text-shadow: rgba(0, 0, 0, 0.5) 0 -1px 0, rgba(255, 255, 255, 0.8) 0 0 6px;*/ }
830849

831850
/*******************************************************************************/
832851
/* Global Footer */
@@ -1459,7 +1478,7 @@
14591478
display: block;
14601479
background: #eeeeee;
14611480
float: left;
1462-
padding: 0 1.5%; }
1481+
padding: 0 1.5% 25px; }
14631482

14641483
#container #body #sidebar ul
14651484
{ float: left;
@@ -1605,6 +1624,77 @@
16051624
width: 100%;
16061625
padding: 5% 6%; }
16071626

1627+
.jquery-learning #sidebar h2
1628+
{ background: url(../i/learning_category_icon.png) no-repeat 0 5px;
1629+
padding-left: 26px; }
1630+
1631+
.jquery-learning #sidebar .paper.subnav
1632+
{ position: absolute;
1633+
height: 100%;
1634+
width: 24%;
1635+
margin: -43px 0 0 -30.5%; /* 6.5% */
1636+
overflow: hidden; }
1637+
1638+
.jquery-learning #sidebar .paper.subnav .shadow
1639+
{ height: 100%;
1640+
width: 5px;
1641+
position: absolute;
1642+
-webkit-box-shadow: inset -2px 0 3px rgba(0,0,0,0.15);
1643+
z-index: 999;
1644+
right: 0; }
1645+
1646+
.jquery-learning #sidebar .paper.subnav .paper_edges
1647+
{ background: url(../i/learning_paper_bg.png) no-repeat 0 0;
1648+
width: 1px;
1649+
height: 1px;
1650+
padding: 238px 0 0 110px;
1651+
margin: -12px 0 0 0px;
1652+
overflow: hidden;
1653+
display: block;
1654+
z-index: 1;
1655+
text-indent: -999;
1656+
-webkit-transform: rotate(28deg);
1657+
-moz-transform: rotate(28deg);
1658+
transform: rotate(28deg);
1659+
-webkit-transition: all 500ms ease-in-out;
1660+
-moz-transition: all 500ms ease-in-out;
1661+
-o-transition: all 500ms ease-in-out;
1662+
-ms-transition: all 500ms ease-in-out;
1663+
transition: all 500ms ease-in-out; }
1664+
1665+
.jquery-learning #sidebar .paper.subnav:hover .paper_edges
1666+
{ -webkit-transform: rotate(0deg);
1667+
-moz-transform: rotate(0deg);
1668+
transform: rotate(0deg); }
1669+
1670+
.jquery-learning #sidebar .paper.subnav:hover
1671+
{ width: 30%;
1672+
margin-left: -36.5%; }
1673+
1674+
.jquery-learning #sidebar .paper.subnav .inner
1675+
{ width: 300px;
1676+
display: block;
1677+
background: #fff;
1678+
border-left: 1px solid rgba(0,0,0,0.25);
1679+
height: 100%;
1680+
margin: -120px 0 0 59px; }
1681+
1682+
.jquery-learning #sidebar .paper.subnav .inner ul
1683+
{ margin-top: -110px;
1684+
position: absolute;
1685+
width: 90%;
1686+
height: 100%;
1687+
background: white url(../i/learning_paper_line_bg.png) repeat-y 0 0;
1688+
margin-left: -2%;
1689+
opacity: 0;
1690+
-webkit-transition: all 500ms ease-in-out;
1691+
-moz-transition: all 500ms ease-in-out;
1692+
-o-transition: all 500ms ease-in-out;
1693+
-ms-transition: all 500ms ease-in-out;
1694+
transition: all 500ms ease-in-out; }
1695+
1696+
.jquery-learning #sidebar .paper.subnav.open .inner ul
1697+
{ opacity: 1; }
16081698

16091699

16101700
/*******************************************************************************/

‎content/assets/i/learning_bg.jpg

788 KB
Loading

‎content/assets/i/learning_category_icon.png

1.14 KB
Loading

‎content/assets/i/learning_cookie_black_bg.png

22.8 KB
Loading

‎content/assets/i/learning_github_bg.png

6.73 KB
Loading

‎content/assets/i/learning_paper_bg.png

5.31 KB
Loading

‎content/assets/i/learning_paper_line_bg.png

1.21 KB
Loading

‎content/assets/js/scripts.js

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,7 @@ App.subscribe("init", function(){
1111
//
1212
// Set Auto Height
1313
//
14-
App.autoHeight();
15-
$(window).resize(function(){
14+
$(window).bind("load resize", function(){
1615
App.autoHeight();
1716
});
1817

@@ -24,14 +23,12 @@ App.subscribe("init", function(){
2423
var el = $(this);
2524
if(el.hasClass('active')){
2625
el.removeClass('active');
27-
$("body").animate({"marginTop":"0"}, 300, function(){
26+
$("body").css({"marginTop":"0"});
2827
el.removeClass('down');
29-
});
3028
} else {
3129
el.addClass('active');
32-
$("body").animate({"marginTop":"150px"}, 300, function(){
30+
$("body").css({"marginTop":"150px"});
3331
el.addClass('down');
34-
});
3532
}
3633
});
3734

@@ -77,5 +74,19 @@ App.subscribe("init", function(){
7774
return $.trim( t );
7875
}).parent().vanGogh();
7976

77+
//
78+
// Learning Site Specific
79+
//
80+
$("#sidebar .paper_edges").bind("click", function(e){
81+
e.preventDefault();
82+
var el = $(this),
83+
container = el.parents(".paper");
84+
if(container.hasClass("open")){
85+
container.addClass("open").animate({"width":"24%","margin-left":"-30.5%"}, 500, function(){});
86+
} else {
87+
container.addClass("open").animate({"width":"120%","margin-left":"-126.5%"}, 500, function(){});
88+
}
89+
});
90+
8091

8192
});

‎layouts/article_footer.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div class="clearfix">
1+
<div class="clearfix meta">
22
<div class="github">
33
<%if @item[:github] %>
44
<% github_user = @item[:github] || "jquery" %>

‎layouts/default.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,11 @@ <h2 class="title"><%= @item[:title] %></h2>
1111

1212
<%= yield %>
1313

14+
<%= render 'article_footer' %>
1415
</div>
1516

1617
<%= render 'sidebar' %>
17-
<%= render 'article_footer' %>
18+
1819
</div>
1920
<!-- /body -->
2021

‎layouts/sidebar.html

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<!-- sidebar -->
22
<aside id="sidebar" class="clearfix autoHeight">
3-
3+
44
<h2>Categories</h2>
55
<hr>
66

@@ -24,5 +24,16 @@ <h2>Categories</h2>
2424
<li><a href="/<%= section %>"><%= section.gsub(/-/, " ").upcase %></a></li>
2525
<% end %>
2626
</ul>
27+
28+
<div class="paper subnav">
29+
<div class="shadow"></div>
30+
<a href="#" class="paper_edges">Open</a>
31+
<div class="inner">
32+
<ul>
33+
<li></li>
34+
</ul>
35+
</div>
36+
</div>
37+
2738
</aside>
2839
<!-- sidebar -->

0 commit comments

Comments
 (0)