krichtof/app.kluk.fr
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

improve layout

Browse source
This commit is contained in:
Christophe Robillard 2025-12-02 17:46:01 +01:00
parent 5ef9cafb27
commit 5ba69fbb54
1 changed files with 14 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
app/views/moods/index.html.erb
View file

@ -1,14 +1,14 @@
<main data-controller="mood" class="columns">
<section class="mode section column">
<main data-controller="mood" class="columns m-auto">
<section class="mode section column m-auto">
<%= image_tag(@mode + ".jpg", "data-mood-target": "image") %>
</section>
<section class="tracker section column">
<h1 class="title is-1">Comment ça KLUK aujourd'hui ?</h1>
<div class="info-day" data-mood-target="info">Aujourd'hui</div>
<div class="moods container">
<div class="log">
<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="info-day subtitle" data-mood-target="info">Aujourd'hui</div>
<div class="moods">
<div class="log is-flex is-flex-wrap-wrap">
<% @mood_log.each do |week| %>
<div class="week">
<div class="week is-flex is-flex-direction-column is-flex-wrap-wrap mb-3">
<% week.each do |d| %>
<% if d[1] %>
<div data-image="<%= asset_path(d[1] + ".jpg") %>" data-mode="<%= d[1] %>" data-day="<%= d[0] %>" data-action="mouseover->mood#updateDayInfo mouseleave->mood#updateDayInfo" title="<%= d[0] %> : <%= d[1] %>" class="day <%= d[1] %>"></div>
@ -20,24 +20,24 @@
<% end %>
</div>
</div>
<div class="level">
<div class="level-item">
<div class="level m-auto">
<div class="level-item has-text-centered">
<div class="bar-frigo"></div>
<div class="bar-explain">Triste</div>
</div>
<div class="level-item">
<div class="level-item has-text-centered">
<div class="bar-en-charge"></div>
<div class="bar-explain">En charge</div>
</div>
<div class="level-item">
<div class="level-item has-text-centered">
<div class="bar-croisiere"></div>
<div class="bar-explain">Croisiere</div>
</div>
<div class="level-item">
<div class="level-item has-text-centered">
<div class="bar-creatif"></div>
<div class="bar-explain">Créatif</div>
</div>
<div class="level-item">
<div class="level-item has-text-centered">
<div class="bar-afond"></div>
<div class="bar-explain">A fond</div>
</div>