CSS Back End On Product pop up

  • Posts: 440
  • Thank you received: 20
  • Hikashop Essential
3 years 6 months ago #335480

Hi

I have a site which has a dark background so the text has been set as white by adding the following

#hikashop_product_right_part {color:#fff;}
I also hade to add additional css rules such as
.hikashop_product_name_main {font-size:1.3rem;color:#fff;}
&
.hikashop_product_custom_eta_line {font-family:Alpaca; color: #fff; font-weight:bold;}
to display white text.
The issue is with the back end and the pop up for products on customer orders as the text is white and cannot be seen, screenshots attached. I have tried adding it to the backend css #hikashop_product_right_part {color:#000!important;} but this hasn't made any difference.

I would appreciate some guidance please?

Thanks

David

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 4816
  • Thank you received: 654
  • MODERATOR
3 years 6 months ago #335482

Hello,

Your popup is display in your backend product page container, that's why when you elaborate a general selector (container class) it's normal your command css impact "all" in this container.

And so, sometimes you have to add another css command, like this by example :

.produxt_backend_page_class .popup_class {
    color: black;
}

Hope this will help you.
Regards

Last edit: 3 years 6 months ago by Philip.

Please Log in or Create an account to join the conversation.

  • Posts: 440
  • Thank you received: 20
  • Hikashop Essential
3 years 6 months ago #335502

Hi

can you please be a bit more specific such as which class is the pop up. The one I refer too is the when you click on a product in the customer orders.

Thanks

David

Please Log in or Create an account to join the conversation.

  • Posts: 4816
  • Thank you received: 654
  • MODERATOR
3 years 6 months ago #335504

Hello,

Yes, in your case this must be the class "vex-content" but maybe you have change some settings.
And so, in this kind of case it's better to use the navigator's inspector tool, follow me step by step :
1. Point your element and right-click
2. Select inspect, or inspector tool
3. You will see your html (and the css) :

alt


Hope this will be useful for this issue and later.
Regards

Last edit: 3 years 6 months ago by Philip.

Please Log in or Create an account to join the conversation.

  • Posts: 440
  • Thank you received: 20
  • Hikashop Essential
3 years 6 months ago #335526

Hi Philip

I have checked this and the code has not been changed for that class.

.vex.vex-theme-default .vex-content {

    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    font-family: "Helvetica Neue", sans-serif;
    background: white;
    color: #444;
    padding: 1em;
    position: relative;
    margin: 0 auto;
    max-width: 100%;
    width: 450px;
    font-size: 1.1em;
    line-height: 1.5em;

I have this for the front end
#hikashop_product_description_main {

    color: #fff;

}

I would have hoped that by applying the same code to the back-end CSS and changing the colour it would be fixed? I have even changed this to .hikashop_product_description_main but the text is still white

Thanks

David

Please Log in or Create an account to join the conversation.

  • Posts: 4816
  • Thank you received: 654
  • MODERATOR
3 years 6 months ago #335530

Hello,

Let's save time, provide a backend access please, because unless your Css selector haven't enough priority, I don't really understand what's blocking you.
Can you provide a backend url & user backend references (with maximum acl).
Awaiting your elements to be able to progress on your subject.

Regards

Last edit: 3 years 6 months ago by Philip.

Please Log in or Create an account to join the conversation.

  • Posts: 440
  • Thank you received: 20
  • Hikashop Essential
3 years 6 months ago #335557

Hi Philip

I have sent the info via the contact form with a reference to this post.

Thanks

David

Please Log in or Create an account to join the conversation.

  • Posts: 4816
  • Thank you received: 654
  • MODERATOR
3 years 6 months ago #335559

Hello,

I have process the custom, I let you have a look at it, the small subtlety that escaped me is that this customization had to be placed in the Frontend css file and not that of the backend ...

I add this code, at the end of your "frontend_custom.css" :

/* BACKEND CUSTOM for product popup in order view */
.contentpane.modal div#hikashop_product_description_main {
	color: #000 !important;
}

Hope this will fit your needs and expectations.
Regards

Last edit: 3 years 6 months ago by Philip.
The following user(s) said Thank You: davec

Please Log in or Create an account to join the conversation.

Time to create page: 0.068 seconds
Powered by Kunena Forum