Home Support
Migration

We will be discontinuing our 3.x series service on the 1st of June 2013.

Please, proceed to our new temporary website at bc.blastchat.com to download our new BlastChat 4.0 client and subscribe to our service.

Welcome, Guest
Please Login or Register.    Lost Password?
Forum is locked
CSS - how to change style? Forum is locked
(0 viewing) 
Go to bottomPage: 12345
TOPIC: CSS - how to change style?
#1979
simo6
Fresh Boarder
Posts: 7
graphgraph
User Offline Click here to see the profile of this user
Re:how to change style? 7 Years ago Karma: 1
ciao Peter, i tried to modify the template_css.css file as u suggested. I added the code at the end but it seems that the style of the template i used for my site keep overriding everything

I added the CSS file i tried to modify too.



/* CSS Document */
iframe {float: right;}
html {
height: 100%;
}

body {
height: 100%;
margin-bottom: 1px;
}

#main {
padding:2px; border: 1px solid #282828
;
width: 802px;
margin-left: auto;
margin-right: auto;

}
.clr {
clear: both;
}
.contentpane {
width: 735px;
}

.outline { border: 1px solid #282828
;
background: #000000;
padding: 2px;
/*
width: 802px;
margin-left: auto;
margin-right: auto;*/
}

#buttons_outer {
width: 735px;
margin-bottom: 2px;
margin-right: 2px;
float: left;

}

#buttons_inner { border: 1px solid #282828
;
height: 21px;
}

#pathway_text {
position: absolute;
bottom: 2px;
left: 2px;
overflow: hidden;
display: block;
height: 25px;
width: 628px;
line-height: 25px !important;
line-height: 22px;
color: white;
padding-left: 4px;
}

#pathway_text img {
margin-left: 5px;
margin-right: 5px;
margin-top: 0px;
}

#pathway_text a{
color: white;
}

#pathway_text a:hover {
color: #C22512;
}

#buttons {
float: left;
margin: 0px;
padding: 0px;
width: auto;
}


ul#mainlevel-nav
{
list-style: none;
padding: 0;
margin: 0;
font-size: 0.8em;
}

ul#mainlevel-nav li
{
background-image: none;
padding-left: 0px;
padding-right: 0px;
float: left;
margin: 0;
font-size: 11px;
line-height: 21px;
white-space: nowrap;
border-right-width: 1px;
border-right-style: solid;
border-right-color: #333333;
}

ul#mainlevel-nav li a
{
display: block;
padding-left: 15px;
padding-right: 15px;
text-decoration: none;
color: #CCCCCC;
background: transparent;
}

#buttons>ul#mainlevel-nav li a { width: auto; }

ul#mainlevel-nav li a:hover
{
color: #fff;
background-color: #383838;
}


#search_outer {
float: left;
width: 165px;
}

#search_inner { border: 1px solid #282828
;
padding: 0px;
height: 21px !important;
height: 23px;
overflow: hidden;
}

#search_inner form {
padding: 0;
margin: 0;
}

#search_inner .inputbox {
border: 0px;
padding: 3px 3px 3px 5px;
font-family: arial, helvetica, sans-serif;
font-size: 11px;
color: #990000;
}

#header_outer {
text-align: left;
border: 0px;
margin: 0px;
}

#header {
position: relative;
float: left;
padding: 0px;
margin-right: 2px;
width: 735px;
height: 150px;
background: url(../images/header_short.jpg) no-repeat;
}

#top_outer{
float: left;
width: 165px;
}

#top_inner {
border: 1px solid #282828;
padding: 2px;
height: 144px !important;
height: 150px;
overflow: hidden;
float: none !important;
float: left;
}
#top_inner .moduletable {
color: #990000;
}
#left_side {
vertical-align: top;
}

#left_outer {
width: 165px;
float: left;
}

#left_inner { border: 1px solid #282828
;
padding: 2px;
float: none !important;
float: left;
}

#main_area {
padding-top: 2px;
}

#main_body {
vertical-align: top;
padding-left: 2px;
width: 100%;
}

#content_outer {
padding: 0px;
margin-top: 0px;
margin-left: 2px;
/** border: 1px solid #282828
;
**/
float: left;
width: 635px;
}

#content_inner{
float: none !important;
float: left;
padding: 0;
padding-top: 2px;
margin: 0;
}

table.content_table {
width: 100%;
padding: 0px;
margin: 0px;
}

table.content_table td {
padding: 0px;
margin: 0px;
}


#banner_inner {
padding: 0px;
text-align: center;
margin: 0px;
margin-bottom: 2px !important;
margin-bottom: 0px;
}

#poweredby_inner {
float: right;
padding-left: 1px;
margin-left: 0px;
height: 70px;
}

#right_side {
vertical-align: top;
padding-left: 2px;
}

#right_outer {
margin-left: 0px;
width: 165px;
}

#right_inner { border: 1px solid #282828
;
padding: 2px;
}

#user1_user2 {
}

.user1_inner { border: 1px solid #282828
;
float: none !important;
float: left;
margin: 0px;
margin-right: 2px;
padding: 2px;
}

.user2_inner { border: 1px solid #282828
;
float: none !important;
float: left;
margin: 0px;
padding: 2px;
}

#body_outer {
float: left;
padding: 2px;
margin-top: 2px; border: 1px solid #282828;
}

#active_menu {
color:#fff;
}

a#active_menu:hover {
color: #C22512;
}

.maintitle {
color: #000000;
font-size: 40px;
padding-left: 15px;
padding-top: 20px;
}

.error {
font-style: italic;
text-transform: uppercase;
padding: 5px;
color: #ffffff;
font-size: 14px;
font-weight: bold;
}

/** old stuff **/

.back_button {
float: left;
text-align: center;
font-size: 11px;
font-weight: bold;
width: auto;
line-height: 20px;
margin: 1px;
padding-top: 0px;
padding-right: 8px;
padding-bottom: 0px;
padding-left: 8px;
background-image: url(../images/sechdr1bg.png);
background-repeat: repeat-x;
border: 1px outset #333333;
}

.pagenav {
float: left;
text-align: center;
font-size: 11px;
font-weight: bold;
border: 1px double #3B3B3B;
width: auto;
line-height: 20px;
margin: 1px;
padding-top: 0px;
padding-right: 8px;
padding-bottom: 0px;
padding-left: 8px;
background-image: url(../images/sechdr1bg.png);
background-repeat: repeat-x;
}

.pagenavbar {
margin-right: 10px;
float: right;
}

#footer {
text-align: center;
padding: 3px;
}

ul
{
margin: 0;
padding: 0;
list-style: none;
}

li
{
line-height: 15px;
padding-left: 15px;
padding-top: 0px;
background-image: url(../images/bullet.png);
background-repeat: no-repeat;
background-position: 0px 2px;
}


td {
text-align: left;
font-size: 11px;
}



body {
margin: 15px;
height: 100%;
padding: 0px;
font-family: Arial, Helvetica, "Sans Serif";
line-height: 120%;
font-size: 11px;
color: #CCCCCC;
background: #000000;
}

/* Joomla core stuff */
a:link, a:visited {
color: #C22512; text-decoration: none;
font-weight: bold;
}

a:hover {
color: #77150B;
text-decoration: none;
font-weight: bold;
}

table.contentpaneopen {
width: 100%;
padding: 0px;
border-collapse: collapse;
border-spacing: 0px;
margin: 0px;
}

table.contentpaneopen td {
}

table.contentpaneopen td.componentheading {
padding-left: 4px;
}



table.contentpane {
width: 100%;
padding: 0px;
border-collapse: collapse;
border-spacing: 0px;
margin: 0px;
}

table.contentpane td {
margin: 0px;
padding: 0px;
}

table.contentpane td.componentheading {
padding-left: 4px;
}

table.contentpaneopen fieldset {
border: 0px;
border-bottom: 1px solid #eee;
}

.button {
text-align: center;
font-size: 11px;
font-weight: bold;
width: auto;
line-height: 20px;
margin: 1px;
padding-top: 3px;
padding-right: 8px;
padding-bottom: 3px;
padding-left: 8px;
background-image: url(../images/sechdr1bg.png);
background-repeat: repeat-x;
color: #CCCCCC;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #990000;
border-right-color: #660000;
border-bottom-color: #710000;
border-left-color: #990000;
}

.inputbox {
padding: 2px;
border:1px solid #990000;
background-color: #000000;
color: #999999;
}

.componentheading {
background: url(../images/subhead_bg.png) repeat-x;
color: #CE2415;
text-align: left;
padding-top: 4px;
padding-left: 4px;
height: 21px;
font-weight: bold;
font-size: 10px;
text-transform: uppercase;

}

.contentcolumn {
padding-right: 5px;
}

.contentheading {
height: 30px;
color: #990000;
font-weight: bold;
font-size: 14px;
white-space: nowrap;
}



.contentpagetitle {
font-size: 13px;
font-weight: bold;
color: #ffffff;
text-align:left;
}

table.searchinto {
width: 100%;
}

table.searchintro td {
font-weight: bold;
}

table.moduletable {
width: 100%;
margin-bottom: 5px;
padding: 0px;
border-spacing: 0px;

}

div.moduletable {
padding: 0;
margin-bottom: 2px;
}

table.moduletable th, div.moduletable h3 {
background: url(../images/subhead_bg.png) repeat-x;
color: #999999;
text-align: left;
padding-left: 4px;
height: 21px;
line-height: 21px;
font-weight: bold;
font-size: 10px;
text-transform: uppercase;
margin: 0 0 2px 0;
}

table.moduletable td {
font-size: 11px;
padding: 0px;
margin: 0px;
font-weight: normal;
}

table.pollstableborder td {
padding: 2px;
}

.sectiontableheader {
font-weight: bold;
padding: 4px;
background-color: #000000;
background-image: url(../images/sechdrbg.png);
background-repeat: repeat-x;
height: 23px;
border-top-width: 1px;
border-bottom-width: 1px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #2A2A2A;
border-bottom-color: #2A2A2A;
background-position: top;
}

.sectiontablefooter {
}

.sectiontableentry1 {
background-color : #101010;
font-size: 11px;
color: #CCCCCC;
height: 23px;
background-image: url(../images/sechdr1bg.png);
background-repeat: repeat-x;
background-position: left top;
}

.sectiontableentry2 {
background-color : #101010;
font-size: 11px;
color: #CCCCCC;
height: 23px;
background-image: url(../images/sechdr1bg.png);
background-repeat: repeat-x;
background-position: left top;
}

.small {
color: #999999;
font-size: 11px;
}

.createdate {
height: 15px;
padding-bottom: 10px;
color: #999999;
font-size: 11px;
}

.modifydate {
height: 15px;
padding-top: 10px;
color: #999999;
font-size: 11px;
}

table.contenttoc { border: 1px solid #282828
;
padding: 2px;
margin-left: 2px;
margin-bottom: 2px;
}

table.contenttoc td {
padding: 2px;
}

table.contenttoc th {
background: url(../images/subhead_bg.png) repeat-x;
color: #CE2415;
text-align: left;
padding-top: 2px;
padding-left: 4px;
height: 21px;
font-weight: bold;
font-size: 10px;
text-transform: uppercase;
}

a.mainlevel:link, a.mainlevel:visited {
display: block;
background: url(../images/menu_bg.png) no-repeat;
vertical-align: middle;
font-size: 11px;
color: #ccc;
text-align: left;
padding-top: 5px;
padding-left: 12px;
height: 20px !important;
height: 25px;
text-decoration: none;
font-weight: normal;
}

a.mainlevel:hover {
background-position: 0px -25px;
text-decoration: none;
color: #fff;
font-weight: normal;
}

a.sublevel:link, a.sublevel:visited {
padding-left: 1px;
vertical-align: middle;
font-size: 11px;
font-weight: bold;
color: #CCCCCC;
text-align: left;
}

a.sublevel:hover {
color: #990000;
text-decoration: none;
}
.highlight {
background-color: Yellow;
color: Blue;
padding: 0;
}
.code {
background-color: #ddd;
border: 1px solid #bbb;
}

form {
/* removes space below form elements */
margin: 0;
padding: 0;
}

div.mosimage {
border: 1px solid #ccc;
}

.mosimage { border: 1px solid #282828
;
margin: 5px
}

.mosimage_caption {
margin-top: 2px;
background: #efefef;
padding: 1px 2px;
color: #666;
text-transform: normal;
font-size: 10px;
border-top: 1px solid #ffffff;
}
#showhide {
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
margin: 0px;
position: relative;
top: 5px;
}

.dd { }

/* BLASTCHAT 2.0 */
/*this will modify background of window*/
body.blastchat {
margin: 3px 0px 3px 0px;
padding: 0px 0px 0px 0px;
vertical-align: top;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#474747;
background: url('../images/outer_center.png');
}

/*definitions to adjust/overwrite menu areas*/
.bc_sectiontableheader {
background-color : #4DA5FF;
color : #FFFFFF;
padding: 0px 0px 0px 0px;
font-weight : bold;
letter-spacing : 0px;
}

/*definitions to adjust/overwrite menu areas*/
.bc_sectiontableheader a:link {
color: blue;
background-color: transparent;
font-weight: bold;
text-decoration: none;
}

/*definitions to adjust/overwrite menu areas*/
.bc_sectiontableheader a:visited {
color: blue;
background-color: transparent;
font-weight: bold;
text-decoration: none;
}

/*definitions to adjust/overwrite menu areas*/
.bc_sectiontableheader a:hover {
color: orange;
background-color: transparent;
font-weight: bold;
text-decoration: none;
}

/*definitions to adjust/overwrite messages stripes*/
.bc_sectiontableentry1 {
margin: 3px 0px 3px 0px;
padding: 0px 0px 0px 0px;
vertical-align: top;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#474747;
background-color : #FFFFFF;
}

/*definitions to adjust/overwrite messages stripes*/
.bc_sectiontableentry2 {
margin: 3px 0px 3px 0px;
padding: 0px 0px 0px 0px;
vertical-align: top;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#474747;
background-color : #F3F3F3;
}

/*from nick*/
/*message sent from me*/
.bc_msg_from {
font-weight : bold;
}
/*to nick*/
/*message sent to me*/
.bc_msg_to {
font-weight : bold;
}
/*user list my own nick*/
.bc_usr_to {
font-weight : bold;
}

/*private message sent*/
.bc_msg_text_privs {
color : blue;
}

/*private message received*/
.bc_msg_text_privr {
color : red;
}

/*definitions to adjust/overwrite submit form area*/
.bc_sectiontableheader_form {
margin: 3px 0px 3px 0px;
padding: 0px 0px 0px 0px;
vertical-align: top;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#474747;
background: url('../images/outer_center.png');
background-color : #F3F3F3;
}<br><br>Post edited by: simo6, at: 2006/05/23 06:07
 
The topic has been locked.
#1973
BlastChatSupport
Admin
Posts: 2563
graph
User Offline Click here to see the profile of this user
BlastChat
Re:how to change style? 7 Years ago Karma: 70
Very soon I will be adding Admin menu &quot;CSS&quot; where you will be able to find (copy/paste) CSS definitions that you can use to modify your template's CSS file, but for eager ones like yourself, here it is:

Simply copy/paste to your template_css.css (Joomla, Mambo) or template.css (Joomla 1.5):
/*this will modify background of window*/
body.blastchat {
margin: 3px 0px 3px 0px;
padding: 0px 0px 0px 0px;
vertical-align: top;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#474747;
background: url('../images/outer_center.png');
}

/*definitions to adjust/overwrite menu areas*/
.bc_sectiontableheader {
background-color : #4DA5FF;
color : #FFFFFF;
padding: 0px 0px 0px 0px;
font-weight : bold;
letter-spacing : 0px;
}

/*definitions to adjust/overwrite menu areas*/
.bc_sectiontableheader a:link {
color: blue;
background-color: transparent;
font-weight: bold;
text-decoration: none;
}

/*definitions to adjust/overwrite menu areas*/
.bc_sectiontableheader a:visited {
color: blue;
background-color: transparent;
font-weight: bold;
text-decoration: none;
}

/*definitions to adjust/overwrite menu areas*/
.bc_sectiontableheader a:hover {
color: orange;
background-color: transparent;
font-weight: bold;
text-decoration: none;
}

/*definitions to adjust/overwrite messages stripes*/
.bc_sectiontableentry1 {
margin: 3px 0px 3px 0px;
padding: 0px 0px 0px 0px;
vertical-align: top;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#474747;
background-color : #FFFFFF;
}

/*definitions to adjust/overwrite messages stripes*/
.bc_sectiontableentry2 {
margin: 3px 0px 3px 0px;
padding: 0px 0px 0px 0px;
vertical-align: top;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#474747;
background-color : #F3F3F3;
}

/*from nick*/
/*message sent from me*/
.bc_msg_from {
font-weight : bold;
}
/*to nick*/
/*message sent to me*/
.bc_msg_to {
font-weight : bold;
}
/*user list my own nick*/
.bc_usr_to {
font-weight : bold;
}

/*private message sent*/
.bc_msg_text_privs {
color : blue;
}

/*private message received*/
.bc_msg_text_privr {
color : red;
}

/*definitions to adjust/overwrite submit form area*/
.bc_sectiontableheader_form {
margin: 3px 0px 3px 0px;
padding: 0px 0px 0px 0px;
vertical-align: top;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#474747;
background: url('../images/outer_center.png');
background-color : #F3F3F3;
}
<br><br>Post edited by: Prutkar, at: 2006/05/22 13:03
 
The topic has been locked.
#1970
simo6
Fresh Boarder
Posts: 7
graphgraph
User Offline Click here to see the profile of this user
CSS - how to change style? 7 Years ago Karma: 1
Just installed new version for Joomla on my site but it looks it doesnt fit perfectly with the template i use.
Is there a way to use default Blastchat template?<br><br>Post edited by: Prutkar, at: 2006/05/23 08:15
 
The topic has been locked.
Go to topPage: 12345