phillip/ingress-intel-total-conversion
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #99 from cmrn/transparent-sidebar

Browse Source 
Transparent sidebar, like the chat box (patch by cmrn)
This commit is contained in:
Stefan Breunig
2013-02-11 02:45:13 -08:00
parent b4f273e80b 74be29ea29
commit 1de0e166e0
2 changed files with 16 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
code/boot.js
View File

@ -27,14 +27,14 @@ window.setupLargeImagePreview = function() {
window.setupStyles = function() { window.setupStyles = function() {
$('head').append('<style>' + $('head').append('<style>' +
[ '#map { margin-right: '+(SIDEBAR_WIDTH+2)+'px } ', [ '#largepreview.enl img { border:2px solid '+COLORS[TEAM_ENL]+'; } ',
'#largepreview.enl img { border:2px solid '+COLORS[TEAM_ENL]+'; } ',
'#largepreview.res img { border:2px solid '+COLORS[TEAM_RES]+'; } ', '#largepreview.res img { border:2px solid '+COLORS[TEAM_RES]+'; } ',
'#largepreview.none img { border:2px solid '+COLORS[TEAM_NONE]+'; } ', '#largepreview.none img { border:2px solid '+COLORS[TEAM_NONE]+'; } ',
'#chatcontrols { bottom: '+(CHAT_SHRINKED+24)+'px; }', '#chatcontrols { bottom: '+(CHAT_SHRINKED+24)+'px; }',
'#chat { height: '+CHAT_SHRINKED+'px; } ', '#chat { height: '+CHAT_SHRINKED+'px; } ',
'.leaflet-right { margin-right: '+(SIDEBAR_WIDTH+1)+'px } ',
'#updatestatus { width:'+(SIDEBAR_WIDTH-2*4)+'px; } ', '#updatestatus { width:'+(SIDEBAR_WIDTH-2*4)+'px; } ',
'#sidebar { width:'+(SIDEBAR_WIDTH + HIDDEN_SCROLLBAR_ASSUMED_WIDTH + 2 /*border*/)+'px; } ', '#sidebar { width:'+(SIDEBAR_WIDTH + HIDDEN_SCROLLBAR_ASSUMED_WIDTH + 1 /*border*/)+'px; } ',
'#sidebartoggle { right:'+SIDEBAR_WIDTH+'px; } ', '#sidebartoggle { right:'+SIDEBAR_WIDTH+'px; } ',
'#scrollwrapper { width:'+(SIDEBAR_WIDTH + 2*HIDDEN_SCROLLBAR_ASSUMED_WIDTH)+'px; right:-'+(2*HIDDEN_SCROLLBAR_ASSUMED_WIDTH-2)+'px } ', '#scrollwrapper { width:'+(SIDEBAR_WIDTH + 2*HIDDEN_SCROLLBAR_ASSUMED_WIDTH)+'px; right:-'+(2*HIDDEN_SCROLLBAR_ASSUMED_WIDTH-2)+'px } ',
'#sidebar input, h2, #updatestatus { width:'+(SIDEBAR_WIDTH - 2*4)+'px !important } ', '#sidebar input, h2, #updatestatus { width:'+(SIDEBAR_WIDTH - 2*4)+'px !important } ',
@ -176,16 +176,15 @@ window.setupSidebarToggle = function() {
var sidebar = $('#sidebar'); var sidebar = $('#sidebar');
if(sidebar.is(':visible')) { if(sidebar.is(':visible')) {
sidebar.hide(); sidebar.hide();
$('#map').css('margin-right','0'); $('.leaflet-right').css('margin-right','0');
toggle.html('◢<br>◥'); toggle.html('◢<br>◥');
toggle.css('right', '0'); toggle.css('right', '0');
} else { } else {
sidebar.show(); sidebar.show();
$('#map').css('margin-right', SIDEBAR_WIDTH+2+'px'); $('.leaflet-right').css('margin-right', SIDEBAR_WIDTH+1+'px');
toggle.html('◣<br>◤'); toggle.html('◣<br>◤');
toggle.css('right', SIDEBAR_WIDTH+'px'); toggle.css('right', SIDEBAR_WIDTH+1+'px');
} }
window.map.invalidateSize(false);
}); });
} }

23
style.css
View File

@ -10,10 +10,6 @@ body {
margin: 0; margin: 0;
} }
#map {
margin-right:302px;
}
#scrollwrapper { #scrollwrapper {
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
@ -24,8 +20,8 @@ body {
} }
#sidebar { #sidebar {
background: #000; background-color: rgba(8, 48, 78, 0.9);
border-left: 2px solid #c3c3c3; border-left: 1px solid #20A8B1;
color: #888; color: #888;
height: 100%; height: 100%;
position: relative; position: relative;
@ -33,16 +29,17 @@ body {
top: 0; top: 0;
overflow-y:scroll; overflow-y:scroll;
overflow-x:hidden; overflow-x:hidden;
z-index: 3000;
} }
#sidebartoggle { #sidebartoggle {
display: block; display: block;
padding: 10px 5px; padding: 20px 5px;
margin-top: -31px; margin-top: -31px;
line-height: 10px; line-height: 10px;
position: absolute; position: absolute;
top: 50%; top: 50%;
z-index: 3000; z-index: 3001;
background-color: rgba(8, 48, 78, 0.9); background-color: rgba(8, 48, 78, 0.9);
color: #FFCE00; color: #FFCE00;
border: 1px solid #20A8B1; border: 1px solid #20A8B1;
@ -257,7 +254,7 @@ summary {
/* sidebar ************************************************************/ /* sidebar ************************************************************/
#sidebar > * { #sidebar > * {
border-bottom: 1px solid #c3c3c3; border-bottom: 1px solid #20A8B1;
} }
@ -321,7 +318,7 @@ h2 sup, h2 sub {
/* geosearch input, and others */ /* geosearch input, and others */
input { input {
background: #313131; background-color: rgba(0, 0, 0, 0.3);
color: #ffce00; color: #ffce00;
height: 22px; height: 22px;
line-height: 22px; line-height: 22px;
@ -381,7 +378,7 @@ h3 {
} }
.mods span { .mods span {
background: #313131; background-color: rgba(0, 0, 0, 0.3);
/* can’t use inline-block because Webkit’s implementation is buggy and /* can’t use inline-block because Webkit’s implementation is buggy and
* introduces additional margins in random cases. No clear necessary, * introduces additional margins in random cases. No clear necessary,
* as that’s solved by setting height on .mods. */ * as that’s solved by setting height on .mods. */
@ -541,9 +538,9 @@ aside:nth-child(odd) span {
/* update status */ /* update status */
#updatestatus { #updatestatus {
background: #000; background-color: rgba(8, 48, 78, 1);
border-bottom: 0; border-bottom: 0;
border-top: 1px solid #c3c3c3; border-top: 1px solid #20A8B1;
bottom: 0; bottom: 0;
color: #ffce00; color: #ffce00;
font-size:13px; font-size:13px;