makary/phpbb
1
0
Fork 0
mirror of https://github.com/phpbb/phpbb.git synced 2025-06-28 22:28:51 +00:00
Code Issues Projects Releases Packages Wiki Activity

Bye bye toggle_inverse.gif... made a "super" toggle.gif which contains both states and "switched" using CSS sprites method to stop the ugly loading "flash" when images aren't cached for the first time. prosilver ACP+style classnames use hyphens... so stuck with them, plus underscores might trip up some bizarre edge case thing with IE6, so play safe. Would like the toggle to set a cookie at some point, so the setting would be "sticky".

Browse source 
git-svn-id: file:///svn/phpbb/trunk@7222 89ea8834-ac86-4346-8a33-228a782c2dd0
This commit is contained in:
Jonathan Stanley 2007-03-23 18:41:45 +00:00
parent 2e244a1eeb
commit 369dc7502c
4 changed files with 11 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
phpBB/adm/images/toggle.gif
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 625 B

After

Width:  |  Height:  |  Size: 788 B

BIN
phpBB/adm/images/toggle_inverse.gif
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 621 B

2
phpBB/adm/style/admin.css
View file

@ -353,7 +353,7 @@ span.corners-bottom span {
margin-left: 2px; margin-left: 2px;
} }
#toggle_handle { #toggle-handle {
display: block; display: block;
width: 18px; width: 18px;
height: 19px; height: 19px;

16
phpBB/adm/style/overall_header.html
View file

@ -120,27 +120,31 @@ function switch_menu()
var menu = document.getElementById('menu'); var menu = document.getElementById('menu');
var main = document.getElementById('main'); var main = document.getElementById('main');
var toggle = document.getElementById('toggle'); var toggle = document.getElementById('toggle');
var handle = document.getElementById('toggle_handle'); var handle = document.getElementById('toggle-handle');
switch(menu_state) switch(menu_state)
{ {
//hide //hidden
case 'shown': case 'shown':
main.style.width = 'auto'; main.style.width = 'auto';
menu.style.display = 'none'; menu.style.display = 'none';
menu_state = 'hidden'; menu_state = 'hidden';
toggle.style.left = '0'; toggle.style.left = '0';
toggle.style.width = '20px'; toggle.style.width = '20px';
handle.style.backgroundImage = 'url(images/toggle_inverse.gif)'; handle.style.backgroundImage = 'url(images/toggle.gif)';
handle.style.backgroundPosition = '100% 50%';
handle.style.backgroundRepeat = 'no-repeat';
break; break;
//show //shown
case 'hidden': case 'hidden':
main.style.width = '76%'; main.style.width = '76%';
menu.style.display = 'block'; menu.style.display = 'block';
menu_state = 'shown'; menu_state = 'shown';
toggle.style.left = '15%'; toggle.style.left = '15%';
toggle.style.width = '5%'; toggle.style.width = '5%';
handle.style.backgroundImage = 'url(images/toggle.gif)'; handle.style.backgroundImage = 'url(images/toggle.gif)';
handle.style.backgroundPosition = '0% 50%';
handle.style.backgroundRepeat = 'no-repeat';
break; break;
} }
} }
@ -172,7 +176,7 @@ function switch_menu()
<span class="corners-top"><span></span></span> <span class="corners-top"><span></span></span>
<div id="content"> <div id="content">
<div id="toggle"> <div id="toggle">
<a id="toggle_handle" accesskey="m" title="{L_MENU_TOGGLE}" onclick="switch_menu(); return false;" href="#"></a></div> <a id="toggle-handle" accesskey="m" title="{L_MENU_TOGGLE}" onclick="switch_menu(); return false;" href="#"></a></div>
<div id="menu"> <div id="menu">
<p>{L_LOGGED_IN_AS}<br /><strong>{USERNAME}</strong> [&nbsp;<a href="{U_LOGOUT}">{L_LOGOUT}</a>&nbsp;]</p> <p>{L_LOGGED_IN_AS}<br /><strong>{USERNAME}</strong> [&nbsp;<a href="{U_LOGOUT}">{L_LOGOUT}</a>&nbsp;]</p>
<ul> <ul>