Some rough style/script for the blog archives faux widget

--HG--
extra : convert_revision : svn%3A5ff7c347-ad56-4c35-b696-ccb81de16e03/trunk%4045442
This commit is contained in:
skewed
2010-01-15 00:38:02 +00:00
parent e5f10e98a0
commit 775567683c
6 changed files with 122 additions and 11 deletions

View File

@@ -114,9 +114,27 @@ page width. Or, you can specify an exact pixel width. */
padding: 30px 30px 15px 30px;
background-color: #fff;
margin-bottom: 30px;
overflow:auto;
_height: 1px; /* only IE6 applies CSS properties starting with an underscrore */
}
#contentwrapper
{
float:left;
width:100%;
}
#content
{
margin-right:230px;
}
#sidebar
{
float:left;
margin-left:-200px;
width:200px;
}
#footer
{
color: #999;

View File

@@ -12,14 +12,21 @@ Model.Zones.AddRenderPartial("content:before", "messages", Model.Messages);
Html.Zone("menu"); %>
</div>
<div id="main">
<div id=content”><%
<div id="contentwrapper">
<div id="content"><%
Html.ZoneBody("primary");
%></div>
<div id=”sidebar”><%
</div>
<div id="sidebarwrapper">
<div id="sidebar"><%
Html.Zone("secondary");
%></div>
</div>
<%-- put outside of #main? --%>
<div id="footerwrapper">
<div id="footer"><%
Html.Zone("footer");
%></div>
</div>
</div>
</div>

View File

@@ -113,6 +113,8 @@
</ItemGroup>
<ItemGroup>
<Content Include="Package.txt" />
<Content Include="Scripts\archives.js" />
<Content Include="Styles\archives.css" />
<Content Include="Views\Archives.ascx" />
<Content Include="Views\BlogPostAdmin\Create.ascx" />
<Content Include="Views\BlogPostAdmin\Edit.ascx" />

View File

@@ -0,0 +1,14 @@
/** archives **/
$(function() {
$('.archives ul.years li.previous').each(function() {
$(this).click(function(ev) {
if (!ev || $(ev.target).not("a").size()) {
$(this).toggleClass("open");
$(this).find("h4>span").toggle();
$(this).children("ul").toggle();
}
});
//$(this).hoverClassIfy();
});
});

View File

@@ -0,0 +1,68 @@
/* todo: (heskew) come up with some real style for this. pretty much a copy/paste from oxite */
/* ARCHIVES
----------------------------------------------------------*/
.archives h3 {
margin-bottom:0;
}
.archives ul {
margin:0;
padding:0;
}
.archives ul
.archives li {
list-style-type:none;
}
.archives ul.years li {
list-style-type:none;
margin:.6em 0 0;
/*background:url(images/bullet_toggle_minus_onoff.png) no-repeat -9999px 0;*/
}
.archives ul.archiveMonthList li
{
margin:.2em 0;
}
.archives ul.archiveMonthList li.first {
margin-top:0;
}
.archives ul.archiveMonthList li.last {
margin-bottom:0;
}
.archives ul.years li.previous h4 span {
display:none;
}
/* todo: (heskew) style for "html.dyn" by default, target html.static for non-javascript */
html.dyn .archives ul.years li.previous h4 span {
display:inline;
}
html.dyn .archives ul.years li h4,
html.dyn .archives ul.years li ul {
margin:.2em .2ex;
}
/* todo: (heskew) very, very, very temporary. do something like the commented-out background image past the :before selector */
html.dyn .archives ul.years li.previous h4:before {
content:"⇓ ";
}
html.dyn .archives ul.years li.previous {
cursor:pointer;
padding:.1em .2ex .2em 2ex;
/*background:url(images/bullet_toggle_plus_onoff.png) no-repeat 0 -25px;*/
margin:0 -2ex;
}
html.dyn .archives ul.years li.previous.hover {
background-position:0 6px;
}
/* todo: (heskew) very, very, very temporary. do something like the commented-out background image past the :before selector */
html.dyn .archives ul.years li.previous.open h4:before {
content:"⇑ ";
}
html.dyn .archives ul.years li.previous.open {
/*background:url(images/bullet_toggle_minus_onoff.png) no-repeat -689px 6px;*/
}
html.dyn .archives ul.years li.previous.open.hover {
background-position:0 6px;
}
html.dyn .archives ul.years li.previous ul {
display:none;
margin-left:2ex;
}

View File

@@ -2,11 +2,13 @@
<%@ Import Namespace="Orchard.Blogs.ViewModels"%>
<%@ Import Namespace="Orchard.Blogs.Extensions"%>
<%@ Import Namespace="Orchard.Blogs.Models"%>
<div class="sub archives">
<% Html.RegisterStyle("archives.css"); %>
<% Html.RegisterFootScript("archives.js"); %>
<div class="archives">
<h3><%=_Encoded("Archives") %></h3><%
if (Model.Archives.Count() > 0) {
if (Model.Archives.Count() > 20) { %>
<ul class="yearList"><%
<ul class="years"><%
int lastYear = Model.Archives.First().Key.Year;
int firstYear = Model.Archives.Last().Key.Year;