Yo! Halloween 🎃 is the Yo! Season 1 finale where I cover gruesome design news, dev tricks, freebies, laughs and more: Watch Yo!
Erickson & Associates
Clean corporate feel in this responsive One Pager for financial services firm, Erickson & Associates. I really like the footer section with a minimal contact form design against a forest background. It’s a pity the Timeline section gets hidden on mobile but cheers for the detailed build notes below…
This particular one page build utilized a few intensive css3 transforms to achieved the one-sided skewed lines. When using 'transform: skew', it skews both sides of the element, therefore skewing one side is a bit more tricky. To achieve this we had to apply a :before pseudo element, apply the transform to skew it, then to hide the other end we utilized some positioning and z-index. It's also difficult to achieve this on the responsive versions so we had to target specific breakpoints to get the desired results.