Jump to content

Community

mdPanel - Material Design IPS Theme [ support topic ]


TAMAN
 Share

Recommended Posts

Just now, DanLemX said:

how to select the icons for menu navigation? Say I have custom links, and want to chose my own icon. 

Simple,

Say your custom link is named Activity

You can change the menu icon by targeting the menu text like this

[data-navtitle="Activity"] .ta_navIcon:before {
	content: "\f080"; /*  This is font awesome icon unicod https://fontawesome.com/v4.7.0/icons  */
}

 

Link to comment
Share on other sites

@TAMAN Using this the on a bilingual site, adjusting the menu icons for the english menu works fine but it does not work for the french menu. Here is an exempleof what I added in my custom.css for the browse menu:

[data-navtitle="Browse"] .ta_navIcon:before {
	content: "\f21a"; /*  This is font awesome icon unicod https://fontawesome.com/v4.7.0/icons  */
}
[data-navtitle="Navigation"] .ta_navIcon:before {
	content: "\f21a"; /*  This is font awesome icon unicod https://fontawesome.com/v4.7.0/icons  */
}

Am I missing anything?

Link to comment
Share on other sites

Just now, Steph40 said:

@TAMAN Using this the on a bilingual site, adjusting the menu icons for the english menu works fine but it does not work for the french menu. Here is an exempleof what I added in my custom.css for the browse menu:


[data-navtitle="Browse"] .ta_navIcon:before {
	content: "\f21a"; /*  This is font awesome icon unicod https://fontawesome.com/v4.7.0/icons  */
}
[data-navtitle="Navigation"] .ta_navIcon:before {
	content: "\f21a"; /*  This is font awesome icon unicod https://fontawesome.com/v4.7.0/icons  */
}

Am I missing anything?

its normal, by default, all menus uses the default icon which is this 55eb7d1ea25019eb5fcd3ea1aed5d0a0.png 

to change the menu icon you need to target the menu by its text. so i have optionally changed ALL default IPS and application menu icons by targeting the english menus 

 

In your code

[data-navtitle="Browse"] .ta_navIcon:before{
	content: "\f21a"; /*  This is font awesome icon unicod https://fontawesome.com/v4.7.0/icons  */
}
[data-navtitle="Navigation"] .ta_navIcon:before{
	content: "\f21a"; /*  This is font awesome icon unicod https://fontawesome.com/v4.7.0/icons  */
}

Simply, change the Browse, and Navigation text in the css to whatever it shows in your site ? 

 

If your site is multi language 

then change the menu icons like this

[data-navtitle="Browse"] .ta_navIcon:before,
[data-navtitle="What is Browse in french?"] .ta_navIcon:before {
	content: "\f21a"; /*  This is font awesome icon unicod https://fontawesome.com/v4.7.0/icons  */
}
[data-navtitle="What is Navigation in french?"] .ta_navIcon:before{
	content: "\f21a"; /*  This is font awesome icon unicod https://fontawesome.com/v4.7.0/icons  */
}

simple 

Edited by TAMAN
Link to comment
Share on other sites

11 minutes ago, TAMAN said:

I think i gave you a custom css with a message about this?

just use that, I might edit this for next version 

Yes, you did. The CSS you gave me was for Magnum theme though and doesn't seem to work on mdPanel:

[data-pagemodule="gallery"] header>#elBlogHeaderStats {
    background: #222 !important;
    color: #fff !important;
}

 

Link to comment
Share on other sites

Just now, Josiah Wallingford said:

Ah, now the mouseover text when hovering over menu buttons is below the menu.

Re-download again.

 

Just now, Josiah Wallingford said:

Yes, you did. The CSS you gave me was for Magnum theme though and doesn't seem to work on mdPanel:


[data-pagemodule="gallery"] header>#elBlogHeaderStats {
    background: #222 !important;
    color: #fff !important;
}

 

i dont think this is the one ? this changes the status background and colors 

any link to check?

Edited by TAMAN
Link to comment
Share on other sites

2 minutes ago, Josiah Wallingford said:

Yes, you did. The CSS you gave me was for Magnum theme though and doesn't seem to work on mdPanel:


[data-pagemodule="gallery"] header>#elBlogHeaderStats {
    background: #222 !important;
    color: #fff !important;
}

 

Correction. I found the missing part from the conversation.

In case anybody else is having this issue. Here is the full css that works:

}
header>#elBlogHeaderStats {
    background: #222 !important;
    color: #fff !important;
}
[data-pagemodule="gallery"] header>#elBlogHeaderStats {
    background: #222 !important;
    color: #fff !important;
}

 

Just now, TAMAN said:

Re-download again.

 

i dont think this is the one ? this changes the status background and colors 

Yeah, we had to do that because the first change in the css made the status background and color look off. I think that is what happened anyway.

Link to comment
Share on other sites

Just now, Josiah Wallingford said:

In case anybody else is having this issue. Here is the full css that works:

This is not problem, it doesnt causes any issues. 

just some solid colors added by ips, change or not is all optional it has nothing to due the theme

but again. i might remove the colors on next version 

Link to comment
Share on other sites

Just now, Josiah Wallingford said:

Minor Bug?:

The P in Promote on the Promote button is right on the line between the two colors.

Promote.png.b6da44d267902fed8e1f31e488873912.png

Does it happen with default theme? if so then you might want to report to ips

 

Just now, Josiah Wallingford said:

What controls the arrow color? It looks fine on my other color scheme themes but this one for some reason blends until moused over.

it is a mixed color between User bar font color & important button background color.

You probably have userbar background color same as Important button background color thats why, this is not a good idea because there is also sign up button in userbar that uses important background color. 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...

Important Information

We use technologies, such as cookies, to customise content and advertising, to provide social media features and to analyse traffic to the site. We also share information about your use of our site with our trusted social media, advertising and analytics partners. See more about cookies and our Privacy Policy