<div class="info-box info-box--turquoise">
    <div class="info-box__icon">
        <svg class="icon icon--info" id="icon-0f1b" viewBox="0 0 200 200" role="presentation">
  <use xlink:href="#icon-info"></use>
</svg>
    </div>
    <div class="info-box__content">Den Antrag für kostenlos mitversicherte Familienmitlgieder schicken wir Ihnen zu. Bitte denken Sie daran, dass wir eine Kündigungsbestätigung nach §175 SGB V von der Vorkasse benötigen.</div>
</div>
-
  //- Prepare attr object
  attr = attr || {};
  attr.class = classList(attr.class);
  attr.class.push(`info-box--${color || 'turquoise'}`);

//- Render box
.info-box&attributes(attr)
  //- Icon
  if icon
    .info-box__icon
      != include('@icon', {icon})

  //- Box content
  .info-box__content #{text}
{
  "color": "turquoise",
  "icon": "info",
  "text": "Den Antrag für kostenlos mitversicherte Familienmitlgieder schicken wir Ihnen zu. Bitte denken Sie daran, dass wir eine Kündigungsbestätigung nach §175 SGB V von der Vorkasse benötigen."
}
  • Content:
    .info-box {
      display: flex;
      margin: 3.5rem 0;
      padding: 1.5rem;
    
      @include mq($from: m) {
        padding: 2.5rem;
      }
    }
    
    .info-box--turquoise {
      background-color: rgba($color-turquoise, 0.2);
      border: 1px solid $color-turquoise;
    }
    
    .info-box__icon {
      color: $color-steelgrey-dark;
      margin-right: 1rem;
    
      @include mq($from: m) {
        margin-right: 1.5rem;
      }
    }
    
    .info-box__content {
      font-size: 1.5rem;
    }
    
  • URL: /components/raw/info-box/info-box.scss
  • Filesystem Path: src/components/organisms/info-box/info-box.scss
  • Size: 412 Bytes

There are no notes for this item.