Just define the hr sytle in the settings and set up rows in the gridder.
Page should have no (left & right) frame to make the lines go border to border of the viewport.
Add Project-Thumnail in the first column of each gridder-row and the text afterwords.

These steps should bring you pretty close. Rest ist fine-tuning and perhaps a wee bit of custom css – something like overflow-hidden etc. ‹— just guessing, here.

When it works it works!!
Glad it does 💐💐💐

How about a different approach:

You write on Tumblr, Medium or the like (and get the benefits of a community) and then add the Post-Excerpts via RSS to a Page on your Website.

We might need a good RSS functionality though. But I think that’s the cooler way todo things.

What do you think?

Well you surely could solve that with some code.
As far as I can see the example page is completely code based with CSS animations. The left part are two simple layouts that switch at the same time as the right part is loading a new image (via jquery?) that is panning from left to right. The logo is just spinning continously.

Your given example sounds more like a video-based solution to me. The easiest way would be a video with all the desired flashing, split-screen and stuff with final cut, premiere, after effects or any toolset you feel comfortable with and then:

Option #1
Place that video as background in a row (use browser height for row height) on a new page. This will ensure the video is always full screen.

Then you could make a transparent button (you can use the documentation as a starting point) and place it over the video an link that button to you work overview (or any other page you’d like)

You can make every page your front page in the customizer / front page settings:

Option #2
Just use the Intro Feature in the Customizer.
But this will not trigger the Video again when you click the logo. The intro only will be shown once every time you visit the front page.

But of course a truly code based solution would be more sophisticated. If you know some CSS and know how keyframes work you could dive deep into these topics. It’s not that hard to understand, but may take some time to make things work the way you want.
Here you find some basic info about the animation properties: CSS3 Animation Properties
And here are some examples how to go about certain animations: Animations in CSS

Hope that helps.

@paul_moxie to make your code valid you need a semicolon after 1px in your css:

.line {
stroke-width: 1px;
}

On the other hand I'm not quite sure if stroke-width will work at all for an hr-element. I’d try something along these lines:

.my-hr .lay-hr {
height: 1px;
}

Then add the class my-hr (call it whatever you fancy) to the hr-elements in the gridder. Unfortunately I can’t really explain why the lay-hr class needs to be there – But it needs to be – It’s something about that CSS-parent-child-thing I never really wrapped my head around.

Hope that helps!

True… this should be a future-feature, I guess.

For now you could hide ›Cart‹ via page/slug specific CSS, which is well documented over here.

So I guess this is solved, isn’t it?

Would you mind editing the topic title to png background not transparent (solved!) or smeothing similar? This way users (with the same issues) can utilise the search function of the forum more easily.

Thanks! 💐

Same here!

I ❤️🧡💛💚💙💜 the new feature a lot! I also tried to target the hover-state type color via CSS, which seems to be a bit tricky.
In generally think it would be super 𝖈𝖔𝖔𝖑 if the hover state would get a few more options, like font color.
Some simple options to add a hover-state to the filter/header elements of the index could also be helpful in terms of good UX.

(push) Anyone?

I’d say »yes, You could just built yourself a footer/page for that.«

@arminunruh I made a quick sketch. Would be 𝖈𝖔𝖔𝖑 to add an extra column for the featured images of projects, like so:

@arminunruh Been looking for said foldable row feature, I’m on version: 5.2.5 can someone point me in the right direction?

Hi there Lay Theme Community,

I’m currently redesigning my website and would love to have a column with small featured Images shown in a project index.

Will this be a feature in the near future?

@arminunruh

Sorry, too fast! the good old !important did the trick! So the code would be as follows (for reference):

single-caption-inner a{
display: inline-block !important;
}

Thanks @arminunruh !

this totally escaped my attention. So here I’m back again with the same issue (still). I tried the code you provided … but to no success.

Top and bottom of the button still is cut off in mobile views 😢

Hi there Forum!

I just updated the website of a client. I used the new Button feature in a carousel. For some reason the buttons get cut off in responsive sizes (mobile and tablet)

Mobile View:

Desktop View:

As usual: Thank you for any help 💐💕

Thank you @arminunruh!
I installed the update … still same issue, though.

Hi there Forum,

I’m currently working on a small website for a client and ran into a minor issue:
It seems like that the content (in a stack) in the first (browser height) row gets pushed to to left side:

Left and right frame is set to be equally 5% and there is no offset applied to the content in question.
I assumed that it has something to do with the scroll-bar … but the behaviour can be replicated on desktop browsers as well as on a smartphone / iphone.

Any help would be much appreciated!
💐

Thank you @arminunruh 🙏

Alright thanks @arminunruh I had this issue on another site I’m currently working on. Will there be a fix somewhen in the forseeable future?