• edgrbnz

    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:

    0_1536706061569_customizer-front-page.jpg

    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.

    0_1536706214599_customizer-intro.jpg

    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.

    posted in General Discussion read more
  • edgrbnz

    @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!

    posted in General Discussion read more
  • edgrbnz

    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.

    posted in General Discussion read more
  • edgrbnz

    Dunno if I get this right,… but project arrows are for navigating between projects (as the name implies). It doens’t make much sense to use these for navigation between pages.
    But you could of course do that with some custom code. I would consider this off-topic and should be discussed in another thread.

    Cheers!

    posted in General Discussion read more
  • edgrbnz

    I would make a character-style in the Text Formats with your desired look and choose it in the customizer afterwards. You could also target the project titles with a custom css and add font-weight: bold; or font-weight: 700;

    Hope that helps.

    Cheers!

    posted in General Discussion read more
  • edgrbnz

    I think the good ol’ !important; solved it!
    Just for reference the code I am using right now:

    /*custom link styles*/
    
    .text a{
        color: #eee;
        transition: ease-in-out 0.12s;
    }
    
    .text a:hover{
        color: #fff;
        text-shadow: 0 0 4px #fff;
        border-bottom: none;
        transition: ease-in-out 0.12s;
    }
    
    .caption a{
        color: #eee;
        transition: ease-in-out 0.12s;
    }
    
    .caption a:hover{
        color: #fff;
        text-shadow: 0 0 4px #fff;
        border-bottom: none;
        transition: ease-in-out 0.12s;
    }
    
    .menu-item span {
        color: #eee;
        transition: ease-in-out 0.12s;
    }
    
    .menu-item span:hover {
        color: #fff;
        text-shadow: 0 0 4px #fff;
        border-bottom: none;
        transition: ease-in-out 0.12s;
    }
    
    .current-menu-item span {
        color: #eee;
        border-bottom: 1.2px solid #eee !important;
        transition: ease-in-out 0.12s;
    }
    
    .current-menu-item span:hover {
        color: #fff;
        text-shadow: 0 0 4px #fff;
        border-bottom: 1.2px solid #fff !important;
        transition: ease-in-out 0.12s;
    }
    

    Thank you @mariusjopen !

    posted in Feedback read more
  • edgrbnz

    Do you have the caching plugin installed and running as recommended in the documentation?

    posted in General Discussion read more
  • edgrbnz

    Hey there @kristellaurits
    that’s pretty straight forward: Create a button-style / class with some custom css. You can find a simple guide how to do so over here.
    Then upload your zip to your Media Library and copy the url of the file:
    0_1536247463247_Media_Library_‹Moritz_Welker—_WordPress.jpg

    Then just add that link to your button.

    posted in General Discussion read more
  • edgrbnz

    It’s an option in the customizer.
    There’s a radio button selection how you want the hover states to behave on mobile:

    0_1536166735226_Customize__Moritz_Welker.jpg

    posted in General Discussion read more
  • edgrbnz

    Well I guess that that’s the Slider implemented into lay. All the functions are listed here: https://alvarotrigo.com/fullPage/examples/methods.html
    And yes, it seems like there’s a dedicated function for your needs.

    Cheers!

    posted in Addons read more
  • edgrbnz

    I can’t answer your question #1 regarding the custom css and project thumbnails.

    But the unusual letterspacing probably is a ligature, which is common to have between f+f, f+i, f+l, etc. to optimise legibility.
    It depends on the font but you may be able to switch off the ligature settings via custom css. You can test these settings over here and copy-paste the corresponding code into your custom-css inside lay afterwards.

    Usually these things (f+f, f+i, f+l) get optimised with kerning and ligatures are only an option. In the case of Helvetica it seems like that these standard ligatures are baked in. Which means, that you probably cannot deactivate it since it’s the basic version of the font.

    If you want to stick with Helvetica / Arial your only option would be to not use that much letterspacing. If you want to stick to your letterspacing you could:

    • Make these links uppercase.
    • License a different neo-grotesque webfont. (eg: Neue Haas Unica, GT America, Favorit, Nimbus Sans, Neue Helvetica,…)

    Best!

    posted in General Discussion read more
  • edgrbnz

    @spontans
    Wellllll,… you could keep it super lean and simple and just integrate a PayPal solution.
    Like so → http://www.amalgam.online/order/

    posted in General Discussion read more
  • edgrbnz

    +1 for more options on links and their states.

    Regarding the inline editing of type: That’s not a bug, that’s a feature.
    If you change a paragraph style it changes the paragraph, makes complete sense. That’s the same behaviour found in InDesign and other Applications.

    For changing the appearance of some words you need a <span> tag around them (a wee bit like how character styles in ID work). You could / should predefine these character styles in the Text Formats of lay-theme:

    0_1534410077496_d99b0d55-a128-4652-8912-e21a75181309-image.png

    Hope that helps.

    posted in Feedback read more
  • edgrbnz

    I don’t think you can fix this with the old version. It just recently was added as a feature.
    0_1533803704280_Lay_Theme_–_The_Designer’s_Portfolio_Theme.jpg

    I know that this usually is wordpress standard functionality – I presume that it has to do with Lay-Theme’s architecture that these feature just were added recently.

    But, you could create pages or a project category. As long as you don’t add these to your content or menues your content won’t be visible (Google may parse it, though).

    posted in Bug Reports read more
  • edgrbnz

    No,…
    Afaik @arminunruh intended it to be a simple and straight forward portfolio theme. You could set it up as a blog by using the projects as posts (or use a special work category for bloggish stuff).
    Or you just link to your tumblr or medium (or similar) from your navigation.

    posted in General Discussion read more
  • edgrbnz

    @mariusjopen said in Lazy Load Images / Image Placeholder Background Color stays behind transparent PNGs:

    .ph { transition: 0.2s ease; }

    It kinda works. On some images (gifs) the background just stays behind the images. I think I'll stick with load images instantly. And try to keep the file sizes to a minimum.

    posted in Bug Reports read more
  • edgrbnz

    Afaik: No.

    I’d recommend activating the project descriptions in Lay Options:
    0_1533461814549_3aacc18c-2642-4987-b5b4-b7c75c10da71-image.png

    posted in General Discussion read more
  • edgrbnz

    Would be cool if you could have a look into it!

    posted in Bug Reports read more
  • edgrbnz

    @jhc sounds like totally normal browser behaviour. If you want to trigger a direkt download just make it a zip. Most Browsers open PDFs in a new tab as preview nowadays.

    posted in General Discussion read more