Material Theme question

It is hard without looking at your sites front page since mine site is different but I am guessing that the image is removed and the first transparent overlay is remove and then you got that image above.

so maybe file PF.SIte/flavors/yourtheme/flavor/bootstrap.css and since it is compressed with one line you could search in that file for

body#page_core_index-visitor .layout-main ._block.location_2 #welcome_message:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.4)}

and hack the code there if it is correct (it will be writen over on any upgrades)

or you might want to try css editor on your theme and add at the end of the css editor file

body#page_core_index-visitor .layout-main ._block.location_2 #welcome_message::before {     background: rgba(0,0,0,0.4); }

of course changing rgba(0,0,0,0.4) to whatever color you want.

This way it won't be written over on upgrades.  Good Luck.

Oh yeah, the first transparent I am guessing you removed was css

body#page_core_index-visitor #main #content-holder #content-stage {     background: transparent !important; }

I have found that when we add an image in this block , the same image becomes background image also ( for the whole screen ). Is there anyway to disable that ? I would like to have a dark ( black ) color background.

Naresh, not sure what you want.  To remove the image you could add these to the bottom of the file in the css editor for your cloned theme.

Thanks John!

Naresh, if you log into Admin, go to dashboard and select:

Appearance>Themes and click edit on the themes then choose the HTML option and remove this line around line 9:

<code> <div class="landing-background row_image"></div>  </code>

it should remove the background image. You could also do this by

going to PF.Site>flavors>material>html>layout.html and removing the line. 

Then if you go to the Homepage option and add below to MAIN CONTENT:

<code>  <syle> body{background-color:black;} </style>   </code>

It should make the background black. This is a kluge but it works. Of course if you update the Material template you will have to do it again.

John, I have found if I go to EditTheme>HOMEPAGE option and clear everything out of the MAIN CONTENT window the block I indicated in the above image turns white. The minute I type anything in the MAIN CONTENT window the block turns grey. Seems there is some javascript going on somewhere.

Thanks....

Thanks

I use to overwrite/change CSS but like you said every time you update you lose it.  So now I just add overrides in the CSS editor and they don't get written over anymore.

Naresh, ok here is a better way of doing what you want to do.

Do not delete line 9 of   PF.Site>flavors>material>html>layout.html

<div class="landing-background row_image"></div>       (line 9)

If you want to remove the landing page background "image" effect instead edit

line 9 and remove     row_image

To change the background color of the landing page edit
PF.Site > flavors > material > flavor > bootstrap.css
search for "landing-background:after". Edit background:rgba(0, 0, 0, 1)
to whatever color you want. The color above is black fully opaque.

To change the background color of block 2 where the Welcome Message is:
 search bootstrap.css for "welcome_message:before" like John said.
 Edit rgba(255, 255, 255, 0.5) to whatever color you want, this is
 white 50% transparent.

Always clear cache for changes to take place.

John/Naresh, when you say the CSS editor, are you talking about the editor built into the admin template editor,

or a third party CSS editor?

Also do you know if TECHIE mode is still a thing? If so, how do you enable it?

Finally, can the Components used in creating/editing blocks such as 

--welcome and --fe-site-stat be edited? Can you create new Components?

Where are these in the code?

If you could help with any of these that would be great, thanks John or Naresh!

William,

Yes the CSS editor is in the left menu when you edit your theme (always make a clone first and set that as default).  What I do is put this at the end of the current file, which separates what was there and below is what I added.

/*---------------------------- CSS Added -------------------------*/

Then I add the new CSS.  Sometimes you have to use !important at the end of your CSS rule to make it override the current CSS but that does not happen often.  Then after I add add additional changes below that line I copy the entire section below that line/dashes and put it in my excel spreadsheet as a backup.  If my theme gets an upgrade and I want to you use the new upgraded theme I can clone the theme again with the new updates and paste all my saved CSS (currently over 400 lines long) and pasted it into my new close theme and set that as default.  Remember upgrades on themes do not overwrite clones (This is the main reason why I use the CSS editor to override the CSS instead of the old way in the code/files that took DAYS to locate hundreds of areas but now it takes 1 Minute)  but instead overwrites the original.

https://docs.phpfox.com/display/FOX4DEVDOC/Enabling+Techie+Mode

You can create new blocks names with the variables available and set them to only the current locations available.  There is the ability to enter your only php but I have not needed that, so I don't know what info you can grab with that.

Thanks John! I followed those instructions for enabling TECHIE mode but it didnt appear to do anything.

Thats why I was wondering if it is still supported.

I found this online:

We can confirm with you that from v4, manage Components (add/edit/delete) are only available in development mode. So, if you want to access those features, you must enable techie mode first, then find those in Admincp - Techie -Components

I enable techie mode but dont see any additional menus in Admincp.