Revert comments changes to apply to document.scss only

assets/styles/generic/_button.scss

@@ -16,20 +16,20 @@ button,
         text-decoration: none;
     }
 
-    display: inline-block; // [1]
-    overflow: visible; // [2]
-    margin: 0; // [3]
+    display: inline-block; /* [1] */
+    overflow: visible; /* [2] */
+    margin: 0; /* [3] */
     padding: 0;
     outline: 0;
     border: 0;
     background: none transparent;
     color: inherit;
-    vertical-align: middle; // [4]
-    text-align: center; // [3]
+    vertical-align: middle; /* [4] */
+    text-align: center; /* [3] */
     text-decoration: none;
     text-transform: none;
-    font: inherit; // [5]
+    font: inherit; /* [5] */
     line-height: normal;
-    cursor: pointer; // [6]
+    cursor: pointer; /* [6] */
     user-select: none;
 }

assets/styles/generic/_generic.scss

@@ -10,7 +10,7 @@ html {
 // Add the correct display in IE 10-.
 // 1. Add the correct display in IE.
 //
-template, // [1]
+template, /* [1] */
 [hidden] {
     display: none;
 }
@@ -66,7 +66,7 @@ h1, h2, h3, h4, h5, h6 {
  * 1. Single taps should be dispatched immediately on clickable elements
  */
 a, area, button, input, label, select, textarea, [tabindex] {
-    -ms-touch-action: manipulation; // [1]
+    -ms-touch-action: manipulation; /* [1] */
     touch-action: manipulation;
 }
 

assets/styles/generic/_media.scss

@@ -13,7 +13,7 @@ iframe,
 img,
 svg,
 video {
-    vertical-align: middle; // [1]
+    vertical-align: middle; /* [1] */
 }
 
 //
@@ -29,16 +29,16 @@ audio:not([controls]) {
 //
 img,
 svg {
-    max-width: 100%; // [2]
+    max-width: 100%; /* [2] */
     height: auto;
 
     //
     // 4. If a `width` and/or `height` attribute have been explicitly defined, let’s
     //    not make the image fluid.
     //
-    &[width], // [4]
+    &[width], /* [4] */
     &[height] {
-        // [4]
+        /* [4] */
         max-width: none;
     }
 }
@@ -47,12 +47,12 @@ svg {
 // 4. Offset `alt` text from surrounding copy.
 //
 img {
-    font-style: italic; // [4]
+    font-style: italic; /* [4] */
 }
 
 //
 // 5. SVG elements should fallback to their surrounding text color.
 //
 svg {
-    fill: currentColor; // [5]
+    fill: currentColor; /* [5] */
 }

assets/styles/objects/_crop.scss

@@ -21,9 +21,9 @@ $crop-ratios: (
  * 2. This is the crucial part: where the cropping happens.
  */
 .o-crop {
-    position: relative; // [1]
+    position: relative; /* [1] */
     display: block;
-    overflow: hidden; // [2]
+    overflow: hidden; /* [2] */
 }
 
 /**
@@ -34,9 +34,9 @@ $crop-ratios: (
  */
 .o-crop_content {
     position: absolute;
-    top: 0; // [1]
-    left: 0; // [1]
-    max-width: none; // [2]
+    top: 0; /* [1] */
+    left: 0; /* [1] */
+    max-width: none; /* [2] */
 
     /**
      * We can position the media in different locations within the cropping area.

assets/styles/objects/_ratio.scss

@@ -17,7 +17,7 @@
 
     &:before {
         display: block;
-        padding-bottom: 100%; // [1]
+        padding-bottom: 100%; /* [1] */
         width: 100%;
         content: "";
     }

assets/styles/utilities/_print.scss

@@ -21,7 +21,7 @@
     *:first-line {
         background: transparent !important;
         box-shadow: none !important;
-        color: #000000 !important; // [1]
+        color: #000000 !important; /* [1] */
         text-shadow: none !important;
     }
 

www/assets/styles/main.css

@@ -532,15 +532,12 @@ button:focus, button:hover,
   text-decoration: none;
 }
 
-/* [1] */
 html {
   min-height: 100%;
-  /* [2] */
   line-height: 1.5;
   font-family: "Webfont Sans", "Helvetica Neue", Arial, sans-serif;
   color: #222222;
   line-height: 1.5;
-  /* [3] */
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
@@ -566,7 +563,6 @@ html {
 @media (min-width: 1200px) and (max-width: 1599px) {
   html {
     font-size: 16px;
-    /* [1] */
   }
 }