tcs_site/tcs_site/templates/home.jinja2

{% extends "layout.jinja2" %}

{% block content %}

<div class="row">  
  <div class="col-lg-4">
    <div class="card overflow-hidden">
      <div class="card-body p-3">
        <h5 class="mb-4 text-center">Hội văn hoá<br>Trịnh Công Sơn</h5>
        <p>hội tụ bạn bè của nhạc sĩ từ khắp nơi trên thế giới, xây dựng trạm web này với mong muốn trở thành một thư viện toàn diện và nghiêm túc về người nghệ sĩ.</p>
      </div>
    </div>
  </div>
  <div class="col-lg-4">
    <div class="card overflow-hidden">
      <div class="card-body p-3">
        <h5 class="mb-4 text-center">L'Association culturelle Trinh Cong Son</h5>
        <p>réunisssant les amis du musicien de par le monde, a créé ce site web avec pour but d'en faire une référence complète et sérieuse sur l'artiste.</p>
      </div>
    </div>
  </div>
  <div class="col-lg-4">
    <div class="card overflow-hidden">
      <div class="card-body p-3">
        <h5 class="mb-4 text-center">The Trinh Cong Son Cultural Association</h5>
        <p>gathering friends of the composer throughout the world, has created this website with the aim of making it a comprehensive and authoritative resource on the artist.</p>
      </div>
    </div>
  </div>
  </div>

<div class="row">
  <!-- Container (BIO Section) -->
    <div class="col-lg-4">
      <div class="card overflow-hidden hover-img">
        <div class="position-relative">
          <img src="{{request.static_url('tcs_site:static/img/home/home_bio.jpg')}}" class="card-img-top">
        </div>
        <!-- COL 1 Biography -->
        <div class="card-body text-center p-3">
            <h5><a href="/topic/tieu-su">Đời và nhạc</a></h5>
            <h5><a href="/topic/life-music">Life and music</a></h5>
            <h5><a href="/topic/vie-musique">Vie et musique</a></h5>

        </div>
      </div>
    </div>
    <div class="col-lg-4">
      <div class="card overflow-hidden hover-img">
        <div class="position-relative">
          <img src="{{request.static_url('tcs_site:static/img/home/home_songs.jpg')}}" class="card-img-top border border-dark" alt="matdash-img">
        </div>
        <!-- COL 2 Music  -->
        <div class="card-body text-center p-3">
            <h5><a href="/blog/934/bai-hat">Bài hát</a></h5>
            <h5><a href="/section/english/songs-en">Songs</a></h5>
            <h5><a href="/section/francais/songs-fr">Chansons</a></h5>
        </div>
      </div>
    </div>
    <div class="col-lg-4">
      <div class="card overflow-hidden hover-img">
        <div class="position-relative">
          <img src="{{request.static_url('tcs_site:static/img/home/home_albums.jpg')}}" class="card-img-top">
        </div>
        <!-- COL 1 Biography -->
        <div class="card-body text-center p-3">
            <h5><a href="/blog/211/tap-nhac">Tập nhạc</a></h5>
            <h5><a href="/blog/211/tap-nhac">Albums</a></h5>
            <h5><a href="/blog/211/tap-nhac">Recueils</a></h5>
        </div>
      </div>
    </div>
</div>

<div class="row">
  <!-- Container (ALBUMS Section) -->
    <div class="col-lg-4">
      <div class="card overflow-hidden hover-img">
        <div class="position-relative">
          <img src="https://media.tcs-home.org/songs/TCSVTH-01.jpg" class="card-img-top border border-dark" alt="matdash-img">
        </div>
        <!-- COL 2 Music  -->
        <div class="card-body text-center p-3">
            <h5><a href="/blog/232/nhac-soan-cho-ghita">Nhạc soạn cho ghita</a></h5>
            <h5><a href="/blog/232/nhac-soan-cho-ghita">Guitar arrangements</a></h5>
            <h5><a href="/blog/232/nhac-soan-cho-ghita">Arrangements pour guitare</a></h5>
        </div>
      </div>
    </div>
    <div class="col-lg-4">
      <div class="card overflow-hidden hover-img">
        <div class="position-relative">
          <img src="{{request.static_url('tcs_site:static/img/home/home_artworks.jpg')}}" class="card-img-top" alt="matdash-img">
          </div>
        <!-- COL 3 ART -->
        <div class="card-body text-center p-3">
            <h5><a href="/blog/937/tranh-ve">Tranh vẽ</a></h5>
            <h5><a href="/blog/937/tranh-ve">Peintures</a></h5>
            <h5><a href="/blog/937/tranh-ve">Paintings</a></h5>

        </div>
      </div>
    </div>
</div>

<div class="row">  
  <div class="col-lg-6">
      <div class="card overflow-hidden hover-img">
        <div class="position-relative">
          <img src="{{request.static_url('tcs_site:static/img/home/home_friends.jpg')}}" class="card-img-top" alt="matdash-img">
        </div>
        <!-- Activites - colonne 3 -->
        <div class="card-body text-center p-3">
            <h5><a href="/topic/ban-be">Góc bạn bè</a></h5>

        </div>
      </div>
  </div>
  <div class="col-lg-6">
      <div class="card overflow-hidden hover-img">
        <div class="position-relative">
          <img src="{{request.static_url('tcs_site:static/img/home/home_hoi.jpg')}}" class="card-img-top" alt="matdash-img">
        </div>
        <!-- Activites - colonne 3 -->
        <div class="card-body text-center p-3">
            <h5><a href="/topic/hoi-tcs">Hội Văn Hóa TCS</a></h5>

        </div>
      </div>
  </div>
</div>

</div>
    
{% endblock %}