From 57c26d2cf9c4c1d825fe4356a6fd14842dc86af1 Mon Sep 17 00:00:00 2001
From: Felipe Dalcin <felipe@pressbooks.com>
Date: Tue, 22 Jun 2021 19:30:01 -0300
Subject: [PATCH] Fix positioning for images without caption in PDFs (#788)

* Fix image positioning
* Fix gh action
* Simplify rules for styling aligned images

Co-authored-by: SteelWagstaff <steel@pressbooks.com>
---
 .github/workflows/.pipeline.yml               |  4 ++-
 .../styles/components/media/_images.scss      | 34 +++++++++++++++++++
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/.pipeline.yml b/.github/workflows/.pipeline.yml
index 933a74a1d..4f8343c2f 100644
--- a/.github/workflows/.pipeline.yml
+++ b/.github/workflows/.pipeline.yml
@@ -31,7 +31,9 @@ jobs:
           node-version: '10'
 
       - name: Install OS dependencies
-        run: sudo apt-get install libxml2-utils ghostscript poppler-utils
+        run: |
+          sudo apt update
+          sudo apt-get install libxml2-utils ghostscript poppler-utils
 
       - name: Start required services
         run: sudo systemctl start mysql.service
diff --git a/packages/buckram/assets/styles/components/media/_images.scss b/packages/buckram/assets/styles/components/media/_images.scss
index 3df299877..78c390ec7 100644
--- a/packages/buckram/assets/styles/components/media/_images.scss
+++ b/packages/buckram/assets/styles/components/media/_images.scss
@@ -9,6 +9,40 @@
   }
 }
 
+p {
+  img {
+    &.aligncenter {
+      margin: if-map-get($image-wrapper-margin-top, $type) auto if-map-get($image-wrapper-margin-bottom, $type);
+      text-align: center;
+      display: block;
+
+      @include caption-text-align(center);
+    }
+
+    &.alignleft {
+      float: left;
+      margin: if-map-get($image-wrapper-margin-top, $type) if-map-get($image-alignleft-margin-right, $type) if-map-get($floated-image-wrapper-margin-bottom, $type) 0;
+      padding-right: 0;
+
+      @include caption-text-align(left);
+    }
+
+    &.alignright {
+      float: right;
+      margin: if-map-get($image-wrapper-margin-top, $type) 0 if-map-get($floated-image-wrapper-margin-bottom, $type) if-map-get($image-alignright-margin-left, $type);
+      padding-left: 0;
+
+      @include caption-text-align(right);
+    }
+
+    @if $type != 'web' {
+      &.aligncenter, &.alignleft, &.alignright {
+        max-width: 50%;
+      }
+    }
+  }
+}
+
 @if $type == 'epub' {
   figcaption,
   .wp-caption-text {