Merge pull request #4354 from tvdeyen/v3.0-fix-dl-style

[v3.0] Make more room for long values in Order Summary
solidusio · Apr 26, 2022 · 2afc2ec · 2afc2ec
2 parents f37cca8 + 6bff1c4
commit 2afc2ec
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 32 deletions.
diff --git a/backend/app/assets/stylesheets/spree/backend/shared/_typography.scss b/backend/app/assets/stylesheets/spree/backend/shared/_typography.scss
@@ -57,38 +57,6 @@ ul.text_list {
   padding-left: 0;
 }
 
-dl {
-  width: 100%;
-  overflow: hidden;
-  margin: 5px 0;
-  color: lighten($body-color, 15);
-
-  dt, dd {
-    float: left;
-    line-height: 16px;
-    padding: 5px;
-  }
-
-  dt {
-    width: 40%;
-    font-weight: $font-weight-bold;
-    padding-left: 0;
-    clear: left;
-  }
-
-  dd {
-    width: 60%;
-    padding-right: 0;
-    margin-left: 0;
-  }
-}
-
-.dl-collapse {
-  dt, dd {
-    width: auto;
-  }
-}
-
 // Helpers
 .align-center  { text-align: center  }
 .align-right   { text-align: right   }

diff --git a/backend/vendor/assets/stylesheets/solidus_admin/bootstrap/mixins/_lists.scss b/backend/vendor/assets/stylesheets/solidus_admin/bootstrap/mixins/_lists.scss
@@ -5,3 +5,38 @@
   padding-left: 0;
   list-style: none;
 }
+
+dl {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  width: 100%;
+  overflow: hidden;
+  margin: 5px 0;
+  color: lighten($body-color, 15);
+
+  dt,
+  dd {
+    min-width: 40%;
+    line-height: 16px;
+    padding: 5px;
+  }
+
+  dt {
+    font-weight: $font-weight-bold;
+    padding-left: 0;
+  }
+
+  dd {
+    text-align: right;
+    padding-right: 0;
+    margin-left: 0;
+  }
+}
+
+.dl-collapse {
+  dt,
+  dd {
+    width: auto;
+  }
+}