half-pipe 0.3.0.alpha.2 → 0.3.0.alpha.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (96) hide show
  1. checksums.yaml +4 -4
  2. data/examples/todomvc-rails/.bowerrc +3 -0
  3. data/examples/todomvc-rails/.gitignore +20 -0
  4. data/examples/todomvc-rails/.jshintrc +34 -0
  5. data/examples/todomvc-rails/Gemfile +40 -0
  6. data/examples/todomvc-rails/Gruntfile.js +42 -0
  7. data/examples/todomvc-rails/README.rdoc +5 -0
  8. data/examples/todomvc-rails/Rakefile +6 -0
  9. data/examples/todomvc-rails/app/controllers/application_controller.rb +5 -0
  10. data/examples/todomvc-rails/app/controllers/concerns/.keep +0 -0
  11. data/examples/todomvc-rails/app/controllers/todos_controller.rb +69 -0
  12. data/examples/todomvc-rails/app/helpers/application_helper.rb +2 -0
  13. data/examples/todomvc-rails/app/helpers/todos_helper.rb +5 -0
  14. data/examples/todomvc-rails/app/mailers/.keep +0 -0
  15. data/examples/todomvc-rails/app/models/.keep +0 -0
  16. data/examples/todomvc-rails/app/models/concerns/.keep +0 -0
  17. data/examples/todomvc-rails/app/models/todo.rb +8 -0
  18. data/examples/todomvc-rails/app/scripts/main.js +53 -0
  19. data/examples/todomvc-rails/app/scripts/todo-title-input.js +57 -0
  20. data/examples/todomvc-rails/app/styles/base.scss +415 -0
  21. data/examples/todomvc-rails/app/styles/main.scss +2 -0
  22. data/examples/todomvc-rails/app/styles/todos.scss +29 -0
  23. data/examples/todomvc-rails/app/views/layouts/application.html.erb +14 -0
  24. data/examples/todomvc-rails/app/views/layouts/todos.js.erb +7 -0
  25. data/examples/todomvc-rails/app/views/todos/_destroy.js.erb +1 -0
  26. data/examples/todomvc-rails/app/views/todos/_footer.html.erb +21 -0
  27. data/examples/todomvc-rails/app/views/todos/_todo.html.erb +14 -0
  28. data/examples/todomvc-rails/app/views/todos/_toggle.js.erb +4 -0
  29. data/examples/todomvc-rails/app/views/todos/create.js.erb +3 -0
  30. data/examples/todomvc-rails/app/views/todos/destroy.js.erb +1 -0
  31. data/examples/todomvc-rails/app/views/todos/destroy_completed.js.erb +1 -0
  32. data/examples/todomvc-rails/app/views/todos/index.html.erb +33 -0
  33. data/examples/todomvc-rails/app/views/todos/toggle.js.erb +1 -0
  34. data/examples/todomvc-rails/app/views/todos/toggle_all.js.erb +1 -0
  35. data/examples/todomvc-rails/app/views/todos/update.js.erb +1 -0
  36. data/examples/todomvc-rails/bin/bundle +3 -0
  37. data/examples/todomvc-rails/bin/rails +4 -0
  38. data/examples/todomvc-rails/bin/rake +4 -0
  39. data/examples/todomvc-rails/bower.json +10 -0
  40. data/examples/todomvc-rails/config.ru +4 -0
  41. data/examples/todomvc-rails/config/application.rb +28 -0
  42. data/examples/todomvc-rails/config/boot.rb +4 -0
  43. data/examples/todomvc-rails/config/build.js +14 -0
  44. data/examples/todomvc-rails/config/database.yml +19 -0
  45. data/examples/todomvc-rails/config/environment.rb +5 -0
  46. data/examples/todomvc-rails/config/environments/development.rb +29 -0
  47. data/examples/todomvc-rails/config/environments/production.rb +80 -0
  48. data/examples/todomvc-rails/config/environments/test.rb +36 -0
  49. data/examples/todomvc-rails/config/half-pipe.json +3 -0
  50. data/examples/todomvc-rails/config/initializers/backtrace_silencers.rb +7 -0
  51. data/examples/todomvc-rails/config/initializers/filter_parameter_logging.rb +4 -0
  52. data/examples/todomvc-rails/config/initializers/inflections.rb +16 -0
  53. data/examples/todomvc-rails/config/initializers/mime_types.rb +5 -0
  54. data/examples/todomvc-rails/config/initializers/secret_token.rb +12 -0
  55. data/examples/todomvc-rails/config/initializers/session_store.rb +3 -0
  56. data/examples/todomvc-rails/config/initializers/wrap_parameters.rb +14 -0
  57. data/examples/todomvc-rails/config/locales/en.yml +23 -0
  58. data/examples/todomvc-rails/config/routes.rb +16 -0
  59. data/examples/todomvc-rails/db/migrate/20130518030840_create_todos.rb +9 -0
  60. data/examples/todomvc-rails/db/schema.rb +23 -0
  61. data/examples/todomvc-rails/db/seeds.rb +7 -0
  62. data/examples/todomvc-rails/lib/assets/.keep +0 -0
  63. data/examples/todomvc-rails/lib/tasks/.keep +0 -0
  64. data/examples/todomvc-rails/log/.keep +0 -0
  65. data/examples/todomvc-rails/package.json +22 -0
  66. data/examples/todomvc-rails/public/404.html +58 -0
  67. data/examples/todomvc-rails/public/422.html +58 -0
  68. data/examples/todomvc-rails/public/500.html +57 -0
  69. data/examples/todomvc-rails/public/favicon.ico +0 -0
  70. data/examples/todomvc-rails/public/robots.txt +5 -0
  71. data/examples/todomvc-rails/tasks/options/connect.js +63 -0
  72. data/examples/todomvc-rails/tasks/options/copy.js +28 -0
  73. data/examples/todomvc-rails/tasks/options/cssmin.js +3 -0
  74. data/examples/todomvc-rails/tasks/options/jshint.js +8 -0
  75. data/examples/todomvc-rails/tasks/options/rails.js +5 -0
  76. data/examples/todomvc-rails/tasks/options/requirejs.js +19 -0
  77. data/examples/todomvc-rails/tasks/options/sass.js +21 -0
  78. data/examples/todomvc-rails/tasks/options/watch.js +13 -0
  79. data/examples/todomvc-rails/test/controllers/.keep +0 -0
  80. data/examples/todomvc-rails/test/fixtures/.keep +0 -0
  81. data/examples/todomvc-rails/test/fixtures/todos.yml +11 -0
  82. data/examples/todomvc-rails/test/helpers/.keep +0 -0
  83. data/examples/todomvc-rails/test/integration/.keep +0 -0
  84. data/examples/todomvc-rails/test/mailers/.keep +0 -0
  85. data/examples/todomvc-rails/test/models/.keep +0 -0
  86. data/examples/todomvc-rails/test/models/todo_test.rb +7 -0
  87. data/examples/todomvc-rails/test/test_helper.rb +15 -0
  88. data/examples/todomvc-rails/vendor/assets/javascripts/.keep +0 -0
  89. data/examples/todomvc-rails/vendor/assets/stylesheets/.keep +0 -0
  90. data/lib/generators/half_pipe/install_generator.rb +2 -1
  91. data/lib/generators/half_pipe/templates/app/scripts/main.js +3 -5
  92. data/lib/generators/half_pipe/templates/config/build.js +4 -0
  93. data/lib/generators/half_pipe/templates/railties.rb +0 -1
  94. data/lib/generators/half_pipe/templates/tasks/options/copy.js +0 -1
  95. data/lib/half-pipe/version.rb +1 -1
  96. metadata +91 -1
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 9e779c2dd9479a1245d628d0d1b9301df8273d89
4
- data.tar.gz: 7f7b736cf0996b856cdf9ef4a04b0bf894e398cc
3
+ metadata.gz: ef0b6df768ef367df6b366f16703de9345b4c36d
4
+ data.tar.gz: 8daf29daf4c6d00f3d9fb9c7e0f58c71aa58044f
5
5
  SHA512:
6
- metadata.gz: 25d694c6d65fdc4fb58901abc92c64d6e5a59a2cffb59a9cc3fb62f18a1d86e67148e27dc161ea0539fab5c312b858d61820f1a54c62a83524a1536e8acccef7
7
- data.tar.gz: 02acde5fa5bf06feabb6c6772f193a4ed29b4ae82421e8038dd4a098e78f7c85fdaf6fa7ac07abe3ccdb04b57c6058f2d7b136e578fe1afb7991285e947b356e
6
+ metadata.gz: b88bc561894217752b1cffec8144602ab41932f27ace516690d3690fabc523cd3d833f41822ec0d0b9bc66e4ebe3fff213b8ab7a4ba3c2de8d09310d2546c072
7
+ data.tar.gz: 6b762bcd300d6e25212e7e292b7b07e7de9bbacf86f0cadeac890429dda45cb0c1c1cf05a0b59a5d08cec254e779e22e8ffecf90f229ce5924cd1276ab73fd9d
@@ -0,0 +1,3 @@
1
+ {
2
+ "json": "bower.json"
3
+ }
@@ -0,0 +1,20 @@
1
+ # See http://help.github.com/ignore-files/ for more about ignoring files.
2
+ #
3
+ # If you find yourself ignoring temporary files generated by your text editor
4
+ # or operating system, you probably want to add a global ignore instead:
5
+ # git config --global core.excludesfile '~/.gitignore_global'
6
+
7
+ # Ignore bundler config.
8
+ /.bundle
9
+
10
+ # Ignore the default SQLite database.
11
+ /db/*.sqlite3
12
+ /db/*.sqlite3-journal
13
+
14
+ # Ignore all logfiles and tempfiles.
15
+ /log/*.log
16
+ /tmp
17
+ node_modules
18
+ bower_components
19
+ public/assets
20
+ .sass-cache
@@ -0,0 +1,34 @@
1
+ {
2
+ "camelcase": true,
3
+ "indent": 2,
4
+ "white": false,
5
+ "curly": true,
6
+ "eqeqeq": true,
7
+ "immed": true,
8
+ "latedef": true,
9
+ "newcap": false,
10
+ "noarg": true,
11
+ "sub": true,
12
+ "undef": true,
13
+ "boss": true,
14
+ "eqnull": true,
15
+ "browser": true,
16
+ "globals": {
17
+ "test": true,
18
+ "asyncTest": true,
19
+ "start": true,
20
+ "expect": true,
21
+ "module": true,
22
+ "define": true,
23
+ "sinon": true,
24
+ "require": true,
25
+ "console": true,
26
+ "Class": true,
27
+ "Events": true,
28
+ "Options": true,
29
+ "Element": true,
30
+ "$": true,
31
+ "$$": true
32
+ }
33
+ }
34
+
@@ -0,0 +1,40 @@
1
+ source 'https://rubygems.org'
2
+
3
+ ruby "2.0.0"
4
+
5
+ # Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
6
+ gem 'rails', '~>4.0.0'
7
+
8
+ gem "pg"
9
+
10
+ # See https://github.com/sstephenson/execjs#readme for more supported runtimes
11
+ # gem 'therubyracer', platforms: :ruby
12
+
13
+ # Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
14
+ gem 'jbuilder', '~> 1.0.1'
15
+
16
+ gem 'half-pipe', path: '../../'
17
+
18
+ group :development do
19
+ # Use sqlite3 as the database for Active Record
20
+ gem 'sqlite3'
21
+ end
22
+
23
+ group :doc do
24
+ # bundle exec rake doc:rails generates the API under doc/api.
25
+ gem 'sdoc', require: false
26
+ end
27
+
28
+ # Use ActiveModel has_secure_password
29
+ # gem 'bcrypt-ruby', '~> 3.0.0'
30
+
31
+ # Use unicorn as the app server
32
+ # gem 'unicorn'
33
+
34
+ # Use Capistrano for deployment
35
+ # gem 'capistrano', group: :development
36
+
37
+ # Use debugger
38
+ # gem 'debugger', group: [:development, :test]
39
+
40
+ gem "sass-css-importer", github: "joefiorini/sass-css-importer", branch: "load-paths"
@@ -0,0 +1,42 @@
1
+ /*global module:false*/
2
+ module.exports = function(grunt) {
3
+
4
+ require("load-grunt-tasks")(grunt);
5
+ grunt.loadNpmTasks('grunt-connect-proxy');
6
+
7
+ function config(name){
8
+ return require("./tasks/options/" + name);
9
+ }
10
+
11
+ // Project configuration.
12
+ grunt.initConfig({
13
+ // Metadata.
14
+ pkg: grunt.file.readJSON('package.json'),
15
+ dirs: grunt.file.readJSON('config/half-pipe.json'),
16
+ bowerOpts: grunt.file.readJSON('.bowerrc'),
17
+ jshint: config("jshint"),
18
+ sass: config("sass"),
19
+ cssmin: config("cssmin"),
20
+ requirejs: config("requirejs"),
21
+ connect: config("connect"),
22
+ copy: config("copy"),
23
+ watch: config("watch"),
24
+ rails: config("rails"),
25
+ clean: ['<%= dirs.tmp %>']
26
+ });
27
+
28
+ // Default task.
29
+ grunt.registerTask('default', 'build:debug');
30
+
31
+ // Configure asset building pipeline
32
+ grunt.registerTask('build', ['build:debug']);
33
+ grunt.registerTask('build:debug', ['clean', 'copy:prepare', 'requirejs:debug', 'sass:debug']);
34
+ grunt.registerTask('build:public', ['clean', 'copy:prepare', 'requirejs:public', 'sass:public', 'copy:finalize']);
35
+
36
+ // Configure preview server
37
+ grunt.registerTask('server', ['server:debug']);
38
+ grunt.registerTask('server:debug', ['build:debug', 'configureProxies', 'connect:debug', 'rails:server:start', 'watch']);
39
+ grunt.registerTask('server:public', ['build:public', 'configureProxies', 'connect:public:keepalive']);
40
+
41
+ };
42
+
@@ -0,0 +1,5 @@
1
+ == TodoMVC on Rails
2
+
3
+ I built the TodoMVC app according to its spec using only Rails 4 and a hint of javascript. See my article for more details
4
+
5
+ http://www.mattdeleon.net/
@@ -0,0 +1,6 @@
1
+ # Add your own tasks in files placed in lib/tasks ending in .rake,
2
+ # for example lib/tasks/capistrano.rake, and they will automatically be available to Rake.
3
+
4
+ require File.expand_path('../config/application', __FILE__)
5
+
6
+ Todos::Application.load_tasks
@@ -0,0 +1,5 @@
1
+ class ApplicationController < ActionController::Base
2
+ # Prevent CSRF attacks by raising an exception.
3
+ # For APIs, you may want to use :null_session instead.
4
+ protect_from_forgery with: :exception
5
+ end
@@ -0,0 +1,69 @@
1
+ class TodosController < ApplicationController
2
+ helper_method :current_filter
3
+
4
+ def index
5
+ @todos = Todo
6
+ end
7
+
8
+ def active
9
+ @todos = Todo.active
10
+
11
+ set_current_filter(:active)
12
+
13
+ render :index
14
+ end
15
+
16
+ def completed
17
+ @todos = Todo.completed
18
+
19
+ set_current_filter(:completed)
20
+
21
+ render :index
22
+ end
23
+
24
+ def create
25
+ @todo = Todo.new(todo_params)
26
+ @todo.save
27
+ end
28
+
29
+ def update
30
+ @todo = Todo.find(params[:id])
31
+ @todo.update(todo_params)
32
+ end
33
+
34
+ def destroy_completed
35
+ @todos_for_destruction = Todo.completed.all
36
+
37
+ Todo.completed.destroy_all
38
+ end
39
+
40
+ def destroy
41
+ @todo = Todo.find(params[:id])
42
+ @todo.destroy
43
+ end
44
+
45
+ def toggle
46
+ @todo = Todo.find(params[:id])
47
+ @todo.toggle!(:completed)
48
+ end
49
+
50
+ def toggle_all
51
+ Todo.update_all(completed: params[:completed] ? 't' : 'f')
52
+
53
+ @todos = Todo.all
54
+ end
55
+
56
+ private
57
+
58
+ def todo_params
59
+ params.require(:todo).permit(:title, :completed)
60
+ end
61
+
62
+ def set_current_filter(filter)
63
+ @current_filter = filter
64
+ end
65
+
66
+ def current_filter
67
+ @current_filter
68
+ end
69
+ end
@@ -0,0 +1,2 @@
1
+ module ApplicationHelper
2
+ end
@@ -0,0 +1,5 @@
1
+ module TodosHelper
2
+ def todos_filter_class
3
+ "filtered " + current_filter.to_s
4
+ end
5
+ end
@@ -0,0 +1,8 @@
1
+ class Todo < ActiveRecord::Base
2
+ scope :completed, -> { where("completed = ?", true) }
3
+ scope :active, -> { where("completed = ?", false) }
4
+
5
+ def title=(title)
6
+ write_attribute(:title, title.strip)
7
+ end
8
+ end
@@ -0,0 +1,53 @@
1
+ 'use strict';
2
+
3
+ define('todos',
4
+ [
5
+ 'todo-title-input',
6
+ 'jquery',
7
+ 'jquery-ujs'
8
+ ],
9
+
10
+ function(TodoTitleInput, $){
11
+
12
+ // Add your initialization code here
13
+
14
+ $.fn.todoTitleInput = function() {
15
+ return this.each(function() {
16
+ var data;
17
+ data = $.data(this, 'todoTitleInput');
18
+ if (!data) {
19
+ return data = $.data(this, 'todoTitleInput', new TodoTitleInput(this));
20
+ }
21
+ });
22
+ };
23
+
24
+ $(document).on("keypress", "[data-behavior~=submit_on_enter]", function(e) {
25
+ if (e.keyCode === 13) {
26
+ if ($(this).val().trim().length) {
27
+ $(this).closest("form").submit();
28
+ }
29
+ return e.preventDefault();
30
+ }
31
+ });
32
+
33
+ $(document).on("click", "[data-behavior~=submit_on_check]", function() {
34
+ return $(this).closest("form").submit();
35
+ });
36
+
37
+ $(document).on("dblclick", "[data-behavior~=todo_title]", function() {
38
+ $(this).closest("li").addClass("editing").siblings().removeClass("editing");
39
+ return $(this).closest("li").find("[data-behavior~=todo_title_input]").focus();
40
+ });
41
+
42
+ $(document).on("focus", "[data-behavior~=todo_title_input]", function() {
43
+ return $(this).todoTitleInput();
44
+ });
45
+
46
+ $(document).on("ajax:before", "form[data-remote]", function() {
47
+ return $(this).addClass("submitting");
48
+ });
49
+
50
+ $(document).on("ajax:complete", "form[data-remote]", function() {
51
+ return $(this).removeClass("submitting");
52
+ });
53
+ });
@@ -0,0 +1,57 @@
1
+ define(['jquery'], function($) {
2
+
3
+ return function() {
4
+
5
+ function TodoTitleInput(input) {
6
+ var _this = this;
7
+ this.$input = $(input);
8
+ this.$input.on("keypress", function(e) {
9
+ return _this.keypress(e);
10
+ });
11
+ this.$input.on("blur", function(e) {
12
+ return _this.blur(e);
13
+ });
14
+ }
15
+
16
+ TodoTitleInput.prototype.keypress = function(e) {
17
+ if (e.keyCode === 27) {
18
+ return this.handleEscape();
19
+ } else if (e.keyCode === 13) {
20
+ return this.handleEnter();
21
+ }
22
+ };
23
+
24
+ TodoTitleInput.prototype.blur = function() {
25
+ return this.submitFormOrDestroy();
26
+ };
27
+
28
+ TodoTitleInput.prototype.handleEscape = function() {
29
+ return this.$input.val(this.$input.data("original-value")).parents("li").removeClass("editing");
30
+ };
31
+
32
+ TodoTitleInput.prototype.handleEnter = function() {
33
+ this.submitFormOrDestroy();
34
+ return false;
35
+ };
36
+
37
+ TodoTitleInput.prototype.submitFormOrDestroy = function() {
38
+ if (this.$input.val().trim().length === 0) {
39
+ return this.destroyTodo();
40
+ } else {
41
+ return this.submitForm();
42
+ }
43
+ };
44
+
45
+ TodoTitleInput.prototype.submitForm = function() {
46
+ return this.$input.parents("form").submit();
47
+ };
48
+
49
+ TodoTitleInput.prototype.destroyTodo = function() {
50
+ return this.$input.parents("li").find(".destroy").click();
51
+ };
52
+
53
+ return TodoTitleInput;
54
+
55
+ }
56
+
57
+ });
@@ -0,0 +1,415 @@
1
+
2
+ html,
3
+ body {
4
+ margin: 0;
5
+ padding: 0;
6
+ }
7
+
8
+ button {
9
+ margin: 0;
10
+ padding: 0;
11
+ border: 0;
12
+ background: none;
13
+ font-size: 100%;
14
+ vertical-align: baseline;
15
+ font-family: inherit;
16
+ color: inherit;
17
+ -webkit-appearance: none;
18
+ /*-moz-appearance: none;*/
19
+ -ms-appearance: none;
20
+ -o-appearance: none;
21
+ appearance: none;
22
+ }
23
+
24
+ body {
25
+ font: 14px 'Helvetica Neue', Helvetica, Arial, sans-serif;
26
+ line-height: 1.4em;
27
+ background: #eaeaea image-url('bg.png');
28
+ color: #4d4d4d;
29
+ width: 550px;
30
+ margin: 0 auto;
31
+ -webkit-font-smoothing: antialiased;
32
+ -moz-font-smoothing: antialiased;
33
+ -ms-font-smoothing: antialiased;
34
+ -o-font-smoothing: antialiased;
35
+ font-smoothing: antialiased;
36
+ }
37
+
38
+ #todoapp {
39
+ background: #fff;
40
+ background: rgba(255, 255, 255, 0.9);
41
+ margin: 130px 0 40px 0;
42
+ border: 1px solid #ccc;
43
+ position: relative;
44
+ border-top-left-radius: 2px;
45
+ border-top-right-radius: 2px;
46
+ box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.2),
47
+ 0 25px 50px 0 rgba(0, 0, 0, 0.15);
48
+ }
49
+
50
+ #todoapp:before {
51
+ content: '';
52
+ border-left: 1px solid #f5d6d6;
53
+ border-right: 1px solid #f5d6d6;
54
+ width: 2px;
55
+ position: absolute;
56
+ top: 0;
57
+ left: 40px;
58
+ height: 100%;
59
+ }
60
+
61
+ #todoapp input::-webkit-input-placeholder {
62
+ font-style: italic;
63
+ }
64
+
65
+ #todoapp input:-moz-placeholder {
66
+ font-style: italic;
67
+ color: #a9a9a9;
68
+ }
69
+
70
+ #todoapp h1 {
71
+ position: absolute;
72
+ top: -120px;
73
+ width: 100%;
74
+ font-size: 70px;
75
+ font-weight: bold;
76
+ text-align: center;
77
+ color: #b3b3b3;
78
+ color: rgba(255, 255, 255, 0.3);
79
+ text-shadow: -1px -1px rgba(0, 0, 0, 0.2);
80
+ -webkit-text-rendering: optimizeLegibility;
81
+ -moz-text-rendering: optimizeLegibility;
82
+ -ms-text-rendering: optimizeLegibility;
83
+ -o-text-rendering: optimizeLegibility;
84
+ text-rendering: optimizeLegibility;
85
+ }
86
+
87
+ #header {
88
+ padding-top: 15px;
89
+ border-radius: inherit;
90
+ }
91
+
92
+ #header:before {
93
+ content: '';
94
+ position: absolute;
95
+ top: 0;
96
+ right: 0;
97
+ left: 0;
98
+ height: 15px;
99
+ z-index: 2;
100
+ border-bottom: 1px solid #6c615c;
101
+ background: #8d7d77;
102
+ background: -webkit-gradient(linear, left top, left bottom, from(rgba(132, 110, 100, 0.8)),to(rgba(101, 84, 76, 0.8)));
103
+ background: -webkit-linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
104
+ background: -moz-linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
105
+ background: -o-linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
106
+ background: -ms-linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
107
+ background: linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
108
+ filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#9d8b83', EndColorStr='#847670');
109
+ border-top-left-radius: 1px;
110
+ border-top-right-radius: 1px;
111
+ }
112
+
113
+ #new-todo,
114
+ .edit {
115
+ position: relative;
116
+ margin: 0;
117
+ width: 100%;
118
+ font-size: 24px;
119
+ font-family: inherit;
120
+ line-height: 1.4em;
121
+ border: 0;
122
+ outline: none;
123
+ color: inherit;
124
+ padding: 6px;
125
+ border: 1px solid #999;
126
+ box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
127
+ -webkit-box-sizing: border-box;
128
+ -moz-box-sizing: border-box;
129
+ -ms-box-sizing: border-box;
130
+ -o-box-sizing: border-box;
131
+ box-sizing: border-box;
132
+ -webkit-font-smoothing: antialiased;
133
+ -moz-font-smoothing: antialiased;
134
+ -ms-font-smoothing: antialiased;
135
+ -o-font-smoothing: antialiased;
136
+ font-smoothing: antialiased;
137
+ }
138
+
139
+ #new-todo {
140
+ padding: 16px 16px 16px 60px;
141
+ border: none;
142
+ background: rgba(0, 0, 0, 0.02);
143
+ z-index: 2;
144
+ box-shadow: none;
145
+ }
146
+
147
+ #main {
148
+ position: relative;
149
+ z-index: 2;
150
+ border-top: 1px dotted #adadad;
151
+ }
152
+
153
+ label[for='toggle-all'] {
154
+ display: none;
155
+ }
156
+
157
+ #toggle-all {
158
+ position: absolute;
159
+ top: -42px;
160
+ left: -4px;
161
+ width: 40px;
162
+ text-align: center;
163
+ border: none; /* Mobile Safari */
164
+ }
165
+
166
+ #toggle-all:before {
167
+ content: '»';
168
+ font-size: 28px;
169
+ color: #d9d9d9;
170
+ padding: 0 25px 7px;
171
+ }
172
+
173
+ #toggle-all:checked:before {
174
+ color: #737373;
175
+ }
176
+
177
+ #todo-list {
178
+ margin: 0;
179
+ padding: 0;
180
+ list-style: none;
181
+ }
182
+
183
+ #todo-list li {
184
+ position: relative;
185
+ font-size: 24px;
186
+ border-bottom: 1px dotted #ccc;
187
+ }
188
+
189
+ #todo-list li:last-child {
190
+ border-bottom: none;
191
+ }
192
+
193
+ #todo-list li.editing {
194
+ border-bottom: none;
195
+ padding: 0;
196
+ }
197
+
198
+ #todo-list li.editing .edit {
199
+ display: block;
200
+ width: 506px;
201
+ padding: 13px 17px 12px 17px;
202
+ margin: 0 0 0 43px;
203
+ }
204
+
205
+ #todo-list li.editing .view {
206
+ display: none;
207
+ }
208
+
209
+ #todo-list li .toggle {
210
+ text-align: center;
211
+ width: 40px;
212
+ /* auto, since non-WebKit browsers doesn't support input styling */
213
+ height: auto;
214
+ position: absolute;
215
+ top: 0;
216
+ bottom: 0;
217
+ margin: auto 0;
218
+ border: none; /* Mobile Safari */
219
+ -webkit-appearance: none;
220
+ /*-moz-appearance: none;*/
221
+ -ms-appearance: none;
222
+ -o-appearance: none;
223
+ appearance: none;
224
+ }
225
+
226
+ #todo-list li .toggle:after {
227
+ content: '✔';
228
+ line-height: 43px; /* 40 + a couple of pixels visual adjustment */
229
+ font-size: 20px;
230
+ color: #d9d9d9;
231
+ text-shadow: 0 -1px 0 #bfbfbf;
232
+ }
233
+
234
+ #todo-list li .toggle:checked:after {
235
+ color: #85ada7;
236
+ text-shadow: 0 1px 0 #669991;
237
+ bottom: 1px;
238
+ position: relative;
239
+ }
240
+
241
+ #todo-list li label {
242
+ word-break: break-word;
243
+ padding: 15px;
244
+ margin-left: 45px;
245
+ display: block;
246
+ line-height: 1.2;
247
+ -webkit-transition: color 0.4s;
248
+ -moz-transition: color 0.4s;
249
+ -ms-transition: color 0.4s;
250
+ -o-transition: color 0.4s;
251
+ transition: color 0.4s;
252
+ }
253
+
254
+ #todo-list li.completed label {
255
+ color: #a9a9a9;
256
+ text-decoration: line-through;
257
+ }
258
+
259
+ #todo-list li .destroy {
260
+ display: none;
261
+ position: absolute;
262
+ top: 0;
263
+ right: 10px;
264
+ bottom: 0;
265
+ width: 40px;
266
+ height: 40px;
267
+ margin: auto 0;
268
+ font-size: 22px;
269
+ color: #a88a8a;
270
+ -webkit-transition: all 0.2s;
271
+ -moz-transition: all 0.2s;
272
+ -ms-transition: all 0.2s;
273
+ -o-transition: all 0.2s;
274
+ transition: all 0.2s;
275
+ }
276
+
277
+ #todo-list li .destroy:hover {
278
+ text-shadow: 0 0 1px #000,
279
+ 0 0 10px rgba(199, 107, 107, 0.8);
280
+ -webkit-transform: scale(1.3);
281
+ -moz-transform: scale(1.3);
282
+ -ms-transform: scale(1.3);
283
+ -o-transform: scale(1.3);
284
+ transform: scale(1.3);
285
+ }
286
+
287
+ #todo-list li .destroy:after {
288
+ content: '✖';
289
+ }
290
+
291
+ #todo-list li:hover .destroy {
292
+ display: block;
293
+ }
294
+
295
+ #todo-list li .edit {
296
+ display: none;
297
+ }
298
+
299
+ #todo-list li.editing:last-child {
300
+ margin-bottom: -1px;
301
+ }
302
+
303
+ #footer {
304
+ color: #777;
305
+ padding: 0 15px;
306
+ position: absolute;
307
+ right: 0;
308
+ bottom: -31px;
309
+ left: 0;
310
+ height: 20px;
311
+ z-index: 1;
312
+ text-align: center;
313
+ }
314
+
315
+ #footer:before {
316
+ content: '';
317
+ position: absolute;
318
+ right: 0;
319
+ bottom: 31px;
320
+ left: 0;
321
+ height: 50px;
322
+ z-index: -1;
323
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3),
324
+ 0 6px 0 -3px rgba(255, 255, 255, 0.8),
325
+ 0 7px 1px -3px rgba(0, 0, 0, 0.3),
326
+ 0 43px 0 -6px rgba(255, 255, 255, 0.8),
327
+ 0 44px 2px -6px rgba(0, 0, 0, 0.2);
328
+ }
329
+
330
+ #todo-count {
331
+ float: left;
332
+ text-align: left;
333
+ }
334
+
335
+ #filters {
336
+ margin: 0;
337
+ padding: 0;
338
+ list-style: none;
339
+ position: absolute;
340
+ right: 0;
341
+ left: 0;
342
+ }
343
+
344
+ #filters li {
345
+ display: inline;
346
+ }
347
+
348
+ #filters li a {
349
+ color: #83756f;
350
+ margin: 2px;
351
+ text-decoration: none;
352
+ }
353
+
354
+ #filters li a.selected {
355
+ font-weight: bold;
356
+ }
357
+
358
+ #clear-completed {
359
+ float: right;
360
+ position: relative;
361
+ line-height: 20px;
362
+ text-decoration: none;
363
+ background: rgba(0, 0, 0, 0.1);
364
+ font-size: 11px;
365
+ padding: 0 10px;
366
+ border-radius: 3px;
367
+ box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.2);
368
+ }
369
+
370
+ #clear-completed:hover {
371
+ background: rgba(0, 0, 0, 0.15);
372
+ box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.3);
373
+ }
374
+
375
+ #info {
376
+ margin: 65px auto 0;
377
+ color: #a6a6a6;
378
+ font-size: 12px;
379
+ text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
380
+ text-align: center;
381
+ }
382
+
383
+ #info a {
384
+ color: inherit;
385
+ }
386
+
387
+ /*
388
+ Hack to remove background from Mobile Safari.
389
+ Can't use it globally since it destroys checkboxes in Firefox and Opera
390
+ */
391
+ @media screen and (-webkit-min-device-pixel-ratio:0) {
392
+ #toggle-all,
393
+ #todo-list li .toggle {
394
+ background: none;
395
+ }
396
+
397
+ #todo-list li .toggle {
398
+ height: 40px;
399
+ }
400
+
401
+ #toggle-all {
402
+ top: -56px;
403
+ left: -15px;
404
+ width: 65px;
405
+ height: 41px;
406
+ -webkit-transform: rotate(90deg);
407
+ transform: rotate(90deg);
408
+ -webkit-appearance: none;
409
+ appearance: none;
410
+ }
411
+ }
412
+
413
+ .hidden{
414
+ display:none;
415
+ }