sudoxreboot/habitica
1
0
Fork 0
mirror of https://github.com/sudoxnym/habitica.git synced 2026-08-01 23:40:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

style Todo tabs, misc stuff

Browse source
This commit is contained in:
Zachary Kain 2013-03-06 01:15:45 -05:00
parent 456580e352
commit f0462d022f
2 changed files with 44 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
styles/app/tasks.styl
View file

@ -261,7 +261,6 @@ for $stage in $stages
font-weight: bold
text-decoration: underline
.option-content
height: 2.5em
width: 100%
@ -299,21 +298,42 @@ for $stage in $stages
padding: 0 0.5em
&.active
opacity: 1
&.spacious
margin: 0.75em 0
font-size: 1.5em
opacity: 1
.tile.spacious
margin: 0.75em 0
font-size: 1.5em
opacity: 1
.tile.bright
background-color: lighten($best, 20%)
&:hover, &:focus
background-color: lighten($best, 40%)
// .context-enabled
// .display-context-dependant,
// .task-list li
// display: none
// todo context switching
.context-enabled
.display-context-dependant,
.task-list li
display: none
// &.context-completed
// .show-for-completed, .completed
// display: block
&.context-completed
.show-for-completed, .completed
display: block
// &.context-uncompleted
// .show-for-uncompleted, .uncompleted
// display: block
&.context-uncompleted
.show-for-uncompleted, .uncompleted
display: block
// nav tabs
.nav-tabs
margin-top: 1.5em
.nav-tabs > li
&.active > a
color: #333
&:hover
margin-top: 1px
> a
border-radius: 0 !important
margin-top: 1px
color: #333
&:hover
border-top: 0
margin-top: 2px

12
views/app/tasks.html
View file

@ -22,6 +22,7 @@
<!-- Todos Column -->
<div class="module">
<div class="task-column todos context-enabled context-uncompleted tabbable tabs-below" id="todo-well">
<!-- todo export/graph options -->
<span class='option-box pull-right'>
{#if _user.history.todos}
<a class="option-action" x-bind=click:toggleChart data-toggle-id="todos-chart" data-history-path="_user.history.todos" rel=tooltip title="Progress"><i class=icon-signal></i></a>
@ -30,16 +31,21 @@
<!-- <a href="https://www.google.com/calendar/render?cid={{encodeiCalLink(_user.id, _user.apiToken)}}" rel=tooltip title="Google Calendar"><i class=icon-calendar></i></a> -->
</span>
<h2 class="task-column_title">Todos</h2>
<!-- create new todo -->
<div class="display-context-dependant show-for-uncompleted">
<app:newTask type="todo" inputValue="{_newTodo}" placeHolder="New Todo" />
</div>
<!-- list of all the todos -->
<ul class='todos task-list'>
{#each _todoList as :task}<app:task />{/}
</ul>
<div class="display-context-dependant show-for-completed">
<a class='btn' x-bind=click:clearCompleted>Clear Completed</a>
</div>
<button class='task-action-btn tile spacious bright display-context-dependant show-for-completed' x-bind=click:clearCompleted>Clear Completed</button>
<div id="todos-chart" style="display:none;"></div>
<!-- remaining/completed tabs -->
<ul class="todo-status-toggler nav nav-tabs">
<li class="active"><a x-bind=click:changeContext data-target="#todo-well" data-context="context-uncompleted">Remaining</a></li>
<li><a x-bind=click:changeContext data-target="#todo-well" data-context="context-completed">Complete</a></li>