Bastelstube/Tims-Chat
1
0
Fork 0
mirror of https://github.com/wbbaddons/Tims-Chat.git synced 2025-01-09 00:20:08 +00:00
Code Issues Releases Wiki Activity

Move CSS from Template to less

Browse Source
This commit is contained in:
Tim Düsterhus 2012-10-15 14:39:59 +02:00
parent 167679d2c3
commit fd75bf99ab
2 changed files with 326 additions and 319 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

116
file/style/be.bastelstu.wcf.chat.less
View File

@ -7,15 +7,16 @@
* @package be.bastelstu.wcf.chat * @package be.bastelstu.wcf.chat
*/ */
#content { #tplChat {
#content {
position: relative; position: relative;
} }
#timsChatRoomContent { #timsChatRoomContent {
text-align: left; text-align: left;
} }
.sidebar { .sidebar {
margin-bottom: -20px !important; margin-bottom: -20px !important;
overflow: auto; overflow: auto;
padding: 0; padding: 0;
@ -33,20 +34,20 @@
} }
} }
} }
} }
#timsChatTopic { #timsChatTopic {
padding: 5px; padding: 5px;
} }
.timsChatMessageContainer { .timsChatMessageContainer {
height: 200px; height: 200px;
overflow-y: scroll; overflow-y: scroll;
overflow-x: hidden; overflow-x: hidden;
padding-left: 7px !important; padding-left: 7px !important;
} }
#smilies { #smilies {
padding: 14px 21px 7px; padding: 14px 21px 7px;
border-bottom-right-radius: 0px; border-bottom-right-radius: 0px;
@ -60,26 +61,26 @@
} }
} }
} }
} }
#timsChatForm { #timsChatForm {
white-space: nowrap; white-space: nowrap;
margin-top: 10px; margin-top: 10px;
// Fix to align chatInput in center // Fix to align chatInput in center
text-align: center; text-align: center;
} }
#timsChatInput { #timsChatInput {
position: relative; position: relative;
z-index: 10; z-index: 10;
} }
#timsChatControls { #timsChatControls {
position: relative; position: relative;
.borderRadius(5px, 5px, 0, 5px); .borderRadius(5px, 5px, 0, 5px);
} }
#timsChatOptions { #timsChatOptions {
top: -1px; top: -1px;
right: 1px; right: 1px;
margin-left: 0; margin-left: 0;
@ -115,9 +116,9 @@
} }
} }
} }
} }
#timsChatUserList { #timsChatUserList {
.timsChatUserMenu { .timsChatUserMenu {
display: none; display: none;
background-color: rgba(0, 0, 0, 0.1); background-color: rgba(0, 0, 0, 0.1);
@ -138,12 +139,27 @@
} }
} }
} }
.timsChatAway { .timsChatAway {
opacity: .5; opacity: .5;
} }
}
.timsChatMessage { > li {
> a {
background-image: url("../icon/arrowRight.svg");
background-position: 15px center;
background-repeat: no-repeat;
}
&.activeMenuItem {
> a {
background-image: url("../icon/arrowDown.svg");
}
}
}
}
.timsChatMessage {
padding-left: 16px; padding-left: 16px;
min-height: 16px; min-height: 16px;
clear: both; clear: both;
@ -164,15 +180,16 @@
&.unloaded { &.unloaded {
opacity: 0.4; opacity: 0.4;
} }
} }
.ajaxLoad { .ajaxLoad {
background-position: right center; background-position: right center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: auto 100%; background-size: auto 100%;
} background-image: url("../icon/spinner.svg");
}
.timsChatSidebarTabs { .timsChatSidebarTabs {
height: 34px; height: 34px;
z-index: 131; z-index: 131;
position: relative; position: relative;
@ -253,37 +270,43 @@
} }
} }
} }
} }
#timsChatRoomList { #timsChatRoomList {
margin-top: 5px; margin-top: 5px;
> div > div { > div > div {
margin-top: 10px; margin-top: 10px;
} }
} }
#sidebarContainer { #sidebarContainer {
overflow-y: auto; overflow-y: auto;
height: 420px; height: 420px;
width: 100%; width: 100%;
border-top: 1px solid darken(@wcfSidebarBackgroundColor, 8%); border-top: 1px solid darken(@wcfSidebarBackgroundColor, 8%);
z-index: 131; z-index: 131;
position: relative; position: relative;
} }
#sidebarContainer a { #sidebarContainer a {
outline: none; outline: none;
overflow: hidden; overflow: hidden;
} }
#timsChatCopyright { #timsChatCopyright {
bottom: 5px; bottom: 5px;
position: absolute; position: absolute;
.textShadow(@wcfContentBackgroundColor); .textShadow(@wcfContentBackgroundColor);
} }
.sidebarContent { #timsChatCopyrightDialog {
background-position: right 45px;
background-repeat: no-repeat;
min-height: 50%;
}
.sidebarContent {
padding-top: 0px; padding-top: 0px;
> div { > div {
ul { ul {
@ -311,9 +334,9 @@
} }
} }
} }
} }
html.fullscreen { html.fullscreen {
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
@ -321,7 +344,7 @@ html.fullscreen {
display: none; display: none;
} }
#tplChat { body {
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
@ -335,16 +358,17 @@ html.fullscreen {
} }
} }
} }
} }
.badgeBG(@backgroundColor) when (lightness(@backgroundColor) < 50%) { .badgeBG(@backgroundColor) when (lightness(@backgroundColor) < 50%) {
background-color: lighten(@backgroundColor, lightness(@backgroundColor) / 2); background-color: lighten(@backgroundColor, lightness(@backgroundColor) / 2);
} }
.badgeBG(@backgroundColor) when (lightness(@backgroundColor) < 20%) { .badgeBG(@backgroundColor) when (lightness(@backgroundColor) < 20%) {
background-color: lighten(@backgroundColor, 20%); background-color: lighten(@backgroundColor, 20%);
} }
.badgeBG(@backgroundColor) when (lightness(@backgroundColor) >= 50%) { .badgeBG(@backgroundColor) when (lightness(@backgroundColor) >= 50%) {
background-color: darken(@backgroundColor, lightness(@backgroundColor) / 2); background-color: darken(@backgroundColor, lightness(@backgroundColor) / 2);
}
} }

17
template/chat.tpl
View File

@ -7,19 +7,6 @@
<style type="text/css"> <style type="text/css">
#timsChatCopyrightDialog { #timsChatCopyrightDialog {
background-image: url("{link controller='Chat' action='Copyright' sheep=1}{/link}"); background-image: url("{link controller='Chat' action='Copyright' sheep=1}{/link}");
background-position: right 45px;
background-repeat: no-repeat;
min-height: 50%;
}
#timsChatUserList > li > a {
background-image: url({icon size='S'}arrowRight{/icon});
background-position: 15px center;
background-repeat: no-repeat;
}
#timsChatUserList > li.activeMenuItem > a {
background-image: url({icon size='S'}arrowDown{/icon});
} }
{assign var='type' value='\wcf\data\chat\message\ChatMessage::TYPE_'} {assign var='type' value='\wcf\data\chat\message\ChatMessage::TYPE_'}
@ -45,10 +32,6 @@
.timsChatMessage{$type|concat:'ERROR'|constant} { .timsChatMessage{$type|concat:'ERROR'|constant} {
background-image: url({icon size='S'}systemError{/icon}); background-image: url({icon size='S'}systemError{/icon});
} }
.ajaxLoad {
background-image: url({icon size='S'}spinner{/icon});
}
</style> </style>
</head> </head>