*

Own Petz

  • ****
  • 171 posts
  • OwnPetz - Free Classified Ads. Buy, Sell or Adopt
How to Change Color of Top Menu in Mobile Theme
« on: June 20, 2024, 10:49:08 AM »
Hello,

Thanks for Your Previous help.

Can you please tell me How to Change Color of Top Menu (attached image) in Mobile Theme? It's light gray, not visible proberly... I want to change it to Dark Black or other color...


I have checked in style.css but not able to understand.... I have also checked this (https://docs.osclasspoint.com/customizations-of-theme-basic) but still not able to change


please suggest me how to change .

Thanks in Advance.
OwnPetz - Free Classified Ads. Buy, Sell or Adopt Online. https://ownpetz.com

*

MB Themes

Re: How to Change Color of Top Menu in Mobile Theme
« Reply #1 on: June 20, 2024, 10:54:39 AM »
Code: [Select]
body #mmenu {background:red;}
  To get fast support, we need following details: Detail description, URL to reproduce problem, Screenshots

*

Own Petz

  • ****
  • 171 posts
  • OwnPetz - Free Classified Ads. Buy, Sell or Adopt
Re: How to Change Color of Top Menu in Mobile Theme
« Reply #2 on: June 20, 2024, 11:36:45 AM »
Thanks for Reply..

I have to write this in style.css ??



In style.css - I have found this, where I have to change??


/* USER MOBILE MENU */
.user-button {cursor:pointer;transition:0.1s;float:left;clear:both;width:100%;height:44px;padding:13px 20px;font-size:16px;color:#fff;line-height:18px;background:#2b333e;position:relative;border-radius:4px;font-weight:500;margin:0;}
.user-button.opened {border-bottom-left-radius:0;border-bottom-right-radius:0;}
.user-button i.fa-angle-down {position:absolute;right:15px;top:12px;line-height:22px;font-size:22px;font-weight:normal;display:none;}
.user-button.opened i.fa-angle-down:before {content:"\f106";}

.user-button .lns {float:right;width:20px;height:14px;margin:2px 0px 2px 0;position:relative;}
.user-button .lns .ln {width:100%;opacity:1;position:absolute;top:0;height:2px;border-radius:3px;background:#fff;transition:0.3s;}
.user-button .lns .ln.ln1 {top:0px;}
.user-button .lns .ln.ln2 {top:6px;}
.user-button .lns .ln.ln3 {top:12px;}

.user-button.opened .lns .ln.ln1 {top:6px;transform:rotate(45deg);}
.user-button.opened .lns .ln.ln2 {opacity:0;}
.user-button.opened .lns .ln.ln3 {top:6px;transform:rotate(-45deg);}

/* MOBILE MENU */
#mmenu {position:fixed;top:0;height:50px;left:0;right:0;background:#fff;z-index:95;border-bottom:1px solid #ddd;padding:0 5px;}
#mmenu a {position:relative;float:left;width:20%;height:50px;padding:8px 3px 4px 3px;text-align:center;}
#mmenu a > span {display:inline-block;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:12px;line-height:11px;text-transform: capitalize;font-size: 9px;color: #aeb9c6;font-weight:bold;}
#mmenu a > i {position:relative;display:inline-block;width:24px;height:24px;line-height:24px;color:#aeb9c6;}
#mmenu a > svg {display:inline-block;width:24px;height:24px;fill:#aeb9c6;}
#mmenu a.active > span, #mmenu a.active > i {color:#3c4858;}
#mmenu a.active > svg {fill:#3c4858;}
#mmenu a .circle {position:absolute;top:3px;right:2px;z-index:2;width:7px;height:7px;border-radius:100px;box-shadow:0 0 1px 1px #fff;}
#mmenu.c4 a {width:25%;}
#mmenu.c6 a {width:16.66%;}
« Last Edit: June 20, 2024, 11:39:48 AM by Own Petz »
OwnPetz - Free Classified Ads. Buy, Sell or Adopt Online. https://ownpetz.com

*

Own Petz

  • ****
  • 171 posts
  • OwnPetz - Free Classified Ads. Buy, Sell or Adopt
Re: How to Change Color of Top Menu in Mobile Theme
« Reply #3 on: June 20, 2024, 11:44:07 AM »
I have added this body #mmenu {background:red;} in mobile menu then its changed background color,

but I want to change text color only... for Home, Search, Contact US, Publish, Account.

Thanks
OwnPetz - Free Classified Ads. Buy, Sell or Adopt Online. https://ownpetz.com

*

MB Themes

Re: How to Change Color of Top Menu in Mobile Theme
« Reply #4 on: June 20, 2024, 12:08:02 PM »
Those are trivial tasks, check https://docs.osclasspoint.com/customizations-of-theme-basic again or find some similar guide.
  To get fast support, we need following details: Detail description, URL to reproduce problem, Screenshots

*

Own Petz

  • ****
  • 171 posts
  • OwnPetz - Free Classified Ads. Buy, Sell or Adopt
Re: How to Change Color of Top Menu in Mobile Theme
« Reply #5 on: June 20, 2024, 12:33:04 PM »
Ok, Thanks for reply ..

I have already checked that links.. that is very difficult for me... because I don't know coding..


I will try to change background color...


Thanks for your help.
OwnPetz - Free Classified Ads. Buy, Sell or Adopt Online. https://ownpetz.com

*

MB Themes

Re: How to Change Color of Top Menu in Mobile Theme
« Reply #6 on: June 20, 2024, 02:36:03 PM »
Then I recommend you to look for some developer with CSS skills, as asking people how to change color of button is too much from my point of view. You can go to ChatGPT and ask such questions and it gives you comprehensive answer (often you can provide URL and it will identify everything for you).

Way to go ;)
  To get fast support, we need following details: Detail description, URL to reproduce problem, Screenshots

*

dragutturgut

  • ***
  • 54 posts
Re: How to Change Color of Top Menu in Mobile Theme
« Reply #7 on: June 23, 2024, 12:37:45 PM »
Ok, Thanks for reply ..

I have already checked that links.. that is very difficult for me... because I don't know coding..


I will try to change background color...


Thanks for your help.

follow this step.

1. open ur site on pc, put your mouse pointer to the element or text that you want to edit. then right click, select inspect element, find the exact text or part or element you want to view or edit. your wil see the details or line of css or codes of that element. for example backgound color : red .... and at the end it will show you the line of css.

2. open your cpanel, open file manager, click public html, please do click slowly, please make sure u click only without edit at first.

3. then after clicking public html, it will show you more file.

4. find delta theme (or any theme that u use) then, click on it  it will show u more file. click until u find css.

5. at css, there is few css file. go only for responsive (this is for css mobile view) . the other one is style.css (this is for desktop view)

6. back to your site, recheck what line and css file (either responsive or style.css) that you see during inspect element.

7. back to your cpanel, public html file, then find the appropriate css file, then from there you may change the color.

8. do not do edit first if you not sure, do view first. view the css file (responsive or style.css). copy the line from inspect element from your site and find it there. if its exist, means you are on the correct place. make sure the line and description are 100% simillar like what you see and copy from inspect element of your site (website)

9. when u sure everything is correct, try finf the color, change the words . example like below :

color : red

‐------

just change the word ' red ' into black or any other color

black color will appear replacing red color in your live website.

.

make sure u edit with cautious, do not add or remove any space. just change word.

then, from here u may learn many other things on how to edit css file.

do try.

thanks to osclass/mb theme for providing non coder like us to create a very good listing website

*

Own Petz

  • ****
  • 171 posts
  • OwnPetz - Free Classified Ads. Buy, Sell or Adopt
Re: How to Change Color of Top Menu in Mobile Theme
« Reply #8 on: July 02, 2024, 09:13:16 AM »
thanks for your reply,...

I will check with these steps.
« Last Edit: July 02, 2024, 09:17:11 AM by Own Petz »
OwnPetz - Free Classified Ads. Buy, Sell or Adopt Online. https://ownpetz.com