use list for navigation tabs RFE #1290423

This commit is contained in:
Sebastian Mendel
2005-10-12 09:28:38 +00:00
parent 6b9d267485
commit e052827c74
5 changed files with 169 additions and 82 deletions

View File

@@ -5,6 +5,12 @@ phpMyAdmin - Changelog
$Id$
$Source$
2005-10-12 Sebastian Mendel <cybot_tm@users.sourceforge.net>
* css/phpmyadmin.css.php, libraries/common.lib.php,
themes/darkblue_orange/css/theme_right.css.php,
themes/original/css/theme_right.css.php:
use list for navigation tabs RFE #1290423
2005-10-12 Michal Čihař <michal@cihar.com>
* libraries/get_foreign.lib.php: Fix paging.

View File

@@ -248,19 +248,32 @@ textarea { overflow: auto; }
.nospace { margin: 0; padding: 0; }
/* topmenu */
#topmenu {
ul#topmenu {
font-weight: bold;
list-style-type: none;
margin: 0;
padding: 0;
}
ul#topmenu li {
float: left;
margin: 0;
padding: 0;
vertical-align: middle;
}
#topmenu img {
height: 1em;
height: 1.3em;
width: auto;
vertical-align: text-bottom;
margin-right: 0.1em;
}
/* default tab styles */
.tab, .tabcaution, .tabactive {
margin-right: 0.1em;
margin-left: 0.1em;
display: block;
margin: 0.2em 0.2em 0 0.2em;
padding: 0.2em 0.2em 0 0.2em;
white-space: nowrap;
}
@@ -286,36 +299,38 @@ a.tabcaution:hover {
<?php if ( $GLOBALS['cfg']['LightTabs'] ) { ?>
/* active tab */
a.tabactive {
border-bottom: 0.1em solid black;
color: black;
}
<?php } else { ?>
#topmenu {
margin-top: 0.5em;
border-bottom: 0.1em solid black;
padding: 0.1em 0.3em 0.1em 0.3em;
}
ul#topmenu li {
border-bottom: 1pt solid black;
}
/* default tab styles */
.tab, .tabcaution, .tabactive {
background-color: #E5E5E5;
border: 0.1em solid <?php echo $GLOBALS['cfg']['BgcolorTwo']; ?>;
border-bottom: 0.1em solid black;
border-radius-topleft: 0.5em;
border-radius-topright: 0.5em;
-moz-border-radius-topleft: 0.5em;
-moz-border-radius-topright: 0.5em;
padding: 0.1em 0.2em 0.1em 0.2em;
background-color: <?php echo $GLOBALS['cfg']['BgcolorOne']; ?>;
border: 1pt solid <?php echo $GLOBALS['cfg']['BgcolorTwo']; ?>;
border-bottom: 0;
border-radius-topleft: 0.4em;
border-radius-topright: 0.4em;
-moz-border-radius-topleft: 0.4em;
-moz-border-radius-topright: 0.4em;
}
/* enabled hover/active tabs */
a.tab:hover, a.tabcaution:hover, .tabactive {
margin-right: 0;
margin-left: 0;
padding: 0.3em 0.3em 0.1em 0.3em;
a.tab:hover, a.tabcaution:hover, .tabactive, .tabactive:hover {
margin: 0;
padding: 0.2em 0.4em 0.2em 0.4em;
text-decoration: none;
}
a.tab:hover, .tabactive {
background-color: #CCCCCC;
background-color: <?php echo $GLOBALS['cfg']['BgcolorTwo']; ?>;
}
/* disabled drop/empty tabs */

View File

@@ -2330,10 +2330,23 @@ if (typeof(document.getElementById) != 'undefined'
* returns a tab for tabbed navigation.
* If the variables $link and $args ar left empty, an inactive tab is created
*
* @param array $tab array with all options
*
* @uses array_merge()
* basename()
* $GLOBALS['strEmpty']
* $GLOBALS['strDrop']
* $GLOBALS['active_page']
* $_SERVER['PHP_SELF']
* htmlentities()
* PMA_generate_common_url()
* $GLOBALS['url_query']
* urlencode()
* $GLOBALS['cfg']['MainPageIconic']
* $GLOBALS['pmaThemeImage']
* sprintf()
* trigger_error()
* E_USER_NOTICE
* @param array $tab array with all options
* @return string html code for one tab, a link if valid otherwise a span
*
* @access public
*/
function PMA_getTab( $tab )
@@ -2353,12 +2366,14 @@ if (typeof(document.getElementById) != 'undefined'
// determine aditional style-class
if ( empty( $tab['class'] ) ) {
if ($tab['text'] == $GLOBALS['strEmpty'] || $tab['text'] == $GLOBALS['strDrop']) {
if ( $tab['text'] == $GLOBALS['strEmpty']
|| $tab['text'] == $GLOBALS['strDrop'] ) {
$tab['class'] = 'caution';
}
elseif ( isset( $tab['active'] ) && $tab['active']
|| isset($GLOBALS['active_page']) && $GLOBALS['active_page'] == $tab['link']
|| basename($_SERVER['PHP_SELF']) == $tab['link'] )
|| isset( $GLOBALS['active_page'] )
&& $GLOBALS['active_page'] == $tab['link']
|| basename( $_SERVER['PHP_SELF'] ) == $tab['link'] )
{
$tab['class'] = 'active';
}
@@ -2367,10 +2382,13 @@ if (typeof(document.getElementById) != 'undefined'
// build the link
if ( ! empty( $tab['link'] ) ) {
$tab['link'] = htmlentities( $tab['link'] );
$tab['link'] = $tab['link'] . $tab['sep'] . ( empty( $GLOBALS['url_query'] ) ? PMA_generate_common_url() : $GLOBALS['url_query'] );
$tab['link'] = $tab['link'] . $tab['sep']
.( empty( $GLOBALS['url_query'] ) ?
PMA_generate_common_url() : $GLOBALS['url_query'] );
if ( ! empty( $tab['args'] ) ) {
foreach( $tab['args'] as $param => $value ) {
$tab['link'] .= '&amp;' . urlencode( $param ) . '=' . urlencode( $value );
$tab['link'] .= '&amp;' . urlencode( $param ) . '='
. urlencode( $value );
}
}
}
@@ -2378,20 +2396,25 @@ if (typeof(document.getElementById) != 'undefined'
// display icon, even if iconic is disabled but the link-text is missing
if ( ( $GLOBALS['cfg']['MainPageIconic'] || empty( $tab['text'] ) )
&& isset( $tab['icon'] ) ) {
$image = '<img src="' . htmlentities( $GLOBALS['pmaThemeImage'] ) . '%1$s" width="16" height="16" border="0" alt="%2$s" />%2$s';
$image = '<img src="' . htmlentities( $GLOBALS['pmaThemeImage'] )
.'%1$s" width="16" height="16" border="0" alt="%2$s" />%2$s';
$tab['text'] = sprintf( $image, htmlentities( $tab['icon'] ), $tab['text'] );
}
// check to not display an empty link-text
elseif ( empty( $tab['text'] ) ) {
$tab['text'] = '?';
trigger_error( __FILE__ . '(' . __LINE__ . '): ' . 'empty linktext in function ' . __FUNCTION__ . '()', E_USER_NOTICE );
trigger_error( __FILE__ . '(' . __LINE__ . '): '
. 'empty linktext in function ' . __FUNCTION__ . '()',
E_USER_NOTICE );
}
if ( ! empty( $tab['link'] ) ) {
$out = '<a class="tab' . htmlentities( $tab['class'] ) . '" href="' . $tab['link'] . '" ' . $tab['attr'] . '>'
. $tab['text'] . '</a>';
$out = '<a class="tab' . htmlentities( $tab['class'] ) . '"'
.' href="' . $tab['link'] . '" ' . $tab['attr'] . '>'
. $tab['text'] . '</a>';
} else {
$out = '<span class="tab' . htmlentities( $tab['class'] ) . '">' . $tab['text'] . '</span>';
$out = '<span class="tab' . htmlentities( $tab['class'] ) . '">'
. $tab['text'] . '</span>';
}
return $out;
@@ -2400,22 +2423,25 @@ if (typeof(document.getElementById) != 'undefined'
/**
* returns html-code for a tab navigation
*
* @param array $tabs one element per tab
* @uses PMA_getTab()
* @uses htmlentities()
* @param array $tabs one element per tab
* @param string $tag_id id used for the html-tag
* @return string html-code for tab-navigation
*/
function PMA_getTabs( $tabs, $tag_id = 'topmenu' )
{
$tab_navigation = '<!-- top menu -->' . "\n";
$tab_navigation .= '<div id="' . htmlentities( $tag_id ) . '">' . "\n";
function PMA_getTabs( $tabs, $tag_id = 'topmenu' ) {
$tab_navigation =
'<div id="' . htmlentities( $tag_id ) . 'container">' . "\n"
.'<ul id="' . htmlentities( $tag_id ) . '">' . "\n";
foreach ( $tabs as $tab )
{
$tab_navigation .= PMA_getTab( $tab ) . "\n";
foreach ( $tabs as $tab ) {
$tab_navigation .= '<li>' . PMA_getTab( $tab ) . '</li>' . "\n";
}
$tab_navigation .= '</div>' . "\n";
$tab_navigation .= '<!-- end top menu -->' . "\n\n";
$tab_navigation .=
'</ul>' . "\n"
.'<div class="clearfloat"></div>'
.'</div>' . "\n";
return $tab_navigation;
}

View File

@@ -202,17 +202,36 @@ button.mult_submit {
/* topmenu */
#topmenu {
ul#topmenu {
font-weight: bold;
list-style-type: none;
margin: 0;
padding: 0;
}
ul#topmenu li {
float: left;
margin: 0;
padding: 0;
vertical-align: middle;
}
#topmenu img {
height: 1.3em;
width: auto;
vertical-align: text-bottom;
margin-right: 0.1em;
}
/* default tab styles */
.tab, .tabcaution, .tabactive {
margin-right: 0.1em;
margin-left: 0.1em;
display: block;
margin: 0.2em 0.2em 0 0.2em;
padding: 0.2em 0.2em 0 0.2em;
white-space: nowrap;
}
/* disbaled tabs */
/* disabled tabs */
span.tab {
color: #666666;
}
@@ -234,36 +253,38 @@ a.tabcaution:hover {
<?php if ( $GLOBALS['cfg']['LightTabs'] ) { ?>
/* active tab */
a.tabactive {
border-bottom: 0.1em solid black;
color: black;
}
<?php } else { ?>
#topmenu {
margin-top: 0.5em;
border-bottom: 0.1em solid black;
padding: 0.1em 0.3em 0.1em 0.3em;
}
ul#topmenu li {
border-bottom: 1pt solid black;
}
/* default tab styles */
.tab, .tabcaution, .tabactive {
background-color: #E5E5E5;
border: 0.1em solid silver;
border-bottom: 0.1em solid black;
border-radius-topleft: 0.5em;
border-radius-topright: 0.5em;
-moz-border-radius-topleft: 0.5em;
-moz-border-radius-topright: 0.5em;
padding: 0.1em 0.2em 0.1em 0.2em;
background-color: <?php echo $GLOBALS['cfg']['BgcolorOne']; ?>;
border: 1pt solid <?php echo $GLOBALS['cfg']['BgcolorTwo']; ?>;
border-bottom: 0;
border-radius-topleft: 0.4em;
border-radius-topright: 0.4em;
-moz-border-radius-topleft: 0.4em;
-moz-border-radius-topright: 0.4em;
}
/* enabled hover/active tabs */
a.tab:hover, a.tabcaution:hover, .tabactive {
margin-right: 0;
margin-left: 0;
padding: 0.3em 0.3em 0.1em 0.3em;
a.tab:hover, a.tabcaution:hover, .tabactive, .tabactive:hover {
margin: 0;
padding: 0.2em 0.4em 0.2em 0.4em;
text-decoration: none;
}
a.tab:hover, .tabactive {
background-color: #CCCCCC;
background-color: <?php echo $GLOBALS['cfg']['BgcolorTwo']; ?>;
}
/* disabled drop/empty tabs */

View File

@@ -113,19 +113,37 @@ button.mult_submit {
hr{ color: #666666; background-color: #666666; border: 0; height: 1px; }
/* topmenu */
#topmenu {
ul#topmenu {
font-weight: bold;
list-style-type: none;
margin: 0;
padding: 0;
}
ul#topmenu li {
float: left;
margin: 0;
padding: 0;
vertical-align: middle;
}
#topmenu img {
height: 1.3em;
width: auto;
vertical-align: text-bottom;
margin-right: 0.1em;
}
/* default tab styles */
.tab, .tabcaution, .tabactive {
margin-right: 0.1em;
margin-left: 0.1em;
display: block;
margin: 0.2em 0.2em 0 0.2em;
padding: 0.2em 0.2em 0 0.2em;
white-space: nowrap;
}
/* disbaled tabs */
/* disabled tabs */
span.tab {
color: #666666;
}
@@ -147,36 +165,38 @@ a.tabcaution:hover {
<?php if ( $GLOBALS['cfg']['LightTabs'] ) { ?>
/* active tab */
a.tabactive {
border-bottom: 0.1em solid black;
color: black;
}
<?php } else { ?>
#topmenu {
margin-top: 0.5em;
border-bottom: 0.1em solid black;
padding: 0.1em 0.3em 0.1em 0.3em;
}
ul#topmenu li {
border-bottom: 1pt solid black;
}
/* default tab styles */
.tab, .tabcaution, .tabactive {
background-color: #E5E5E5;
border: 0.1em solid silver;
border-bottom: 0.1em solid black;
border-radius-topleft: 0.5em;
border-radius-topright: 0.5em;
-moz-border-radius-topleft: 0.5em;
-moz-border-radius-topright: 0.5em;
padding: 0.1em 0.2em 0.1em 0.2em;
background-color: <?php echo $GLOBALS['cfg']['BgcolorOne']; ?>;
border: 1pt solid <?php echo $GLOBALS['cfg']['BgcolorTwo']; ?>;
border-bottom: 0;
border-radius-topleft: 0.4em;
border-radius-topright: 0.4em;
-moz-border-radius-topleft: 0.4em;
-moz-border-radius-topright: 0.4em;
}
/* enabled hover/active tabs */
a.tab:hover, a.tabcaution:hover, .tabactive {
margin-right: 0;
margin-left: 0;
padding: 0.3em 0.3em 0.1em 0.3em;
a.tab:hover, a.tabcaution:hover, .tabactive, .tabactive:hover {
margin: 0;
padding: 0.2em 0.4em 0.2em 0.4em;
text-decoration: none;
}
a.tab:hover, .tabactive {
background-color: #CCCCCC;
background-color: <?php echo $GLOBALS['cfg']['BgcolorTwo']; ?>;
}
/* disabled drop/empty tabs */
@@ -186,7 +206,6 @@ span.tab, span.tabcaution {
<?php } ?>
/* end topmenu */
/* Warning showing div with right border and optional icon */
div.errorhead {