← Join our Newsletter

June 04, 2020

CodyHouse Logo

Hello again!

Last month we released Mercurio, the first of a long series of templates we plan on releasing over the next months. Following Rogier's suggestion on our board, we've also shipped the option to export the style guide of a CodyFrame project.

Below is a recap of the latest tutorials and components published in May.

Thanks for reading,
— Seb & Claudia 🖤


CSS Nugget #36: Styling Siblings on Hover

Use the :not CSS selector to stylize siblings on hover.

Normally, you would need JavaScript to stylize all the siblings of an element you're interacting with. But wait! There's a cool method based 100% on CSS.

The idea, in short, is to target the :hover of the parent, then target all the children except the one you're hovering over.

Code snippet

Use this technique to create hover effects like this one:

effect preview

Check the code demo


UI Framework

New components of the month:

1. Explorer (Pro)

Modal window with autocomplete search.

Download

Explorer

2. Sticky Banner (free)

A sticky banner that slides in passed a target element or a scrolling offset.

Download

Sticky Banner

3. Gallery v2 (Pro)

A gallery of card components with an additional text element.

Download

Gallery v2

4. Banner (free)

A CTA banner containing text + media.

Download

Banner

5. Feature v11 (Pro)

A feature section containing a boxed content over a background image.

Download

Feature v11

6. Autocomplete (Pro)

Autocomplete widget for input elements.

Download

Autocomplete

We'd love to hear what you think!

Reply to this email with suggestions, feedback, criticism, or anything you wish to share with us. Your input helps us shape the future of CodyHouse.