From 53c7d59767a6478963e0b99868484390fe621262 Mon Sep 17 00:00:00 2001
From: Amanda Dominy <gillespie.amanda@gmail.com>
Date: Fri, 28 Feb 2020 13:56:37 +0000
Subject: [PATCH] Fix aligncenter images

Images with .aligncenter still aren't centered with only the style .mx-auto because they need to be set to display:block as well.
---
 sass/understrap/understrap.scss | 152 ++++++++++++++++++--------------
 1 file changed, 87 insertions(+), 65 deletions(-)

diff --git a/sass/understrap/understrap.scss b/sass/understrap/understrap.scss
index a9f4869..b52ac9e 100644
--- a/sass/understrap/understrap.scss
+++ b/sass/understrap/understrap.scss
@@ -1,127 +1,149 @@
 // Some basic padding for all wrappers
 .wrapper {
-  padding: $grid-gutter-width 0; }
+	padding: $grid-gutter-width 0;
+}
 
 // Reset hero wrapper padding to 0
-#wrapper-hero { padding: 0px !important; }
+#wrapper-hero {
+	padding: 0px !important;
+}
 
 // Adding basic WordPress classes to pass the WordPress.org tests
 .sticky,
 .gallery-caption,
 .bypostauthor {
-  font-size: inherit;
+	font-size: inherit;
 }
 
 // Separate sticky wrapper from main content
-.wrapper#wrapper-sticky { border-bottom: 1px solid $gray-300; }
+.wrapper#wrapper-sticky {
+	border-bottom: 1px solid $gray-300;
+}
 
 // Adding some contrast background color to footer full widget
 #wrapper-footer-full,
-#wrapper-static-hero { background-color: $gray-200; }
+#wrapper-static-hero {
+	background-color: $gray-200;
+}
 
 // Necessary WP classes
-.wp-caption { font-size: inherit; }
+.wp-caption {
+	font-size: inherit;
+}
 
-.wp-caption-text { font-size: inherit; }
+.wp-caption-text {
+	font-size: inherit;
+}
 
-.screen-reader-text { @extend .sr-only; }
+.screen-reader-text {
+	@extend .sr-only;
+}
 
 .alignleft {
-  display: inline;
-  float: left;
-  margin-right: 1.5em;
+	display: inline;
+	float: left;
+	margin-right: 1.5em;
 }
 
 .alignright {
-  display: inline;
-  float: right;
-  margin-left: 1.5em;
+	display: inline;
+	float: right;
+	margin-left: 1.5em;
 }
 
-.aligncenter { @extend .mx-auto; }
+.aligncenter {
+	@extend .mx-auto,
+	.d-block;
+}
 
 .widget_categories,
 .widget_archive {
-	select { 
+	select {
 		@extend .form-control;
 	}
 }
 
 // Post design
-.entry-footer span { padding-right: 10px; }
+.entry-footer span {
+	padding-right: 10px;
+}
 
-// Limit featured image size to 100%
 img.wp-post-image,
 article img,
 figure,
 img,
 #secondary img {
-  max-width: 100%;
-  height: auto;
+	max-width: 100%;
+	height: auto;
 }
 
 // Skip to content link
 a.skip-link {
-  position: fixed;
-  z-index: 1000;
-  top: 0px;
-  right: 0px;
+	position: fixed;
+	z-index: 1000;
+	top: 0px;
+	right: 0px;
 }
 
 // Reset Jumbotron default margin
-.jumbotron { margin-bottom: 0px; }
+.jumbotron {
+	margin-bottom: 0px;
+}
 
 // Dropdown translation
-.navbar-dark .navbar-nav .dropdown-menu .nav-link{
-  display: block;
-  width: 100%; // For `<button>`s
-  padding: $dropdown-item-padding-y $dropdown-item-padding-x;
-  clear: both;
-  font-weight: $font-weight-normal;
-  color: $dropdown-link-color !important;
-  text-align: inherit; // For `<button>`s
-  white-space: nowrap; // prevent links from randomly breaking onto new lines
-  background: none; // For `<button>`s
-  border: 0; // For `<button>`s
+.navbar-dark .navbar-nav .dropdown-menu .nav-link {
+	display: block;
+	width: 100%; // For `<button>`s
+	padding: $dropdown-item-padding-y $dropdown-item-padding-x;
+	clear: both;
+	font-weight: $font-weight-normal;
+	color: $dropdown-link-color !important;
+	text-align: inherit; // For `<button>`s
+	white-space: nowrap; // prevent links from randomly breaking onto new lines
+	background: none; // For `<button>`s
+	border: 0; // For `<button>`s
 
-  @include hover-focus {
-    color: $dropdown-link-hover-color !important;
-    text-decoration: none;
-    background-color: $dropdown-link-hover-bg;
-  }
+	@include hover-focus {
+		color: $dropdown-link-hover-color !important;
+		text-decoration: none;
+		background-color: $dropdown-link-hover-bg;
+	}
 
-  &.active,
-  &:active {
-    color: $dropdown-link-active-color !important;
-    text-decoration: none;
-    background-color: $dropdown-link-active-bg;
-  }
+	&.active,
+	&:active {
+		color: $dropdown-link-active-color !important;
+		text-decoration: none;
+		background-color: $dropdown-link-active-bg;
+	}
 
-  &.disabled,
-  &:disabled {
-    color: $dropdown-link-disabled-color !important;
-    background-color: transparent;
-    // Remove CSS gradients if they're enabled
-    @if $enable-gradients {
-      background-image: none;
-    }
-  }
+	&.disabled,
+	&:disabled {
+		color: $dropdown-link-disabled-color !important;
+		background-color: transparent;
+
+		// Remove CSS gradients if they're enabled
+		@if $enable-gradients {
+			background-image: none;
+		}
+	}
 }
 
 .navbar-light .navbar-brand a {
-     color: $navbar-light-active-color;
+	color: $navbar-light-active-color;
 
-    @include hover-focus {
-      color: $navbar-light-active-color;
-    }
+	@include hover-focus {
+		color: $navbar-light-active-color;
+	}
 }
 
 .navbar-dark .navbar-brand a {
-    color: $navbar-dark-active-color;
+	color: $navbar-dark-active-color;
 
-    @include hover-focus {
-      color: $navbar-dark-active-color;
-    }
+	@include hover-focus {
+		color: $navbar-dark-active-color;
+	}
 }
 
-.navbar h1 { font-weight: $font-weight-normal; }
+.navbar h1 {
+	font-weight: $font-weight-normal;
+}