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.

Add a Hoverable Div to Toolbar

View previous topic View next topic Go down

Solved Add a Hoverable Div to Toolbar

Post by Valoish on January 4th 2017, 8:25 pm

Technical Details


Forum version : #phpBB2
Position : Founder
Concerned browser(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari
Screenshot of problem : http://image.prntscr.com/image/7beb0c06b4ad453da2439e5823d22854.png
Who the problem concerns : All members
When the problem appeared : Today
Forum link : http://www.canvasforums.com

Description of problem

I would like to add a small div that will contain the text "CanvasForums" on the left side of the Toolbar (See screenshot).
It'd just be a plain div with a background color and text color that will change colors when someone hovers over it. I'm assuming this needs to be added in the templates, but I'm not sure where..


Last edited by Valoish on January 8th 2017, 5:04 am; edited 1 time in total
avatar
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by SLGray on January 4th 2017, 10:08 pm

Did you use credits to remove the Forumotion link from the toolbar? If no, you need to remove the code, cause it is against the Terms of Service.


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

avatar
SLGray
Administrator
Administrator

Male Posts : 40909
Reputation : 2777
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by Valoish on January 4th 2017, 10:14 pm

@SLGray; If you mean this then yes c: Hae handles the credits of the forum so if that's not it, I'll PM and ask o;
avatar
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by SLGray on January 4th 2017, 10:19 pm

That is correct.

You do know that after removing the copyrights with credits, you can add your own link and image there.

AP > Modules > Toolbar


Last edited by SLGray on January 4th 2017, 10:25 pm; edited 1 time in total


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

avatar
SLGray
Administrator
Administrator

Male Posts : 40909
Reputation : 2777
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by Valoish on January 4th 2017, 10:24 pm

Would I be able to style that link using CSS afterwards? o;
avatar
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by SLGray on January 4th 2017, 10:26 pm

I believe so.


Code:
#fa_toolbar #fa_service


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

avatar
SLGray
Administrator
Administrator

Male Posts : 40909
Reputation : 2777
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by Valoish on January 4th 2017, 10:31 pm

Woo, awesome~! It works :3
Now if I wanna style the link to it I'd just use
Code:
#fa_toolbar #fa_service a {}

#fa_toolbar #fa_service a:hover {}
right?
avatar
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by SLGray on January 4th 2017, 10:36 pm

I believe so.


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

avatar
SLGray
Administrator
Administrator

Male Posts : 40909
Reputation : 2777
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by Valoish on January 4th 2017, 10:43 pm

Nope that doesn't work >< I can style the background and text color using this CSS:
Code:
    #fa_toolbar #fa_service {
    position: absolute;
    top: 0;
    left: 0;
    color: #fff !important;
    background-color: #77c4ff;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 2.5px;
    padding: 8.5px 16px;
    margin: 0!important;
    }

But whenever I try to target the link to remove the underline and stuff, it doesn't work..
I've tried using the following selectors and none worked:
Code:
#fa_toolbar a#fa_service:hover {
    text-decoration: none; }

#fa_toolbar #fa_service a:hover {
    text-decoration: none; }
avatar
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by SLGray on January 4th 2017, 10:48 pm

Add !important.


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

avatar
SLGray
Administrator
Administrator

Male Posts : 40909
Reputation : 2777
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by Valoish on January 4th 2017, 10:53 pm

I've tried that and it didn't work either ><
avatar
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by SLGray on January 4th 2017, 10:55 pm

Add it to the top of the stylesheet.


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

avatar
SLGray
Administrator
Administrator

Male Posts : 40909
Reputation : 2777
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by Valoish on January 4th 2017, 10:58 pm

Nope, still doesnt work xD
avatar
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by Valoish on January 8th 2017, 5:04 am

Figured it out~ c:
This can be locked and archived now
avatar
Valoish
Forumember

Female Posts : 291
Reputation : 54
Language : English
Location : NYC

http://www.canvastutorials.org/

Back to top Go down

Solved Re: Add a Hoverable Div to Toolbar

Post by APE on January 8th 2017, 7:25 pm

Problem solved & topic archived.
Please read our forum rules: ESF General Rules



avatar
APE
Manager
Manager

Male Posts : 11061
Reputation : 1036
Language : fluent in dork / mumbojumbo & English haha
Location : STUCK IN FORUMOTIONS SERVERS HELP ME !!!!!!

http://chatworld.forumotion.co.uk/

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