Themes / Chating CSS & colors


no_avatar
pjpjr6
 
Posts: 1
Joined: Tue Apr 12, 2016 9:45 pm
 Wed Apr 13, 2016 4:10 pm • via Web
How do I change the theme if I buy a different theme? Or can I just change the CSS?
no_avatar
OldFart
 
Posts: 16
Joined: Sun Feb 21, 2016 6:53 pm
 Tue Jun 07, 2016 10:16 pm • via Web
I'd like to know this myself! There is 2 different .css files. One in /themes/prosilver -and- one in /themes/all. I did some edits on a test board in /themes/prosliver and it had no effect
no_avatar
OldFart
 
Posts: 16
Joined: Sun Feb 21, 2016 6:53 pm
 Wed Jun 08, 2016 10:56 pm • via Web
Code: Select all
#chat-body {
   background: #00ff00;                /*------------------------------------#0076B1;-------------This Changes the main blue chat header---------*/
   background: linear-gradient(to bottom,#00ff00, #006600 40px);/*---------#12A3EB-----------*/
   background: -moz-linear-gradient(top, #00ff00, #006600 40px);
   background: -webkit-linear-gradient#00ff00(, #006600 40px);
   background: -o-linear-gradient(top,#00ff00 , #006600 40px);
}

#chat-title {
   color: black;                               /*-----------------#FFFFFF;-------Changes text color of the word chat--------*/
   text-transform: uppercase;
   font-weight: bold;
}

#chat-content {
   background: #006600;                         /*--------------#E9F0F5;-----------This changed bottom background-*/
}

#chat-tabs li {
   border-color: red;                             /*------------------------#CCC;-------------------*/
}

#chat-tabs li.active {
   border-top-color: green;                 /*------#FFFFFF;-----*/
   font-weight: bold;}

#chat-right-panel, #chat-conversation-container, #chat-toolbar {
   border: 1px solid #006600;                                                 /*------ #CCC;---Small border around chat windows---*/
}

#chat-toolbar li.separator {
   background: green;
}

#chat-toolbar a:hover, .chat-button:hover {
   background: #006600;             /*--------#FAFAFA;------off-white---CHANGES BG COLOR OF ACTION ICONS ON HOVER-*/
   border-color: red;                          /*-------------------------------#CCC;---------------*/
}

/* For IE7+ (without css3) */
#chat-toolbar a.disabled:hover {
   background: none;
}

#chat-toolbar a.active {
   border-color: red !important;
}

#chat-toolbar a,
.chat-button [class*="chat-icon-"] {
   font-size: 15px;
   color: blue;                                 /*---------#105289;---CHANGES CHAT ICON COLOR----*/
}

#chat-toolbar a.disabled, .chat-button.disabled [class*="chat-icon-"] {
   border-color: transparent !important;
   color: yellow;/*-------#999;---------*/
   cursor: default;
}

#chat-toolbar a:not(.disabled):hover,
.chat-button:not(.disabled):hover [class*="chat-icon-"] {
   color: red;        /*-----------#D31141;-----changes action icon color on hover----*/
}

.ic-row-actions a {
   color: #D31141;                 /*--------#999;------------*/
}

.ic-row-actions a:hover {
   color: green;                                /*------------#105289;---Changes quote icons in main chat window----*/
}

/* Boxes
------------------------------- */
.ic-box {
   border: 1px solid green;/*---original value #999;---*/
}

.color-box .colour, .smiley-box a {
   border: 1px solid black;/*----original value--#FFFFFF;-----*/
}

.color-box .colour:hover, .smiley-box a:hover {
   border-color: pink;                                        /*-------#CCC;-----------*/
}

#chat-right-panel, #chat-conversation-container,
#chat-tabs li.active, #chat-toolbar a.active, .ic-box  {
   background: black;/*-----------------------#FFFFFF;----WHO's in chat and chatbody background-----------*/
}

/* Tabs
------------------------------- */
.chat-archive-tabs a {
   color: #FFF;
}

.chat-archive-tabs .active {
   background: gray;                                          /*-------#E9F0F5;------*/
   color: #000;
}

/* Style overrides
------------------------------- */
.chat-row blockquote {
   background-color: black;                               /*------- #F4F4F4;------*/
   border-color: green;                                         /*------- #DDD;--------*/
   margin-left: 15px;
}

.chat-row ul, .chat-row ol {
   margin-left: 20px;
}

.dropdown-extended { z-index: 3; }
.dropdown, .dropdown .dropdown-contents { z-index: 4; }
.dropdown .pointer { z-index: 5; }

/* Responsive Layout
------------------------------- */
@media only screen and (max-width: 950px) {
   #chat-left-panel    { width: 80%; }
   #chat-right-panel   { width: 19.4% }
}

@media only screen and (max-width: 750px) {
   #chat-left-panel    { width: 75%; }
   #chat-right-panel   { width: 24.4% }
}

@media only screen and (min-width: 500px) and (max-width: 600px) {
   .ic-row-date {
      display: block;
      font-size: 0.9em;
   }
   
   .ic-row-date:before {
      content: '';
      padding: 0;
   }
}

@media only screen and (max-width: 500px) {
   #chat-left-panel, #chat-right-panel  {
      float: none;
      width: auto;
   }
   
   #chat-right-panel {
      clear: both;
      height: auto !important;
      margin-top: 10px;
      max-height: 60px;
      overflow: auto;
   }
   
   .ic-userlist > li {
      display: inline-block;
      margin: 2px 0;
   }
   
   #chat-message { width: 70%; }
   #chat-message textarea { font-size: 12px; }
   
   .ic-edit-textarea {
      width: 280px;
   }
   
   .color-box .colour span {
      height: 18px;
      width: 18px;
   }
}

@media only screen and (max-width: 430px) {
   #chat-toolbar li.ic-loading { margin-left: 0; }
   .chat-responsive-refresh, .chat-responsive-hide { display: none; }
   .chat-responsive-menu { display: inline-block; }
   
   #chat-notices [class*="chat-icon"] { display: none; }.ic-row-date { font-size: 0.9em; }
   
   .ic-row-avatar {
      height: 30px;
      width: 30px;
   }
   
   .ic-row-text.avatar-margin, .ic-row-title.avatar-margin {
      margin-left: 38px;
   }
   
   .ic-edit-textarea {
      width: 260px;
   }
}

Who is online

Users browsing this forum: No registered users and 0 guests