Save
Saving
  • edgrbnz edgrbnz

    Hey there!

    # Icons:
    You could do all of that via Custom CSS. If you want to include Icons you could setup a mobile Menu in Appearance like so. If you would like to add icons I’d suggest you make an icon-font upload it to Lay OptionsWebfonts and add a class to your custom css something along the lines of:

    /*custom icon class*/
    ._icon {
        font-family: my-cool-icons;
    }
    

    Then you can add the Icons inline via <span class="…> in the Navigation Label, et voila! Icons in your Navigation!


    # Background colors etc:
    you could easily edit things like nav.mobile-nav via the webinspector and then add your code to the Custom CSS – For a gradient it could look like this:

    nav.mobile-nav {
       background-image: linear-gradient(180deg, #FF0000 0%, #0050FF 100%);
    }
    

    If you want to add lines/borders to every (mobile) menu entry something like this could do the trick:

    nav.mobile-nav li,
    nav.mobile-nav li a {
       border-bottom: 2px solid brown;
    }
    

    Happy coding!

    posted in Feedback read more
  • edgrbnz edgrbnz

    @Mitchboi said in What do i need for this?:

    www.maximilianvirgili.com

    I’d say the fullscreen slider is exactly what you are looking for: You can make layouts in rows as you are used to as soon as the Fullscreen slider is activated for the given page/project the rows just become slides.

    posted in Addons read more
  • edgrbnz edgrbnz

    Hi @mariusjopen !
    Thanks for your reply!
    Yes I know it’s kinda experimental. I was planning to add some Fallback via @supports (mix-blend-mode: exclusion) {…}
    So your advice would be to just leave it behind and find a different solution?
    Which would be sad but ok.

    But if you have the time here’s some food for thought:

    As soon as I set a background color (also white!) for a row it also works in Chrome. Since I cannot set a color for Row Gutters this work-around won’t really cut it.

    It looks like it is fixable since only Chrome doesn’t want to register the overall set background color of the LayTheme Website for the exclusion. I guess it would be a small tweak and has something to do with the transitions and/or opacities for backgrounds – I’m just unable to find out what it is.

    If you check the password-prompt page in Chrome you can see that it works fine. If you login now (pass: Error) you can see that it works with a white row background (scroll down a bit).

    So my guess is that it has something to do with the way the overall background for Lay is rendered…

    posted in General Discussion read more
  • edgrbnz edgrbnz

    Want to give this a slight push…
    If anyone knows some handy trick regarding my questions i’d be very very thankful!

    posted in General Discussion read more
  • edgrbnz edgrbnz

    I got this to work In Safari in Firefox.
    I uploaded a quick test over here → Pass: Error

    The CSS is as follows:

    nav.primary,
    .sitetitle,
    .lay-carousel-sink-parent {
    	mix-blend-mode: exclusion;
    }
    
    .numbers._H5 {
    	color: white;
    }
    

    This doesn’t really work in Chrome. It only works as soon as there are changes in the background color. I also tried to apply a white background color via CSS to the .body but Chrome doesn’t seem to register the background color of the site.

    There seems to be an existing Chrome bug for this, as stated here (scroll ↓ a bit).

    Perhaps @mariusjopen or @arminunruh know something about this?
    Any help would be very much appreciated!

    posted in General Discussion read more
  • edgrbnz edgrbnz

    Body background is set to white in Customize / Background. If I switch on the menu bar in Customize / Menu Style / Menu Bar and set it to white the text shows up in chrome.
    Otherwise it’s just white on white… it seems like chrome doesn’t register the body background?
    I wonder why?


    (Edit 20/06/26)
    I also tried to apply the mix-blend-mode to the carousel numbers (which are set to On top of Carousel) with the following code:

    .lay-carousel-sink .numbers {
    	color: white;
    	mix-blend-mode: difference;
    }
    

    That also didn’t work… seems to me I’m just doing something wrong – If anyone knows…

    posted in General Discussion read more
  • edgrbnz edgrbnz

    With abit of trial and error I realised that it works perfedlty fine in Safari and Firefox. Only Chrome doesn’t seem to work. So the following code results in the desired effect on Safari and Firefox, but not Chrome.

    nav.primary{
    	mix-blend-mode: difference;
    }
    
    .sitetitle {
    	mix-blend-mode: difference;
    }
    

    Does anyone know why that is and how to fix it?

    posted in General Discussion read more
  • edgrbnz edgrbnz

    Hey there Lay Theme Community,

    I’m trying to integrate a mix-blend-mode: difference; for a menu/navigation and site title like this page.
    I understand that I need to set the menu points to color: white; and also have the sitetitle be a white SVG to get the desired effect.

    For some reason my CSS doesn’t seem to cut it…

    .sitetitle {
    	mix-blend-mode: difference;
    }
    nav.primary .menu-item {
    	mix-blend-mode: difference;
    }
    

    This is what I’m trying to achieve:
    diff.jpg

    Unfortuntaley I’m working on a local environment so there’s no link I could share. But except the above there is no custom CSS going on so far.

    Any help and hints is much appreciated!

    posted in General Discussion read more
  • edgrbnz edgrbnz

    Scroll, Marius! Scroll!

    nice work @kmathios

    posted in Showcase read more
  • edgrbnz edgrbnz

    Did you try to tick the option for Disable cache in the Network tab of the developer tools? Chrome is pretty harsh when it comes to caching and saving stuff.

    posted in Bug Reports read more