Made the sidebar transparent like the chat box
This commit is contained in:
13
code/boot.js
13
code/boot.js
@ -27,14 +27,14 @@ window.setupLargeImagePreview = function() {
|
||||
|
||||
window.setupStyles = function() {
|
||||
$('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.none img { border:2px solid '+COLORS[TEAM_NONE]+'; } ',
|
||||
'#chatcontrols { bottom: '+(CHAT_SHRINKED+24)+'px; }',
|
||||
'#chat { height: '+CHAT_SHRINKED+'px; } ',
|
||||
'.leaflet-right { margin-right: '+(SIDEBAR_WIDTH+1)+'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; } ',
|
||||
'#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 } ',
|
||||
@ -176,16 +176,15 @@ window.setupSidebarToggle = function() {
|
||||
var sidebar = $('#sidebar');
|
||||
if(sidebar.is(':visible')) {
|
||||
sidebar.hide();
|
||||
$('#map').css('margin-right','0');
|
||||
$('.leaflet-right').css('margin-right','0');
|
||||
toggle.html('◢<br>◥');
|
||||
toggle.css('right', '0');
|
||||
} else {
|
||||
sidebar.show();
|
||||
$('#map').css('margin-right', SIDEBAR_WIDTH+2+'px');
|
||||
$('.leaflet-right').css('margin-right', SIDEBAR_WIDTH+1+'px');
|
||||
toggle.html('◣<br>◤');
|
||||
toggle.css('right', SIDEBAR_WIDTH+'px');
|
||||
toggle.css('right', SIDEBAR_WIDTH+1+'px');
|
||||
}
|
||||
window.map.invalidateSize(false);
|
||||
});
|
||||
}
|
||||
|
||||
|
23
style.css
23
style.css
@ -10,10 +10,6 @@ body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#map {
|
||||
margin-right:302px;
|
||||
}
|
||||
|
||||
#scrollwrapper {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
@ -24,8 +20,8 @@ body {
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
background: #000;
|
||||
border-left: 2px solid #c3c3c3;
|
||||
background-color: rgba(8, 48, 78, 0.9);
|
||||
border-left: 1px solid #20A8B1;
|
||||
color: #888;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
@ -33,16 +29,17 @@ body {
|
||||
top: 0;
|
||||
overflow-y:scroll;
|
||||
overflow-x:hidden;
|
||||
z-index: 3000;
|
||||
}
|
||||
|
||||
#sidebartoggle {
|
||||
display: block;
|
||||
padding: 10px 5px;
|
||||
padding: 20px 5px;
|
||||
margin-top: -31px;
|
||||
line-height: 10px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
z-index: 3000;
|
||||
z-index: 3001;
|
||||
background-color: rgba(8, 48, 78, 0.9);
|
||||
color: #FFCE00;
|
||||
border: 1px solid #20A8B1;
|
||||
@ -257,7 +254,7 @@ summary {
|
||||
/* sidebar ************************************************************/
|
||||
|
||||
#sidebar > * {
|
||||
border-bottom: 1px solid #c3c3c3;
|
||||
border-bottom: 1px solid #20A8B1;
|
||||
}
|
||||
|
||||
|
||||
@ -321,7 +318,7 @@ h2 sup, h2 sub {
|
||||
|
||||
/* geosearch input, and others */
|
||||
input {
|
||||
background: #313131;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
color: #ffce00;
|
||||
height: 22px;
|
||||
line-height: 22px;
|
||||
@ -381,7 +378,7 @@ h3 {
|
||||
}
|
||||
|
||||
.mods span {
|
||||
background: #313131;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
/* can’t use inline-block because Webkit’s implementation is buggy and
|
||||
* introduces additional margins in random cases. No clear necessary,
|
||||
* as that’s solved by setting height on .mods. */
|
||||
@ -541,9 +538,9 @@ aside:nth-child(odd) span {
|
||||
|
||||
/* update status */
|
||||
#updatestatus {
|
||||
background: #000;
|
||||
background-color: rgba(8, 48, 78, 1);
|
||||
border-bottom: 0;
|
||||
border-top: 1px solid #c3c3c3;
|
||||
border-top: 1px solid #20A8B1;
|
||||
bottom: 0;
|
||||
color: #ffce00;
|
||||
font-size:13px;
|
||||
|
Reference in New Issue
Block a user