<my-recommended-videos>
  <div class="other-videos">
    <div class="title-page-container ng-star-inserted">
      <h2 class="title-page title-page-single">他の動画</h2>
    </div>
    @foreach ($res['recommend']->data as $k => $v)
      <my-video-miniature actorimagesize="32" class="ng-star-inserted">
        <div class="video-miniature">
          <my-video-thumbnail>
            <a class="video-thumbnail ng-star-inserted" href="/w/{{ $v->shortUUID }}">
              <img alt="" aria-label="{{ $v->name }}" src="https://video.076.ne.jp{{ $v->thumbnailPath }}" class="ng-star-inserted">
              <div class="video-thumbnail-label-overlay warning ng-star-inserted"></div>
              <div class="video-thumbnail-label-overlay danger ng-star-inserted"></div>
              <div class="video-thumbnail-duration-overlay ng-star-inserted">{{ ptDuration($v->duration) }}</div>
              <div class="play-overlay ng-star-inserted">
                <div class="icon"></div>
              </div>
            </a>
          </my-video-thumbnail>
          <div class="video-bottom">
            <div class="video-miniature-information">
              <div class="d-flex video-miniature-meta">
                <my-actor-avatar class="ng-star-inserted">
                  <a title="{{ $v->channel->name }} (チャンネルページへ) " href="/c/{{ $v->channel->name }}" class="ng-star-inserted">
                    <img class="avatar avatar-32 channel ng-star-inserted" src="{{ ptAvatar($v->channel) }}" alt="チャンネルのアバター">
                  </a>
                </my-actor-avatar>
                <div class="w-100 d-flex flex-column">
                  <my-link tabindex="-1" class="video-miniature-name" style="max-height: 3em;">
                    <a tabindex="-1" title="{{ $v->name }}" href="/w/{{ $v->shortUUID }}" class="ng-star-inserted"> {{ $v->name }} </a>
                  </my-link>
                  <span class="video-miniature-created-at-views">
                    <my-date-toggle class="ng-star-inserted">
                      <span class="date-toggle" title="{{ date('Y年m月d日 H:i:s T', strtotime($v->createdAt)) }}">{{ date('Y/m/d', strtotime($v->createdAt)) }} </span>
                    </my-date-toggle>
                    <span class="views" title=""> • 
                      <my-video-views-counter class="ng-star-inserted">
                        <span title=""> {{ $v->views }} 回視聴</span>
                      </my-video-views-counter>
                    </span>
                  </span>
                  <a tabindex="-1" class="video-miniature-account ng-star-inserted" href="/c/{{ ptFullHandle($v->channel) }}"> {{ ptFullHandle($v->account) }} </a>
                  <div class="video-info-privacy"></div>
                </div>
              </div>
            </div>
            <div class="video-actions"></div>
          </div>
        </div>
      </my-video-miniature>
      <hr class="ng-star-inserted">
    @endforeach
  </div>
</my-recommended-videos>
