display mood text for mobile

This commit is contained in:
Christophe Robillard 2026-01-07 16:44:27 +01:00
parent 415abbe70f
commit d2d71468b4
2 changed files with 7 additions and 5 deletions

View file

@ -1,12 +1,14 @@
import { Controller } from '@hotwired/stimulus'
export default class extends Controller {
static targets = [ "image", "info" ]
static targets = [ "image", "day", "mode" ]
updateDayInfo(event) {
const image = this.imageTarget;
const infoDay = this.infoTarget;
const day = this.dayTarget;
const mode = this.modeTarget;
image.src = event.target.dataset.image;
infoDay.textContent = event.target.dataset.day;
day.textContent = event.target.dataset.day;
mode.textContent = event.target.dataset.mode;
}
}

View file

@ -3,11 +3,11 @@
<%= image_tag(@mode + ".jpg", "data-mood-target": "image") %>
</section>
<section class="is-hidden-desktop section column m-auto current-day">
<h1><%= @mode %></h1>
<div class="subtitle" data-mood-target="mode"><%= @mode %></div>
</section>
<section class="tracker section column has-background-primary-light my-0 mx-auto">
<h1 class="title is-1 mt-6">Comment ça KLUK aujourd'hui ?</h1>
<div class="subtitle" data-mood-target="info">Aujourd'hui</div>
<div class="subtitle" data-mood-target="day">Aujourd'hui</div>
<div>
<div class="is-flex is-flex-wrap-wrap">
<% @mood_log.each do |week| %>