Small style optimizations
authorMarcel Werk <burntime@woltlab.com>
Mon, 1 Apr 2013 15:11:51 +0000 (17:11 +0200)
committerMarcel Werk <burntime@woltlab.com>
Mon, 1 Apr 2013 15:11:51 +0000 (17:11 +0200)
files/style/conversation.less
templates/conversation.tpl

index e21ec79a2d015fbb56b6c520b49327f702b38cb5..b4b3fc7a55debae723bb9fc9704a6ed31b80befe 100644 (file)
                                font-size: @wcfSmallFontSize;
                        }
                }
+               
+               &.conversationLeft {
+                       > div > a > img {
+                               .grayscale;
+                       }
+               }
        }
 }
 
-.conversationLeft {
+.conversationLeft .userLink,
+.conversationLeft.userLink {
        text-decoration: line-through;
 }
 
 .sidebar fieldset.conversationQuota {
        > div {
                text-align: center;
-               width: 180px;
        }
 }
 
 .conversationUsageBar {
-       background-color: @wcfContentBackgroundColor;
-       border: 1px solid @wcfContainerBorderColor;
-       padding: 1px;
+       background-color: @wcfColor;
+       height: 20px;
+       padding: 4px;
+       
+       .borderRadius(5px);
+       .boxShadowNative(~"inset 0 1px 5px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .5)");
        
        > span {
                color: transparent;
                display: block;
-               font-size: @wcfSmallFontSize;
+               height: 100%;
                
-               .linearGradient(rgba(0, 153, 0, 1), rgba(0, 153, 0, 1), rgba(0, 102, 0, 1));
+               .borderRadius(3px);
+               .boxShadowNative(~"inset 0 1px 0 rgba(255, 255, 255, .5)");
+               .linearGradient(rgba(165, 223, 65, 1), rgba(165, 223, 65, 1), rgba(76, 169, 22, 1));
        }
        
        &.yellow > span {
-               .linearGradient(rgba(255, 215, 0, 1), rgba(255, 215, 0, 1), rgba(218, 165, 32, 1));
-               
+               .linearGradient(rgba(254, 207, 35, 1), rgba(254, 207, 35, 1), rgba(253, 146, 21, 1));
        }
        
        &.red > span {
-               .linearGradient(rgba(153, 0, 0, 1), rgba(153, 0, 0, 1), rgba(102, 0, 0, 1));
+               .linearGradient(rgba(240, 163, 163, 1), rgba(240, 163, 163, 1), rgba(244, 35, 35, 1));
        }
 }
 
index 82abd27acdb401962d8937d77cc62c3cc088d6cf..765f3ed7d522a842504bf4a8ee3ff8909a9904ea 100644 (file)
                        
                        <ul class="containerBoxList tripleColumned conversationParticipantList">
                                {foreach from=$participants item=participant}
-                                       <li class="jsParticipant">
+                                       <li class="jsParticipant{if $participant->hideConversation == 2} conversationLeft{/if}">
                                                <div class="box24">
                                                        <a href="{link controller='User' object=$participant}{/link}" class="framed">{@$participant->getAvatar()->getImageTag(24)}</a>
                                                        <hgroup>
                                                                <h1>
-                                                                       <a href="{link controller='User' object=$participant}{/link}" class="userLink{if $participant->hideConversation == 2} conversationLeft{/if}" data-user-id="{@$participant->userID}">{$participant->username}</a>
+                                                                       <a href="{link controller='User' object=$participant}{/link}" class="userLink" data-user-id="{@$participant->userID}">{$participant->username}</a>
                                                                        {if $participant->isInvisible}<small>({lang}wcf.conversation.invisible{/lang})</small>{/if}
                                                                        {if ($conversation->userID == $__wcf->getUser()->userID) && ($participant->userID != $__wcf->getUser()->userID) && $participant->hideConversation != 2}
                                                                                <a class="jsDeleteButton jsTooltip jsOnly" title="{lang}wcf.conversation.participants.removeParticipant{/lang}" data-confirm-message="{lang}wcf.conversation.participants.removeParticipant.confirmMessage{/lang}" data-object-id="{@$participant->userID}"><span class="icon icon16 icon-remove"></span></a>