Lay Theme Forum

@arminunruh thank you so much! love it

Hey guys,
on my local wordpress theme with lay theme (great theme btw) my cover feature stops working.

Because the site is local I can only create a video of it:
https://youtu.be/Tn58FKrEItI

(The video was created on a MacBook Pro M1 Max with the native screen recording feature on a Local Wordpress Site with Arc Browser and all the laytheme addons activated. Cache was purged)

The problem occurs with Safari and Arc Browser.

Thank you for your help. Would love to use both cover & project overlays not one or another.

Hey, i have got some custom html and css code on my website to make a custom menu. I would like to style the active style of the links properly but it does not seem to work with :active{}.
is there a chance to get this running with pure css and html?

this is the line that does not seem to do anything (it is at the end of my custom css):
.nav-link a:active{
color: hsla(0, 0%, 100%, 1);
}

this is my website and below that you will find my custom code:
https://andrebeiler.work (the menu is custom made)

Custom HTML at top:
<div class="top">
<a href="/" class="link-3">André Beiler</a>
<div class="nav-2">
<a href="/foto" class="nav-link">Fotographie</a><span class="komma">, </span>
<a href="/film" class="nav-link">Musikvideo</a><span class="komma">, </span>
<a href="#" class="nav-link">Archiv</a><span class="komma">, </span>
<a href="/snaps" class="nav-link">Snaps</a><span class="komma">, </span>
<a href="/about" class="nav-link">Über Mich</a><span class="komma">, </span>
<a href="/about" class="nav-link">Kontakt</a>
</div>
</div>

Custom CSS:.top {
font-family: 'NeueHaasDisplayRoman', sans-serif;
position: fixed;
left: 0%;
top: 0%;
right: 0%;
bottom: auto;
width: 100%;
padding-top: 20px;
padding-bottom: 0px;
padding-left: 20px;
z-index: 999999999;

}

.link-3 {
text-decoration: none;
font-size: 1em; /* Set the font size to 1em /
line-height: 0.95;
color: hsla(0, 0%, 100%, 0.6);
transition: color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1); / Use "in out circ" timing function for color */
}

.link-3:hover {
color: hsla(0, 0%, 100%, 1);
}

.nav-2 {
display: flex;
margin-top: 2px;
}

.nav-link,
.komma {
font-size: 1.3em; /* Set the font size to 1.3em /
line-height: 0.95;
text-decoration: none;
color: hsla(0, 0%, 100%, 0.6);
transition: color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1); / Use "in out circ" timing function for color */
}

.nav-link:hover {
color: hsla(0, 0%, 100%, 1);
}

.komma {
margin-right: 4px; /* Adjust the margin as needed */
}

.lay-projectindex-row.hover{
font-family: 'NeueHaasDisplayRoman', sans-serif;
}

.nav-link a:active{
color: hsla(0, 0%, 100%, 1);
}

Hey there,
is there any way to fill the whole background when you hover on an index row, instead of just showing it next to the cursor?

I want to achieve something like that with an index + fullscreen and centered imagehover option: https://erynnlamont.com/cinematography/

Thank you!