move head tags from index to layout

This commit is contained in:
Christophe Robillard 2025-08-05 16:56:33 +02:00
parent 2653930993
commit ac5faa4475
3 changed files with 19 additions and 28 deletions

View file

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

View file

@ -2,6 +2,7 @@
<html>
<head>
<title><%= content_for(:title) || "Moodie" %></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
@ -17,6 +18,10 @@
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/icon.png">
<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">
<%# Includes all stylesheet files in app/assets/stylesheets %>
<%= stylesheet_link_tag :app, "data-turbo-track": "reload" %>
<%= javascript_importmap_tags %>

View file

@ -1,32 +1,6 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<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", "info" ]
updateDayInfo(event) {
const image = this.imageTarget;
const infoDay = this.infoTarget;
image.src = event.target.dataset.mode + ".jpg"
infoDay.textContent = event.target.dataset.day;
}
})
</script>
</head>
<main data-controller="mood">
<div class="mode">
<!--img data-mood-target="image" src="<%= @mode %>.jpg"-->
<%= image_tag @mode + ".jpg" %>
<%= image_tag(@mode + ".jpg", "data-mood-target": "image") %>
</div>
<div class="tracker">
<div class="title">
@ -39,7 +13,7 @@
<div class="week">
<% week.each do |d| %>
<% if d[1] %>
<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>
<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>
<% else %>
<div class="day"></div>
<% end %>