Illustrator Theme

• 

  lamparo · Member · Feb 9, 2016 at 7:12 pm

  • Copy link
  • Add topic to favorites

  Hi there!

  I’d like to customize some aspects of the Illustrator theme on WordPress. However, the simple edit tab does not allow me to customize these things.

  First I want to remove the small box that appears over a portfolio post when you scroll over the post. I don’t want that box to appear at all.

  Second I’d like to change the color of the main navigation page from white to black and change the text throughout the blog from black to white.

  I’ve tried several CSS codes but it doesn’t seem like my changes are working out.

  Could someone help me out please?

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Feb 10, 2016 at 6:58 am

  • Copy link

  Hi there, I see you have hidden the box on the images and also changed the text color of the navigation.

  Since you have a light color background on your site, do you mean change the light colored text to black? If so, add the following CSS.

  body, button, input, select, textarea {
  color: #000000;
  }

• 

  lamparo · Member · Feb 10, 2016 at 4:54 pm

  • Copy link

  Hi there,

  I’m a bit confused. Seems like the box image still appears on images concerning posts. i want the text background to be black and the actual text to be white. When I imputed the above CSS it did not update the website.

  Could you please advise

• 

  thesacredpath · Member · Feb 10, 2016 at 8:41 pm

  • Copy link

  Perhaps I’m confused. When I looked at your site originally, the boxes were not showing over the posts on your main page, and there was custom CSS, but I’m not seeing that custom CSS now.

  Do you want the entire white area behind all of your content to be black with white text?

• 

  lamparo · Member · Feb 10, 2016 at 8:55 pm

  • Copy link

  yes! I want all of the white area to be black and the text to be white.

  sorry for the confusion i was still trying to see what CSS would make this work for me.

• 

  thesacredpath · Member · Feb 10, 2016 at 9:12 pm

  • Copy link

  Ok, let’s start with this then.

  body, button, input, select, textarea, .site-title, .site-description, .main-navigation a, .page-title a, .entry-title, .entry-title a, .site-main .portfolio-entry-meta {
      color: #fff !important;
  }
  body.custom-background, #page, .site-footer {
      background-color: #000;
  }
  .page-header::after, .entry-header::after {
      background: #fff;
  }

• 

  lamparo · Member · Feb 10, 2016 at 9:18 pm

  • Copy link

  yes this is perfect. thank you so much !

• 

  thesacredpath · Member · Feb 10, 2016 at 9:23 pm

  • Copy link

  Hooray and you are welcome.

• 

  lamparo · Member · Feb 10, 2016 at 9:29 pm

  • Copy link

  i just have two more questions.

  is there a way to remove the grayish black box that appears over the tile for a post?

  also the menu dropdown for the portfolio page has items in white text over a white background. how can i correct that, so that viewers can see the menu items?

• 

  thesacredpath · Member · Feb 11, 2016 at 1:43 am

  • Copy link

  The following will remove the box/border effect on hover.

  .portfolio-thumbnail a:hover::before, .portfolio-thumbnail a:focus::before, .portfolio-thumbnail a:active::before {
      opacity: 0;
  }

  Sorry, I didn’t notice the background on the submenus. Add the following to change the background color to black. If you want it a different color, you can edit the color code.

  .main-navigation ul ul {
      background-color: #000;
  }

• 

  lamparo · Member · Feb 11, 2016 at 1:57 am

  • Copy link

  this looks perfect. thank you so much for all of your help.

• 

  thesacredpath · Member · Feb 11, 2016 at 6:42 am

  • Copy link

  You are welcome.