client/components/dormitory/DormitoryYoutube.vue

<template>
  <div>
    <h2>
      Youtube
      <small>動画</small>
    </h2>
    <p>Youtubeに動画をあげています</p>
    <div class="col-sm-6 col-xs-12">
      <a
        href="https://www.youtube.com/watch?v=fvEnrxz5sQw"
        target="_blank"
        rel="noopener"
        onClick="ga('send', 'event', 'link', 'youtube', 'jokon2017dance')"
      >
        <img
          src="http://img.youtube.com/vi/fvEnrxz5sQw/mqdefault.jpg"
          width="1200"
          height="800"
          class="img-responsive img-rounded"
        >
      </a>
      <span id="photoname">【国際寮】平成２９年度女コン団体の部【FLASH & TT】</span>
      <hr>
    </div>
    <div class="col-sm-6 col-xs-12">
      <a
        href="https://www.youtube.com/watch?v=oIjo1A5Ge4w"
        target="_blank"
        rel="noopener"
        onClick="ga('send', 'event', 'link', 'youtube', 'jokon2017kojin')"
      >
        <img
          src="http://img.youtube.com/vi/oIjo1A5Ge4w/mqdefault.jpg"
          alt
          width="1200"
          height="800"
          class="img-responsive img-rounded"
        >
      </a>
      <span id="photoname">【国際寮】平成２９年度女コン個人の部【じゃい子ちゃん】</span>
      <hr>
    </div>
    <div class="col-sm-6 col-xs-12">
      <a
        href="https://www.youtube.com/watch?v=DaNHQL3Az1o"
        target="_blank"
        rel="noopener"
        onClick="ga('send', 'event', 'link', 'youtube', 'jokon2015dance')"
      >
        <img
          src="http://img.youtube.com/vi/DaNHQL3Az1o/mqdefault.jpg"
          alt
          width="1200"
          height="800"
          class="img-responsive img-rounded"
        >
      </a>
      <span id="photoname">【国際寮】平成２７年度女コン団体の部【Boy Meets Girl & Little scarlet bad girl】</span>
      <hr>
    </div>
    <div class="col-sm-6 col-xs-12">
      <a
        href="https://www.youtube.com/watch?v=tcQ3N1NBQK0"
        target="_blank"
        rel="noopener"
        onClick="ga('send', 'event', 'link', 'youtube', 'jokon2015kojin')"
      >
        <img
          src="http://img.youtube.com/vi/tcQ3N1NBQK0/mqdefault.jpg"
          alt
          width="1200"
          height="800"
          class="img-responsive img-rounded"
        >
      </a>
      <span id="photoname">【国際寮】平成２７年度女コン個人の部【かん子ちゃん】</span>
      <hr>
    </div>
  </div>
</template>