The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

FM Toolbar Drop-Down Menu Editing.

View previous topic View next topic Go down

Solved FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 22nd 2014, 2:48 pm

First off sorry for the long and kind of confusing title...

Okay so I have a quick question about the editing of the FM toolbar, specifically the drop down menu(s). I am using a code (posted below) which modifies the user menu and notification drop-downs. Anyway it works wonderfully. However I noticed that in editing the 'color' part in the first little section of code to change the writing, well it only seems to effect the writing of the Notifications drop down. Really only the part where it says 'see all the notifications'. Now the forum I am working on this for has a dark theme and so the background color is dark. However that makes some of the text hard to see... and I dont think the blue color for links looks very good with it. Is there something more I could add to the code to change the color of the links and the dark text? I tried fiddling a little bit but received no results.

I hope the pictures below show what I mean.

I actually figured out how to change the Rank shortly after taking this screen shot but I still need to change the Post/PM part and if possible change the blue color of the links. Also the rank is still that dark color when you hover over it so if there is maybe some way of fixing that... that would be more than awesome.

And as you can see in the next little clip things are dark in the notification list here also... the light blue/grey color of the "See all the notifications" is the color I was aiming for. That small bit of text is the only thing that changed however.


And this is the code I am using.

Code:
li.see_all, li.see_all a{
color:#7B8695 !important;
background-color:transparent !important;
}
#fa_toolbar #fa_right #notif_list li.unread{
background-color:transparent !important;
}
ul#notif_list, ul#fa_menulist{
background-color:#070707 !important;
border:none !important;
border-radius:10px;
margin-top:5px !important;
box-shadow:0px 3px 6px rgba(26, 26, 26, 0.6);
}
ul#fa_menulist{
background-image:url('');
background-repeat:no-repeat;
background-position:right;
}
#fa_usermenu {
border-right:1px solid #CCC;
padding-right:5px !important;
max-height:90%;
height:auto;
min-height:0%;
}

This is the code I added to the end of that original code to edit the rank in the usermenu place... But like I said it is still that grey color when I hover over it.

Code:
#fa_ranktitle {
color: #ffffff;
font-family: Trebuchet MS;
font-size: 9px;
width: 120px;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

I hope everyone can understand what I am asking clear enough...

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Ange Tuteur on February 22nd 2014, 9:28 pm

Hello Selvester,

You can try using this CSS to color those elements :
Code:
/* menulist user details */
#fa_usermenu { color:#f00; }

/* menulist links */
#fa_menulist :link, #fa_menulist :visited { color:#f00 !important; }

/* notifications */
#notif_list .contentText.ellipsis { color:#f00; }

If some of the above do not work, try adding important.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 23rd 2014, 2:18 pm

Hello Ange. And thank you.

I had actually tried the first two codes you listed but I had tried them without Important and it hadn't occurred to me to try them with. Anyway the ones for the user details and the notifications are now fixed. However the menu links are still unchanged...

But thank you for your assistance so far!

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Ange Tuteur on February 23rd 2014, 9:40 pm

Try this for the links :
Code:
#fa_menulist a:link, #fa_menulist a:visited  { color:red !important; }

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 24th 2014, 2:44 pm

Thank you so much! That fixed it for the user menu.

Now I hate to be a pain but is it possible to change the colors for the links in the notification drop down as well? I have fiddled with that a bit after fixing the user menu ones hoping I wouldn't have to pester anyone anymore... But I can't seem to get it.

But again thank you so much for your help so far!

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Pizza Boi on February 24th 2014, 2:50 pm

@Selvester wrote:Thank you so much! That fixed it for the user menu.

Now I hate to be a pain but is it possible to change the colors for the links in the notification drop down as well? I have fiddled with that a bit after fixing the user menu ones hoping I wouldn't have to pester anyone anymore... But I can't seem to get it.

But again thank you so much for your help so far!

Hi Very Happy

Just add vlink in the css Smile.

Regards,
Pizza Boi

P.S. I have not encountered the problem you have, but I hope that adding vlink or at least hover, like this would work:

Code:
#fa_menulist a:hover

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 24th 2014, 3:53 pm

I am sorry but how would I go about adding vlink? I have never used that particular attribute before. I am guessing it is not a selector right? Could you just be a little more specific. Sorry...

Also I have fixed this with the user menu with the code Ange provided. I am currently trying to edit the notifications list. And I believe the #fa_menulist only effects the user menu? Confused

See here:



The links are that soft grey blue color... thats what I want. I am trying to get that for the Notifications but still I have that original darker blue color seen below...


Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Pizza Boi on February 24th 2014, 4:49 pm

Hi Very Happy

Hi, I'm not sure if I managed to get the right ID, but try this code please:

Code:
#notif_list {
font-color: color;
}

Or you can start it with the a or link attribute Smile. Try checking your console to check on the ID and then replace the one in the code above. This is the link color change I'm mentioning, but these are just examples:

Code:
a:link {text-decoration:none;
font-color: color;}
a:visited {text-decoration:none;
font-color: color;}
a:hover {text-decoration:underline;
font-color: color; opacity: # ;}
a:active {text-decoration:underline;
font-color: color;}

You can also change the 'font-color' to just 'color' if it would work that way Smile.

Hope this helps!

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 24th 2014, 5:01 pm

Hello. (:

#notif_list should be the right selector. It has worked on editing previous parts of it. However I am afraid the above code you provided is of no help.
I had already tried the #notif_list with the a:link and a:visited. Basically just taking the previous code Ange provided and replacing the #fa_menulist with the #notif_list and I got no results.

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Pizza Boi on February 24th 2014, 5:05 pm

Hi Very Happy

Can you please provide me with the test account you used in the screen shot so I can find a solution if possible?

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 24th 2014, 5:17 pm

Certainly. Just give me a few moments to do so.

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Pizza Boi on February 24th 2014, 7:11 pm

Hi Very Happy

Well, it seems like there's no link notifications for me to look at an ID at, but I did manage to reproduce something similar to that in a forum.

Try these ID's: .content or/and .contentText ellipsis

Hopefully, at least one of them works =x.

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 24th 2014, 7:19 pm

Thank you for trying but I can tell you now thats not going to help. That was in Ange's first suggestion.

Code:
/* notifications */
#notif_list .contentText.ellipsis { color:#f00; }

And that works but it changes the regular text color to white. It does not effect the link color however. As you can see below.

Before the code:



After the code:


Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Pizza Boi on February 24th 2014, 7:28 pm

Hi Very Happy

Okay, this will be my last attempt T_T. -Fingers crossed-

Try this ID: #fa_toolbar a:link

I saw that Ange suggested menulist, try changing it into the whole Toolbar, but if ever, I'm pretty sure all the links in the Toolbar would change to a different color...

Anyway, sorry if I couldn't solve this Sad.

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 24th 2014, 7:58 pm

Alright. I shall try that. I would be alright with all the links changing to the same color if that does end up happening. I will update in a moment to let you know if it works. If not thanks for trying anyway. (:

Update: Thanks for trying but that didn't work either. It changed the ones in the user menu (I only know they were the ones to change as I put red as the test color) but it left the notification ones untouched. >.<

I am starting to half believe those ones can't be changed... :/

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by SLGray on February 24th 2014, 8:29 pm

Send me a pm so I can test a code for you.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36618
Reputation : 2439
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 24th 2014, 9:15 pm

Will do SLGray. And thank you for trying to help. (:

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by SLGray on February 24th 2014, 9:36 pm

Thanks.

Try this:
Code:
#fa_toolbar #fa_right #notif_list li .contentText {
    color: YOUR COLOR !important;
}


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36618
Reputation : 2439
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 24th 2014, 9:50 pm

Thank you for trying but still no.
It changed the regular text, which I had already done, rather than the linked text. ):

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by SLGray on February 24th 2014, 9:51 pm

Send me another pm.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36618
Reputation : 2439
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 24th 2014, 10:41 pm

PM Sent. (:

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Ange Tuteur on February 24th 2014, 11:44 pm

The inline stylesheet for the FA toolbar is overriding the Admin Panel stylesheet style. You can override that sheet by using the homepage message to create a new inline stylesheet.

Administration Panel > Display > Homepage > Generalities

Add the following into the homepage message and save.
Code:
<style>#fa_toolbar #fa_right #notif_list li .contentText a { color: #f00 !important; }
.panel.introduction { display:none; /* hide the homepage message */ }</style>

If you're using the homepage message to inform users, make the last rule in the inline style a comment, and change it back to hide the panel.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Selvester on February 25th 2014, 12:25 am

Thank you so much Ange! You have been so helpful as always!

That worked perfectly! This is finally solved!

Selvester
Forumember

Female Posts : 255
Reputation : 10
Language : English, French (little bit)

http://rp-central.forumotion.com

Back to top Go down

Solved Re: FM Toolbar Drop-Down Menu Editing.

Post by Ange Tuteur on February 25th 2014, 12:28 am

You're welcome I love you

Topic solved and archived

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


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