Fix aspect ratio / Other fixes

mainio · Apr 18, 2024 · 34706bd · 34706bd
1 parent 52aaaf2
commit 34706bd
Show file tree

Hide file tree

Showing 7 changed files with 36 additions and 19 deletions.
diff --git a/app/controllers/decidim/iframe/iframe_controller.rb b/app/controllers/decidim/iframe/iframe_controller.rb
@@ -16,24 +16,32 @@ def iframe
       def element
         case content_height
         when "16:9"
-          "<iframe id=\"iFrame\" class=\"aspect-ratio-16-9\" src=\"#{attributes.src}\" width=\"#{content_width}\"
-          frameborder=\"#{attributes.frameborder}\"></iframe>"
+          "<iframe id=\"iFrame\" class=\"aspect-ratio-16\" src=\"#{attributes.src}\" width=\"#{content_width}\"
+          frameborder=\"#{frameborder?}\"></iframe>"
         when "4:3"
-          "<iframe id=\"iFrame\" class=\"aspect-ratio-4-3\" src=\"#{attributes.src}\" width=\"#{content_width}\"
-          frameborder=\"#{attributes.frameborder}\"></iframe>"
+          "<iframe id=\"iFrame\" class=\"aspect-ratio-4\" src=\"#{attributes.src}\" width=\"#{content_width}\"
+          frameborder=\"#{frameborder?}\"></iframe>"
         when "auto"
           "<iframe id=\"iFrame\" src=\"#{attributes.src}\" width=\"#{content_width}\"
-          frameborder=\"#{attributes.frameborder}\"></iframe>"
+          frameborder=\"#{frameborder?}\"></iframe>"
         when "manual_pixel"
           "<iframe id=\"iFrame\" src=\"#{attributes.src}\" width=\"#{content_width}\"
-          height=\"#{attributes.height_value}px\"frameborder=\"#{attributes.frameborder}\"></iframe>"
+          height=\"#{attributes.height_value}px\"frameborder=\"#{frameborder?}\"></iframe>"
         end
       end
 
       def attributes
         @attributes ||= current_component.settings
       end
 
+      def frameborder?
+        if attributes.frameborder
+          "1"
+        else
+          "0"
+        end
+      end
+
       def content_height
         attributes.content_height
       end

diff --git a/app/packs/stylesheets/decidim/iframe/iframe.scss b/app/packs/stylesheets/decidim/iframe/iframe.scss
@@ -0,0 +1,7 @@
+.aspect-ratio-16 {
+  aspect-ratio: 16/9;
+}
+
+.aspect-ratio-4 {
+  aspect-ratio: 4 / 3;
+}
diff --git a/app/views/decidim/iframe/iframe/show.html.erb b/app/views/decidim/iframe/iframe/show.html.erb
@@ -7,7 +7,7 @@
   <% end %>
 </style>
 
-<div class="iframe<%= " row" if viewport_width? %>">
+<div class="iframe<%= " row column" if viewport_width? %>">
   <%= iframe %>
 </div>
 

diff --git a/config/assets.rb b/config/assets.rb
@@ -7,3 +7,5 @@
 Decidim::Webpacker.register_entrypoints(
   decidim_iframe: "#{base_path}/app/packs/entrypoints/decidim_iframe.js"
 )
+
+Decidim::Webpacker.register_stylesheet_import("stylesheets/decidim/iframe/iframe")
diff --git a/config/locales/en.yml b/config/locales/en.yml
@@ -14,18 +14,18 @@ en:
               before using the automatic height option. Read more about how to support
               this library from the iframe-resizer documentation.
             content_height_options:
-              '16:9': '16:9'
-              '4:3': '4:3'
+              '16:9': '16:9 aspect ratio'
+              '4:3': '4:3 aspect ratio'
               auto: Automatic height
               manual_pixel: Manual height in pixels
             content_width: Content width
             content_width_options:
               full_width: Full width
               manual_percentage: Manual width as a percentage
               manual_pixel: Manual width in pixels
-            frameborder: Content frameborder
+            frameborder: Add border around the iframe
             height_value: Height value
-            no_margins: No margins
+            no_margins: Remove margins around the iframe
             resize_iframe: Resize Iframe
             resize_iframe_options:
               manual: Resize manually

diff --git a/config/locales/fi.yml b/config/locales/fi.yml
@@ -18,13 +18,13 @@ fi:
                                  tukeminen ennen automaattisen korkeuden säädön käyttöä. Katso iframe-resizer
                                  dokumentaatio lukeaksesi lisää tämän kirjaston tukemisesta.
             content_height_options:
-              "16:9": "16:9"
-              "4:3": "4:3"
+              "16:9": "16:9 kuvasuhde"
+              "4:3": "4:3 kuvasuhde"
               auto: Automaattinen korkeus
               manual_pixel: Korkeus pikseleissä
-            frameborder: Sisällön kehys
+            frameborder: Lisää kehys iframe -elementille
             height_value: Korkeusarvo
-            no_margins: Ei reunoja
+            no_margins: Poista reunat iframe -elementiltä
             resize_iframe: Iframe -elementin koko
             resize_iframe_options:
               responsive: Automaattinen koko

diff --git a/config/locales/sv.yml b/config/locales/sv.yml
@@ -18,13 +18,13 @@ sv:
               library before using the automatic height option. Read more about how to support this library from the
               iframe-resizer documentation.
             content_height_options:
-              "16:9": "16:9"
-              "4:3": "4:3"
+              "16:9": "16:9 aspect ratio"
+              "4:3": "4:3 aspect ratio"
               auto: Automatic height
               manual_pixel: Manual height in pixels
-            frameborder: Content frameborder
+            frameborder: Add border around the iframe
             height_value: Height value
-            no_margins: No margins
+            no_margins: Remove margins around the iframe
             resize_iframe: Resize Iframe
             resize_iframe_options:
               manual: Resize manually