krichtof/config
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update font

Browse source
This commit is contained in:
Christophe Robillard 2025-06-29 12:21:06 +02:00
parent 17b97e937a
commit 7dcc576689
2 changed files with 22 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
public/main.css
View file

@ -1,6 +1,8 @@
body {
margin: 0px;
font: 1.8rem "Fira Sans", sans-serif;
font-family: "Sour Gummy", sans-serif;
font-weight: 350;
font-style: normal;
}
.mode {
@ -15,6 +17,7 @@ body {
.title {
grid-area: title;
margin: 30px;
font-size: 2rem;
}
.legend .bar-creatif {
@ -89,9 +92,10 @@ main {
grid-area: tracker;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 2fr 6fr 1fr;
grid-template-rows: 2fr 1fr 6fr 1fr;
grid-template-areas:
"title title"
"info-day info-day"
"moods moods"
". legend";
background-color: lightgoldenrodyellow;
@ -107,6 +111,10 @@ main {
margin: 30px;
}
.info-day {
grid-area: info-day;
margin: 30px;
}
.info {
grid-area: info;
@ -127,6 +135,7 @@ main {
max-height: 100%;
display: flex;
flex-direction: column;
overflow: hidden;
}
.legend {

20
views/index.erb
View file

@ -3,21 +3,22 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="main.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Delius&family=Sour+Gummy:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<script type="module">
import { Application, Controller } from "https://unpkg.com/@hotwired/stimulus/dist/stimulus.js"
window.Stimulus = Application.start()
Stimulus.register("mood", class extends Controller {
static targets = [ "image" ]
static targets = [ "image", "info" ]
showMode(event) {
const image = this.imageTarget
updateDayInfo(event) {
const image = this.imageTarget;
const infoDay = this.infoTarget;
image.src = event.target.dataset.mode + ".jpg"
}
showCurrent() {
const image = this.imageTarget
image.src = "<%= @mode %>.jpg"
infoDay.textContent = event.target.dataset.day;
}
})
@ -31,13 +32,14 @@
<div class="title">
<h1>Comment il va le Robi ?</h1>
</div>
<div class="info-day" data-mood-target="info">Aujourd'hui</div>
<div class="moods">
<div class="log">
<% @mood_log.each do |week| %>
<div class="week">
<% week.each do |d| %>
<% if d[1] %>
<div data-mode="<%= d[1] %>" data-action="mouseover->mood#showMode mouseleave->mood#showMode" title="<%= d[0] %> : <%= d[1] %>" class="day <%= d[1] %>"></div>
<div 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>
<% else %>
<div class="day"></div>
<% end %>