Fix hidden responsive sidebar issue / Move X-UA-Compatible meta tag to be first

[johnnyreilly]

Hi John,

This PR addresses 2 issues.

Fix vanishing responsive sidebar

The responsive sidebar vanishes in these circumstances:

1. You shrink the viewport size down so the mobile view is triggered
2. You open and then close the menu
3. You grow the viewport size so the desktop view is triggered.

This happens because in the sidebar directive the sidebar-inner element gets set to display:none as a result of the $sidebarInner.slideUp(350). This fix adds a single media query to force the visibility of the sidebar-inner element when in desktop view.

@media (min-width: 768px) {
  .sidebar .sidebar-inner {
    display: block !important;
  }
}

Preventing Compatibility-mode triggering in IE

I've noticed that the <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" /> tag sits after a style tag in the template. This should mean that the tag will be ineffective - see MSDN:

The X-UA-Compatible header isn't case sensitive; however, it must appear in the header of the webpage (the HEAD section) before all other elements except for the title element and other meta elements. - Full text here

The simple fix is to amend the template from this:

    <style>
        /* This helps the ng-show/ng-hide animations start at the right place. */
        /* Since Angular has this but needs to load, this gives us the class early. */
        .ng-hide {
            display: none !important;
        }
    </style>
    <title data-ng-bind="title">Hot Towel Angular</title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />

To this:

    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
    <style>
        /* This helps the ng-show/ng-hide animations start at the right place. */
        /* Since Angular has this but needs to load, this gives us the class early. */
        .ng-hide {
            display: none !important;
        }
    </style>
    <title data-ng-bind="title">Hot Towel Angular</title>
    <meta charset="utf-8" />

ie. Simply moving the meta tag above the <style tag. It's a little thing, but if you've been bitten by Compatibility mode (I have 👎) it can be painful....

Best,
John