Hitbox CLR用聊天室 CSS範本 Updated: 2014/08/10

/***************************************************/
/*  Hitbox CLR用聊天室 CSS範本 Updated: 2014/08/10  */
/***************************************************/

/*背景，rgba(紅,藍,綠,透明度:0為完全透明)*/
body { background-color: rgba(0,0,0,0) !important; }

/* 時間戳記，打開用inline，關閉用none*/
.chat-status-time, .chat-compact-time { display: inline !important; }

/*聊天室字形設定*/
.chat-messages.compact .message, .chat-status-message, .chatBody .name, .chat-status-time, .chat-compact-time{
    font-size: 16px             !important;        /*聊天室文字大小*/
    font-family: 微軟正黑體      !important;        /*聊天室文字字型*/
    font-weight: 900            !important;        /*聊天室文字粗細，900為最粗*/
    line-height: 1.05em         !important;        /*聊天室文字行高，1.05倍行高*/
}

/*聊天訊息*/
.chat-messages.compact .message {
    /*聊天訊息顏色，設定為白色*/
    color: white !important;

    /*用陰影做出黑色邊框，與白色字型有明顯對比。*/
    text-shadow: 1px 1px 0px black,-1px 1px 0px black,-1px -1px 0px black,1px -1px 0px black;
 }

/*******************************************/
/*  以下不推薦更動。不過還是附上註解。  */
/*******************************************/

/*使用者暱稱*/
.chatBody .name {
    /*用陰影做出白色邊框。雖然使用者暱稱的顏色不固定，但是純白的邊框表現不錯。*/
    text-shadow: 1px 1px 0px white,-1px 1px 0px white,-1px -1px 0px white,1px -1px 0px white;
}

/*時間戳記與系統訊息*/
.chat-status-time, .chat-compact-time, .chat-status-message {
    color: #AAA !important; /*淺灰色*/

    /*用陰影做出黑色邊框，與淺灰色的對比還算明顯。*/
    text-shadow: 1px 1px 0px black,-1px 1px 0px black,-1px -1px 0px black,1px -1px 0px black;
}

/*聊天室文字版面設定*/
.chat-messages.compact .message, .chat-status-message, .chatBody .name, .chat-status-time, .chat-compact-time{
    padding: 0                  !important;        /*取消留白*/
    margin: 0 0.1em 0 0.1em     !important;        /*固定邊界*/
    opacity: 1                  !important;        /*取消透明度*/
}

/*調整版面最左邊的留白*/
.chatBody li>div { padding: 0px 0px !important; }

/*讓狀態訊息產生較大的上下邊界*/
.chat-status-message { margin: 5px 0 !important; }

/*取消和上一個使用者之間的段落間距。*/
.chatBody .title { margin: 0 0 0 0 !important; }

/*不顯示輸入框*/
.chat-input { display: none; }

/*聊天室自帶背景。設定為透明避免干擾。*/
.chat-table, .chat-table td, .chat-table tr { background-color: transparent !important ; }

/*隱藏視窗捲軸*/
::-webkit-scrollbar { visibility: hidden; }