[bknr-cvs] hans changed trunk/projects/quickhoney/website/ - bknr-cvs@common-lisp.net - mailman3.common-lisp.net

27 Aug 2008

Revision: 3743
Author: hans
URL: http://bknr.net/trac/changeset/3743
implement drop shadows for overlay windows
U   trunk/projects/quickhoney/website/static/javascript.js
A   trunk/projects/quickhoney/website/static/shadow-grid.gif
A   trunk/projects/quickhoney/website/static/shadow.png
A   trunk/projects/quickhoney/website/static/ydsf.css
U   trunk/projects/quickhoney/website/templates/index.xml
Modified: trunk/projects/quickhoney/website/static/javascript.js
===================================================================

--- trunk/projects/quickhoney/website/static/javascript.js	2008-08-27 10:13:01 UTC (rev 3742)
+++ trunk/projects/quickhoney/website/static/javascript.js	2008-08-27 17:27:40 UTC (rev 3743)
@@ -1233,10 +1233,14 @@
     var overlay = $('overlay');
     overlay.style.top = '144px';
     overlay.className = current_directory;
+    var inner = DIV({ 'class': 'inner', style: 'background: white'},
+                    H1(null, title),
+                    IMG({ src: '/image/overlay-close/color,000000,' + pages[current_directory].link_color,
+                          id: 'close', width: 13, height: 13}),
+                    BR());
     replaceChildNodes(overlay,
-                      H1(null, title),
-                      IMG({ src: '/image/overlay-close/color,000000,' + pages[current_directory].link_color,
-                                  id: 'close', width: 13, height: 13}));
+                      DIV({ 'class': 'ydsf' },
+                          inner));
     overlay.style.width = width + 'px';
     $('close').style.left = (width - 23) + 'px';
     $('close').onclick = overlay_remove;
@@ -1244,7 +1248,7 @@
     for (var i = 3; i < arguments.length; i++) {
         elements.push(arguments[i]);
     }
-    appendChildNodes(overlay, DIV({id: id}, elements));
+    appendChildNodes(inner, DIV({id: id}, elements));
     overlay.style.visibility = 'inherit';
 }
Added: trunk/projects/quickhoney/website/static/shadow-grid.gif
===================================================================
(Binary files differ)
Property changes on: trunk/projects/quickhoney/website/static/shadow-grid.gif
___________________________________________________________________
Name: svn:executable
   + *
Name: svn:mime-type
   + application/octet-stream
Added: trunk/projects/quickhoney/website/static/shadow.png
===================================================================
(Binary files differ)
Property changes on: trunk/projects/quickhoney/website/static/shadow.png
___________________________________________________________________
Name: svn:executable
   + *
Name: svn:mime-type
   + application/octet-stream
Added: trunk/projects/quickhoney/website/static/ydsf.css
===================================================================
--- trunk/projects/quickhoney/website/static/ydsf.css	                        (rev 0)
+++ trunk/projects/quickhoney/website/static/ydsf.css	2008-08-27 17:27:40 UTC (rev 3743)
@@ -0,0 +1,92 @@
+/*
+	yDSF (ydnar Drop-Shadow-Fu)
+	ydnar@sixapart.com - http://www.sixapart.com
+*/
+
+.ydsf {
+	display: block;
+	position: relative;
+	margin: 4px -4px -4px 4px;
+	background: url(shadow-grid.gif) repeat;
+}
+
+/* ie6 ignores this selector */
+html>body .ydsf {
+	margin: 10px -10px -10px 10px;
+	background: url(shadow.png) right bottom no-repeat;
+}
+
+/* shadow corners */
+.ydsf:before,
+.ydsf:after {
+	content: " ";
+	display: block;
+	width: 10px;
+	height: 10px;
+	background: inherit;	
+}
+
+.ydsf:before {
+	position: absolute;
+	top: 0;
+	right: 0;
+	margin: -10px 0 0 auto;
+	background-position: right top;
+}
+
+.ydsf:after {
+	margin: -10px 0 0 -10px;
+	background-position: left bottom;
+}
+
+.ydsf .inner {
+	display: block;
+	position: relative;
+	overflow: hidden; /* prevents margin leakage from child elements */
+	left: -4px;
+	top: -4px;
+}
+
+/* ie6 ignores this selector */
+html>body .ydsf .inner {
+	left: -10px;
+	top: -10px;
+	margin: 0;
+}
+
+
+/* helper classes (not YDSF related) */
+
+.demo-ydsf {
+	position: relative;
+	border: 1px solid #999;
+	padding: 10px;
+	background: #fff url(gradient.jpg) left top repeat-x;
+}
+
+.clear {
+	clear: both;
+	overflow: hidden;
+	width: 1px;
+	height: 1px;
+	margin: 0 -1px -1px 0;
+	border: 0;
+	padding: 0;
+	font-size: 0;
+	line-height: 0;
+}
+
+.left {
+	float: left;
+	display: inline; /* fixes ie double margin-left bug */
+}
+
+.right { float: right; }
+
+.note {
+	width: 200px;
+	border: 1px solid #666;
+	padding: 10px;
+	background: #ffc;
+	color: #333;
+}
Property changes on: trunk/projects/quickhoney/website/static/ydsf.css
___________________________________________________________________
Name: svn:executable
   + *
Modified: trunk/projects/quickhoney/website/templates/index.xml
===================================================================
--- trunk/projects/quickhoney/website/templates/index.xml	2008-08-27 10:13:01 UTC (rev 3742)
+++ trunk/projects/quickhoney/website/templates/index.xml	2008-08-27 17:27:40 UTC (rev 3743)
@@ -9,6 +9,7 @@
   <head>
     <link rel="stylesheet" href="/static/yui/reset-fonts/reset-fonts.css" />
     <link rel="stylesheet" href="/static/styles.css" />
+    <link rel="stylesheet" href="/static/ydsf.css" />
     <link rel="alternate" type="application/rss+xml" title="RSS Feed" href="/rss/quickhoney" />
     <script src="/static/detectplugins.js" type="text/javascript"> </script> 
     <script src="/static/AC_QuickTime.js" type="text/javascript"> </script>

    