From 2d2e7bbf5406b5ce6373b5b5e1f50264e6f5aa3a Mon Sep 17 00:00:00 2001 From: Zachary Kain Date: Tue, 5 Mar 2013 09:13:14 -0500 Subject: [PATCH 01/57] reposition Todo options, use proper icon --- views/app/tasks.html | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/views/app/tasks.html b/views/app/tasks.html index f0ff20c787..9b983cbd5f 100644 --- a/views/app/tasks.html +++ b/views/app/tasks.html @@ -13,6 +13,13 @@
+ + {#if _user.history.todos} + + {/} +   + +

Todos

@@ -24,13 +31,6 @@ Clear Completed

 

- - {#if _user.history.todos} - - {/} -  iCal - -
- + {#if _user.history.todos} - + {/} - +

Todos

@@ -124,9 +124,10 @@
- - + +
+
@@ -152,19 +153,22 @@
{#if equal(:task.type, 'habit')} - {#if :task.up}{/} - {#if :task.down}{/} + {#if :task.up}{/} + {#if :task.down}{/} {else if equal(:task.type, 'reward')} - {:task.value} + {:task.value} {else} - + + + + {/}
-
{:task.text}
+

{:task.text}

From 1a308da495aab91bfd718596fd94aaf2e9ff0e9a Mon Sep 17 00:00:00 2001 From: Zachary Kain Date: Tue, 5 Mar 2013 15:01:52 -0500 Subject: [PATCH 04/57] better responsive breakpoints, more robust custom grid --- styles/app/index.styl | 8 ++++-- styles/app/responsive.styl | 28 +++++++++++++++++++ views/app/index.html | 4 +-- views/app/tasks.html | 55 +++++++++++++++++++++++--------------- 4 files changed, 69 insertions(+), 26 deletions(-) create mode 100644 styles/app/responsive.styl diff --git a/styles/app/index.styl b/styles/app/index.styl index fcec0af9e1..40204aaba0 100644 --- a/styles/app/index.styl +++ b/styles/app/index.styl @@ -8,6 +8,10 @@ @import "./items.styl"; @import "./alerts.styl"; @import "./helpers.styl"; +@import "./responsive.styl"; + +// where's the actual bootstrap include? +// @import "../bootstrap-responsive.styl"; @import "../../public/vendor/bootstrap-datepicker/css/datepicker.css"; @@ -35,7 +39,7 @@ html,body,p,h1,ul,li,table,tr,th,td box-sizing: border-box z-index: 1000 -@media (max-width: 480px) { +@media (max-width: 600px) { #head { position: static; } @@ -132,7 +136,7 @@ html,body,p,h1,ul,li,table,tr,th,td /*overflow:auto;*/ padding-bottom: 250px; /* don't know why this works, sticky footers are weird */ -@media (max-width: 480px) { +@media (max-width: 600px) { #wrap { margin-top: 0 } diff --git a/styles/app/responsive.styl b/styles/app/responsive.styl new file mode 100644 index 0000000000..4047c3bbfd --- /dev/null +++ b/styles/app/responsive.styl @@ -0,0 +1,28 @@ +.grid + padding: 0 1.5em 1.5em 0 + letter-spacing: -4px + +.module + display: inline-block + letter-spacing: normal + vertical-align: top + width: 25% + padding: 0 0 1.5em 1.5em + -moz-box-sizing: border-box + box-sizing: border-box + +// at 960px when 4 columns really starts to break +@media (max-width: 60em) + .module + width: 50% + .task-column + max-height: 18em + overflow-y: scroll + +// at 600px when 2col starts breaking +@media (max-width: 37.5em) + .module + width: 100% + .task-column + max-height: none + overflow: visible \ No newline at end of file diff --git a/views/app/index.html b/views/app/index.html index 69ce9f1db5..e16e6fd1eb 100644 --- a/views/app/index.html +++ b/views/app/index.html @@ -28,9 +28,9 @@
-
+
-
+
diff --git a/views/app/tasks.html b/views/app/tasks.html index a02fd393a5..e8930c33da 100644 --- a/views/app/tasks.html +++ b/views/app/tasks.html @@ -1,18 +1,27 @@ - -
+ + + +
+

Habits

    {#each _habitList as :task}{/}
+
-
+ +
+

Daily

    {#each _dailyList as :task}{/}
+
-
+ +
+
{#if _user.history.todos} @@ -36,11 +45,12 @@
  • Remaining
  • Complete
  • -
    +
    -
    - + +
    +

    Rewards

    @@ -60,68 +70,69 @@
    - + {#if _user.flags.petsEnabled}
    - +
    - +
    {#with _view.items.pets as :pets} - +
    {#with :pets[0]}{/} {#with :pets[1]}{/} {#with :pets[2]}{/} {#with :pets[3]}{/}
    - +
    {#with :pets[4]}{/} {#with :pets[5]}{/} {#with :pets[6]}{/} {#with :pets[7]}{/}
    - +
    {#with :pets[8]}{/} {#with :pets[9]}{/} {#with :pets[10]}{/} {#with :pets[11]}{/}
    - +
    {#with :pets[12]}{/} {#with :pets[13]}{/} {#with :pets[14]}{/} {#with :pets[15]}{/}
    - +
    {#with :pets[16]}{/}
    - - + + {/}
    - - + +
    - {else} + {else} - {/} -
    + {/}
    +
    +
    From 5fb3ba67f61f50b62146624061df5b0f8dee5106 Mon Sep 17 00:00:00 2001 From: Zachary Kain Date: Tue, 5 Mar 2013 15:13:59 -0500 Subject: [PATCH 05/57] circle icon for uncompleted tasks, and rollin with square edges for now --- styles/app/tasks.styl | 33 ++++++++++++++++++++++----------- 1 file changed, 22 insertions(+), 11 deletions(-) diff --git a/styles/app/tasks.styl b/styles/app/tasks.styl index 1299bd5f00..c454ca3cce 100644 --- a/styles/app/tasks.styl +++ b/styles/app/tasks.styl @@ -167,10 +167,11 @@ li:hover .task-meta-controls .hover-show min-height: 2.5em line-height: 2.5 margin-bottom: 0.75em - // border: 1px solid rgba(0,0,0,0.2) - // -webkit-background-clip: padding-box + outline: 1px solid rgba(0,0,0,0.1) + outline-offset: -1px + -webkit-background-clip: padding-box border-radius: 0.25em - overflow: hidden + // overflow: hidden &:last-child margin-bottom: 0 @@ -191,21 +192,31 @@ li:hover .task-meta-controls .hover-show cursor: pointer // border-radius: 0.25em 0 0 0.25em &:after - content: '¬' - transform: rotate(135deg) + content: '○' display: block - line-height: 1.1 - text-align: left - opacity: 0.1 + opacity: 0.2 + line-height: 0.8 + text-align: center color: black font-size: 3em - &:hover:after, - &:focus:after + &:hover:before, + &:focus:before + content: '¬' + display: block + font-size: 3em + color: black + transform: rotate(135deg) + line-height: 1.1 + text-align: left opacity: 0.5 !important - &:active:after + &:active:before opacity: 0.75 !important & input[type=checkbox]:checked + label:after + content: '¬' + transform: rotate(135deg) + line-height: 1.1 + text-align: left opacity: 1 input[type=checkbox] From fbc4345d05a0b4ea714a5a2b15c91419369f3e0b Mon Sep 17 00:00:00 2001 From: Zachary Kain Date: Tue, 5 Mar 2013 19:47:08 -0500 Subject: [PATCH 06/57] further refactoring of tasks code. Last commit before merge in the revert --- styles/app/tasks.styl | 125 ++++++++++++++---------------------------- 1 file changed, 41 insertions(+), 84 deletions(-) diff --git a/styles/app/tasks.styl b/styles/app/tasks.styl index c454ca3cce..9327eec73d 100644 --- a/styles/app/tasks.styl +++ b/styles/app/tasks.styl @@ -1,77 +1,42 @@ -// color variables -$color-worst = rgb(230, 184, 175) -$color-worse = rgb(244, 204, 204) -$color-bad = rgb(252, 229, 205) -$color-neutral = rgb(255, 242, 204) -$color-good = rgb(217, 234, 211) -$color-better = rgb(208, 224, 227) -$color-best = rgb(201, 218, 248) -$color-completed = rgb(217, 217, 217) +// 1. Set up color classes +// ======================== -.color-worst - background-color: $color-worst - .task-checker label - background-color: darken($color-worst, 30%) - .action-plus - background-color: darken($color-worst, 30%) - .action-minus - background-color: darken($color-worst, 30%) -.color-worse - background-color: $color-worse - .task-checker label - background-color: darken($color-worse, 30%) - .action-plus - background-color: darken($color-worse, 30%) - .action-minus - background-color: darken($color-worse, 30%) -.color-bad - background-color: $color-bad - .task-checker label - background-color: darken($color-bad, 30%) - .action-plus - background-color: darken($color-bad, 30%) - .action-minus - background-color: darken($color-bad, 30%) -.color-neutral - background-color: $color-neutral - .task-checker label - background-color: darken($color-neutral, 30%) - .action-plus - background-color: darken($color-neutral, 30%) - .action-minus - background-color: darken($color-neutral, 30%) -.color-good - background-color: $color-good - .task-checker label - background-color: darken($color-good, 30%) - .action-plus - background-color: darken($color-good, 30%) - .action-minus - background-color: darken($color-good, 30%) -.color-better - background-color: $color-better - .task-checker label - background-color: darken($color-better, 30%) - .action-plus - background-color: darken($color-better, 30%) - .action-minus - background-color: darken($color-better, 30%) -.color-best - background-color: $color-best - .task-checker label - background-color: darken($color-best, 30%) - .action-plus - background-color: darken($color-best, 30%) - .action-minus - background-color: darken($color-best, 30%) +// color variables +$worst = rgb(230, 184, 175) +$worse = rgb(244, 204, 204) +$bad = rgb(252, 229, 205) +$neutral = rgb(255, 242, 204) +$good = rgb(217, 234, 211) +$better = rgb(208, 224, 227) +$best = rgb(201, 218, 248) +$completed = rgb(217, 217, 217) + +// array of keywords and their associated color vars +$stages = (worst $worst) (worse $worse) (bad $bad) (neutral $neutral) (good $good) (better $better) (best $best) + +// for each color stage, generate a named class w/ the appropriate color +for $stage in $stages + .color-{$stage[0]} + background-color: $stage[1] + .task-checker label, + .action-plus, + .action-minus + background-color: darken($stage[1], 30%) + +// completed has to be outside the loop to override the color class .completed - background-color: $color-completed + background-color: $completed + color: #999 .task-checker label - background-color: darken($color-completed, 30%) - color: rgb(153, 153, 153) + background-color: darken($completed, 30%) + .reward background-color: white + +// 2. Task Options +// ================ + label.checkbox.inline{ width: 40px } @@ -120,13 +85,6 @@ li:hover .task-meta-controls .hover-show i margin-left:5px - // .task-controls,.task-text - // // display:inline - // // margin: 0 10px 0 0 - - // input - // margin-top: 0 - .task-meta-controls .hover-show display: none; @@ -190,17 +148,16 @@ li:hover .task-meta-controls .hover-show margin: 0 vertical-align: top cursor: pointer - // border-radius: 0.25em 0 0 0.25em &:after content: '○' display: block opacity: 0.2 - line-height: 0.8 + line-height: 0.76 text-align: center color: black font-size: 3em - &:hover:before, - &:focus:before + &:hover:after, + &:focus:after content: '¬' display: block font-size: 3em @@ -209,7 +166,7 @@ li:hover .task-meta-controls .hover-show line-height: 1.1 text-align: left opacity: 0.5 !important - &:active:before + &:active:after opacity: 0.75 !important & input[type=checkbox]:checked + label:after @@ -243,7 +200,7 @@ li:hover .task-meta-controls .hover-show padding: 0 0 0 0.5em width: 100% &:focus - box-shadow: inset 0 0 3px darken($color-best, 20%) + box-shadow: inset 0 0 3px darken($best, 20%) .addtask-btn display: inline-block width: 1.51515em @@ -253,14 +210,14 @@ li:hover .task-meta-controls .hover-show line-height: 1.55 outline: 0 border: 0 - background-color: darken($color-best, 20%) + background-color: darken($best, 20%) opacity: 0.5 &:hover, &:focus opacity: 0.75 - background-color: darken($color-best, 20%) + background-color: darken($best, 20%) &:active - background-color: darken($color-best, 30%) + background-color: darken($best, 30%) opacity: 1 .task-action-btn From 3f33261792ac31b9b997987db7d01c05fd85d81d Mon Sep 17 00:00:00 2001 From: Tyler Renelle Date: Tue, 5 Mar 2013 20:08:31 -0500 Subject: [PATCH 07/57] proper derby tabbing --- views/app/tasks.html | 324 +++++++++++++++++++++---------------------- 1 file changed, 162 insertions(+), 162 deletions(-) diff --git a/views/app/tasks.html b/views/app/tasks.html index e8930c33da..13f4d6cd52 100644 --- a/views/app/tasks.html +++ b/views/app/tasks.html @@ -1,136 +1,136 @@ - + - -
    -
    -

    Habits

    - -
      {#each _habitList as :task}{/}
    -
    -
    - - -
    -
    -

    Daily

    - -
      {#each _dailyList as :task}{/}
    -
    -
    - - -
    -
    - - {#if _user.history.todos} - - {/} - - - -

    Todos

    -
    - + +
    +
    +

    Habits

    + +
      {#each _habitList as :task}{/}
    -
      - {#each _todoList as :task}{/} -
    -
    - Clear Completed -

     

    -
    - -
    -
    - -
    -
    - -
    -

    Rewards

    -
    - {#unless _view.activeTabPets} - - - - - - -
    {gold(_user.stats.gp)}
    {silver(_user.stats.gp)}
    - {else} - + +
    +
    +

    Daily

    + +
      {#each _dailyList as :task}{/}
    +
    +
    + + +
    +
    + + {#if _user.history.todos} + {/} + + + +

    Todos

    +
    +
    -
    - - - {#if _user.flags.petsEnabled} -
    - -
    -
    - -
    - -
    - {#with _view.items.pets as :pets} - -
    - {#with :pets[0]}{/} - {#with :pets[1]}{/} - {#with :pets[2]}{/} - {#with :pets[3]}{/} -
    - -
    - {#with :pets[4]}{/} - {#with :pets[5]}{/} - {#with :pets[6]}{/} - {#with :pets[7]}{/} -
    - -
    - {#with :pets[8]}{/} - {#with :pets[9]}{/} - {#with :pets[10]}{/} - {#with :pets[11]}{/} -
    - -
    - {#with :pets[12]}{/} - {#with :pets[13]}{/} - {#with :pets[14]}{/} - {#with :pets[15]}{/} -
    - -
    - {#with :pets[16]}{/} -
    - - - {/} -
    - +
      + {#each _todoList as :task}{/} +
    + - - -
    - {else} - - {/}
    -
    +
    + + +
    +
    + +
    +

    Rewards

    +
    + {#unless _view.activeTabPets} + + + + + + +
    {gold(_user.stats.gp)}
    {silver(_user.stats.gp)}
    + {else} + + {/} +
    +
    + + + {#if _user.flags.petsEnabled} +
    + +
    +
    + +
    + +
    + {#with _view.items.pets as :pets} + +
    + {#with :pets[0]}{/} + {#with :pets[1]}{/} + {#with :pets[2]}{/} + {#with :pets[3]}{/} +
    + +
    + {#with :pets[4]}{/} + {#with :pets[5]}{/} + {#with :pets[6]}{/} + {#with :pets[7]}{/} +
    + +
    + {#with :pets[8]}{/} + {#with :pets[9]}{/} + {#with :pets[10]}{/} + {#with :pets[11]}{/} +
    + +
    + {#with :pets[12]}{/} + {#with :pets[13]}{/} + {#with :pets[14]}{/} + {#with :pets[15]}{/} +
    + +
    + {#with :pets[16]}{/} +
    + + + {/} +
    + +
    + + + +
    + {else} + + {/}
    +
    @@ -140,50 +140,50 @@
    - - -
  • - -
    -
    - - - {#if :task.history} - - - - {/} -
    - - {#if :task.notes} - + + +
  • + +
    +
    + + + {#if :task.history} + + + {/}
    - -
    - - {#if equal(:task.type, 'habit')} - {#if :task.up}{/} - {#if :task.down}{/} - - {else if equal(:task.type, 'reward')} - {:task.value} - - {else} - - - - - {/} -
    + {#if :task.notes} + + {/} +
    - -

    {:task.text}

    + +
    + + {#if equal(:task.type, 'habit')} + {#if :task.up}{/} + {#if :task.down}{/} + + {else if equal(:task.type, 'reward')} + {:task.value} + + {else} + + + + + {/} +
    - - -
  • + +

    {:task.text}

    + + + + - {#if _user.flags.petsEnabled} -
    + {#if equal(_user.flags.petsEnabled,true)} +
    -
    -
    - +
    +
    + +
    + +
    + {#with _view.items.pets as :pets} + +
    + {#with :pets[0]}{/} + {#with :pets[1]}{/} + {#with :pets[2]}{/} + {#with :pets[3]}{/} +
    + +
    + {#with :pets[4]}{/} + {#with :pets[5]}{/} + {#with :pets[6]}{/} + {#with :pets[7]}{/} +
    + +
    + {#with :pets[8]}{/} + {#with :pets[9]}{/} + {#with :pets[10]}{/} + {#with :pets[11]}{/} +
    + +
    + {#with :pets[12]}{/} + {#with :pets[13]}{/} + {#with :pets[14]}{/} + {#with :pets[15]}{/} +
    + +
    + {#with :pets[16]}{/} +
    + + + {/} +
    +
    -
    - {#with _view.items.pets as :pets} -
    - {#with :pets[0]}{/} - {#with :pets[1]}{/} - {#with :pets[2]}{/} - {#with :pets[3]}{/} -
    - -
    - {#with :pets[4]}{/} - {#with :pets[5]}{/} - {#with :pets[6]}{/} - {#with :pets[7]}{/} -
    - -
    - {#with :pets[8]}{/} - {#with :pets[9]}{/} - {#with :pets[10]}{/} - {#with :pets[11]}{/} -
    - -
    - {#with :pets[12]}{/} - {#with :pets[13]}{/} - {#with :pets[14]}{/} - {#with :pets[15]}{/} -
    - -
    - {#with :pets[16]}{/} -
    - - - {/} -
    - +
    - - - -
    {else} - + {/}
    From 4bb0207564415b74809690d2ce858226fa8898e7 Mon Sep 17 00:00:00 2001 From: Tyler Renelle Date: Tue, 5 Mar 2013 18:07:22 -0500 Subject: [PATCH 09/57] rename priority multiplier to "Difficulty" -> easy, medium, hard (people keep getting confused) and putting it back into "advanced" section --- views/app/tasks.html | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/views/app/tasks.html b/views/app/tasks.html index 235f5b1447..7b96fac499 100644 --- a/views/app/tasks.html +++ b/views/app/tasks.html @@ -231,18 +231,21 @@
    {/} +
    {#unless equal(:task.type, 'reward')} -
    -
    - - - - + Advanced +
    +
    + + + + +
    +
    {/} -
    From 4f6a78c0ae912854698b45676a9a6def9c785d18 Mon Sep 17 00:00:00 2001 From: Tyler Renelle Date: Tue, 5 Mar 2013 18:58:15 -0500 Subject: [PATCH 10/57] add help popover to difficulty --- views/app/tasks.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/views/app/tasks.html b/views/app/tasks.html index 7b96fac499..0826a1f742 100644 --- a/views/app/tasks.html +++ b/views/app/tasks.html @@ -236,8 +236,9 @@
    Advanced
    + +
    - From 16bba9461cf562615ad2e75f2ee82f9a5b747685 Mon Sep 17 00:00:00 2001 From: Zachary Kain Date: Tue, 5 Mar 2013 20:21:17 -0500 Subject: [PATCH 11/57] add the bootstrap update --- public/vendor/bootstrap | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/vendor/bootstrap b/public/vendor/bootstrap index eb24718add..8c7f9c66a7 160000 --- a/public/vendor/bootstrap +++ b/public/vendor/bootstrap @@ -1 +1 @@ -Subproject commit eb24718add4dd36fe92fdbdb79e6ff4ce5919300 +Subproject commit 8c7f9c66a7d12f47f50618ef420868fe836d0c33 From 7e304afc544273855fa1d7af8bfbab851b9c6908 Mon Sep 17 00:00:00 2001 From: Tyler Renelle Date: Tue, 5 Mar 2013 20:23:31 -0500 Subject: [PATCH 12/57] upgrade bootstrap --- public/vendor/bootstrap | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/vendor/bootstrap b/public/vendor/bootstrap index 8c7f9c66a7..eb24718add 160000 --- a/public/vendor/bootstrap +++ b/public/vendor/bootstrap @@ -1 +1 @@ -Subproject commit 8c7f9c66a7d12f47f50618ef420868fe836d0c33 +Subproject commit eb24718add4dd36fe92fdbdb79e6ff4ce5919300 From a002932210525a6d16df3cca04b528db5baa8047 Mon Sep 17 00:00:00 2001 From: Zachary Kain Date: Tue, 5 Mar 2013 20:29:20 -0500 Subject: [PATCH 13/57] re-add Lato webfont --- views/app/index.html | 2 ++ 1 file changed, 2 insertions(+) diff --git a/views/app/index.html b/views/app/index.html index a9cb2bbc43..e16e6fd1eb 100644 --- a/views/app/index.html +++ b/views/app/index.html @@ -14,6 +14,8 @@ + + From 44714bcc5bb457489ea5ab031e6fa35e586cd3a5 Mon Sep 17 00:00:00 2001 From: Tyler Renelle Date: Tue, 5 Mar 2013 20:35:13 -0500 Subject: [PATCH 14/57] comment out webkit-devtools-agent - only for my pesronal use, really --- package.json | 3 +-- server.js | 4 ++-- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index a80458cca0..6f65508171 100644 --- a/package.json +++ b/package.json @@ -26,8 +26,7 @@ "superagent": "~0.12.4", "resolve": "~0.2.3", "browserify": "1.17.3", - "expect.js": "~0.2.0", - "webkit-devtools-agent": "*" + "expect.js": "~0.2.0" }, "private": true, "subdomain": "habitrpg", diff --git a/server.js b/server.js index 51db9480cf..6412b78225 100644 --- a/server.js +++ b/server.js @@ -22,7 +22,7 @@ process.env.SMTP_SERVICE = conf.get("SMTP_SERVICE"); process.env.STRIPE_API_KEY = conf.get("STRIPE_API_KEY"); process.env.STRIPE_PUB_KEY = conf.get("STRIPE_PUB_KEY"); -var agent; +/*var agent; if (process.env.NODE_ENV === 'development') { // Follow these instructions for profiling / debugging leaks // * https://developers.google.com/chrome-developer-tools/docs/heap-profiling @@ -31,7 +31,7 @@ if (process.env.NODE_ENV === 'development') { console.log("To debug memory leaks:" + "\n\t(1) Run `kill -SIGUSR2 " + process.pid + "`" + "\n\t(2) open http://c4milo.github.com/node-webkit-agent/21.0.1180.57/inspector.html?host=localhost:1337&page=0"); -} +}*/ process.on('uncaughtException', function (error) { From ce19fed852b6e4f770b9b6186c4d91f357781949 Mon Sep 17 00:00:00 2001 From: Zachary Kain Date: Tue, 5 Mar 2013 20:35:13 -0500 Subject: [PATCH 15/57] remove responsive from bootstrap includes. Rolling our own! --- src/app/index.coffee | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/index.coffee b/src/app/index.coffee index eabdfbde0e..d7445536a0 100644 --- a/src/app/index.coffee +++ b/src/app/index.coffee @@ -1,7 +1,7 @@ derby = require 'derby' app = derby.createApp module {get, view, ready} = app -derby.use require('derby-ui-boot'), {styles: ['bootstrap', 'responsive']} +derby.use require('derby-ui-boot'), {styles: ['bootstrap']} derby.use require '../../ui' derby.use require 'derby-auth/components' From fd216719c364c5b3875c1bfed0b8c03b3795b763 Mon Sep 17 00:00:00 2001 From: Zachary Kain Date: Tue, 5 Mar 2013 21:03:35 -0500 Subject: [PATCH 16/57] allow task text to word-wrap and be padded from element edge --- styles/app/tasks.styl | 17 +++++++---------- 1 file changed, 7 insertions(+), 10 deletions(-) diff --git a/styles/app/tasks.styl b/styles/app/tasks.styl index 9327eec73d..9dc1b45b94 100644 --- a/styles/app/tasks.styl +++ b/styles/app/tasks.styl @@ -100,8 +100,7 @@ li:hover .task-meta-controls .hover-show .task-column padding: 1.5em background: #f5f5f5 - border: 1px solid #bbb - border-radius: 0.25em + border: 1px solid #ccc font-family: 'Lato', sans-serif h2 margin: 0 0 0.5em @@ -121,7 +120,7 @@ li:hover .task-meta-controls .hover-show .task list-style: none clear: both - padding: 0 0.5em 0 0 + padding: 0 0.5em 0 0.5em min-height: 2.5em line-height: 2.5 margin-bottom: 0.75em @@ -135,9 +134,10 @@ li:hover .task-meta-controls .hover-show .task-controls display: inline + margin-left: -0.5em + margin-right: 0.5em .task-text - display: inline-block - text-indent: 0.5em + display: inline .task-checker label @@ -174,7 +174,7 @@ li:hover .task-meta-controls .hover-show transform: rotate(135deg) line-height: 1.1 text-align: left - opacity: 1 + opacity: 0.75 input[type=checkbox] margin: 0 @@ -183,19 +183,16 @@ li:hover .task-meta-controls .hover-show .addtask-form margin-bottom: 0.75em - border-radius: 0.25em - overflow: hidden .addtask-field display: inline-block width: 80% // fallback for Safari 5.1 - // width: calc(unquote('100% - 3em')) + width: calc(unquote('100% - 3em')) input font-family: 'Lato', sans-serif outline: 0 border: 0 box-shadow: none background-color: white - border-radius 0 0.25em 0.25em 0 height: 2.5em padding: 0 0 0 0.5em width: 100% From 174c7a8b9f14da4e39df6a32a3ab593cc03f0745 Mon Sep 17 00:00:00 2001 From: Zachary Kain Date: Tue, 5 Mar 2013 22:06:45 -0500 Subject: [PATCH 17/57] tweaks, most notably DISABLE CHART BUTAN --- styles/app/tasks.styl | 269 ++++++++++++++++++++---------------------- views/app/tasks.html | 29 +++-- 2 files changed, 139 insertions(+), 159 deletions(-) diff --git a/styles/app/tasks.styl b/styles/app/tasks.styl index 9dc1b45b94..ce121649f4 100644 --- a/styles/app/tasks.styl +++ b/styles/app/tasks.styl @@ -34,89 +34,75 @@ for $stage in $stages background-color: white -// 2. Task Options -// ================ -label.checkbox.inline{ - width: 40px -} - -.todos - .nav-pills > .active > a, .nav-pills > .active > a:hover - color: #005580 - background-color: #DEE5F2 - -.dailys - .repeat-days > .btn:not(.active) - background-color: #aaa; - background-image: -moz-linear-gradient(top, #eee, #aaa); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eee), to(#aaa)); - background-image: -webkit-linear-gradient(top, #eee, #aaa); - background-image: -o-linear-gradient(top, #eee, #aaa); - background-image: linear-gradient(to bottom, #eee, #aaa); - background-repeat: repeat-x; - -.context-enabled - .display-context-dependant, - .task-list li - display: none - - &.context-completed - .show-for-completed, .completed - display: block - - &.context-uncompleted - .show-for-uncompleted, .uncompleted - display: block - -.help-icon - float:right; - -.task:hover - cursor: move - -li:hover .task-meta-controls .hover-show - display: inline - -.task - - .task-meta-controls - float:right - i - margin-left:5px - - .task-meta-controls .hover-show - display: none; - -.vote-up, .vote-down - text-decoration:none; - -.new-task-form - margin-bottom:5px; - - -// begin rewrite css 2013-03-04 +// 2. Columns & Tasks +// =================== +// main columns +// ------------ .task-column padding: 1.5em background: #f5f5f5 border: 1px solid #ccc font-family: 'Lato', sans-serif - h2 + + .task-column_title margin: 0 0 0.5em padding: 0 - - .nav-tabs - margin-top: 0.75em - .option-box - .option-action - margin-left: 0.25em + hr + border: 0 + border-bottom: 1px solid #ddd - -.rewards +// add new task form +// ----------------- +.addtask-form margin-bottom: 0.75em + outline: 1px solid rgba(0,0,0,0.15) + outline-offset: -1px +// the input field +.addtask-field + display: inline-block + width: 80% // fallback for Safari 5.1 + width: calc(unquote('100% - 3em')) + input + font-family: 'Lato', sans-serif + border: 0 + outline: 0 + border-radius: 0 + box-shadow: none + background-color: white + height: 2.5em + padding: 0 0 0 0.5em + width: 100% + &:focus + box-shadow: inset 0 0 3px darken($best, 20%) + +// the button +.addtask-btn + display: inline-block + // important for overriding bootstrap, remove later + width: 1.51515em !important + height: 1.51515em + padding: 0 + font-size: 1.65em + line-height: 1.55 + outline: 0 + border: 0 + background-color: darken($best, 20%) + opacity: 0.75 + &:hover, + &:focus + opacity: 1 + background-color: darken($best, 20%) + &:active + background-color: darken($best, 30%) + opacity: 1 + + +// an individual task entry +// ------------------------ .task list-style: none clear: both @@ -126,114 +112,109 @@ li:hover .task-meta-controls .hover-show margin-bottom: 0.75em outline: 1px solid rgba(0,0,0,0.1) outline-offset: -1px - -webkit-background-clip: padding-box - border-radius: 0.25em - // overflow: hidden + &:hover + cursor: move &:last-child margin-bottom: 0 +// task content +.task-text + display: inline + + +// primary task commands +// ---------------------- .task-controls display: inline margin-left: -0.5em margin-right: 0.5em -.task-text - display: inline -.task-checker - label + // plus/minus commands + .task-action-btn + display: inline-block + width: 1.773em + height: 1.773em + padding: 0 + font-size: 1.41em + line-height: 1.773 + text-align: center + color: black + vertical-align: top + border-right: 1px solid rgba(0,0,0,0.25) + &:last-child + border: 0 + &:hover, &:focus + text-decoration: none + + // checkbox + .task-checker input[type=checkbox] + margin: 0 + padding: 0 + visibility: hidden + + .task-checker label display: inline-block width: 2.5em height: 2.5em - padding: 0 margin: 0 vertical-align: top cursor: pointer + + // uncompleted icon &:after content: '○' display: block - opacity: 0.2 + font-size: 3em line-height: 0.76 text-align: center color: black - font-size: 3em + opacity: 0.2 + + // hint at completed icon &:hover:after, &:focus:after content: '¬' - display: block font-size: 3em - color: black - transform: rotate(135deg) line-height: 1.1 text-align: left + transform: rotate(135deg) opacity: 0.5 !important &:active:after opacity: 0.75 !important - & input[type=checkbox]:checked + label:after + // completed icon + .task-checker input[type=checkbox]:checked + label:after content: '¬' transform: rotate(135deg) line-height: 1.1 text-align: left opacity: 0.75 - - input[type=checkbox] - margin: 0 - padding: 0 - visibility: hidden -.addtask-form - margin-bottom: 0.75em - .addtask-field - display: inline-block - width: 80% // fallback for Safari 5.1 - width: calc(unquote('100% - 3em')) - input - font-family: 'Lato', sans-serif - outline: 0 - border: 0 - box-shadow: none - background-color: white - height: 2.5em - padding: 0 0 0 0.5em - width: 100% - &:focus - box-shadow: inset 0 0 3px darken($best, 20%) - .addtask-btn - display: inline-block - width: 1.51515em - height: 1.51515em - padding: 0 - font-size: 1.65em - line-height: 1.55 - outline: 0 - border: 0 - background-color: darken($best, 20%) - opacity: 0.5 - &:hover, - &:focus - opacity: 0.75 - background-color: darken($best, 20%) - &:active - background-color: darken($best, 30%) - opacity: 1 -.task-action-btn - display: inline-block - width: 1.773em - height: 1.773em - padding: 0 - font-size: 1.41em - line-height: 1.773 - text-align: center - color: black - vertical-align: top - border-right: 1px solid rgba(0,0,0,0.25) - &:last-child - border: 0 - &:hover, - &:focus - text-decoration: none - // &.action-plus - // background-color: darken($color-good, 20%) - // &.action-minus - // background-color: darken($color-worst, 20%) \ No newline at end of file +// secondary task commands +// ----------------------- +.task-meta-controls + float: right + margin-left: 0.25em + opacity: 0.25 + a > i + margin-left: 0.125em + .task-notes + margin-left: 0.125em + +.task:hover .task-meta-controls + opacity: 1 + + +// .context-enabled +// .display-context-dependant, +// .task-list li +// display: none + +// &.context-completed +// .show-for-completed, .completed +// display: block + +// &.context-uncompleted +// .show-for-uncompleted, .uncompleted +// display: block \ No newline at end of file diff --git a/views/app/tasks.html b/views/app/tasks.html index 0826a1f742..fd880e1767 100644 --- a/views/app/tasks.html +++ b/views/app/tasks.html @@ -4,7 +4,7 @@
    -

    Habits

    +

    Habits

      {#each _habitList as :task}{/}
    @@ -13,7 +13,7 @@
    -

    Daily

    +

    Daily

      {#each _dailyList as :task}{/}
    @@ -29,7 +29,7 @@ -

    Todos

    +

    Todos

    @@ -38,7 +38,6 @@