Fix responsive interface

This commit is contained in:
Mattias Erming 2014-08-15 06:52:14 -07:00
parent 523ae952c7
commit e4d6f8f9ab
3 changed files with 703 additions and 733 deletions

File diff suppressed because it is too large Load diff

View file

@ -32,11 +32,6 @@
</footer>
</aside>
<div id="main">
<header id="header">
<button id="lt"></button>
<button id="rt"></button>
<h1></h1>
</header>
<div id="windows">
<div id="chat"></div>
<div id="sign-in" class="window">
@ -211,7 +206,13 @@
<script type="text/html" class="chat">
{{#each channels}}
<div id="chan-{{id}}" data-id="{{id}}" data-type="{{type}}" class="chan">
<div id="chan-{{id}}" data-id="{{id}}" data-type="{{type}}" class="chan {{type}}">
<div class="header">
<button class="lt"></button>
<button class="rt"></button>
<span class="title">{{name}}</span>
<span class="topic">{{type}} </span>
</div>
<div class="chat">
{{#equal 100 messages.length}}
<button class="show-more" data-id="{{id}}">
@ -223,10 +224,6 @@
</div>
</div>
<aside class="sidebar">
<div class="meta">
<h1>{{name}}</h1>
<span class="type">{{type}}</span>
</div>
<div class="users">
{{partial "users"}}
</div>

View file

@ -249,9 +249,10 @@ $(function() {
.trigger("change");
var viewport = $("#viewport");
$("#rt, #lt").on("click", function(e) {
viewport.on("click", ".lt, .rt", function(e) {
var self = $(this);
viewport.toggleClass(self.attr("id"));
viewport.toggleClass(self.attr("class"));
if (viewport.is(".lt, .rt")) {
e.stopPropagation();
chat.find(".chat").one("click", function() {
@ -300,8 +301,6 @@ $(function() {
favico.badge("");
}
$("#rt").toggle(self.hasClass("chan"));
$("#header").find("h1").html(self.data("title"));
viewport.removeClass();
$("#windows .active").removeClass("active");