🎉 Black Friday deal! 30% off your first year of CodyHouse Pro →

Projects

Progress value is 30%

Feature

Content group containing Text + Media.

View Demo

Dependencies

All components are based on CodyFrame.

This component includes variations. Variations share the same SCSS/JS code but differ in their HTML.

How to

The Feature component is a content group containing a text component and a media element (image, inline SVG, video or iframe).

You can use the .col-{number} utility classes to decide if/when the two feature items should separate in different columns.

The media supported are <img>, <svg>, <video> and <iframe> elements.

If you're using an iframe, make sure to add the aspect-ratio utility class to the <figure> element.

If you're using an inline SVG, make sure to include the width, height, viewbox and preserveAspectRatio attribute.

<!-- img -->
<figure>
  <img class="block width-100%" src="assets/img-name.png" alt="Image Name">
</figure>

<!-- video -->
<figure>
  <video class="block width-100%" poster="assets/video-name-poster.jpg" src="assets/video-name.mp4"></video>
</figure>

<!-- inline SVG -->
<figure>
  <svg class="block width-100% height-auto" width="620" height="420" viewBox="0 0 620 420" preserveAspectRatio="xMinYMin slice">
    <!-- svg code -->
  </svg>
</figure>

<!-- iframe -->
<figure class="aspect-ratio-16:9">
    <iframe src="assets/iframe-name" frameborder="0"></iframe>
</figure>

✅ Project duplicated

✅ Project created

There was an error while trying to export your project. Please try again or contact us