Permalink
Browse files
updated accordion and datepicker markup. changed demos/index.html so …
…it looks for .demos-nav rather than #container within individual widget demo indexes.
- Loading branch information
Showing
with
23 additions
and
16 deletions.
-
+1
−1
demos/accordion/index.html
-
+10
−8
demos/datepicker/index.html
-
+11
−6
demos/demos.css
-
+1
−1
demos/index.html
|
|
@@ -5,7 +5,7 @@ |
|
|
<link type="text/css" href="../demos.css" rel="stylesheet" /> |
|
|
</head> |
|
|
<body> |
|
|
<div id="container"> |
|
|
<div class="demos-nav"> |
|
|
<h4>Accordion</h4> |
|
|
<ul> |
|
|
<li class="demo-config-on"><a href="default.html">Basic accordion (default)</a></li> |
|
|
|
|
|
@@ -6,14 +6,16 @@ |
|
|
</head> |
|
|
<body> |
|
|
|
|
|
<dl class="demos-nav"> |
|
|
<dt>Datepicker</dt> |
|
|
<dd><a href="default.html">Default datepicker</a></dd> |
|
|
<dd><a href="dropdown_month_year.html">Month & year menus</a></dd> |
|
|
<dd><a href="buttonbar.html">Today & Done button bar</a></dd> |
|
|
<dd><a href="multiple_calendars.html">3 month view</a></dd> |
|
|
<dd><a href="inline.html">Inline datepicker</a></dd> |
|
|
</dl> |
|
|
<div class="demos-nav"> |
|
|
<h4>Datepicker</h4> |
|
|
<ul> |
|
|
<li><a href="default.html">Default datepicker</a></li> |
|
|
<li><a href="dropdown_month_year.html">Month & year menus</a></li> |
|
|
<li><a href="buttonbar.html">Today & Done button bar</a></li> |
|
|
<li><a href="multiple_calendars.html">3 month view</a></li> |
|
|
<li><a href="inline.html">Inline datepicker</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
</body> |
|
|
</html> |
|
|
@@ -64,7 +64,7 @@ body { |
|
|
|
|
|
/* Demos */ |
|
|
|
|
|
.demos-nav, .demos-nav dt, .demos-nav dd { |
|
|
.demos-nav, .demos-nav dt, .demos-nav dd, .demos-nav ul, .demos-nav li { |
|
|
margin: 0; |
|
|
padding: 0 |
|
|
} |
|
|
@@ -75,21 +75,24 @@ body { |
|
|
font-size: 1.3em; |
|
|
} |
|
|
|
|
|
.demos-nav dt { |
|
|
.demos-nav dt, |
|
|
.demos-nav h4 { |
|
|
margin: 0; |
|
|
padding: 0; |
|
|
letter-spacing: 0.75pt; |
|
|
font: bold 1.2em 'Arial', 'Helvetica', sans-serif; |
|
|
color: #e87b10; |
|
|
} |
|
|
|
|
|
.demos-nav dt { |
|
|
.demos-nav dt, |
|
|
.demos-nav h4 { |
|
|
margin-top: 1.5em; |
|
|
margin-bottom: 0.7em; |
|
|
line-height: 1.2em; |
|
|
} |
|
|
|
|
|
.demos-nav dd a { |
|
|
.demos-nav dd a, |
|
|
.demos-nav li a { |
|
|
border-bottom: 1px solid #F4F4F4; |
|
|
display:block; |
|
|
padding: 3px 3px 3px 12px; |
|
|
@@ -100,7 +103,9 @@ body { |
|
|
} |
|
|
|
|
|
.demos-nav dd a:hover, |
|
|
.demos-nav dd a:focus { |
|
|
.demos-nav dd a:focus, |
|
|
.demos-nav li a:hover, |
|
|
.demos-nav li a:focus { |
|
|
background: #EAEAEA; |
|
|
border-color: #BBBBBB; |
|
|
} |
|
|
@@ -120,7 +125,7 @@ eventually we should convert the font sizes to ems -- using px for now to minimi |
|
|
|
|
|
#demo-frame { float:left; width:520px; height:300px; border:1px solid #ddd; } |
|
|
|
|
|
#demo-config-menu { float:right; width:150px; } |
|
|
#demo-config-menu { float:right; width:200px; } |
|
|
#demo-config-menu h4 { font-size:13px; color:#666; font-weight:normal; border:0; padding-left:18px; } |
|
|
|
|
|
#demo-config-menu ul { list-style: none; padding: 0; margin: 0; } |
|
|
|
|
|
@@ -30,7 +30,7 @@ |
|
|
.find('#demo-config') |
|
|
.append('<iframe id="demo-frame" name="demo-frame" width="520" height="314" scrolling="auto" frameborder="0" src="'+ section +'/default.html"></iframe><div id="demo-config-menu"></div>') |
|
|
.find('#demo-config-menu') |
|
|
.load(this.href + ' #container', function(){ |
|
|
.load(this.href + ' .demos-nav', function(){ |
|
|
$('#demo-config-menu a').each(function(){ |
|
|
this.setAttribute('href', section + '/' + this.getAttribute('href')); |
|
|
$(this).attr('target', 'demo-frame'); |
|
|
|