Updated markdown/links

ux-variations/01.composing-variations.md

@@ -1,21 +1,16 @@
 # Using Composition to handle UX variations
 Combining smaller reusable components to build a bigger UI blocks.
 
-How do we make sure components are reusable?
+**How do we make sure components are reusable?**
   - By ensuring our UI components are pure presentational components (dumb)
 
-What does reusable mean?
+**What does reusable mean?**
   - No data fetching within the component (do it in Redux).
   - If data is required from API - goes into Redux
        Via redux-thunk API calls are isolated away from the redux containers that deal with the data obtained and pass it on to the dumb component.
 
 If we have a bunch of renderBla() functions within the component which are used in the main component render()
-  --- It’s better to move it to separate components. That way it is reusable.
-
-### Reference:
-- https://speakerdeck.com/vasa/building-multitenant-ui-with-react-dot-js
-
-
+  - It’s better to move it to separate components. That way it is reusable.
 
 ### Example
 Login page variations
@@ -60,3 +55,6 @@ class MemberSignIn extends Component {
 
 export default MemberSignIn;
 ```
+
+### Reference:
+- [Slides from my talk: Building Multi-tenant UI with React](https://speakerdeck.com/vasa/building-multitenant-ui-with-react-dot-js)

ux-variations/02.toggle-ui-elements.md

@@ -5,14 +5,10 @@ Modify the component to take in a prop to control it’s behavior.
 
 ### Gotcha:
 Easy to overuse this idea by adding props for  every variation.
-  Only add in props for features specific to the current feature that the component.
-  Basically, not violate the Single Responsibility Principle.
+  - Only add in props for features specific to the current feature that the component.
+  - Basically, not violate the Single Responsibility Principle.
 
-### Reference:
-- https://speakerdeck.com/vasa/building-multitenant-ui-with-react-dot-js
-
-
-### Example
+#### Example
 Show/Hide password feature in Login form
 
 ```javascript
@@ -40,3 +36,6 @@ class PasswordField extends Component {
   }
 }
 ```
+
+### Reference:
+- [Slides from my talk: Building Multi-tenant UI with React](https://speakerdeck.com/vasa/building-multitenant-ui-with-react-dot-js)

ux-variations/05.wrapper-components.md

@@ -1,7 +1,7 @@
 # Wrapper Components
 Using Wrappers to handle UX/style variations
 
-For Handling Wrapper <div>’s and other markup around component, use composition!
+For Handling Wrapper ``<div>``’s and other markup around component, use composition!
 
 When you create a React component instance, you can include additional React components or JavaScript expressions between the opening and closing tags.
 Parent can read its children by accessing the special this.props.children prop.
@@ -17,10 +17,11 @@ const SampleComponent = () => {
 };
 
 const Parent = () => {
-  // You can use class 'bla' or any other classed to handle any style
-  // variations for the same markup.
+  // You can use class 'bla' or any other classes to handle any style variations for the same markup.
   <div className="bla">
     {this.props.children}
   </div>
 };
 ```
+### Reference:
+- [Slides from my talk: Building Multi-tenant UI with React](https://speakerdeck.com/vasa/building-multitenant-ui-with-react-dot-js)

ux-variations/06.display-order-variations.md

@@ -1,7 +1,4 @@
 # Display UI elements in different order
-### Reference:
-- https://speakerdeck.com/vasa/building-multitenant-ui-with-react-dot-js
-
 
 Use a prop to specify order – Map through ReactElements and render it based on order prop.
 ```javascript
@@ -22,3 +19,5 @@ class PageSections extends Component {
   }
 }
 ```
+### Reference:
+- [Slides from my talk: Building Multi-tenant UI with React](https://speakerdeck.com/vasa/building-multitenant-ui-with-react-dot-js)