@extends('layouts.app')

@section('content')
  @while(have_posts()) @php the_post() @endphp
    @include('partials.content-single-'.get_post_type())
  @endwhile
@endsection


<article>
  <div class="teaser-content">
      
      @if($term_list)
          <span style="@if($badge_inverted_colors) background-color: rgba(0,0,0,0)!important; color: {!! $category_color !!}; border: {!! $badge_outline_width !!}px solid {!! $category_color !!};@endif
          @if($category_color) background-color: {!! $category_color !!}; @endif color: {!! $badge_text_color !!}; border-radius: {!! $badge_border_radius !!}px"
          class="job-badge {!! $term_list[0]->slug !!} inline-block py-1 px-8 mb-8">
              {!! $term_list[0]->slug !!}
          </span>
      @endif
      <a href="{!! get_permalink($job->ID) !!}">
          <h2 style="color: {!! $title_color !!}" class="font-bold text-xl mb-2">{!! get_the_title($job) !!}</h2>
      </a>
      <div class="teaser-info teser-job-info">
          @if ($info)
              <div style="color: {!! $excerpt_color !!}" class="teaser-detail">
                  <p>{!! $info !!}</p>
              </div>
          @endif
      </div>
      <a href="{!! get_permalink($job->ID) !!}">
          <div
              style="
              background-color: {!! $cta_background !!};
              border: {!! $cta_outline_width !!}px {!! $cta_outline_color !!} solid;
              border-radius: {!! $box_border_radius !!}px;
              
              " class="teaser-cta inline-block py-4 px-8 mt-16">
              <div class="flex align-middle">
                  @if ($cta_icon_job)
                      <img width="16" height="16" src="{!! $cta_icon_job !!}" alt="cta-icon" class="{!! $cta_text ? 'mr-2' : ''!!}">
                  @endif
              <span style="color: {!! $cta_text_color !!}">{!! $cta_text !!}</span>
              </div>
          </div>
      </a>
  </div>
</article>