NoteJotter/index.html at master · CAPTAIN320/NoteJotter · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!DOCTYPE html>
<html manifest="manifest.php" class="with-statusbar-overlay">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">

    <title>NOTE</title>

    <link rel="stylesheet" href="css/framework7.ios.min.css">
    <link rel="stylesheet" href="css/framework7.ios.colors.min.css">

    <link rel="stylesheet" href="css/note.css">

  </head>
  <body>
    <!-- Views-->
    <div class="views">
      <div class="view view-main navbar-fixed">
        <div class="navbar">
          <div class="navbar-inner">
            <div class="left"></div>
            <div class="center sliding">NOTE</div>
            <div class="right"><a href="#" class="link icon-only open-popup"><i class="icon icon-plus">+</i></a></div>
          </div>
        </div>
        <div class="pages">
          <div data-page="index" class="page">
            <div class="page-content">
              <div class="list-block todo-items-list theme-pink"></div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- Popup to add new task           -->
    <div class="popup">
      <div class="view view-popup navbar-fixed">
        <div class="navbar">
          <div class="navbar-inner">
            <div class="left"></div>
            <div class="center sliding">New Note</div>
            <div class="right"><a href="#" class="link close-popup">Cancel</a></div>
          </div>
        </div>
        <div class="pages">
          <div class="page">
            <div class="page-content">
              <div class="list-block">
                <ul>
                  <li>
                    <div class="item-content">
                      <div class="item-inner">
                        <div class="item-title label">Note</div>
                        <div class="item-input">
                          <input type="text" name="title">
                        </div>
                      </div>
                    </div>
                  </li>
                  <li>
                    <div class="item-content">
                      <div class="item-inner">
                        <div class="item-title label">Color</div>
                        <div class="item-input"><span data-color="pink" class="color selected"></span><span data-color="green" class="color"></span><span data-color="orange" class="color"></span><span data-color="blue" class="color"></span><span data-color="yellow" class="color"></span><span data-color="purple" class="color"></span><span data-color="cyan" class="color"></span></div>
                      </div>
                    </div>
                  </li>
                </ul>
              </div>
              <div class="content-block"><a href="#" class="button add-task">Add Note</a></div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- Template-->
    <script id="todo-item-template" type="text/template">
      <ul>{{#each this}}
        <li data-color="{{color}}" data-id="{{id}}" class="swipeout">
          <div class="swipeout-content">
            <label class="label-checkbox item-content"><input type="checkbox" {{checked}}>
              <div class="item-inner">
                <div class="item-title" style="white-space:normal;">{{title}}</div>
              </div>
              <div class="item-media">
                <a href="#" class="swipeout-delete">
                  <img src="img/trash.png"/>
                </a>
              </div>
            </label>
          </div>
        </li>{{/each}}
      </ul>
    </script>
    <!-- Path to Framework7 Library JS-->
    <script type="text/javascript" src="js/framework7.min.js"></script>
    <!-- Path to your app js-->
    <script type="text/javascript" src="js/note.js"></script>
  </body>
</html>