Fix post 🚀

Author: chicio

_posts/2020-05-20-dark-mode-css-sass-scss.md

@@ -103,10 +103,10 @@ $themes: (
 Now I was ready to define the `@mixin` needed to apply the themes. We said in the introduction that we will apply the dark mode based on the `@media (prefers-color-scheme: dark)` media query and we will use the light theme as default (light theme or no user preference). This basically means that I needed to define a `@mixin` that let us apply a certain property in both cases.  I needed also to be able to eventually apply other property attributes other than the color based on the current theme selected. For example I had rules for border styling like `border: 1px solid #BDBDBD` where the color must be picked up from the correct theme based on the rule discussed before.
 So I created `@mixin theme($themes, $property, $color, $additionalPropertiesPositionIsFront: false, $additionalProperties: '')` that accepts the following properties:
 
-* $property, the property that we want to change based on the theme selected for the current user
-* $color, the color name to be picked up. This should be one of the variable seen above
-* $additionalPropertiesPositionIsFront, a boolean that is used to understand if the additional properties to be concatenated with the color values should be placed before or after the color value. This property is optional and has a default value of false
-* $additionalProperties, a string with the list of properties be concatenated with the color value. This property is optional and has a default value of empty string.
+* `$property`, the property that we want to change based on the theme selected for the current user
+* `$color`, the color name to be picked up. This should be one of the variable seen above
+* `$additionalPropertiesPositionIsFront`, a boolean that is used to understand if the additional properties to be concatenated with the color values should be placed before or after the color value. This property is optional and has a default value of false
+* `$additionalProperties`, a string with the list of properties be concatenated with the color value. This property is optional and has a default value of empty string.
 
 In this theme mixin I got the dark and light theme values by extracting theme from the `$themes` variable using the `map-get` [SASS map function](https://sass-lang.com/documentation/modules/map "sass map function"). Then I used another mixin `@mixin themeProperty($theme, $property, $color, $additionalPropertiesPositionIsFront, $additionalProperties)` to create the css rule `<property>: <value>` using the values received from the invocation. Inside it I did the concatenation between the additional properties and the color value (if necessary) using the `+` operator and the [SASS unquote function](https://sass-lang.com/documentation/modules/string "sass unquote function") to remove the string quote and have in output from the mixin a standard css rule. The `themeProperty` is invoked two times, one for the default value with the light time, and another one inside the `@media (prefers-color-scheme: dark)` query. Below you can find the code of these two new mixin.