-52WeekChallenge/index.html at master · Davidvete/-52WeekChallenge · 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
103
104
105
106
107
108
109
<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <script src="js/vue.min.js"></script>
    <title>#52WeekChallenge</title>
    <style>
        .month {
            background: whitesmoke;
            margin: 5px !important;
        }
        #app {
            margin-top: 70px;
        }
        .wells {
            min-height: 20px;
            padding: 6px;
            margin-bottom: 5px;
            background-color: #f5f5f5;
            border: 1px solid #e3e3e3;
            border-radius: 0 !important;
        }

        .sec {
            border-right: 1px solid #cac7c7;
        }
    </style>
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <a class="navbar-brand" href="#">
                #52WeekChallenge
            </a>
        </div>
        <ul class="nav navbar-nav navbar-right">
            <li>
                <a target="_blank"
                   href="http://www.rookie-manager.com/personal-finance/why-take-on-the-52-week-challenge/">
                    Blog Post
                </a>
            </li>
            <li>
                <a target="_blank" href="https://twitter.com/search?q=%2352WeekChallenge&src=typd">
                    Twitter Hashtag
                </a>
            </li>
            <li>
                <a target="_blank" href="https://github.com/bikundo/-52WeekChallenge">
                    Code
                </a>
            </li>
        </ul>
    </div>
</nav>
<div class="container" id="app">
    <div class="row">
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
            <div class="form-group">
                <label for="starting">Starting amount</label>
                <input id="starting" type="number" step="5" min="5" class="form-control" v-model="starting">
            </div>
        </div>
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
            <h3 class="pull-right">
                total saved : KES {{totalSaved}}
            </h3>
        </div>
    </div>
    <div class="row">
        <section class="month" v-for="week in computedTotals">
            <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 wells">
                <div class="row">
                    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 sec">
                        <b>{{week.weekNumber}}</b>
                    </div>
                    <div class="col-xs-5 col-sm-5 col-md-5 col-lg-5 sec">
                        deposit: {{week.deposit.toLocaleString()}}
                    </div>
                    <div class="col-xs-5 col-sm-5 col-md-5 col-lg-5">
                        Total: {{week.total.toLocaleString()}}
                    </div>

                </div>
            </div>
        </section>
    </div>
</div>
</body>
<script src="js/app.js"></script>
<script>
    (function (i, s, o, g, r, a, m) {
        i['GoogleAnalyticsObject'] = r;
        i[r] = i[r] || function () {
                    (i[r].q = i[r].q || []).push(arguments)
                }, i[r].l = 1 * new Date();
        a = s.createElement(o),
                m = s.getElementsByTagName(o)[0];
        a.async = 1;
        a.src = g;
        m.parentNode.insertBefore(a, m)
    })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');

    ga('create', 'UA-89813918-1', 'auto');
    ga('send', 'pageview');

</script>
</html>