Merge pull request #3762 from stephaniehobson/1189515-details-bottom-…

…margin Bug 1189515: Details and summary
mdn · Feb 2, 2016 · 82a5bbd · 82a5bbd
2 parents 641f454 + 552cfc5
commit 82a5bbd
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 8 deletions.
diff --git a/kuma/static/styles/base/elements/sectioning.styl b/kuma/static/styles/base/elements/sectioning.styl
@@ -55,6 +55,11 @@ footer {
 details {
     clear: both;
     display: block;
+    margin-bottom: $grid-spacing;
+}
+
+details + details {
+    margin-top: $grid-spacing * -1;
 }
 
 summary  {

diff --git a/kuma/static/styles/components/wiki/no-details.styl b/kuma/static/styles/components/wiki/no-details.styl
@@ -1,20 +1,21 @@
 /* The .no-details styles will get applied only if JavaScript is enabled and
-<details> is not natively supported. Add focus styles (for keyboard
-accessibility) */
+<details> is not natively supported. */
 .no-details {
     summary {
         cursor: pointer;
+        bidi-style(padding-right, -15px, padding-left, 0);
     }
-    summary:before {
-        set-font-size(1.25em);
-        bidi-value(float, left, right);
+    summary:after {
         content: '+';
+        bidi-value(float, right, left);
         margin-top: -.15em;
-        bidi-style(margin-left, -15px, margin-right, 0);
+        bidi-style(margin-right, -15px, margin-left, 0);
+        set-font-size(1.25em);
+        font-weight: bold;
     }
-    &.open summary:before {
+    &.open summary:after {
         content: '–';
         margin-top: -.2em;
-        bidi-style(margin-left, -13px, margin-right, 0);
+        bidi-style(margin-right, -13px, margin-left, 0);
     }
 }