mirror of
https://github.com/moparisthebest/kaiwa
synced 2024-08-13 17:03:51 -04:00
Update UI
This commit is contained in:
parent
7c79b88e69
commit
5745de5e15
@ -13,7 +13,7 @@ exports.pages = {};
|
|||||||
exports.body = function anonymous(locals) {
|
exports.body = function anonymous(locals) {
|
||||||
var buf = [];
|
var buf = [];
|
||||||
with (locals || {}) {
|
with (locals || {}) {
|
||||||
buf.push('<body><div id="updateBar"><p>Update available!</p><button class="primary upgrade">Upgrade</button></div><div id="wrapper"><aside id="menu"><section id="organization"><span id="orga_name"></span></section><section id="bookmarks"><h1>Rooms</h1><nav></nav><input type="text" placeholder="add a room" id="joinmuc" class="inline"/></section><section id="roster"><h1>Direct messages</h1><ul id="contactrequests"></ul><nav></nav><input type="text" placeholder="add a contact" id="addcontact" class="inline"/></section></aside><header id="topbar"><div id="connectionStatus"><p>You\'re currently <strong>disconnected</strong></p><button class="primary reconnect">Reconnect</button></div><a href="/" class="button secondary settings"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewbox="0 0 25 25" height="25" width="25"><g transform="scale(0.4)"><path d="M37.418,34.3c-2.1-2.721-2.622-6.352-1.292-9.604c0.452-1.107,1.104-2.1,1.902-2.951 c-0.753-0.877-1.573-1.697-2.507-2.387l-2.609,1.408c-1.05-0.629-2.194-1.112-3.414-1.421l-0.845-2.833 c-0.75-0.112-1.512-0.188-2.287-0.188c-0.783,0-1.54,0.075-2.288,0.188l-0.851,2.833c-1.215,0.309-2.355,0.792-3.41,1.421 l-2.614-1.408c-1.229,0.912-2.318,2-3.228,3.231l1.404,2.612c-0.628,1.053-1.11,2.193-1.419,3.411l-2.832,0.849 c-0.114,0.75-0.187,1.508-0.187,2.287c0,0.778,0.073,1.537,0.187,2.286l2.832,0.848c0.309,1.22,0.791,2.36,1.419,3.413l-1.404,2.61 c0.909,1.231,1.999,2.321,3.228,3.231l2.614-1.406c1.055,0.628,2.195,1.11,3.41,1.42l0.851,2.832 c0.748,0.114,1.505,0.188,2.288,0.188c0.775,0,1.537-0.074,2.287-0.188l0.845-2.832c1.224-0.31,2.364-0.792,3.414-1.42l0.062,0.033 l2.045-3.02L37.418,34.3z M26.367,36.776c-2.777,0-5.027-2.253-5.027-5.027c0-2.775,2.25-5.028,5.027-5.028 c2.774,0,5.024,2.253,5.024,5.028C31.391,34.523,29.141,36.776,26.367,36.776z"></path><path d="M51.762,24.505l-1.125-0.459l-1.451,3.55c-0.814,1.993-2.832,3.054-4.505,2.37l-0.355-0.144 c-1.673-0.686-2.37-2.856-1.558-4.849l1.451-3.551l-1.125-0.46c-2.225,0.608-4.153,2.2-5.092,4.501 c-1.225,2.997-0.422,6.312,1.771,8.436l-2.958,6.812l-2.204,3.249l-0.007,2.281l5.275,2.154l1.593-1.633l0.7-3.861l2.901-6.836 c3.049,0.018,5.947-1.785,7.174-4.779C53.186,28.983,52.924,26.499,51.762,24.505z"></path></g></svg>Settings</a></header><main id="pages"></main><div id="footer"><div id="me"><div><img class="avatar"/></div><span class="name"></span><span contenteditable="true" spellcheck="false" class="status"></span></div></div></div></body>');
|
buf.push('<body><div id="updateBar"><p>Update available!</p><button class="primary upgrade">Upgrade</button></div><div id="wrapper"><aside id="menu"><section id="organization"><span id="orga_name"></span><a href="/" class="button secondary settings"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewbox="0 0 25 25" height="25" width="25"><g transform="scale(0.4)"><path d="M37.418,34.3c-2.1-2.721-2.622-6.352-1.292-9.604c0.452-1.107,1.104-2.1,1.902-2.951 c-0.753-0.877-1.573-1.697-2.507-2.387l-2.609,1.408c-1.05-0.629-2.194-1.112-3.414-1.421l-0.845-2.833 c-0.75-0.112-1.512-0.188-2.287-0.188c-0.783,0-1.54,0.075-2.288,0.188l-0.851,2.833c-1.215,0.309-2.355,0.792-3.41,1.421 l-2.614-1.408c-1.229,0.912-2.318,2-3.228,3.231l1.404,2.612c-0.628,1.053-1.11,2.193-1.419,3.411l-2.832,0.849 c-0.114,0.75-0.187,1.508-0.187,2.287c0,0.778,0.073,1.537,0.187,2.286l2.832,0.848c0.309,1.22,0.791,2.36,1.419,3.413l-1.404,2.61 c0.909,1.231,1.999,2.321,3.228,3.231l2.614-1.406c1.055,0.628,2.195,1.11,3.41,1.42l0.851,2.832 c0.748,0.114,1.505,0.188,2.288,0.188c0.775,0,1.537-0.074,2.287-0.188l0.845-2.832c1.224-0.31,2.364-0.792,3.414-1.42l0.062,0.033 l2.045-3.02L37.418,34.3z M26.367,36.776c-2.777,0-5.027-2.253-5.027-5.027c0-2.775,2.25-5.028,5.027-5.028 c2.774,0,5.024,2.253,5.024,5.028C31.391,34.523,29.141,36.776,26.367,36.776z"></path><path d="M51.762,24.505l-1.125-0.459l-1.451,3.55c-0.814,1.993-2.832,3.054-4.505,2.37l-0.355-0.144 c-1.673-0.686-2.37-2.856-1.558-4.849l1.451-3.551l-1.125-0.46c-2.225,0.608-4.153,2.2-5.092,4.501 c-1.225,2.997-0.422,6.312,1.771,8.436l-2.958,6.812l-2.204,3.249l-0.007,2.281l5.275,2.154l1.593-1.633l0.7-3.861l2.901-6.836 c3.049,0.018,5.947-1.785,7.174-4.779C53.186,28.983,52.924,26.499,51.762,24.505z"></path></g></svg></a></section><section id="bookmarks"><h1>Rooms</h1><nav></nav><input type="text" placeholder="add a room" id="joinmuc" class="inline"/></section><section id="roster"><h1>Direct messages</h1><ul id="contactrequests"></ul><nav></nav><input type="text" placeholder="add a contact" id="addcontact" class="inline"/></section></aside><header id="topbar"><div id="connectionStatus"><p>You\'re currently <strong>disconnected</strong></p><button class="primary reconnect">Reconnect</button></div><div id="me"><img class="avatar"/><div><span class="name"></span><span contenteditable="true" spellcheck="false" class="status"></span></div></div></header><main id="pages"></main></div></body>');
|
||||||
}
|
}
|
||||||
return buf.join("");
|
return buf.join("");
|
||||||
};
|
};
|
||||||
|
@ -6,6 +6,11 @@ body
|
|||||||
aside#menu
|
aside#menu
|
||||||
section#organization
|
section#organization
|
||||||
span#orga_name
|
span#orga_name
|
||||||
|
a(href="/", class="button secondary settings")
|
||||||
|
svg(version='1.1', xmlns='http://www.w3.org/2000/svg', xmlns:xlink='http://www.w3.org/1999/xlink', viewbox="0 0 25 25", height="25", width="25")
|
||||||
|
g(transform='scale(0.4)')
|
||||||
|
path(d='M37.418,34.3c-2.1-2.721-2.622-6.352-1.292-9.604c0.452-1.107,1.104-2.1,1.902-2.951 c-0.753-0.877-1.573-1.697-2.507-2.387l-2.609,1.408c-1.05-0.629-2.194-1.112-3.414-1.421l-0.845-2.833 c-0.75-0.112-1.512-0.188-2.287-0.188c-0.783,0-1.54,0.075-2.288,0.188l-0.851,2.833c-1.215,0.309-2.355,0.792-3.41,1.421 l-2.614-1.408c-1.229,0.912-2.318,2-3.228,3.231l1.404,2.612c-0.628,1.053-1.11,2.193-1.419,3.411l-2.832,0.849 c-0.114,0.75-0.187,1.508-0.187,2.287c0,0.778,0.073,1.537,0.187,2.286l2.832,0.848c0.309,1.22,0.791,2.36,1.419,3.413l-1.404,2.61 c0.909,1.231,1.999,2.321,3.228,3.231l2.614-1.406c1.055,0.628,2.195,1.11,3.41,1.42l0.851,2.832 c0.748,0.114,1.505,0.188,2.288,0.188c0.775,0,1.537-0.074,2.287-0.188l0.845-2.832c1.224-0.31,2.364-0.792,3.414-1.42l0.062,0.033 l2.045-3.02L37.418,34.3z M26.367,36.776c-2.777,0-5.027-2.253-5.027-5.027c0-2.775,2.25-5.028,5.027-5.028 c2.774,0,5.024,2.253,5.024,5.028C31.391,34.523,29.141,36.776,26.367,36.776z')
|
||||||
|
path(d='M51.762,24.505l-1.125-0.459l-1.451,3.55c-0.814,1.993-2.832,3.054-4.505,2.37l-0.355-0.144 c-1.673-0.686-2.37-2.856-1.558-4.849l1.451-3.551l-1.125-0.46c-2.225,0.608-4.153,2.2-5.092,4.501 c-1.225,2.997-0.422,6.312,1.771,8.436l-2.958,6.812l-2.204,3.249l-0.007,2.281l5.275,2.154l1.593-1.633l0.7-3.861l2.901-6.836 c3.049,0.018,5.947-1.785,7.174-4.779C53.186,28.983,52.924,26.499,51.762,24.505z')
|
||||||
section#bookmarks
|
section#bookmarks
|
||||||
h1 Rooms
|
h1 Rooms
|
||||||
nav
|
nav
|
||||||
@ -21,16 +26,11 @@ body
|
|||||||
| You're currently
|
| You're currently
|
||||||
strong disconnected
|
strong disconnected
|
||||||
button.primary.reconnect Reconnect
|
button.primary.reconnect Reconnect
|
||||||
a(href="/", class="button secondary settings")
|
|
||||||
svg(version='1.1', xmlns='http://www.w3.org/2000/svg', xmlns:xlink='http://www.w3.org/1999/xlink', viewbox="0 0 25 25", height="25", width="25")
|
|
||||||
g(transform='scale(0.4)')
|
|
||||||
path(d='M37.418,34.3c-2.1-2.721-2.622-6.352-1.292-9.604c0.452-1.107,1.104-2.1,1.902-2.951 c-0.753-0.877-1.573-1.697-2.507-2.387l-2.609,1.408c-1.05-0.629-2.194-1.112-3.414-1.421l-0.845-2.833 c-0.75-0.112-1.512-0.188-2.287-0.188c-0.783,0-1.54,0.075-2.288,0.188l-0.851,2.833c-1.215,0.309-2.355,0.792-3.41,1.421 l-2.614-1.408c-1.229,0.912-2.318,2-3.228,3.231l1.404,2.612c-0.628,1.053-1.11,2.193-1.419,3.411l-2.832,0.849 c-0.114,0.75-0.187,1.508-0.187,2.287c0,0.778,0.073,1.537,0.187,2.286l2.832,0.848c0.309,1.22,0.791,2.36,1.419,3.413l-1.404,2.61 c0.909,1.231,1.999,2.321,3.228,3.231l2.614-1.406c1.055,0.628,2.195,1.11,3.41,1.42l0.851,2.832 c0.748,0.114,1.505,0.188,2.288,0.188c0.775,0,1.537-0.074,2.287-0.188l0.845-2.832c1.224-0.31,2.364-0.792,3.414-1.42l0.062,0.033 l2.045-3.02L37.418,34.3z M26.367,36.776c-2.777,0-5.027-2.253-5.027-5.027c0-2.775,2.25-5.028,5.027-5.028 c2.774,0,5.024,2.253,5.024,5.028C31.391,34.523,29.141,36.776,26.367,36.776z')
|
|
||||||
path(d='M51.762,24.505l-1.125-0.459l-1.451,3.55c-0.814,1.993-2.832,3.054-4.505,2.37l-0.355-0.144 c-1.673-0.686-2.37-2.856-1.558-4.849l1.451-3.551l-1.125-0.46c-2.225,0.608-4.153,2.2-5.092,4.501 c-1.225,2.997-0.422,6.312,1.771,8.436l-2.958,6.812l-2.204,3.249l-0.007,2.281l5.275,2.154l1.593-1.633l0.7-3.861l2.901-6.836 c3.049,0.018,5.947-1.785,7.174-4.779C53.186,28.983,52.924,26.499,51.762,24.505z')
|
|
||||||
| Settings
|
|
||||||
main#pages
|
|
||||||
#footer
|
|
||||||
#me
|
#me
|
||||||
div
|
|
||||||
img.avatar
|
img.avatar
|
||||||
|
div
|
||||||
span.name
|
span.name
|
||||||
span.status(contenteditable="true", spellcheck="false")
|
span.status(contenteditable="true", spellcheck="false")
|
||||||
|
main#pages
|
||||||
|
|
||||||
|
|
||||||
|
@ -91,10 +91,10 @@ $sidebarRequestBorder = $sidebarHover
|
|||||||
$sidebarStatusText = $sidebarNames
|
$sidebarStatusText = $sidebarNames
|
||||||
$sidebarStatusBorder = $sidebarInputBorder
|
$sidebarStatusBorder = $sidebarInputBorder
|
||||||
|
|
||||||
$settingsBg = #fff
|
$settingsBg = $sidebarBg
|
||||||
$settingsText = $sidebarBg
|
$settingsText = #fff
|
||||||
$settingsHoverBg = $sidebarBg
|
$settingsHoverBg = #fff
|
||||||
$settingsHoverText = #fff
|
$settingsHoverText = $sidebarSelectionBg
|
||||||
|
|
||||||
// Font families
|
// Font families
|
||||||
|
|
||||||
|
@ -534,9 +534,7 @@ button.secondary:hover:not(:disabled) {
|
|||||||
}
|
}
|
||||||
#menu #organization {
|
#menu #organization {
|
||||||
width: 220px;
|
width: 220px;
|
||||||
height: 53px;
|
height: 42px;
|
||||||
background-color: #1a233f;
|
|
||||||
border-bottom: 2px solid #121a33;
|
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
#menu #organization #orga_name {
|
#menu #organization #orga_name {
|
||||||
@ -547,6 +545,26 @@ button.secondary:hover:not(:disabled) {
|
|||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
margin-left: 20px;
|
margin-left: 20px;
|
||||||
}
|
}
|
||||||
|
#menu #organization .settings {
|
||||||
|
position: relative;
|
||||||
|
height: 30px;
|
||||||
|
left: 0px;
|
||||||
|
background-color: #3d486b;
|
||||||
|
color: #fff;
|
||||||
|
transition: none;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
#menu #organization .settings svg {
|
||||||
|
position: absolute;
|
||||||
|
top: 55%;
|
||||||
|
left: 3px;
|
||||||
|
margin: 0px;
|
||||||
|
margin-top: -13px;
|
||||||
|
fill: #fff;
|
||||||
|
}
|
||||||
|
#menu #organization .settings:hover svg {
|
||||||
|
fill: #94b021;
|
||||||
|
}
|
||||||
#menu .main {
|
#menu .main {
|
||||||
margin: 10px 0 0 0;
|
margin: 10px 0 0 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -630,8 +648,8 @@ button.secondary:hover:not(:disabled) {
|
|||||||
#bookmarks li {
|
#bookmarks li {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
padding: 4px 10px;
|
padding: 4px 10px;
|
||||||
margin: 0px;
|
margin: 0px 0px 0px 10px;
|
||||||
border-radius: 0px 0.25rem 0.25rem 0px;
|
border-radius: 0.25rem;
|
||||||
position: relative;
|
position: relative;
|
||||||
height: 25px;
|
height: 25px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
@ -799,7 +817,7 @@ button.secondary:hover:not(:disabled) {
|
|||||||
height: 17px;
|
height: 17px;
|
||||||
text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
|
text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 32px;
|
left: 22px;
|
||||||
max-width: 140px;
|
max-width: 140px;
|
||||||
}
|
}
|
||||||
#roster li .unread,
|
#roster li .unread,
|
||||||
@ -868,10 +886,10 @@ button.secondary:hover:not(:disabled) {
|
|||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
#roster .wrap {
|
#roster .wrap {
|
||||||
padding-left: 10px;
|
padding-left: 0px;
|
||||||
}
|
}
|
||||||
#bookmarks .wrap {
|
#bookmarks .wrap {
|
||||||
padding-left: 24px;
|
padding-left: 14px;
|
||||||
}
|
}
|
||||||
@-moz-keyframes pulsate {
|
@-moz-keyframes pulsate {
|
||||||
0% {
|
0% {
|
||||||
@ -938,7 +956,7 @@ button.secondary:hover:not(:disabled) {
|
|||||||
top: 0px;
|
top: 0px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
left: 220px;
|
left: 220px;
|
||||||
right: 90px;
|
right: 200px;
|
||||||
height: 55px;
|
height: 55px;
|
||||||
z-index: 101;
|
z-index: 101;
|
||||||
}
|
}
|
||||||
@ -1752,7 +1770,7 @@ rgba(0,0,0,0.7)
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
#topbar.connected {
|
#topbar.connected {
|
||||||
background-color: transparent;
|
background-color: #f7f7f7;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
}
|
}
|
||||||
#topbar.connected #connectionStatus {
|
#topbar.connected #connectionStatus {
|
||||||
@ -1793,69 +1811,37 @@ rgba(0,0,0,0.7)
|
|||||||
margin: 3px 0;
|
margin: 3px 0;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
#topbar .settings {
|
#topbar #me {
|
||||||
|
display: none;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
padding-left: 30px;
|
right: 0;
|
||||||
line-height: 30px;
|
padding: 8px 5px 5px 5px;
|
||||||
height: 30px;
|
width: 175px;
|
||||||
right: 5px;
|
|
||||||
top: 12px;
|
|
||||||
background-color: #fff;
|
|
||||||
color: #3d486b;
|
|
||||||
transition: none;
|
|
||||||
border: 0;
|
|
||||||
}
|
}
|
||||||
#topbar .settings svg {
|
#topbar .avatar {
|
||||||
position: absolute;
|
float: right;
|
||||||
top: 50%;
|
width: 35px;
|
||||||
left: 5px;
|
height: 35px;
|
||||||
margin: 0px;
|
|
||||||
margin-top: -13px;
|
|
||||||
fill: #3d486b;
|
|
||||||
}
|
|
||||||
#topbar .settings:hover {
|
|
||||||
background-color: #3d486b;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
#topbar .settings:hover svg {
|
|
||||||
fill: #fff;
|
|
||||||
}
|
|
||||||
#footer {
|
|
||||||
bottom: 0px;
|
|
||||||
left: 0px;
|
|
||||||
background-color: #1a233f;
|
|
||||||
width: 100%;
|
|
||||||
height: 4rem;
|
|
||||||
position: fixed;
|
|
||||||
z-index: 301;
|
|
||||||
}
|
|
||||||
#footer #me {
|
|
||||||
border-top: 2px solid #121a33;
|
|
||||||
padding: 7px 0px 9px 8px;
|
|
||||||
}
|
|
||||||
#footer .avatar {
|
|
||||||
float: left;
|
|
||||||
width: 48px;
|
|
||||||
height: 48px;
|
|
||||||
background: rgba(0,0,0,0);
|
background: rgba(0,0,0,0);
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
margin: 0px 0.5rem 0px 0px;
|
margin: 3px 0.5rem 0px 0px;
|
||||||
}
|
}
|
||||||
#footer .name,
|
#topbar .name,
|
||||||
#footer .status {
|
#topbar .status {
|
||||||
display: block;
|
display: block;
|
||||||
width: 145px;
|
width: 120px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
|
text-align: right;
|
||||||
}
|
}
|
||||||
#footer .name {
|
#topbar .name {
|
||||||
color: #fff;
|
color: #555459;
|
||||||
font-size: 17px;
|
font-size: 17px;
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
}
|
}
|
||||||
#footer .status {
|
#topbar .status {
|
||||||
color: #c1dcec;
|
color: #9e9ea6;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
line-height: 14px;
|
line-height: 14px;
|
||||||
@ -1873,16 +1859,19 @@ rgba(0,0,0,0.7)
|
|||||||
-ms-user-select: initial;
|
-ms-user-select: initial;
|
||||||
user-select: initial;
|
user-select: initial;
|
||||||
}
|
}
|
||||||
#footer .status:focus {
|
#topbar .status:focus {
|
||||||
border-radius: 0.25rem;
|
border-radius: 0.25rem;
|
||||||
border: 1px solid #626f9c;
|
border: 1px solid #9e9ea6;
|
||||||
outline: none;
|
outline: none;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
}
|
}
|
||||||
#footer .status:empty:before {
|
#topbar .status:empty:before {
|
||||||
content: 'Update your status';
|
content: 'Update your status';
|
||||||
}
|
}
|
||||||
#footer .status:before,
|
#topbar .status:before,
|
||||||
#footer .status:empty:focus:before {
|
#topbar .status:empty:focus:before {
|
||||||
content: '';
|
content: '';
|
||||||
}
|
}
|
||||||
|
#topbar.connected #me {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
@ -13,4 +13,4 @@
|
|||||||
@import 'pages/aux'
|
@import 'pages/aux'
|
||||||
@import 'pages/callbar'
|
@import 'pages/callbar'
|
||||||
@import 'pages/header'
|
@import 'pages/header'
|
||||||
@import 'pages/footer'
|
@import 'pages/me'
|
||||||
|
@ -18,7 +18,7 @@
|
|||||||
top: 0px
|
top: 0px
|
||||||
right: 0px
|
right: 0px
|
||||||
left: 220px
|
left: 220px
|
||||||
right: 90px
|
right: 200px
|
||||||
height: 55px
|
height: 55px
|
||||||
z-index: 101
|
z-index: 101
|
||||||
|
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
@import '../_mixins'
|
@import '../_mixins'
|
||||||
|
|
||||||
#topbar.connected
|
#topbar.connected
|
||||||
background-color: transparent
|
background-color: rgb(247, 247, 247)
|
||||||
z-index: 100
|
z-index: 100
|
||||||
#connectionStatus
|
#connectionStatus
|
||||||
display: none
|
display: none
|
||||||
@ -36,30 +36,3 @@
|
|||||||
height: 30px
|
height: 30px
|
||||||
margin: 3px 0
|
margin: 3px 0
|
||||||
cursor: pointer
|
cursor: pointer
|
||||||
|
|
||||||
.settings
|
|
||||||
position: fixed
|
|
||||||
padding-left: 30px
|
|
||||||
line-height: 30px
|
|
||||||
height: 30px
|
|
||||||
right: 5px
|
|
||||||
top: 12px
|
|
||||||
background-color: $settingsBg
|
|
||||||
color: $settingsText
|
|
||||||
transition: none
|
|
||||||
border: 0
|
|
||||||
|
|
||||||
svg
|
|
||||||
position: absolute
|
|
||||||
top: 50%
|
|
||||||
left: 5px
|
|
||||||
margin: 0px
|
|
||||||
margin-top: -13px
|
|
||||||
fill: $settingsText
|
|
||||||
|
|
||||||
&:hover
|
|
||||||
background-color: $settingsHoverBg
|
|
||||||
color: $settingsHoverText
|
|
||||||
|
|
||||||
svg
|
|
||||||
fill: #fff
|
|
||||||
|
@ -1,42 +1,39 @@
|
|||||||
@import '../_variables'
|
@import '../_variables'
|
||||||
@import '../_mixins'
|
@import '../_mixins'
|
||||||
|
|
||||||
#footer
|
#topbar
|
||||||
bottom: 0px
|
|
||||||
left: 0px
|
|
||||||
background-color: $sidebarTopAndBottomBg
|
|
||||||
width:100%
|
|
||||||
height: 4rem;
|
|
||||||
position: fixed
|
|
||||||
z-index: 301
|
|
||||||
|
|
||||||
#me
|
#me
|
||||||
border-top: 2px solid $sidebarBorder
|
display: none
|
||||||
padding: 7px 0px 9px 8px;
|
position: fixed
|
||||||
|
right: 0
|
||||||
|
padding: 8px 5px 5px 5px
|
||||||
|
width: 175px
|
||||||
|
|
||||||
.avatar
|
.avatar
|
||||||
float:left
|
float:right
|
||||||
width: 48px
|
width: 35px
|
||||||
height: 48px
|
height: 35px
|
||||||
background: rgba(0,0,0,0)
|
background: rgba(0,0,0,0)
|
||||||
background-color: transparent
|
background-color: transparent
|
||||||
vertical-align: middle
|
vertical-align: middle
|
||||||
margin: 0px 0.5rem 0px 0px;
|
margin: 3px 0.5rem 0px 0px;
|
||||||
|
|
||||||
.name,
|
.name,
|
||||||
.status
|
.status
|
||||||
display: block
|
display: block
|
||||||
width: 145px
|
width: 120px
|
||||||
overflow: hidden
|
overflow: hidden
|
||||||
text-overflow: ellipsis
|
text-overflow: ellipsis
|
||||||
|
text-align: right
|
||||||
|
|
||||||
.name
|
.name
|
||||||
color: #fff
|
color: $gray-dark
|
||||||
font-size: $font-size-large
|
font-size: $font-size-large
|
||||||
font-weight: $font-weight-bolder
|
font-weight: $font-weight-bolder
|
||||||
|
|
||||||
.status
|
.status
|
||||||
color: $sidebarStatusText
|
color: $gray
|
||||||
font-weight: normal
|
font-weight: normal
|
||||||
font-size: $font-size-base
|
font-size: $font-size-base
|
||||||
line-height: $font-size-base
|
line-height: $font-size-base
|
||||||
@ -51,7 +48,7 @@
|
|||||||
|
|
||||||
&:focus
|
&:focus
|
||||||
border-radius: 0.25rem
|
border-radius: 0.25rem
|
||||||
border: 1px solid $sidebarStatusBorder
|
border: 1px solid $gray
|
||||||
outline: none
|
outline: none
|
||||||
padding: 2px
|
padding: 2px
|
||||||
|
|
||||||
@ -61,3 +58,7 @@
|
|||||||
&:before,
|
&:before,
|
||||||
&:empty:focus:before
|
&:empty:focus:before
|
||||||
content: ''
|
content: ''
|
||||||
|
|
||||||
|
&.connected
|
||||||
|
#me
|
||||||
|
display: block
|
@ -18,9 +18,7 @@
|
|||||||
|
|
||||||
#organization
|
#organization
|
||||||
width: 220px
|
width: 220px
|
||||||
height: 53px
|
height: 42px
|
||||||
background-color: $sidebarTopAndBottomBg
|
|
||||||
border-bottom: 2px solid $sidebarBorder
|
|
||||||
margin-bottom: 10px
|
margin-bottom: 10px
|
||||||
|
|
||||||
#orga_name
|
#orga_name
|
||||||
@ -31,6 +29,27 @@
|
|||||||
vertical-align: middle
|
vertical-align: middle
|
||||||
margin-left: 20px
|
margin-left: 20px
|
||||||
|
|
||||||
|
.settings
|
||||||
|
position: relative
|
||||||
|
height: 30px
|
||||||
|
left: 0px
|
||||||
|
background-color: $settingsBg
|
||||||
|
color: $settingsText
|
||||||
|
transition: none
|
||||||
|
border: 0
|
||||||
|
|
||||||
|
svg
|
||||||
|
position: absolute
|
||||||
|
top: 55%
|
||||||
|
left: 3px
|
||||||
|
margin: 0px
|
||||||
|
margin-top: -13px
|
||||||
|
fill: $settingsText
|
||||||
|
|
||||||
|
&:hover
|
||||||
|
svg
|
||||||
|
fill: $settingsHoverText
|
||||||
|
|
||||||
.main
|
.main
|
||||||
margin: 10px 0 0 0
|
margin: 10px 0 0 0
|
||||||
text-align: center
|
text-align: center
|
||||||
@ -104,8 +123,8 @@
|
|||||||
li
|
li
|
||||||
list-style-type: none
|
list-style-type: none
|
||||||
padding: 4px 10px
|
padding: 4px 10px
|
||||||
margin: 0px
|
margin: 0px 0px 0px 10px
|
||||||
border-radius: 0px 0.25rem 0.25rem 0px;
|
border-radius: 0.25rem
|
||||||
position: relative
|
position: relative
|
||||||
height: 25px
|
height: 25px
|
||||||
font-size: $font-size-base
|
font-size: $font-size-base
|
||||||
@ -230,7 +249,7 @@
|
|||||||
height: $font-size-base+3
|
height: $font-size-base+3
|
||||||
text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3)
|
text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3)
|
||||||
position: absolute
|
position: absolute
|
||||||
left: 32px
|
left: 22px
|
||||||
max-width: 140px
|
max-width: 140px
|
||||||
|
|
||||||
.unread
|
.unread
|
||||||
@ -285,11 +304,11 @@
|
|||||||
|
|
||||||
#roster
|
#roster
|
||||||
.wrap
|
.wrap
|
||||||
padding-left: 10px
|
padding-left: 0px
|
||||||
|
|
||||||
#bookmarks
|
#bookmarks
|
||||||
.wrap
|
.wrap
|
||||||
padding-left: 24px
|
padding-left: 14px
|
||||||
|
|
||||||
@keyframes pulsate
|
@keyframes pulsate
|
||||||
0%
|
0%
|
||||||
|
Loading…
Reference in New Issue
Block a user