Use CSS instead of server requests for image format in pet styles form
Instead of offering a form to request a different format, we just render both in the HTML, and use CSS to swap between the two. Love to see the `:has` filter come through for us!
This commit is contained in:
parent
7f62417294
commit
5be35591c2
2 changed files with 26 additions and 22 deletions
|
@ -1,5 +1,4 @@
|
||||||
@import "../partials/clean/constants"
|
@import "../partials/clean/constants"
|
||||||
@import "../partials/context_button"
|
|
||||||
|
|
||||||
support-outfit-viewer
|
support-outfit-viewer
|
||||||
display: flex
|
display: flex
|
||||||
|
@ -39,8 +38,16 @@ support-outfit-viewer
|
||||||
input[type=radio]
|
input[type=radio]
|
||||||
margin: 0
|
margin: 0
|
||||||
|
|
||||||
[type=submit]
|
.outfit-viewer-area
|
||||||
+context-button
|
> [data-format=png]
|
||||||
|
display: none
|
||||||
|
|
||||||
|
&:has(input[value=png]:checked)
|
||||||
|
.outfit-viewer-area
|
||||||
|
> [data-format=svg]
|
||||||
|
display: none
|
||||||
|
> [data-format=png]
|
||||||
|
display: block
|
||||||
|
|
||||||
> table
|
> table
|
||||||
flex: 0 0 auto
|
flex: 0 0 auto
|
||||||
|
|
|
@ -1,24 +1,21 @@
|
||||||
= content_tag "support-outfit-viewer", **html_options do
|
= content_tag "support-outfit-viewer", **html_options do
|
||||||
= turbo_frame_tag "support-outfit-viewer-preview" do
|
%div
|
||||||
%div
|
.outfit-viewer-area
|
||||||
-# Render an outfit viewer in a magnifier. Use SVG by default for clarity,
|
%magic-magnifier{"data-format": "svg"}
|
||||||
-# but also offer an option to switch to PNG if it looks wrong.
|
= outfit_viewer outfit, preferred_image_format: :svg
|
||||||
%magic-magnifier
|
%magic-magnifier{"data-format": "png"}
|
||||||
= outfit_viewer outfit,
|
= outfit_viewer outfit, preferred_image_format: :png
|
||||||
preferred_image_format: params[:preferred_image_format] == "png" ? :png : :svg
|
|
||||||
|
|
||||||
= form_with method: :get, class: "outfit-viewer-controls" do |f|
|
= form_with method: :get, class: "outfit-viewer-controls" do |f|
|
||||||
%fieldset
|
%fieldset
|
||||||
%legend Format
|
%legend Format
|
||||||
%label
|
%label
|
||||||
= f.radio_button "preferred_image_format", "svg",
|
= f.radio_button "preferred_image_format", "svg",
|
||||||
checked: params[:preferred_image_format] != "png"
|
checked: true
|
||||||
SVG
|
SVG
|
||||||
%label
|
%label
|
||||||
= f.radio_button "preferred_image_format", "png",
|
= f.radio_button "preferred_image_format", "png"
|
||||||
checked: params[:preferred_image_format] == "png"
|
PNG
|
||||||
PNG
|
|
||||||
= f.submit "Update"
|
|
||||||
|
|
||||||
%table
|
%table
|
||||||
%thead
|
%thead
|
||||||
|
|
Loading…
Reference in a new issue