display graphs for exchange rates

apps/core/static/css/skeleton-tabs.css

@@ -0,0 +1,29 @@
+/* https://github.com/nathancahill/skeleton-tabs */
+ul.tab-nav {
+    list-style: none;
+    border-bottom: 1px solid #bbb;
+    padding-left: 5px;
+}
+
+ul.tab-nav li {
+    display: inline;
+}
+
+ul.tab-nav li a.button {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+    margin-bottom: -1px;
+    border-bottom: none;
+}
+
+ul.tab-nav li a.active.button {
+    border-bottom: 0.175em solid #fff;
+}
+
+.tab-content .tab-pane {
+    display: none;
+}
+
+.tab-content .tab-pane.active {
+    display: block;
+}

apps/core/static/js/skeleton-tabs.js

@@ -0,0 +1,22 @@
+/* https://github.com/nathancahill/skeleton-tabs */
+(function() {
+    function main() {
+        var tabButtons = [].slice.call(document.querySelectorAll('ul.tab-nav li a.button'));
+
+        tabButtons.map(function(button) {
+            button.addEventListener('click', function() {
+                document.querySelector('li a.active.button').classList.remove('active');
+                button.classList.add('active');
+
+                document.querySelector('.tab-pane.active').classList.remove('active');
+                document.querySelector(button.getAttribute('href')).classList.add('active');
+            })
+        })
+    }
+
+    if (document.readyState !== 'loading') {
+        main();
+    } else {
+        document.addEventListener('DOMContentLoaded', main);
+    }
+})();