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 <[email protected]>
pressbooks · Jun 22, 2021 · 57c26d2 · 57c26d2
1 parent 7fe7f68
commit 57c26d2
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 1 deletion.
diff --git 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
@@ -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 {