IMPORTANT

FM Design is in read-only mode, please click here for more information.

Latest topics
» Forumactif Edge - Releases
by Ange Tuteur Tue 09 Oct 2018, 11:34

» Forum Closure
by Ange Tuteur Mon 01 Jan 2018, 01:28

» Chit Chat Thread
by Valoish Sun 31 Dec 2017, 19:15

» Font/Text background color.
by Valoish Sun 31 Dec 2017, 19:11

» Forumactif Messenger - Instant Message Application for Forumotion
by Wolfuryo Sun 31 Dec 2017, 18:24

» [GAME] Count to One Million!
by brandon_g Fri 29 Dec 2017, 18:58

» Post Cards
by manikbiradar Wed 20 Dec 2017, 07:50

» [GAME] Countdown from 200,000
by Valoish Wed 13 Dec 2017, 23:22

» GeekPolice Tech Support Forums - GeekPolice.net
by Dr Jay Mon 11 Dec 2017, 19:12

» Asking about some plugin for Forumotion
by Dr Jay Mon 11 Dec 2017, 19:10

» [GAME] What are you thinking right now?
by Van-Helsing Sat 09 Dec 2017, 14:51

» Widget : Similar topics
by ranbac Wed 06 Dec 2017, 18:11

» Change the Background of the Forum and put an image and how to make prefixs?
by Clement Wed 06 Dec 2017, 15:19

» Hello from Western Australia
by SarkZKalie Wed 06 Dec 2017, 05:34

» Numbering of messages in the topic
by SLGray Mon 04 Dec 2017, 22:40

Recent Tutorials
Top posting users this month

Who is online?
In total there are 7 users online :: 0 Registered, 0 Hidden and 7 Guests :: 1 Bot

None

[ View the whole list ]


Most users ever online was 172 on Fri 19 Feb 2016, 05:17

Re-Styling a chatbox with CSS from scratch

Page 1 of 2 1, 2  Next

View previous topic View next topic Go down

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Mon 09 Mar 2015, 15:29

Heelo,

So I was using a custom styled AWC Chatbox before FM'S updates to the chatbox. After their updates it pushed the buttons out of view and hid them. It was styled using 'px' which I hear (even from coders and webmasters of paid sites) that 'px' can be a pain to use. I thought after playing with it for awhile that it should be re-styled by hand myself using 'cm' and/or 'mm'. So my question here today is more is if I can seek pointers, advice and helpful suggestions on how I can go about this


I would like it to look similar to how it was before the updates (like in this screenshot):


but I would like the code styling to be 'cm' or 'mm' which much easier to work with.

This is my 1st time trying to style anything by hand with CSS but I hope that this project can help me learn and pick things up quicker.

Css and other things available upon request and a test forum is available to style it on. Smile

Any help would be appericated and thanked greatly.

-Brandon
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Tue 10 Mar 2015, 08:39

If you have experience designing with CSS and a basic knowledge of the DOM, it'd make things a lot easier. I'd recommend reading through this if you haven't : http://www.w3schools.com/css/default.asp It's pretty good for beginners.

I've not spent time with the newer versions of AWC, so I can't really tell you what effects what. The best thing to do would be to use your browser's developer tools to inspect the DOM and find a class or ID to style the element.

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Tue 10 Mar 2015, 09:20

Ok thanks I will read through that Ange,

If I provided the CSS I used before would this give you a better idea of the effects and what is what and what not?
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Wed 11 Mar 2015, 01:11

Not entirely. CSS is just a set of style rules for HTML elements. I'd need to visually know what elements the selectors affect. Here's a rundown of the process of getting a selector from an element in the DOM :

1. Open the tools F12 or dev tools from a menu
2. Go to the DOM inspector and click select element to choose an element from the screen
3. Traverse the DOM to find the element and analyze its attributes
4. Create a style rule from the elements attributes by class, tag, id, etc...



I'd actually write the CSS in the Style Editor, but I needed an extra window to show a CSS example.

I was planning to take the latest AWC for a spin, but at the moment I'm working on a few projects and also studying. I'll get to it though, there's no rush.. Razz

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Wed 11 Mar 2015, 06:45

@Ange Tuteur wrote:Not entirely. CSS is just a set of style rules for HTML elements. I'd need to visually know what elements the selectors affect. Here's a rundown of the process of getting a selector from an element in the DOM :

1. Open the tools F12 or dev tools from a menu
2. Go to the DOM inspector and click select element to choose an element from the screen
3. Traverse the DOM to find the element and analyze its attributes
4. Create a style rule from the elements attributes by class, tag, id, etc...



I'd actually write the CSS in the Style Editor, but I needed an extra window to show a CSS example.

I was planning to take the latest AWC for a spin, but at the moment I'm working on a few projects and also studying. I'll get to it though, there's no rush.. Razz

Hmm.. ok I will see what I can do.
avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Wed 11 Mar 2015, 09:25

Hello,
Please note that the custom CSS is no longer in the acp, i removed it, I do not know if this will effect Dev tools or not, but i copy what I got in Dev tools for you.

Here is a screen shot of the Developer tools for you (from a Chrome book):


Let me know if this helps any. Or if you need anything in particular. But I tried Neutral I do not know much about Developer tools.

But again please note I removed the css that was in there before and replaced it with the standard AWC CSS. If you need the exact code for the CSS that I had before let me know, I will get it.
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Wed 11 Mar 2015, 16:36

I can go by the first post image when I use Avacweb chat. It's pretty simple and flat to be honest. Mostly including these properties :

color:#FFF;
background:#038BC9;
border:1px solid #FFF

Then some blacks for the background it looks like.

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Wed 11 Mar 2015, 17:34

Oh ok, but do you think from this information we can get the chatbox look like this:


I can provide the previous css styling if it can help any. The above screenshot was taken after the css styling was removed.

Thanks for all so far,
-Brandon
avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Fri 13 Mar 2015, 10:39

@brandon_g wrote:Oh ok, but do you think from this information we can get the chatbox look like this:


I can provide the previous css styling if it can help any. The above screenshot was taken after the css styling was removed.

Thanks for all so far,
-Brandon

If you need the css I will get it for you as soon as my tablet decides to connect to the wifi at my house (I hope it will be today or at least very soon). Just let me know if you need it or anything else.
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Fri 13 Mar 2015, 17:14

Sorry, I was busy yesterday. Try this :
Code:
.achat_button, #awc_userlist h4.member-title {
  color:#FFF !important;
  font-weight:bold !important;
  border:1px solid #FFF !important;
  background:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
}
#awc_header, #awc_footer, #awc_userlist h4.member-title, #avacweb_chat_button { background:#038BC9 !important }
#awc_userlist h4.member-title {
  border-radius:6px !important;
  margin:3px !important;
}
#awc_userlist, #awc_rightbox, #awc_message {
  color:#FFF !important;
  background:#444 !important;
  box-shadow:none !important;
}
.achat_row,#awc_tabs {
  background:none !important;
  border:none !important;
}

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Fri 13 Mar 2015, 17:36

Wow that pretty much hit the nail on the head! Nice thanks Ange... now say I ever wanted to edit this design or if something breaks again, what would be the easiest way for myself to fix it?

What I mean is, if the code ever needed tweaking for any reason what does what so I know what to fix or adjust.

Thanks again so much!
-Brandon
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Fri 13 Mar 2015, 21:01

Honestly ? If you've no experience in CSS or exploring the DOM to find what does what, you're going to have a tough time trying to do things yourself. I do however, think that the selectors in the style rules provide a pretty explicit description of what they do.

For example :
The class .achat_button affects the buttons.

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Fri 13 Mar 2015, 21:50

Hey! I am working on it! I have been watching youtube videos and studying on w3schools and I know a little bit of stuff.

For example
Code:
h1 {
      background-color= #00FF0C;
}
Will give you a greenish background color. I am slowly getting it, I just wanted to make sure is all. Very Happy


(Also do not forget I do 90% of things on my tablet nowadays since the pc here is slower then a snail in quick sand Razz, the tablet does not have a DOM that I know of, that screenshot I had to take from the school computer. Neutral)

Thank you for everything.

I really appericate it very much Ange Smile.
-Brandon
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Sun 15 Mar 2015, 15:45

I'm only being honest.. Mr. Green

I have a small correction for your rule above.
Code:
background-color= #00FF0C;

Property values aren't assigned using the = operator in CSS. They're assigned with a colon.
Code:
background-color: #00FF0C;

The DOM ( Document Object Model ) is pretty much a tree of HTML elements created when a webpage is loaded. So technically, any web browser has an HTML DOM.

For learning web development, simply take it at your own pace. Start with HTML, go to CSS, and then JavaScript. There's no need to rush, otherwise you can end up missing important points. Furthermore, you should always study from different sources and refresh your mind once in awhile, because there can always be something you've missed. Rereading is an excellent way, but practicing by creating your own documents, scripts, etc.. is essential.

I didn't learn what I know over night, it's been almost 2 years I've been studying and I still am. Wink

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Sun 15 Mar 2015, 15:57

Yeah that is true Ange, I may try playing around with the styling for the chatbox on my test forum, see what I can accomplish. I suppose I should put the styling on my main forum 1st though before I start playing with it. Very Happy

I catching on to it slowly, there are so many little rules that do so many things that it can take awhile. Honestly I think I am learning rather quickly as well, because when I came back in December I knew nada (or had pretty much forgotten most of it) about the acp besides how to add, remove or modify forums and categories. I re-learned that really quick, now I have begun learning the coding ways a bit, html is pretty stright forward, if you do not know something simply try one thing and if that does work try another. Very Happy

Thanks for all the help so far!

-Brandon
avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Sun 22 Mar 2015, 19:10

@brandon_g wrote:Oh ok, but do you think from this information we can get the chatbox look like this:


I can provide the previous css styling if it can help any. The above screenshot was taken after the css styling was removed.

Thanks for all so far,
-Brandon

Which part can I use to change the background of the chatting area (see how the above image has a black one)?

I tried fiddling around with different think in it including .chat_button but only managed to chat the outside border of the chat to black.


What I have tried:

I have tried playing with the .chat_button and only managed to change the border outside the chatting area.
I tried also playing around with #awc_header and the line below it that says { background: #038B09}
And got no result.

I am trying to change it the chatting area background color (where the text is displayed) to #0000 .

I have tried these experiments on my test forum. http://www.testingduo.forumotion.com

Thanks for all help so far,
-Brandon
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Mon 23 Mar 2015, 20:12

#awc_rightbox for the chatbox and #awc_userlist for the memberlist.

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Tue 24 Mar 2015, 09:11

Ok I tried changing it on my test forum. No result Sad.

The CSS for #awc_rightbox is:
Code:
#awc_userlist, #awc_rightbox, #awc_message {
  color:#000000 !important;
  background:#000000 !important;
  box-shadow:none !important;
}

I have also included in the one below when I tried experimenting with #chat_row
Code:
#awc_userlist, #awc_rightbox, #awc_message {
  color:#000000 !important;
  background:#000000 !important;
  box-shadow:none !important;
}
.achat_row,#awc_tabs {
  background: #000000 !important;
  border:none !important;
}

Is there anything else I can try?

Thanks for all the help so far,
-Brandon
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Wed 25 Mar 2015, 22:33

Do you have CSS to modify the chatbox already in your stylesheet ? If so, remove it or modify it.

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Thu 26 Mar 2015, 07:00

The only other thing added is the standard css to keep pm's private and a tiny line to make the default text color gray (otherwise the text is nearly impossible to read without sun glasses).

-Brandon
avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Mon 30 Mar 2015, 12:48

Is that enough information?
If you need more let me know?

Any idea why it won't change the background? I will keep experimenting with it later today to see what else I can do with it.
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Tue 31 Mar 2015, 17:28

Sorry, I've been busy.

I thought the whole CSS I gave you before changed the background color to black. scratch

here : http://fmdesign.forumotion.com/t344-re-styling-a-chatbox-with-css-from-scratch#2610

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Tue 31 Mar 2015, 19:55

No, it didn't it changed everything else except the background.

You can see the AWC on my test forum in this screenshot: http://prntscr.com/6nxr9e

I had to ask LG how to make the default text color gray because it was so terrible and hard to read.

-Brandon
avatar
Ange Tuteur
Administrator
Gender : Male
Age : 23
Posts : 4736
Points : 10024
Reputation : 2369
Location : Macungie, PA
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
View user profile https://github.com/SethClydesdale https://twitter.com/sethc1995

PostAnge Tuteur on Wed 01 Apr 2015, 11:53

...that looks like the default avacweb skin scratch

Could I see your entire stylesheet for that forum ?

--------

Ange Tuteur
Tips and TricksContact Me

avatar
brandon_g

Gender : Unspecified
Age : 21
Posts : 458
Points : 2111
Reputation : 67
Location : USA
Language : English
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : phpBB2
View user profile http://broadcastingduo.forumotion.com

Postbrandon_g on Wed 01 Apr 2015, 12:09

Sure thing... here you go.... but the only other thing on there is for your database.

Code:
/* --- START DATABASE CP --- */
body.databaseBody { color:#666; font-size:11px; font-family:Verdana,Arial,Helvetica,sans-serif; background:#DEF; }
body.databaseBody a { text-decoration:none }
#db_wrap { background:#FFF; border:1px solid #CCC; width:80%; margin:40px auto; padding:3px; }
#db_wrap h1 { color:#479 !important; font-size:18px; border-bottom:1px solid #479; padding-bottom:3px; margin:3px 0; }
.database_table { background:#FFF; border:1px solid #CCC; border-spacing:0; width:100%; overflow:auto; }
.database_table a { background:none !important; display:inline-block; white-space:nowrap; overflow:hidden; max-width:100px; }
.database_table tr:nth-child(even) { background:#FFF }
.database_table tr:nth-child(odd) { background:#DDD }
.database_table tr:hover { background:#FFA }
.database_table td { border-right:1px solid #CCC; border-bottom:1px solid #CCC; padding:3px; }
.database_table tr.table_data { background:#EEE; box-shadow:0 10px 6px rgba(255,255,255,0.3) inset, 0 -10px 6px rgba(0,0,0,0.05) inset }
#db_list { background:#EEE; border:1px solid #CCC; float:left; width:150px; min-height:200px; padding:3px; margin-right:6px; }
#db_list .database { color:#999; text-shadow:1px 1px 0 #FFF; text-align:center; font-weight:bold; font-size:10px; background:none; border:1px solid #CCC; border-radius:3px; cursor:pointer; margin:3px 0; padding:3px; }
#db_list .database:hover { color:#479; border-color:#479; }
#db_list .database.dbactif { background:#DEF; color:#69B; border-color:#8BD; }
#db_tables { background:#EEE; border:1px solid #CCC; overflow-x:hidden; padding:3px; }
#innertable { height:400px; overflow:auto; }
.db_nav { text-align:right; background:#EEE; border:1px solid #CCC; padding:5px 3px; margin:6px 0; }
.db_nav a, .db_button, tr.table_data a { color:#999; text-shadow:1px 1px 0 #FFF; text-transform:uppercase; background:none; border:1px solid #CCC; border-radius:3px; display:inline-block; padding:3px 6px; margin:1px 3px; cursor:pointer; }
.db_nav a:hover, .db_button:hover, tr.table_data a:hover { color:#479; border-color:#479; }
.db_nav a:focus, .db_button:focus, tr.table_data a:focus { color:#8BD; border-color:#8BD; }
.db_title { color:#479; font-size:12px; font-weight:bold; border-bottom:1px solid #479; padding-bottom:3px; margin-bottom:3px; }
.db_info { color:#58A; text-shadow:1px 1px 0 #FFF; text-align:center; background-color:#DEF; border:1px solid #BCD; border-radius:3px; padding:5px 3px; margin:6px 3px; }
.db_erreur { color:#C66; font-size:12px; text-shadow:1px 1px 0 #FFF; font-weight:bold; height:20px; }
.db_overlay { background:rgba(0,0,0,0.3); position:fixed; top:0; left:0; right:0; bottom:0; z-index:999; }
.dbo_content { background:#EEE; border:1px solid #CCC; width:65%; height:50%; overflow:auto; padding:3px; position:absolute; top:20%; left:15%; }
.dbo_content.process { color:#996; text-shadow:1px 1px 0 #FFF; text-align:center; font-size:16px; font-weight:bold; width:30%; height:auto; padding:6px 24px; left:30%; top:40%; }
.db_textarea { color:#333; background:#FFF; border:1px solid #CCC; border-radius:3px; width:90% !important; height:50% !important; resize:none; display:block; padding:3px; margin:3px auto; }
.db_textarea:hover { border-color:#479 }
.db_textarea:focus { border-color:#8BD }
/* --- END DATABASE CP --- */
/* START fa_like */
.fa_like_row { margin-top:6px }
.fa_like_list { font-style:italic; min-height:25px; }
a.fa_like_button, .fa_like_button, .fa_liked { color:#FFF; font-size:10px; background:#6A6; border:1px solid #686; border-radius:3px; display:inline-block; padding:3px 6px; cursor:default; }
.fa_liked { cursor:default; opacity:0.3; }
a.fa_like_button:hover { background:#3A3; border:1px solid #383; cursor:pointer; }
/* END fa_like */

Code:
/* START Awc Styling */
    .a_chat_pm tr, .a_chat_pm td, .a_chat_tab tr, .a_chat_tab td {
        display:none!important;
    }
    .a_chat_pm:before, .a_chat_tab:before {
        content: 'Hidden Content';
        font-style: italic;
    }
    h4.away, h4.away + ul {
        display: none;
    }
.achat_row { color: gray; }
Code:
avacweb_chat_config.add_event('onload', function () {
  $(avacweb_chat.id('achat_color_button')).after('Smileys');
});
.achat_button, #awc_userlist h4.member-title {
  color:#000000 !important;
  font-weight:bold !important;
  border:1px solid #FFF !important;
  background:#000000 !important;
  box-shadow: #000000 !important;
  text-shadow:none !important;
}
#awc_header, #awc_footer, #awc_userlist h4.member-title, #avacweb_chat_button { background:#038BC9 !important }
#awc_userlist h4.member-title {
  border-radius:6px !important;
  margin:3px !important;
}
#awc_userlist, #awc_rightbox, #awc_message {
  color:#000000 !important;
  background:#000000 !important;
  box-shadow:none !important;
}
.achat_row,#awc_tabs {
  background: #000000 !important;
  border:none !important;
}
.bodyline {
border: 5px #868686 solid!important;
border-radius: 10px;
box-shadow: 0px 0px 15px #ffffff;
}
/* END of Awc styling */


Last edited by brandon_g on Sun 05 Apr 2015, 18:54; edited 1 time in total
Sponsored content

PostSponsored content

Page 1 of 2 1, 2  Next

View previous topic View next topic Back to top

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!


Create a new account

Log in

Already have an account? No problem, log in here.


Log in

 
Permissions in this forum:
You cannot reply to topics in this forum