Some properties

[Mordac]

Can anyone help me out with which properties to change for the styling of the following problems?

I'm using an Omni theme but altered a lot.

1. In the user alerts, if I or any user clicks on the bell it looks fine. (See image 1) But when I hover over it, it turns black and one can't see the contents. (See image 2)

2. (I couldn't take a screen shot of this.) In the body of a message when I or a user mentions another user by using @username, the tab that pops up is black. one can't see the contents.

I've been trying to find which properties to change but have come up black despite a very extensive search.

 

[jim]

You'll need to hover over the black area and inspect it and get the class.

li.menu-row.menu-row--separated.menu-row--clickable.menu-row--alt:hover {
    background: transparent;  /*Or the add a color that fits*/
}

Your class element might be different depending on the theme your using.

You need to add :hover at the end of the class in less.

 

[Mordac]

You'll need to hover over the black area and inspect it and get the class.

View attachment 27777

li.menu-row.menu-row--separated.menu-row--clickable.menu-row--alt:hover {
    background: transparent;  /*Or the add a color that fits*/
}

Your class element might be different depending on the theme your using.

You need to add :hover at the end of the class in less.

jimThanks. You mean "Less"in templates? I don't have any such property but when I check the properties in the browser by inspecting the element, it says blocklink (actaully "fauxBlockLink-blocklink") and there is a property for "core_blocklink.less" and in there a property for "hover" which is empty but for
&:hover
{
text-decoration: none;
}

Adding another CSS property "hover:" might work? So for example,

&:hover
{
text-decoration: none;
background = rgb(124, 37, 37);
}

might work?

 

[jim]

Thanks. You mean "Less"in templates? I don't have any such property but when I check the properties in the browser by inspecting the element, it says blocklink (actaully "fauxBlockLink-blocklink") and there is a property for "core_blocklink.less" and in there a property for "hover" which is empty but for
&:hover
{
text-decoration: none;
}

Adding another CSS property "hover:" might work? So for example,

&:hover
{
text-decoration: none;
background = rgb(124, 37, 37);
}

might work?

MordacYou can try yes. but If it doesn't work try adding it into PAGE_CONTAINER template.

<style>
    &:hover { text-decoration: none; background =background: #ffffff; }
</style>

but I would use

<style>
    li.alert.js-alert.menu-row.menu-row--separated.menu-row--clickable {background: #ffffff;}
</style>

<style>
    li.alert.js-alert.menu-row.menu-row--separated.menu-row--clickable:hover {background: #ffffff;}
</style>

 

[Mordac]

You can try yes. but If it doesn't work try adding it into PAGE_CONTAINER template.

<style>
    &:hover { text-decoration: none; background =background: #ffffff; }
</style>

but I would use

<style>
    li.alert.js-alert.menu-row.menu-row--separated.menu-row--clickable {background: #ffffff;}
</style>

<style>
    li.alert.js-alert.menu-row.menu-row--separated.menu-row--clickable:hover {background: #ffffff;}
</style>

jimUnderstood. the second one in the PAGE_CONTAINER template?

 

[jim]

Understood. the second one in the PAGE_CONTAINER template?

Mordacyes

 

[Mordac]

yes

jimWorked! Thanks a lot.

I wonder if I could trouble you about: In the body of a message when I or a user mentions another user by using @username, the tab that pops up is black. one can't see the contents.

 

[jim]

Worked! Thanks a lot.

I wonder if I could trouble you about: In the body of a message when I or a user mentions another user by using @username, the tab that pops up is black. one can't see the contents.

MordacSure, mention me on your forum so I can check it out my username is jimmy5.

 

[Mordac]

Sure, mention me on your forum so I can check it out my username is jimmy5.

jimDone but not sure how that will help. If you mention me or anyone using the @jim (@username) tag, you will see the problem. The background color and the text color is black. Like it was for the alert when hovered over.