application.css

@import url('//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css');

@media (min-width: 769px) {
  html,
  .navbar-fixed-top,
  .navbar-fixed-bottom {
    width: 320px;
    margin: auto;
  }
}

a.remove {
    float: right !important;
}

a.check {
    float: left !important;
}

a.check,
a.remove {
    position: relative;
    top: -1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    font-size: 1.4em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.concluida a.check:before {
    content: "\e067";
}

a.remove:before {
    content: "\e088";
}

a.check:before {
    content: "\e157";
}

.concluida a.check,
.concluida a.titulo {
    color: #999999;
}

a.check {
    color: #3c763d;
}

a.check:hover {
    color: #2b542c;
}

a.remove {
    color: #a94442;
}

a.remove:hover {
    color: #843534;
}

body {
    padding-top: 50px;
    padding-bottom: 50px;
}

a.titulo {
    color: #444;
    font-weight: normal;
    padding-left: 10px;
}

.concluida a.titulo {
    text-decoration: line-through;
}

a.check,
a.remove {
    text-decoration: none;
}

ul.list-group {
    margin-bottom: 0;
}

.navbar-form {
    padding: 0;
    margin-left: 0;
    margin-right: 0;
}

.navbar-form .form-control {
    width: 100%;
}

.list-group-item {
    padding: 10px;
    line-height: 100%;
}

.list-group-item.editing {
    padding: 5px 8px;
}

.editing .view {
    display: none;
}

form.edit {
    margin: 0;
    padding-left: 20px;
    padding-right: 20px;
    display: none;
}

.editing form.edit {
    display: block;
}

.alert:empty {
  display: none;
}

rails new todo_pocket -B
cd todo_pocket/public
wget https://gist.githubusercontent.com/neves/9770484/raw/application.css
wget https://gist.githubusercontent.com/neves/9770562/raw/index.html
cd ..
rails server