3 files changed, 15 insertions, 30 deletions
diff --git a/templates/album.qtpl b/templates/album.qtpl
index 58fc499..246c77c 100644
--- a/templates/album.qtpl
+++ b/templates/album.qtpl
@@ -20,15 +20,15 @@ func (m *AlbumPage) PreloadAttr() string {
 {% func (p *AlbumPage) Title() %}Media{% endfunc %}
 
 {% func (p *AlbumPage) Content() %}
-<h1 class="title text-size-1">{%s p.Name %}</h1>
-<div class="tags are-large">
-{% for _, a := range p.Albums %}
-  <a href="/album?albumId={%s FromUInttoString(&a.ID) %}" class="tag text-size-2">{%s a.Name %}</a>
-{% endfor %}
-</div>
-<div class="columns">
+<section class="section">
+    <h1 class="title text-size-1">{%s p.Name %}</h1>
+    <div class="tags are-large">
+    {% for _, a := range p.Albums %}
+      <a href="/album?albumId={%s FromUInttoString(&a.ID) %}" class="tag text-size-2">{%s a.Name %}</a>
+    {% endfor %}
+    </div>
+</section>
 {%= Mosaic(p.Medias, p.PreloadAttr()) %}
-</div>
 <div>
     <a href="/album?albumId={%s FromUInttoString(p.Next.AlbumID) %}&page={%d p.Next.Page %}" class="button is-pulled-right">next</a>
 </div>
diff --git a/templates/media.qtpl b/templates/media.qtpl
index 737d03d..6a13827 100644
--- a/templates/media.qtpl
+++ b/templates/media.qtpl
@@ -18,9 +18,7 @@ func (m *MediaPage) PreloadAttr() string {
 {% func (p *MediaPage) Title() %}Media{% endfunc %}
 
 {% func (p *MediaPage) Content() %}
-<div class="columns">
 {%= Mosaic(p.Medias, p.PreloadAttr()) %}
-</div>
 <div>
     <a href="/media?page={%d p.Next.Page %}" class="button is-pulled-right">next</a>
 </div>
diff --git a/templates/mosaic.qtpl b/templates/mosaic.qtpl
index 21a8bae..9e941b6 100644
--- a/templates/mosaic.qtpl
+++ b/templates/mosaic.qtpl
@@ -1,26 +1,13 @@
 {% import "git.sr.ht/~gabrielgio/img/pkg/database/repository" %}
-{% import "git.sr.ht/~gabrielgio/img/pkg/list" %}
 
 {% func Mosaic(medias []*repository.Media, preloadAttr string) %}
-<div class="columns">
-{% for _, c := range list.Distribuite(medias, 6) %}
-    <div class="column is-2">
-    {% for _, media := range c %}
-    <div class="card-image">
-       <a href="/detail?path_hash={%s media.PathHash %}">
-       {% if media.IsVideo() %}
-       <video class="image is-fit" controls muted="true" poster="/media/thumbnail?path_hash={%s media.PathHash %}" preload="{%s preloadAttr %}">
-           <source src="/media/image?path_hash={%s media.PathHash %}" type="{%s media.MIMEType %}">
-       </video>
-       {% else %}
-       <figure class="image is-fit">
-           <img src="/media/thumbnail?path_hash={%s media.PathHash %}">
-       </figure>
-       </a>
-        {% endif %}
-    </div>
-    {% endfor %}
-    </div>
+<div class="gallary_container">
+{% for _, media := range medias %}
+    <a href="/detail?path_hash={%s media.PathHash %}">
+        <figure class="image_container">
+            <img src="/media/thumbnail?path_hash={%s media.PathHash %}" >
+        </figure>
+    </a>
 {% endfor %}
 </div>
 {% endfunc %}