diff --git a/Gemfile.lock b/Gemfile.lock index 5e9169e..d467b22 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -152,7 +152,7 @@ GEM kaminari-core (= 1.2.2) kaminari-core (1.2.2) language_server-protocol (3.17.0.5) - lexxy (0.9.19) + lexxy (0.9.20) rails (>= 8.0.2) lint_roller (1.1.0) logger (1.7.0) @@ -463,7 +463,7 @@ CHECKSUMS kaminari-activerecord (1.2.2) sha256=0dd3a67bab356a356f36b3b7236bcb81cef313095365befe8e98057dd2472430 kaminari-core (1.2.2) sha256=3bd26fec7370645af40ca73b9426a448d09b8a8ba7afa9ba3c3e0d39cdbb83ff language_server-protocol (3.17.0.5) sha256=fd1e39a51a28bf3eec959379985a72e296e9f9acfce46f6a79d31ca8760803cc - lexxy (0.9.19) sha256=e143748704b90969148a9694d52084a99f1041edcfcf0b3e81a9692420223166 + lexxy (0.9.20) sha256=31b4e50b68302e9a4d00b5a3e104f3b27a0682d43510a1e9e6673da695038e6e lint_roller (1.1.0) sha256=2c0c845b632a7d172cb849cc90c1bce937a28c5c8ccccb50dfd46a485003cc87 logger (1.7.0) sha256=196edec7cc44b66cfb40f9755ce11b392f21f7967696af15d274dde7edff0203 loofah (2.25.1) sha256=d436c73dbd0c1147b16c4a41db097942d217303e1f7728704b37e4df9f6d2e04 diff --git a/app/assets/images/ico-wave.svg b/app/assets/images/ico-wave.svg index 29e6dcf..014bcfe 100644 --- a/app/assets/images/ico-wave.svg +++ b/app/assets/images/ico-wave.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/app/assets/images/inter-ikea-systems.svg b/app/assets/images/inter-ikea-systems.svg new file mode 100644 index 0000000..dad3468 --- /dev/null +++ b/app/assets/images/inter-ikea-systems.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index 28c1c44..56a389f 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -131,6 +131,7 @@ body { .debug-score { position: fixed; + display: none; font-size: var(--fs-s); right: 0; top: 0; @@ -401,6 +402,7 @@ main { .hero-container { display: grid; grid-template: 1fr / 1fr; + position: relative; & img, video { grid-area: 1 / 1; @@ -434,12 +436,33 @@ main { fill: var(--clr-bg, var(--clr-green)); } + #inter-ikea-systems { + position: absolute; + right: 0.5rem; + top: 1rem; + fill: var(--clr-black); + } + + &:has(img, video) { + #inter-ikea-systems { + fill: var(--clr-white); + } + } + + + & .hero-link { grid-area: 1 / 1; z-index: 2; } } +body:has(header) { + .hero-container #inter-ikea-systems { + top: 25%; + } +} + form:has(.cta) { display: flex; @@ -466,13 +489,51 @@ form:has(.cta) { } .share-container { - display: flex; - margin-block-end: 0.5rem; - - & .cta { + display: flex; + margin-block-start: 1rem; + & button { + font-size: var(--fs-base); + font-weight: 700; + color: var(--clr-black); + border: none; background-color: transparent; - border: 1px solid var(--clr-black); + display: inline-flex; + align-items: center; + gap: 0.5rem; } + + + +} + +.arrow { + display: block; + background-image: url("ico-arrow-right.svg"); + background-repeat: no-repeat; + background-position: 50% 50%; + width: 2rem; + aspect-ratio: 1; + background-color: var(--clr-white); + border-radius: 50%; +} + +.cta-container { + display: grid; + grid-template-columns: 1fr; + gap: 0.5rem; + justify-content: stretch; + align-items: stretch; + margin: 0 1rem; + +} + +.cta-link { + display: flex; + --clr-action: transparent; + border-radius: 100vw; + border: 1px solid var(--clr-black); + flex-grow: 1; + width: 100%; } .play-time { @@ -684,13 +745,21 @@ dialog::backdrop { .results-header { background-color: var(--clr-green); - padding: 2rem 1rem 3rem 1rem; + padding: 2rem 1rem 2rem 1rem; strong { display: block; } } +.results-header { + background-image: url("inter-ikea-systems.svg"); + background-repeat: no-repeat; + background-position: calc(100% - 0.5rem) 0.5rem; +} + + + .results-tagline { display: grid; grid-template-columns: 1fr max-content; diff --git a/app/views/game/done.html.erb b/app/views/game/done.html.erb index a25ae31..cde976e 100644 --- a/app/views/game/done.html.erb +++ b/app/views/game/done.html.erb @@ -4,10 +4,10 @@ <%= render partial: "stage_header" %>
- <%# render_responsive_picture(image_attachment.asset, alt: "Hero", fetchpriority: "high") %>
<%= @result_node.attachments[0]&.body&.html_safe %>
+ <%= svg "inter-ikea-systems" %> <%= svg "ico-wave" %>
diff --git a/app/views/game/facts.html.erb b/app/views/game/facts.html.erb index f9ca869..3c12b61 100644 --- a/app/views/game/facts.html.erb +++ b/app/views/game/facts.html.erb @@ -6,6 +6,7 @@
  • <%= render_responsive_picture(attachment.asset, alt: "Hero", fetchpriority: "high") %> + <%= svg "inter-ikea-systems" %> <%= svg "ico-wave" %>
    diff --git a/app/views/game/intro.html.erb b/app/views/game/intro.html.erb index 2aa0695..355c567 100644 --- a/app/views/game/intro.html.erb +++ b/app/views/game/intro.html.erb @@ -15,6 +15,7 @@
    <%= video_attachment.body.html_safe %>
    + <%= svg "inter-ikea-systems" %> <% end %> <%= link_to url_for(action: "stage", id: 1), class: "hero-link", "aria-label": t("game.got_it_lets_get_started"), data: { intro_target: "link" } do %><% end %> diff --git a/app/views/game/last_save.html.erb b/app/views/game/last_save.html.erb index 80939cb..f63a72a 100644 --- a/app/views/game/last_save.html.erb +++ b/app/views/game/last_save.html.erb @@ -9,6 +9,7 @@
    <%= image_attachment.body.html_safe %>
    + <%= svg "inter-ikea-systems" %> <%= svg "ico-wave" %> diff --git a/app/views/game/results.html.erb b/app/views/game/results.html.erb index 9b183b0..1842347 100644 --- a/app/views/game/results.html.erb +++ b/app/views/game/results.html.erb @@ -2,11 +2,21 @@

    <%= result_headline(current_player) %>

    + + +
    <%= result_description(current_player) %>
    + + <%= svg "ico-wave" %>
    @@ -72,17 +82,10 @@ - - -<%= button_to tag.span(t("game.save_another_tomato")), start_path, class: "cta" %> - +
    + <%= link_to tag.span(t("game.subscribe_to_newsletter")), "#", class: "cta cta-link" %> + <%= button_to tag.span(t("game.save_another_tomato")), start_path, class: "cta" %> +
    \ No newline at end of file diff --git a/app/views/game/stage.html.erb b/app/views/game/stage.html.erb index 1c1eb70..a80a1b8 100644 --- a/app/views/game/stage.html.erb +++ b/app/views/game/stage.html.erb @@ -8,6 +8,7 @@
    <%= image_attachment.body.html_safe %>
    + <%= svg "inter-ikea-systems" %> <%= svg "ico-wave" %> diff --git a/app/views/game/stage_result.html.erb b/app/views/game/stage_result.html.erb index fceb853..d972244 100644 --- a/app/views/game/stage_result.html.erb +++ b/app/views/game/stage_result.html.erb @@ -4,10 +4,10 @@ <%= render partial: "stage_header" %>
    - <%# render_responsive_picture(image_attachment.asset, alt: "Hero", fetchpriority: "high") %>
    <%= @result_node.attachments[0]&.body&.html_safe %>
    + <%= svg "inter-ikea-systems" %> <%= svg "ico-wave" %>
    diff --git a/app/views/game/start.html.erb b/app/views/game/start.html.erb index 604595f..35d1ebd 100644 --- a/app/views/game/start.html.erb +++ b/app/views/game/start.html.erb @@ -6,6 +6,7 @@
    <%= render_responsive_picture(@node.icon, alt: "Hero", fetchpriority: "high") %> + <%= svg "inter-ikea-systems" %> <%= svg "ico-wave" %>
    diff --git a/config/locales/en.yml b/config/locales/en.yml index 7595f6a..3dafbf4 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -34,6 +34,7 @@ en: sounds_good: Sounds good! save_another_tomato: Save another tomato share: Share game + subscribe_to_newsletter: Subscribe to newsletter results: best: diff --git a/db20260325.dump b/db20260325.dump deleted file mode 100644 index c379943..0000000 Binary files a/db20260325.dump and /dev/null differ