[geeklog-cvs] geeklog: Updated Tooltip styling and related files to fix some d...
geeklog-cvs at lists.geeklog.net
geeklog-cvs at lists.geeklog.net
Sun Dec 5 14:30:29 EST 2010
changeset 8027:04f5f50309f5
url: http://project.geeklog.net/cgi-bin/hgwebdir.cgi/geeklog/rev/04f5f50309f5
user: Tom <websitemaster at cogeco.net>
date: Sun Dec 05 14:29:36 2010 -0500
description:
Updated Tooltip styling and related files to fix some display issues (Patch by: Rouslan)
diffstat:
public_html/layout/professional/style.css | 39 +++++-----
public_html/layout/professional/tooltips/critical.thtml | 2 +-
public_html/layout/professional/tooltips/help.thtml | 2 +-
public_html/layout/professional/tooltips/images/Critical.png | 0
public_html/layout/professional/tooltips/images/Help.png | 0
public_html/layout/professional/tooltips/images/Info.png | 0
public_html/layout/professional/tooltips/images/Warning.png | 0
public_html/layout/professional/tooltips/images/tooltip.png | 0
public_html/layout/professional/tooltips/information.thtml | 2 +-
public_html/layout/professional/tooltips/warning.thtml | 2 +-
public_html/lib-common.php | 16 ++-
11 files changed, 34 insertions(+), 29 deletions(-)
diffs (154 lines):
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/style.css
--- a/public_html/layout/professional/style.css Sat Dec 04 10:53:50 2010 -0500
+++ b/public_html/layout/professional/style.css Sun Dec 05 14:29:36 2010 -0500
@@ -1021,33 +1021,36 @@
position: absolute;
}
a.tooltip:hover span {
- border-radius: 5px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
- box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
- font-family: Calibri, Tahoma, Geneva, sans-serif;
+ border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;
+ box-shadow: 2px 2px 8px #666; -webkit-box-shadow: 2px 2px 8px #666; -moz-box-shadow: 2px 2px 8px #666;
+ font-family: Calibri, Tahoma, Geneva, sans, sans-serif;
position: absolute; left: 1em; top: 2em; z-index: 99;
margin-left: 0; width: 250px;
}
-a.tooltip:hover img {
- border: 0; margin: -10px 0 0 -55px;
+a.tooltip:hover img.icon {
+ border: 0; margin: -15px 0 0 -51px;
float: left; position: absolute;
}
-img#tooltip-icon {
+a.tooltip img#tooltip-icon {
border: 0;
- margin: 0 0 0 2px;
- position: absolute;
}
a.tooltip:hover em {
- font-family: Candara, Tahoma, Geneva, sans-serif; font-size: 1.2em; font-weight: bold;
- display: block; padding: 0.2em 0 0.6em 0;
+ font-family: Candara, Tahoma, Geneva, sans, sans-serif; font-size: 1.2em; font-weight: bold;
+ display: block; padding: 0.2em 0 0.6em 0.4em;
}
-span.classic { padding: 0.8em 1em; }
-span.custom { padding: 0.5em 0.8em 0.8em 2em; }
-* html a:hover { background: transparent; }
-span.classic {background: #FFFFAA; border: 1px solid #FFAD33; }
-span.critical { background: #FFCCAA; border: 1px solid #FF3334; }
-span.help { background: #9FDAEE; border: 1px solid #2BB0D7; }
-span.info { background: #9FDAEE; border: 1px solid #2BB0D7; }
-span.warning { background: #FFFFAA; border: 1px solid #FFAD33; }
+span.classic { padding: 0.8em 1em; }
+span.custom { padding: 0.5em 0.8em 0.8em 2em; }
+* html a:hover { background: transparent; }
+span.classic { background: #EEEEEC; border: 2px solid #555753; }
+span.critical { background: #F5F0F0; border: 2px solid #A40000; }
+span.help { background: #EDF0F2; border: 2px solid #204A87; }
+span.info { background: #EDF0F2; border: 2px solid #204A87; }
+span.warning { background: #FCF7EF; border: 2px solid #CE5C00; font-weight: normal; color: black; }
+
+span.critical em { color: #A40000; }
+span.help em { color: #204A87; }
+span.info em { color: #204A87; }
+span.warning em { color: #CE5C00; }
/* End of common CSS for on-hover info feature */
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/tooltips/critical.thtml
--- a/public_html/layout/professional/tooltips/critical.thtml Sat Dec 04 10:53:50 2010 -0500
+++ b/public_html/layout/professional/tooltips/critical.thtml Sun Dec 05 14:29:36 2010 -0500
@@ -1,1 +1,1 @@
-<a class="{class}" href="#">{hoverover}<span class="custom critical"><img src="{layout_url}/tooltips/images/critical.png" alt="{title}" height="48" width="48" /><em>{title}</em>{text}</span></a>
\ No newline at end of file
+<a class="{class}" href="#">{hoverover}<span class="custom critical"><img class="icon" src="{layout_url}/tooltips/images/critical.png" alt="{title}" height="48" width="48"{xhtml}><em>{title}</em>{text}</span></a>
\ No newline at end of file
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/tooltips/help.thtml
--- a/public_html/layout/professional/tooltips/help.thtml Sat Dec 04 10:53:50 2010 -0500
+++ b/public_html/layout/professional/tooltips/help.thtml Sun Dec 05 14:29:36 2010 -0500
@@ -1,1 +1,1 @@
-<a class="{class}" href="#">{hoverover}<span class="custom help"><img src="{layout_url}/tooltips/images/help.png" alt="{title}" height="48" width="48" /><em>{title}</em>{text}</span></a>
\ No newline at end of file
+<a class="{class}" href="#">{hoverover}<span class="custom help"><img class="icon" src="{layout_url}/tooltips/images/help.png" alt="{title}" height="48" width="48"{xhtml}><em>{title}</em>{text}</span></a>
\ No newline at end of file
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/tooltips/images/Critical.png
Binary file public_html/layout/professional/tooltips/images/Critical.png has changed
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/tooltips/images/Help.png
Binary file public_html/layout/professional/tooltips/images/Help.png has changed
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/tooltips/images/Info.png
Binary file public_html/layout/professional/tooltips/images/Info.png has changed
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/tooltips/images/Warning.png
Binary file public_html/layout/professional/tooltips/images/Warning.png has changed
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/tooltips/images/tooltip.png
Binary file public_html/layout/professional/tooltips/images/tooltip.png has changed
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/tooltips/information.thtml
--- a/public_html/layout/professional/tooltips/information.thtml Sat Dec 04 10:53:50 2010 -0500
+++ b/public_html/layout/professional/tooltips/information.thtml Sun Dec 05 14:29:36 2010 -0500
@@ -1,1 +1,1 @@
-<a class="{class}" href="#">{hoverover}<span class="custom info"><img src="{layout_url}/tooltips/images/info.png" alt="{title}" height="48" width="48" /><em>{title}</em>{text}</span></a>
\ No newline at end of file
+<a class="{class}" href="#">{hoverover}<span class="custom info"><img class="icon" src="{layout_url}/tooltips/images/info.png" alt="{title}" height="48" width="48"{xhtml}><em>{title}</em>{text}</span></a>
\ No newline at end of file
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/layout/professional/tooltips/warning.thtml
--- a/public_html/layout/professional/tooltips/warning.thtml Sat Dec 04 10:53:50 2010 -0500
+++ b/public_html/layout/professional/tooltips/warning.thtml Sun Dec 05 14:29:36 2010 -0500
@@ -1,1 +1,1 @@
-<a class="{class}" href="#">{hoverover}<span class="custom warning"><img src="{layout_url}/tooltips/images/warning.png" alt="{title}" height="48" width="48" /><em>{title}</em>{text}</span></a>
\ No newline at end of file
+<a class="{class}" href="#">{hoverover}<span class="custom warning"><img class="icon" src="{layout_url}/tooltips/images/warning.png" alt="{title}" height="48" width="48"{xhtml}><em>{title}</em>{text}</span></a>
\ No newline at end of file
diff -r e4f1ddf89c20 -r 04f5f50309f5 public_html/lib-common.php
--- a/public_html/lib-common.php Sat Dec 04 10:53:50 2010 -0500
+++ b/public_html/lib-common.php Sun Dec 05 14:29:36 2010 -0500
@@ -3972,12 +3972,12 @@
$comma = '';
foreach ($autotags as $tag) {
if ($done_once) {
- $comma = ',';
+ $comma = ', ';
}
if ($description[$tag] != '') {
- $retval .= $comma . COM_Tooltip(' [' . $tag . ':]', $description[$tag], $LANG01[132],'tooltip' , 'information');
+ $retval .= $comma . COM_Tooltip('[' . $tag . ':]', $description[$tag], $LANG01[132],'information');
} else {
- $retval .= $comma . ' [' . $tag . ':]';
+ $retval .= $comma . '[' . $tag . ':]';
}
$done_once = true;
}
@@ -6744,28 +6744,30 @@
* @param string $hoverover Text or image to display for the user to hover their mouse cursor over.
* @param string $text Text for the actual tooltip. Can include HTML.
* @param string $title Text for the tooltip title (if there is one). Can include HTML.
+* @param string $template Specify a different template to use (classic, critical, help, information, warning).
* @param string $class Specify a different tooltip class to use.
-* @param string $template Specify a different template to use.
* @return string HTML tooltip
*
*/
-function COM_Tooltip($hoverover = '', $text = '', $title = '', $class = 'tooltip', $template = 'classic')
+function COM_Tooltip($hoverover = '', $text = '', $title = '', $template = 'classic', $class = 'tooltip')
{
global $_CONF, $_IMAGE_TYPE;
if ($hoverover == '') {
- $hoverover = '<img id="tooltip-icon" src="' . $_CONF['layout_url'] . '/tooltips/images/tooltip.' . $_IMAGE_TYPE . '">';
+ $hoverover = '<img alt="?" id="tooltip-icon" src="' . $_CONF['layout_url'] . '/tooltips/images/tooltip.' . $_IMAGE_TYPE . '"' . XHTML . '>';
}
$tooltip = new Template($_CONF['path_layout'] .'tooltips/');
$tooltip->set_file(array('tooltip' => $template . '.thtml'));
$tooltip->preprocess_fn = ''; // Do not process for autotags in text since tooltip
+
+ $tooltip->set_var('xhtml', XHTML);
+ $tooltip->set_var('layout_url', $_CONF['layout_url']);
$tooltip->set_var('class', $class);
$tooltip->set_var('hoverover', $hoverover);
$tooltip->set_var('text', $text);
$tooltip->set_var('title', $title);
- $tooltip->set_var('layout_url', $_CONF['layout_url']);
$retval = $tooltip->finish($tooltip->parse('output', 'tooltip'));
return $retval;
More information about the geeklog-cvs
mailing list