diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 5749079..8084eef 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -2,9 +2,15 @@
GitHub
+
+
+
+
- <%= yield %>
+
+ <%= yield %>
+
diff --git a/public/application.css b/public/application.css
new file mode 100644
index 0000000..0fe3776
--- /dev/null
+++ b/public/application.css
@@ -0,0 +1,54 @@
+body {
+ padding-top: 20px;
+ padding-bottom: 20px;
+}
+
+.header {
+ margin-top: 0;
+ margin-bottom: 0;
+}
+
+.header h3 {
+ margin-top: 0;
+ margin-bottom: 0;
+ line-height: 40px;
+}
+
+.octicon {
+ vertical-align: text-top;
+}
+
+.repositories {
+ width: 350px;
+}
+
+.star-badge {
+ float: right;
+ color: #777;
+}
+
+.nav-pills .badge {
+ background-color: #ccc;
+}
+
+.show-more .spinner {
+ display: none;
+}
+
+.show-more.loading .spinner {
+ display: inline-block;
+ float: right;
+ animation-name: spin;
+ animation-duration: 2000ms;
+ animation-iteration-count: infinite;
+ animation-timing-function: linear;
+ padding-left: 4px;
+}
+
+@keyframes spin {
+ from {
+ transform: rotate(0deg);
+ } to {
+ transform: rotate(360deg);
+ }
+}
diff --git a/public/application.js b/public/application.js
new file mode 100644
index 0000000..45c7038
--- /dev/null
+++ b/public/application.js
@@ -0,0 +1,14 @@
+function loadMoreRepositories(event) {
+ var container = event.target.parentElement;
+ container.classList.add('loading');
+ event.preventDefault();
+
+ var xhr = new XMLHttpRequest();
+ xhr.open('GET', event.target.href, true);
+ xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+ xhr.onload = function() {
+ container.insertAdjacentHTML('afterend', xhr.responseText);
+ container.remove();
+ }
+ xhr.send();
+}