Update known issues comment. #88

fork-versions/default/_normalize.scss

@@ -375,22 +375,31 @@ svg:not(:root) {
 
 /**
  * Known issues:
- * - By default, Chrome on OS X and Safari on OS X allow very limited styling of
+ * - `select`:
+ *   By default, Chrome on OS X and Safari on OS X allow very limited styling of
  *   select, unless a border property is set. The default font weight on
  *   optgroup elements cannot safely be changed in Chrome on OSX and Safari on
  *   OS X.
- * - It is recommended that you do not style checkbox and radio inputs as
+ * - `[type="checkbox"]`:
+ *   It is recommended that you do not style checkbox and radio inputs as
  *   Firefox's implementation does not respect box-sizing, padding, or width.
- * - Certain font size values applied to number inputs cause the cursor style of
- *   the decrement button to change from default to text.
- * - The search input is not fully stylable by default. In Chrome and Safari on
- *   OSX/iOS you can't control font, padding, border, or background. In Chrome
- *   and Safari on Windows you can't control border properly. It will apply
- *   border-width but will only show a border color (which cannot be controlled)
- *   for the outer 1px of that border. Applying -webkit-appearance: textfield
- *   addresses these issues without removing the benefits of search inputs (e.g.
- *   showing past searches). Safari (but not Chrome) will clip the cancel button
- *   on when it has padding (and textfield appearance).
+ * - `[type="number"]`:
+ *   Certain font size values applied to number inputs cause the cursor style of
+ *   the decrement button to change from `default` to `text`.
+ * - `[type="search"]`:
+ *   The search input is not fully stylable by default. In Chrome and Safari on
+ *   OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
+ *   Chrome and Safari on Windows you can't control `border` properly. It will
+ *   apply `border-width` but will only show a border color (which cannot be
+ *   controlled) for the outer 1px of that border. Applying
+ *   `-webkit-appearance: textfield` addresses these issues without removing the
+ *   benefits of search inputs (e.g. showing past searches). Safari (but not
+ *   Chrome) will clip the cancel button on when it has padding (and `textfield`
+ *   appearance).
+ * - `::placeholder`:
+ *   In Edge, placeholders will disappear on `relative` or `absolute` positioned
+ *   `<input>` elements if you use `opacity` less than `1` due to a
+ *   [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
  */
 
 /**

fork-versions/deprecated-compass/_normalize.scss

@@ -372,22 +372,31 @@ svg:not(:root) {
 
 /**
  * Known issues:
- * - By default, Chrome on OS X and Safari on OS X allow very limited styling of
+ * - `select`:
+ *   By default, Chrome on OS X and Safari on OS X allow very limited styling of
  *   select, unless a border property is set. The default font weight on
  *   optgroup elements cannot safely be changed in Chrome on OSX and Safari on
  *   OS X.
- * - It is recommended that you do not style checkbox and radio inputs as
+ * - `[type="checkbox"]`:
+ *   It is recommended that you do not style checkbox and radio inputs as
  *   Firefox's implementation does not respect box-sizing, padding, or width.
- * - Certain font size values applied to number inputs cause the cursor style of
- *   the decrement button to change from default to text.
- * - The search input is not fully stylable by default. In Chrome and Safari on
- *   OSX/iOS you can't control font, padding, border, or background. In Chrome
- *   and Safari on Windows you can't control border properly. It will apply
- *   border-width but will only show a border color (which cannot be controlled)
- *   for the outer 1px of that border. Applying -webkit-appearance: textfield
- *   addresses these issues without removing the benefits of search inputs (e.g.
- *   showing past searches). Safari (but not Chrome) will clip the cancel button
- *   on when it has padding (and textfield appearance).
+ * - `[type="number"]`:
+ *   Certain font size values applied to number inputs cause the cursor style of
+ *   the decrement button to change from `default` to `text`.
+ * - `[type="search"]`:
+ *   The search input is not fully stylable by default. In Chrome and Safari on
+ *   OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
+ *   Chrome and Safari on Windows you can't control `border` properly. It will
+ *   apply `border-width` but will only show a border color (which cannot be
+ *   controlled) for the outer 1px of that border. Applying
+ *   `-webkit-appearance: textfield` addresses these issues without removing the
+ *   benefits of search inputs (e.g. showing past searches). Safari (but not
+ *   Chrome) will clip the cancel button on when it has padding (and `textfield`
+ *   appearance).
+ * - `::placeholder`:
+ *   In Edge, placeholders will disappear on `relative` or `absolute` positioned
+ *   `<input>` elements if you use `opacity` less than `1` due to a
+ *   [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
  */
 
 /**

fork-versions/typey-chroma-kss/base/forms/_forms.scss

@@ -105,6 +105,19 @@ input {
 // HTML5 types: `text`, `search`, `tel`, `url`, `email`, `password`, `date`,
 // `time`, `number`, `range`, `color`, and `file`.
 //
+// Note: Certain font size values applied to `number` inputs cause the cursor
+// style of the decrement button to change from `default` to `text`.
+//
+// Note: The search input is not fully stylable by default. In Chrome and Safari
+// on OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
+// Chrome and Safari on Windows you can't control `border` properly. It will
+// apply `border-width` but will only show a border color (which cannot be
+// controlled) for the outer 1px of that border. Applying
+// `-webkit-appearance: textfield` addresses these issues without removing the
+// benefits of search inputs (e.g. showing past searches). Safari (but not
+// Chrome) will clip the cancel button on when it has padding (and `textfield`
+// appearance).
+//
 // Markup: forms-input.twig
 //
 // Style guide: forms.base.input
@@ -138,8 +151,8 @@ input {
 // If an `<input>` element has the `type='checkbox'` attribute set, the form
 // field is displayed as a checkbox.
 //
-// It's recommended that you don't attempt to style these elements. Firefox's
-// implementation doesn't respect `box-sizing`, `padding`, or `width`.
+// It is recommended that you do not style checkbox and radio inputs as
+// Firefox's implementation does not respect box-sizing, padding, or width.
 //
 // Markup: forms-input-checkbox.twig
 //
@@ -150,8 +163,8 @@ input {
 // If an `<input>` element has the `type='radio'` attribute set, the form field
 // is displayed as a radio button.
 //
-// It's recommended that you don't attempt to style these elements. Firefox's
-// implementation doesn't respect `box-sizing`, `padding`, or `width`.
+// It is recommended that you do not style checkbox and radio inputs as
+// Firefox's implementation does not respect box-sizing, padding, or width.
 //
 // Markup: forms-input-radio.twig
 //
@@ -215,7 +228,9 @@ label {
 // options.
 //
 // Known limitation: by default, Chrome and Safari on OS X allow very limited
-// styling of `<select>`, unless a `border` property is set.
+// styling of `<select>`, unless a `border` property is set. The default font
+// weight on `optgroup` elements cannot safely be changed in Chrome on OSX and
+// Safari on OS X.
 //
 // Markup: forms-select.twig
 //

fork-versions/typey/_normalize.scss

@@ -330,22 +330,31 @@ svg:not(:root) {
 
 /**
  * Known issues:
- * - By default, Chrome on OS X and Safari on OS X allow very limited styling of
+ * - `select`:
+ *   By default, Chrome on OS X and Safari on OS X allow very limited styling of
  *   select, unless a border property is set. The default font weight on
  *   optgroup elements cannot safely be changed in Chrome on OSX and Safari on
  *   OS X.
- * - It is recommended that you do not style checkbox and radio inputs as
+ * - `[type="checkbox"]`:
+ *   It is recommended that you do not style checkbox and radio inputs as
  *   Firefox's implementation does not respect box-sizing, padding, or width.
- * - Certain font size values applied to number inputs cause the cursor style of
- *   the decrement button to change from default to text.
- * - The search input is not fully stylable by default. In Chrome and Safari on
- *   OSX/iOS you can't control font, padding, border, or background. In Chrome
- *   and Safari on Windows you can't control border properly. It will apply
- *   border-width but will only show a border color (which cannot be controlled)
- *   for the outer 1px of that border. Applying -webkit-appearance: textfield
- *   addresses these issues without removing the benefits of search inputs (e.g.
- *   showing past searches). Safari (but not Chrome) will clip the cancel button
- *   on when it has padding (and textfield appearance).
+ * - `[type="number"]`:
+ *   Certain font size values applied to number inputs cause the cursor style of
+ *   the decrement button to change from `default` to `text`.
+ * - `[type="search"]`:
+ *   The search input is not fully stylable by default. In Chrome and Safari on
+ *   OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
+ *   Chrome and Safari on Windows you can't control `border` properly. It will
+ *   apply `border-width` but will only show a border color (which cannot be
+ *   controlled) for the outer 1px of that border. Applying
+ *   `-webkit-appearance: textfield` addresses these issues without removing the
+ *   benefits of search inputs (e.g. showing past searches). Safari (but not
+ *   Chrome) will clip the cancel button on when it has padding (and `textfield`
+ *   appearance).
+ * - `::placeholder`:
+ *   In Edge, placeholders will disappear on `relative` or `absolute` positioned
+ *   `<input>` elements if you use `opacity` less than `1` due to a
+ *   [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
  */
 
 /**

sass/normalize/_normalize-mixin.scss

@@ -414,26 +414,6 @@
     /* Forms
        ========================================================================== */
 
-    /**
-     * Known issues:
-     * - By default, Chrome on OS X and Safari on OS X allow very limited styling of
-     *   select, unless a border property is set. The default font weight on
-     *   optgroup elements cannot safely be changed in Chrome on OSX and Safari on
-     *   OS X.
-     * - It is recommended that you do not style checkbox and radio inputs as
-     *   Firefox's implementation does not respect box-sizing, padding, or width.
-     * - Certain font size values applied to number inputs cause the cursor style of
-     *   the decrement button to change from default to text.
-     * - The search input is not fully stylable by default. In Chrome and Safari on
-     *   OSX/iOS you can't control font, padding, border, or background. In Chrome
-     *   and Safari on Windows you can't control border properly. It will apply
-     *   border-width but will only show a border color (which cannot be controlled)
-     *   for the outer 1px of that border. Applying -webkit-appearance: textfield
-     *   addresses these issues without removing the benefits of search inputs (e.g.
-     *   showing past searches). Safari (but not Chrome) will clip the cancel button
-     *   on when it has padding (and textfield appearance).
-     */
-
     /**
      * 1. Change the font styles in all browsers (opinionated).
      * 2. Remove the margin in Firefox and Safari.

test/fixtures/fork-versions/default/output.css

@@ -205,22 +205,31 @@ svg:not(:root) {
    ========================================================================== */
 /**
  * Known issues:
- * - By default, Chrome on OS X and Safari on OS X allow very limited styling of
+ * - `select`:
+ *   By default, Chrome on OS X and Safari on OS X allow very limited styling of
  *   select, unless a border property is set. The default font weight on
  *   optgroup elements cannot safely be changed in Chrome on OSX and Safari on
  *   OS X.
- * - It is recommended that you do not style checkbox and radio inputs as
+ * - `[type="checkbox"]`:
+ *   It is recommended that you do not style checkbox and radio inputs as
  *   Firefox's implementation does not respect box-sizing, padding, or width.
- * - Certain font size values applied to number inputs cause the cursor style of
- *   the decrement button to change from default to text.
- * - The search input is not fully stylable by default. In Chrome and Safari on
- *   OSX/iOS you can't control font, padding, border, or background. In Chrome
- *   and Safari on Windows you can't control border properly. It will apply
- *   border-width but will only show a border color (which cannot be controlled)
- *   for the outer 1px of that border. Applying -webkit-appearance: textfield
- *   addresses these issues without removing the benefits of search inputs (e.g.
- *   showing past searches). Safari (but not Chrome) will clip the cancel button
- *   on when it has padding (and textfield appearance).
+ * - `[type="number"]`:
+ *   Certain font size values applied to number inputs cause the cursor style of
+ *   the decrement button to change from `default` to `text`.
+ * - `[type="search"]`:
+ *   The search input is not fully stylable by default. In Chrome and Safari on
+ *   OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
+ *   Chrome and Safari on Windows you can't control `border` properly. It will
+ *   apply `border-width` but will only show a border color (which cannot be
+ *   controlled) for the outer 1px of that border. Applying
+ *   `-webkit-appearance: textfield` addresses these issues without removing the
+ *   benefits of search inputs (e.g. showing past searches). Safari (but not
+ *   Chrome) will clip the cancel button on when it has padding (and `textfield`
+ *   appearance).
+ * - `::placeholder`:
+ *   In Edge, placeholders will disappear on `relative` or `absolute` positioned
+ *   `<input>` elements if you use `opacity` less than `1` due to a
+ *   [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
  */
 /**
  * 1. Change the font styles in all browsers (opinionated).

test/fixtures/fork-versions/deprecated-compass/output.css

@@ -218,22 +218,31 @@ svg:not(:root) {
    ========================================================================== */
 /**
  * Known issues:
- * - By default, Chrome on OS X and Safari on OS X allow very limited styling of
+ * - `select`:
+ *   By default, Chrome on OS X and Safari on OS X allow very limited styling of
  *   select, unless a border property is set. The default font weight on
  *   optgroup elements cannot safely be changed in Chrome on OSX and Safari on
  *   OS X.
- * - It is recommended that you do not style checkbox and radio inputs as
+ * - `[type="checkbox"]`:
+ *   It is recommended that you do not style checkbox and radio inputs as
  *   Firefox's implementation does not respect box-sizing, padding, or width.
- * - Certain font size values applied to number inputs cause the cursor style of
- *   the decrement button to change from default to text.
- * - The search input is not fully stylable by default. In Chrome and Safari on
- *   OSX/iOS you can't control font, padding, border, or background. In Chrome
- *   and Safari on Windows you can't control border properly. It will apply
- *   border-width but will only show a border color (which cannot be controlled)
- *   for the outer 1px of that border. Applying -webkit-appearance: textfield
- *   addresses these issues without removing the benefits of search inputs (e.g.
- *   showing past searches). Safari (but not Chrome) will clip the cancel button
- *   on when it has padding (and textfield appearance).
+ * - `[type="number"]`:
+ *   Certain font size values applied to number inputs cause the cursor style of
+ *   the decrement button to change from `default` to `text`.
+ * - `[type="search"]`:
+ *   The search input is not fully stylable by default. In Chrome and Safari on
+ *   OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
+ *   Chrome and Safari on Windows you can't control `border` properly. It will
+ *   apply `border-width` but will only show a border color (which cannot be
+ *   controlled) for the outer 1px of that border. Applying
+ *   `-webkit-appearance: textfield` addresses these issues without removing the
+ *   benefits of search inputs (e.g. showing past searches). Safari (but not
+ *   Chrome) will clip the cancel button on when it has padding (and `textfield`
+ *   appearance).
+ * - `::placeholder`:
+ *   In Edge, placeholders will disappear on `relative` or `absolute` positioned
+ *   `<input>` elements if you use `opacity` less than `1` due to a
+ *   [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
  */
 /**
  * 1. Change the font styles in all browsers (opinionated).

test/fixtures/fork-versions/typey/output.css

@@ -270,22 +270,31 @@ svg:not(:root) {
    ========================================================================== */
 /**
  * Known issues:
- * - By default, Chrome on OS X and Safari on OS X allow very limited styling of
+ * - `select`:
+ *   By default, Chrome on OS X and Safari on OS X allow very limited styling of
  *   select, unless a border property is set. The default font weight on
  *   optgroup elements cannot safely be changed in Chrome on OSX and Safari on
  *   OS X.
- * - It is recommended that you do not style checkbox and radio inputs as
+ * - `[type="checkbox"]`:
+ *   It is recommended that you do not style checkbox and radio inputs as
  *   Firefox's implementation does not respect box-sizing, padding, or width.
- * - Certain font size values applied to number inputs cause the cursor style of
- *   the decrement button to change from default to text.
- * - The search input is not fully stylable by default. In Chrome and Safari on
- *   OSX/iOS you can't control font, padding, border, or background. In Chrome
- *   and Safari on Windows you can't control border properly. It will apply
- *   border-width but will only show a border color (which cannot be controlled)
- *   for the outer 1px of that border. Applying -webkit-appearance: textfield
- *   addresses these issues without removing the benefits of search inputs (e.g.
- *   showing past searches). Safari (but not Chrome) will clip the cancel button
- *   on when it has padding (and textfield appearance).
+ * - `[type="number"]`:
+ *   Certain font size values applied to number inputs cause the cursor style of
+ *   the decrement button to change from `default` to `text`.
+ * - `[type="search"]`:
+ *   The search input is not fully stylable by default. In Chrome and Safari on
+ *   OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
+ *   Chrome and Safari on Windows you can't control `border` properly. It will
+ *   apply `border-width` but will only show a border color (which cannot be
+ *   controlled) for the outer 1px of that border. Applying
+ *   `-webkit-appearance: textfield` addresses these issues without removing the
+ *   benefits of search inputs (e.g. showing past searches). Safari (but not
+ *   Chrome) will clip the cancel button on when it has padding (and `textfield`
+ *   appearance).
+ * - `::placeholder`:
+ *   In Edge, placeholders will disappear on `relative` or `absolute` positioned
+ *   `<input>` elements if you use `opacity` less than `1` due to a
+ *   [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
  */
 /**
  * 1. Change the font styles in all browsers (opinionated).