styling the notification bar some

This commit is contained in:
Kyle Spearrin 2016-12-30 16:47:07 -05:00
parent d2ef99d1e5
commit 77aca102e6
3 changed files with 25 additions and 9 deletions

View File

@ -122,17 +122,17 @@
var iframe = document.createElement('iframe');
iframe.src = chrome.extension.getURL(barPage);
iframe.style.cssText = 'height: 41px; width: 100%; border: 0;';
iframe.style.cssText = 'height: 42px; width: 100%; border: 0;';
var frameDiv = document.createElement('div');
frameDiv.id = 'bit-notification-bar';
frameDiv.style.cssText = 'height: 41px; width: 100%; top: 0; left: 0; padding: 0; position: fixed; z-index: 1000000099; visibility: visible;';
frameDiv.style.cssText = 'height: 42px; width: 100%; top: 0; left: 0; padding: 0; position: fixed; z-index: 1000000099; visibility: visible;';
frameDiv.appendChild(iframe);
document.body.appendChild(frameDiv);
var spacer = document.createElement('div');
spacer.id = 'bit-notification-bar-spacer';
spacer.style.cssText = 'height: 41px;';
spacer.style.cssText = 'height: 42px;';
document.body.insertBefore(spacer, document.body.firstChild);
}

View File

@ -15,7 +15,7 @@ table {
.outter-table > tbody > tr > td {
padding: 0 0 0 10px;
border-bottom: 1px solid #333333;
border-bottom: 2px solid #3c8dbc;
height: 40px;
}
@ -48,7 +48,21 @@ img {
}
#close {
width: 18px;
height: 18px;
width: 15px;
height: 15px;
display: block;
padding: 5px 0;
}
button {
background-color: #3c8dbc;
padding: 5px 15px;
border-radius: 3px;
color: #ffffff;
border: 0;
}
button:hover {
cursor: pointer;
background-color: #3681ad;
}

View File

@ -10,12 +10,14 @@
<tbody>
<tr>
<td width="24">
<img id="logo" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAclBMVEUAAAAzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzOkbymMAAAAJXRSTlMAAQIICQsMGBkaKkJYWWl0dXeMjpWXm6WmtcXM0dPr7fH3+fv9KIjKuwAAAIRJREFUKM/dzUkCgkAMBdHfCArOIypBW4S6/xVdNCqDJ7BWSd4iknKG5ZIkMW4AdzMzs+cI1mG3f4N6ADfqMJR9cFAG2PVhDtsAWQ8igyyAzl3Yw6W9K/YfcAfw8RuUVS1MrlCl+pZ6gM3iAX6mbknR/ikS9XOrBmiWTqOmR05T/SzqLi/Z3CbrA3nnNwAAAABJRU5ErkJggg==" />
<a href="https://vault.bitwarden.com" target="_blank" title="bitwarden">
<img id="logo" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAclBMVEUAAAAzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzOkbymMAAAAJXRSTlMAAQIICQsMGBkaKkJYWWl0dXeMjpWXm6WmtcXM0dPr7fH3+fv9KIjKuwAAAIRJREFUKM/dzUkCgkAMBdHfCArOIypBW4S6/xVdNCqDJ7BWSd4iknKG5ZIkMW4AdzMzs+cI1mG3f4N6ADfqMJR9cFAG2PVhDtsAWQ8igyyAzl3Yw6W9K/YfcAfw8RuUVS1MrlCl+pZ6gM3iAX6mbknR/ikS9XOrBmiWTqOmR05T/SzqLi/Z3CbrA3nnNwAAAABJRU5ErkJggg==" />
</a>
</td>
<td id="content"></td>
<td align="right" width="18">
<td align="right" width="15">
<a href="#" title="Close" id="close-button">
<img id="close" alt="X" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAMAAABhEH5lAAAAWlBMVEUAAAAzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMHgWvyAAAAHXRSTlMAAgMFCA4RLTE0NVlrbG97naCotbe5z+Lk5ujr/TBmF6UAAAB+SURBVBhXXc7JEsJQCETRm3l2ikZj0v//my7ol0rJBjhFAUB+X2oimnUEyF/SFtZKugKzZGslSSOlZAvRCpNtiKwGuLiOaOHPQs6WBB6W4ZA+Dfm/kxx2Elvnxvu2mmKPsk93F7K3Jf1yg+prCXtmQPXZO9+eNGcAZIUFSuAHidYU7gWlVOAAAAAASUVORK5CYII=" />
<img id="close" alt="X" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAMAAAAMCGV4AAAAilBMVEUAAAAzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzORiUCaAAAALXRSTlMAAQMHCCMkJicsLjQ6PEJFUFVYW11fYWlscXR7fIOFi4yOkZSVmqDAw9Pc+/0n8J+EAAAAdElEQVQIHQXBhyLDAABAwUuJVVtqU0Wt9P3/77kzfFwDjD97bGoCxrnfhdtqgnGur4FVNTHOtR3gppoO5vocgKuqegdwWbUG4LDqDsDxrqoHwLJ6vaiewFn1zGn1gvPqEZbVG9u6B052/S0MmxXA0fc+AIB/vAoPdfukIW0AAAAASUVORK5CYII=" />
</a>
</td>
</tr>