Extend menu see through area

Support Area Forums Umami Extend menu see through area

Viewing 2 posts - 1 through 2 (of 2 total)
URL to the page in question: http://bamboonoodle192.com/menu/
  • Author
  • #35772

    Hi Bill!

    My client was wondering if there was a way to extend all the way to the end of the page the black see-through box that pops up behind the menu? She would rather not see the bright contrast of the images with the dark backdrop.

    Thank you!

    Bill Robbins

    Good Morning,

    Great question. I believe we may be able to do that. Try adding this snippet to the Custom CSS box that’s at the bottom of the Advanced tab in the Theme Options page:

    @media only screen and (min-width: 768px) {
    	#content {
    		position: relative;
    		z-index: 2;
    		background: transparent;
    	#content::before {
    		content: "";
    		display: block;
    		height: 100%;
    		min-height: 100%;
    		position: fixed;
    		top: 0;
    		right: 0;
    		width: calc(100% - 300px);
    		z-index: -1;
    		background-color: rgba(0, 0, 0, 0.8);
    		-webkit-animation-duration: 1s;
    		animation-duration: 1s;
    		-webkit-animation-delay: 1.3s;
    		-moz-animation-delay: 1.3s;
    		animation-delay: 1.3s;
    		-webkit-animation-fill-mode: both;
    		animation-fill-mode: both;
    		-webkit-animation-name: fadeIn;
    		animation-name: fadeIn;

    Hopefully that will remove the original background and add in a larger one for browsers 768 pixels wide and larger. Let me know if you run into trouble there.


Viewing 2 posts - 1 through 2 (of 2 total)
  • The topic ‘Extend menu see through area’ is closed to new replies.