Added FontAwesome
This commit is contained in:
Mattias Erming
parent
c2ff4566fa
commit
14cd7e2409
|
|
@ -126,8 +126,10 @@ button {
|
|||
font: bold 15px Lato;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
#sidebar h2 {
|
||||
color: #84d1ff;
|
||||
#sidebar .lobby {
|
||||
color: #84d1ff !important;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
#sidebar .close {
|
||||
|
|
@ -168,11 +170,28 @@ button {
|
|||
}
|
||||
#sidebar .pulse {
|
||||
color: #fff;
|
||||
transition: color 0.2s;
|
||||
transition: color .2s;
|
||||
}
|
||||
#sidebar .network {
|
||||
margin-top: 30px;
|
||||
}
|
||||
#sidebar .footer {
|
||||
bottom: 0;
|
||||
height: 50px;
|
||||
left: 0;
|
||||
padding: 0 40px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
}
|
||||
#sidebar .footer small {
|
||||
color: #7c838d;
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
opacity: .4;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
word-spacing: 3px;
|
||||
}
|
||||
#main {
|
||||
bottom: 0;
|
||||
left: 220px;
|
||||
|
|
@ -280,25 +299,24 @@ button {
|
|||
font-size: 15px;
|
||||
}
|
||||
#chat .header button {
|
||||
background: no-repeat url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTZweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDE2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxnPg0KCQk8cGF0aCBkPSJNMTUuNDk5LDAuMDFIMC41MDFjLTAuMjc1LDAtMC41LDAuMjQtMC41LDAuNTM0djEuOTQ4YzAsMC4yODIsMC4yMjUsMC41MTMsMC41LDAuNTEzaDE0Ljk5OGMwLjI3NSwwLDAuNS0wLjIzLDAuNS0wLjUxMw0KCQkJVjAuNTQ0QzE1Ljk5OSwwLjI1LDE1Ljc3NCwwLjAxLDE1LjQ5OSwwLjAxeiBNMTUuNDk5LDUuMDFIMC41MDFjLTAuMjc1LDAtMC41LDAuMjQtMC41LDAuNTM1djEuOTQ3DQoJCQljMCwwLjI4MywwLjIyNSwwLjUxMywwLjUsMC41MTNoMTQuOTk4YzAuMjc1LDAsMC41LTAuMjMsMC41LTAuNTEzVjUuNTQ0QzE1Ljk5OSw1LjI1LDE1Ljc3NCw1LjAxLDE1LjQ5OSw1LjAxeiBNMTUuNDk5LDEwLjAxDQoJCQlIMC41MDFjLTAuMjc1LDAtMC41LDAuMjQtMC41LDAuNTM1djEuOTQ3YzAsMC4yODEsMC4yMjUsMC41MTIsMC41LDAuNTEyaDE0Ljk5OGMwLjI3NSwwLDAuNS0wLjIzLDAuNS0wLjUxMnYtMS45NDcNCgkJCUMxNS45OTksMTAuMjUsMTUuNzc0LDEwLjAxLDE1LjQ5OSwxMC4wMXoiLz4NCgk8L2c+DQo8L2c+DQo8L3N2Zz4NCg==);
|
||||
background-position: 8px 10px;
|
||||
color: #aaa;
|
||||
height: 32px;
|
||||
opacity: .2;
|
||||
transition: all .1s;
|
||||
font-size: 18px !important;
|
||||
opacity: .5;
|
||||
top: 1px;
|
||||
transition: opacity .2s;
|
||||
width: 32px;
|
||||
}
|
||||
#chat .header button:hover {
|
||||
opacity: .5;
|
||||
opacity: 1;
|
||||
}
|
||||
#chat .header .lt {
|
||||
left: 4px;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
}
|
||||
#chat .header .rt {
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
top: 4px;
|
||||
}
|
||||
#chat .header .type {
|
||||
text-transform: capitalize;
|
||||
|
|
@ -543,3 +561,10 @@ button {
|
|||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-device-width: 767px) {
|
||||
#chat .header .rt,
|
||||
#chat .header .lt {
|
||||
top: 3px;
|
||||
}
|
||||
}
|
||||
|
|
@ -10,6 +10,7 @@
|
|||
|
||||
<link rel="stylesheet" href="/css/normalize.css">
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="<%= typeof theme !== "undefined" ? theme : "" %>">
|
||||
|
||||
<link rel="apple-touch-icon" sizes="144x144" href="/img/apple-icon-144x144.png" />
|
||||
|
|
@ -28,8 +29,12 @@
|
|||
<a id="logout" href="" style="display: none;">Sign out</a>
|
||||
<% } %>
|
||||
</section>
|
||||
<div id="networks">
|
||||
</div>
|
||||
<div id="networks"></div>
|
||||
<footer class="footer">
|
||||
<small>
|
||||
Shout <%= version %>
|
||||
</small>
|
||||
</footer>
|
||||
</aside>
|
||||
<div id="main">
|
||||
<div id="windows">
|
||||
|
|
@ -57,7 +62,6 @@
|
|||
<script type="text/html" class="networks">
|
||||
{{#each networks}}
|
||||
<section id="network-{{id}}" class="network">
|
||||
<h2>{{name}}</h2>
|
||||
{{partial "channels"}}
|
||||
</section>
|
||||
{{/each}}
|
||||
|
|
@ -93,8 +97,12 @@
|
|||
</div>
|
||||
</div>
|
||||
<header class="header">
|
||||
<button class="lt"></button>
|
||||
<button class="rt"></button>
|
||||
<button class="lt">
|
||||
<i class="fa fa-navicon"></i>
|
||||
</button>
|
||||
<button class="rt">
|
||||
<i class="fa fa-navicon"></i>
|
||||
</button>
|
||||
{{partial "meta"}}
|
||||
</header>
|
||||
<form class="form" data-target="{{id}}">
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ function Network(attr) {
|
|||
|
||||
// Add lobby
|
||||
this.channels.unshift(
|
||||
new Chan({name: this.host, type: "lobby"})
|
||||
new Chan({name: this.name, type: "lobby"})
|
||||
);
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue