Integration: Margin between elements should be 24px (rem eqv.) (#856)

closes #841

---------

Co-authored-by: create-issue-branch[bot] <53036503+create-issue-branch[bot]@users.noreply.github.com>
Co-authored-by: Lois Wells <lois.wells@raspberrypi.org>
Co-authored-by: Lois Wells <88904316+loiswells97@users.noreply.github.com>
Co-authored-by: MagdalenaJadach <magdalena@raspberrypi.org>

CHANGELOG.md

@@ -49,6 +49,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 - Dark mode button theming (#850)
 - `<strong>` styling on Firefox (#854)
 - Progress bar width on Firefox (#855)
+- Instructions blocks spacing (#856)
 - Font family stacking (#857)
 - Save/download panel spacing (#859)
 

src/assets/stylesheets/Instructions.scss

@@ -33,7 +33,7 @@
   }
 
   .c-project-code {
-    margin: $space-1 0;
+    margin: $space-1 0 $space-1-5 0;
     border-radius: 8px;
     background-color: $rpf-grey-700;
 
@@ -169,7 +169,7 @@
     gap: $space-1;
     border-end-start-radius: 8px;
     border-end-end-radius: 8px;
-    margin-block-end: $space-1;
+    margin-block-end: $space-1-5;
 
     p {
       margin: 0;
@@ -187,7 +187,7 @@
     display: flex;
     flex-direction: column;
     gap: $space-0-5;
-    margin: $space-1 0;
+    margin: $space-1-5 0;
 
     h3 {
       margin: 0;
@@ -227,6 +227,7 @@
     padding: $space-1;
     border-radius: 8px;
     border: 1px solid var(--rpf-grey-150);
+    margin-block-end: $space-1-5;
 
     pre {
       padding: 0;