1
0
mirror of https://github.com/wbbaddons/Tims-Chat.git synced 2024-10-31 14:10:08 +00:00

Fixed frontend (still some tiny quirks remaining, but they aren' important for now)

This commit is contained in:
max-m 2012-04-15 00:21:33 +02:00
parent 6de5e5a6da
commit c3c1cf414a
3 changed files with 61 additions and 26 deletions

View File

@ -7,11 +7,15 @@
* @package be.bastelstu.wcf.chat
*/
#content {
position: relative;
}
#timsChatRoomContent {
text-align: left;
}
.wcf-sidebar {
.sidebar {
margin-bottom: -20px !important;
overflow: auto;
padding: 0;
@ -62,9 +66,45 @@ #timsChatInput {
z-index: 10;
}
#timsChatControls {
position: relative;
border-radius: 5px 5px 0 5px;
}
#timsChatOptions {
bottom: -29px;
margin-left: 0;
position: absolute;
width: 100%;
> ul {
margin-right: -1px;
text-align: right;
> li {
> a {
&.button {
border-radius: 0 0 0 0;
margin: 0;
padding-right: 7px;
}
}
display: inline-block;
margin-left: -5px;
}
> li:first-child {
> a {
border-bottom-left-radius: 14px;
}
}
> li:last-child {
> a {
border-bottom-right-radius: 14px;
}
}
}
}
@ -184,7 +224,7 @@ .timsChatSidebarTabs {
}
}
&.active .wcf-badge {
&.active .badge {
font-size: 65% !important;
color: #fff;
background-color: #369;
@ -220,6 +260,7 @@ #timsChatCopyright {
}
.sidebarContent {
padding-top: 0px;
> div {
ul {
> li {
@ -227,13 +268,7 @@ .sidebarContent {
background-color: transparent !important;
box-shadow: none !important;
}
}
}
}
.sidebarContent {
> div {
ul {
> li.activeMenuItem {
> a {
background-color: #FFFFFF;
@ -242,4 +277,4 @@ .sidebarContent {
}
}
}
}
}

View File

@ -49,10 +49,10 @@
{include file='header' sandbox=false sidebarOrientation='right'}
<div id="timsChatRoomContent">
<div id="timsChatTopic" class="wcf-box wcf-marginBottom"{if $room->topic|language === ''} style="display: none;"{/if}>{$room->topic|language}</div>
<div class="timsChatMessageContainer wcf-box wcf-shadow1 wcf-boxPadding">
<div id="timsChatTopic" class="container box16"{if $room->topic|language === ''} style="display: none;"{/if}>{$room->topic|language}</div>
<div class="timsChatMessageContainer container box shadow1 containerPadding marginTop">
<ul>
<noscript><li class="wcf-error">{lang}wcf.chat.noJs{/lang}</li></noscript>
<noscript><li class="error">{lang}wcf.chat.noJs{/lang}</li></noscript>
</ul>
</div>
@ -60,7 +60,7 @@
<input type="text" id="timsChatInput" class="inputText long" name="text" autocomplete="off" maxlength="{@CHAT_MAX_LENGTH}" disabled="disabled" required="required" placeholder="{lang}wcf.chat.submit.default{/lang}" />
</form>
<div id="timsChatControls" class="wcf-box wcf-marginTop">
<div id="timsChatControls" class="box24 marginTop container">
{if MODULE_SMILEY}
<div id="smileyList">
<ul class="smilies">
@ -73,36 +73,36 @@
</div>
{/if}
<nav id="timsChatOptions">
<ul class="wcf-smallButtons">
<ul class="smallButtons">
<li>
<a id="timsChatAutoscroll" href="javascript:;" class="timsChatToggle jsTooltip wcf-button" title="{lang}wcf.global.button.disable{/lang}" data-disable-message="{lang}wcf.global.button.disable{/lang}" data-enable-message="{lang}wcf.global.button.enable{/lang}" data-status="1">
<a id="timsChatAutoscroll" href="javascript:;" class="timsChatToggle jsTooltip button" title="{lang}wcf.global.button.disable{/lang}" data-disable-message="{lang}wcf.global.button.disable{/lang}" data-enable-message="{lang}wcf.global.button.enable{/lang}" data-status="1">
<img alt="" src="{icon size='S'}enabled1{/icon}" /> <span>{lang}wcf.chat.scroll{/lang}</span>
</a>
</li>
<li>
<a id="timsChatNotify" href="javascript:;" class="timsChatToggle jsTooltip wcf-button" title="{lang}wcf.global.button.enable{/lang}" data-disable-message="{lang}wcf.global.button.disable{/lang}" data-enable-message="{lang}wcf.global.button.enable{/lang}" data-status="0">
<a id="timsChatNotify" href="javascript:;" class="timsChatToggle jsTooltip button" title="{lang}wcf.global.button.enable{/lang}" data-disable-message="{lang}wcf.global.button.disable{/lang}" data-enable-message="{lang}wcf.global.button.enable{/lang}" data-status="0">
<img alt="" src="{icon size='S'}disabled1{/icon}" /> <span>{lang}wcf.chat.notify{/lang}</span>
</a>
</li>
<li{if !MODULE_SMILEY} style="display: none;"{/if}>
<a id="timsChatSmilies" href="javascript:;" class="timsChatToggle jsTooltip wcf-button" title="{lang}wcf.global.button.disable{/lang}" data-disable-message="{lang}wcf.global.button.disable{/lang}" data-enable-message="{lang}wcf.global.button.enable{/lang}" data-status="1">
<a id="timsChatSmilies" href="javascript:;" class="timsChatToggle jsTooltip button" title="{lang}wcf.global.button.disable{/lang}" data-disable-message="{lang}wcf.global.button.disable{/lang}" data-enable-message="{lang}wcf.global.button.enable{/lang}" data-status="1">
<img alt="" src="{icon size='S'}enabled1{/icon}" /> <span>{lang}wcf.chat.smilies{/lang}</span>
</a>
</li>
<li>
<a id="timsChatClear" href="javascript:;" class="jsTooltip wcf-button" title="{lang}wcf.chat.clear.description{/lang}">
<a id="timsChatClear" href="javascript:;" class="jsTooltip button" title="{lang}wcf.chat.clear.description{/lang}">
<img alt="" src="{icon size='S'}delete1{/icon}" /> <span>{lang}wcf.chat.clear{/lang}</span>
</a>
</li>
<li>
<a id="timsChatMark" href="javascript:;" class="jsTooltip wcf-button" title="{lang}wcf.chat.mark.description{/lang}">
<a id="timsChatMark" href="javascript:;" class="jsTooltip button" title="{lang}wcf.chat.mark.description{/lang}">
<img alt="" src="{icon size='S'}check1{/icon}" /> <span>{lang}wcf.chat.mark{/lang}</span>
</a>
</li>
</ul>
</nav>
{include file='chatCopyright'}
</div>
{include file='chatCopyright'}
</div>
{include file='chatJavascriptInclude'}
<script type="text/javascript">
@ -142,7 +142,7 @@
// enable user-interface
$('#timsChatInput').enable().jCounter().focus();
$('#timsChatControls .copyright').click(function (event) {
$('#timsChatCopyright').click(function (event) {
event.preventDefault();
if ($.wcfIsset('timsChatCopyrightDialog')) return WCF.showDialog('timsChatCopyrightDialog', { title: 'Tims Chat{if CHAT_SHOW_VERSION} {$chatVersion}{/if}' });
var container = $('<div id="timsChatCopyrightDialog"></div>');

View File

@ -1,15 +1,15 @@
<div id="sidebarContent" class="wcf-sidebarContent">
<div id="sidebarContent" class="sidebarContent">
<nav class="timsChatSidebarTabs">
<ul>
<li id="toggleUsers" class="active"><a href="javascript:;" title="{lang}wcf.chat.users{/lang}">{lang}wcf.chat.users{/lang} <span class="wcf-badge">0</span></a></li>
<li id="toggleRooms"><a href="javascript:;" title="{lang}wcf.chat.rooms{/lang}" data-refresh-url="{link controller="Chat" action="RefreshRoomList"}{/link}">{lang}wcf.chat.rooms{/lang} <span class="wcf-badge">{#$rooms|count}</span></a></li>
<li id="toggleUsers" class="active"><a href="javascript:;" title="{lang}wcf.chat.users{/lang}">{lang}wcf.chat.users{/lang} <span class="badge">0</span></a></li>
<li id="toggleRooms"><a href="javascript:;" title="{lang}wcf.chat.rooms{/lang}" data-refresh-url="{link controller="Chat" action="RefreshRoomList"}{/link}">{lang}wcf.chat.rooms{/lang} <span class="badge">{#$rooms|count}</span></a></li>
</ul>
</nav>
<div id="sidebarContainer">
<ul id="timsChatUserList">
</ul>
<nav id="timsChatRoomList" class="wcf-sidebarMenu" style="display: none;">
<nav id="timsChatRoomList" class="sidebarMenu" style="display: none;">
<div>
<ul>
{foreach from=$rooms item='roomListRoom'}