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

put legend on top of the log

Browse source
This commit is contained in:
Christophe Robillard 2026-01-07 17:29:10 +01:00
parent f328f3a10d
commit 4e25f9936a
2 changed files with 35 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
app/assets/stylesheets/kluk.css
View file

@ -52,10 +52,6 @@ body {
height: 10px; height: 10px;
} }
.bar-explain {
padding-left: 5px;
}
.day { .day {
border: 1px; border: 1px;
margin: 4px; margin: 4px;

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

@ -2,15 +2,36 @@
<section class="is-hidden-mobile mode section column m-auto"> <section class="is-hidden-mobile mode section column m-auto">
<%= image_tag(@mode + ".jpg", "data-mood-target": "image") %> <%= image_tag(@mode + ".jpg", "data-mood-target": "image") %>
</section> </section>
<section class="is-hidden-desktop section column m-auto current-day"> <section class="is-hidden-tablet section column m-auto current-day">
<h1 class="title is-1 is-spaced">Comment ça KLUK ?</h1> <h1 class="title is-1 is-spaced">Comment ça KLUK ?</h1>
<div class="block subtitle" data-mood-target="mode"><%= @mode %></div> <div class="block subtitle" data-mood-target="mode"><%= @mode %></div>
<div class="block subtitle" data-mood-target="day">Aujourd'hui</div> <div class="block subtitle" data-mood-target="dayMobile">Aujourd'hui</div>
</section> </section>
<section class="tracker section column has-background-primary-light my-0 mx-auto"> <section class="tracker section column has-background-primary-light my-0 mx-auto">
<h1 class="title is-1 mt-6 is-hidden-mobile">Comment ça KLUK aujourd'hui ?</h1> <h1 class="title is-1 mt-6 is-hidden-mobile">Comment ça KLUK ?</h1>
<div class="subtitle is-hidden-mobile" data-mood-target="day">Aujourd'hui</div> <div class="subtitle is-hidden-mobile" data-mood-target="day">Aujourd'hui</div>
<div> <div class="is-flex is-flex-wrap-wrap mb-5 ">
<div class="is-flex is-align-items-center mr-4">
<div class="bar-frigo mr-1"></div>
<div class="">Tristoune</div>
</div>
<div class="is-flex is-align-items-center mr-4">
<div class="bar-en-charge mr-1"></div>
<div class="">En chargement</div>
</div>
<div class="is-flex is-align-items-center mr-4">
<div class="bar-croisiere mr-1"></div>
<div class="">Croisiere</div>
</div>
<div class="is-flex is-align-items-center mr-4">
<div class="bar-creatif mr-1"></div>
<div>Creatif</div>
</div>
<div class="is-flex is-align-items-center mr-4">
<div class="bar-afond mr-1"></div>
<div class="">A fond</div>
</div>
</div>
<div class="is-flex is-flex-wrap-wrap"> <div class="is-flex is-flex-wrap-wrap">
<% @mood_log.each do |week| %> <% @mood_log.each do |week| %>
<div class="is-flex is-flex-direction-column is-flex-wrap-wrap mb-3"> <div class="is-flex is-flex-direction-column is-flex-wrap-wrap mb-3">
@ -24,28 +45,5 @@
</div> </div>
<% end %> <% end %>
</div> </div>
</div>
<div class="level m-auto">
<div class="level-item has-text-centered">
<span class="bar-frigo"></span>
<div class="bar-explain">Triste</div>
</div>
<div class="level-item has-text-centered">
<span class="bar-en-charge"></span>
<div class="bar-explain">En charge</div>
</div>
<div class="level-item has-text-centered">
<span class="bar-croisiere"></span>
<div class="bar-explain">Croisiere</div>
</div>
<div class="level-item has-text-centered">
<span class="bar-creatif"></span>
<div class="bar-explain">Créatif</div>
</div>
<div class="level-item has-text-centered">
<span class="bar-afond"></span>
<div class="bar-explain">A fond</div>
</div>
</div>
</section> </section>
</main> </main>