Community Central
Community Central
mNo edit summary
mNo edit summary
Line 1: Line 1:
This is a custom .css that changes your chat window. This skin now has support for transparency and background images, as well as color changes for the user menu's icons.
+
This is a custom .css that changes your chat window. This skin now has support for transparency and background images, as well as color changes for the user menu's icons. [http://i.imgur.com/IA09wWr.png -preview-]
   
 
As for background images, you may use [http://imgur.com imgur] or Wikia. Make sure to place it on <nowiki>".ChatWindow {
 
As for background images, you may use [http://imgur.com imgur] or Wikia. Make sure to place it on <nowiki>".ChatWindow {
Line 39: Line 39:
 
background:transparent;
 
background:transparent;
 
}
 
}
  +
  +
/* WARNING: Do not remove the link below. It's for the menu icons. */
   
 
.UserStatsMenu .actions ul li .icon {
 
.UserStatsMenu .actions ul li .icon {

Revision as of 11:18, 8 September 2013

This is a custom .css that changes your chat window. This skin now has support for transparency and background images, as well as color changes for the user menu's icons. -preview-

As for background images, you may use imgur or Wikia. Make sure to place it on ".ChatWindow { background:url('') no-repeat fixed center;", between the apostrophe enclosed with the parentheses.

To apply the modular chat skin, visit this page on a wiki, or here; should you wish for the modular chat skin to be applied on all wiki chats.

To suggest features, make sure you message me on my wall.

.css


/* Modular Chat Skin by Ahri-chan */

.ChatWindow { 
background:url('') no-repeat fixed center; 
}

.ChatHeader {
background-color:rgba(0, 0, 0, 0.75); 
}

.Chat li.you {
background:transparent; 
}

.ChatWindow .UserStatsMenu { 
background-color:rgba(0, 0, 0, 0.45); 
box-shadow: inset 0 0 0px 0px #000000; -webkit-box-shadow: inset 0 0 0px 0px #000000;
border:1px solid #3d454d; 
border-radius:3px; 
}

.ChatWindow .UserStatsMenu .info { 
background:transparent; 
}
 
.ChatWindow .UserStatsMenu .actions ul li:hover { 
background:transparent; 
}

/* WARNING: Do not remove the link below. It's for the menu icons. */

.UserStatsMenu .actions ul li .icon { 
background-position:0; background-image:url('http://i.imgur.com/T1scNH0.png');
opacity:100; 
}

.UserStatsMenu .actions ul li:hover .icon { 
opacity:100; 
}

.ChatWindow .Write .message { 
background:transparent; 
}

.Rail .User:hover { 
background:transparent; 
}

.Rail .public .chevron { 
border-color:white transparent transparent transparent; 
}

.Rail .public .chevron.closed { 
border-color:transparent transparent transparent white; 
}

.Rail .private { 
background-color:transparent; 
background-image:-webkit-gradient(linear,0% 0%,0% 0%,color-stop(0,transparent),color-stop(0,transparent));
}

.Rail .selected { 
background:transparent; 
box-shadow: inset 0 0 0px 0px #000000; -webkit-box-shadow: inset 0 0 0px 0px #000000; 
}

/* END OF CODES */

Upcoming updates

  • Compatibility with chat hacks
  • Universalisation of the .css.