Can't get header styles from Todo list guide


#1

Greetings, I’ve just started to learn ionic and I’m trying to complete the “Todo list” app from ionic guide. At first I wrote everything by hand but when I run the application by ionic serve, I couldn’t get any header style, just got the titles. Then I copied/pasted the code from the ionic framework but I kept getting the same issue. Somehow header styles are not working. I’d be grateful if you can help me to figure out what is the issue and how can I fix it.

HTML code in www folder;

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Todo</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">

    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- Needed for Cordova/PhoneGap (will be a 404 during development) -->
    <script src="js/app.js"></script>
    <script src="cordova.js"></script>
  </head>
<body ng-app="todo">
  <ion-side-menus>

    <!-- Center content -->
    <ion-side-menu-content>
      <ion-header-bar class="bar-dark">
        <h1 class="title">Todo</h1>
      </ion-header-bar>
      <ion-content>
      </ion-content>
    </ion-side-menu-content>

    <!-- Left menu -->
    <ion-side-menu side="left">
      <ion-header-bar class="bar-dark">
        <h1 class="title">Projects</h1>
      </ion-header-bar>
    </ion-side-menu>

  </ion-side-menus>
</body>
</html>

Javascript code in /www/js folder;

angular.module('todo', ['ionic'])

And I don’t know if it does matter but I’m using Macbook and I used exactly code from this page; http://ionicframework.com/docs/guide/starting.html


#2

Hi there! How did you start the project?