College of Business Style Guide

Video Box 

<div class="video_box-item">
    <div class="video_box-video video">
        <iframe src="https://www.youtube.com/embed/tAcVUkNZJSk" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    </div>
    <div class="video_box-content">
        <h3>Holding Onto You</h3>
        <p>I'm taking over my body. Back in control, no more shotty. I bet a lot of me was lost. T's uncrossed and I's undotted. I fought it a lot and it seems a lot. Like flesh is all I got. Not any more, flesh out the door?</p>
    </div>
</div><!-- end video_box-item -->
 
<div class="video_box-item">
  <div class="video_box-video video">
    {% block cms_override %}
      <iframe src="{{ youtube_src }}" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    {% endblock cms_override %}
  </div>
  <div class="video_box-content">
    <h3>{{ headline|raw }}</h3>
    <p>{{ content }}</p>
  </div>
</div><!-- end video_box-item -->
 
{
  "youtube_src": "https://www.youtube.com/embed/tAcVUkNZJSk",
  "headline": "Holding Onto You",
  "content": "I'm taking over my body. Back in control, no more shotty. I bet a lot of me was lost. T's uncrossed and I's undotted. I fought it a lot and it seems a lot. Like flesh is all I got. Not any more, flesh out the door?"
}
  • Content: 
    .video_box-item {
  display: flex;
  flex-direction: column;
  max-width: inherit;
  box-shadow: 0 2px 10px $drop_shadow;

  .video_box-video {
    width: 100%;
    margin: 0 0 $space 0;

    &.video {
      padding-top: unset;
    }
  }

  h3 {
    font-size: 1rem;
    font-weight: bold;
  }

  a {
    font-weight: bold;
    color: $grey_darkest;

    &.button {
      font-weight: normal;
      width: 95%;
    }
  }

  @media only screen and (min-width: $break-desktop) {
    max-width: 50%;
  }

  .video_box-content {
    padding: 0 $space-one-half;
  }
}
  • URL: /components/raw/video_box/video_box.scss
  • Filesystem Path: components/02-pieces/21-video_box/video_box.scss
  • Size: 563 Bytes

No notes defined.