habitica/styles/app/index.styl

@import "nib/vendor";
@import "../bootstrap-responsive";

html,body,p,h1,ul,li,table,tr,th,td
  margin: 0
  padding: 0

#head
  background: #ddd
  background: -webkit-gradient(linear,0 0,0 100%,from(#e7e7e7),to(#d0d0d0))
  background: -moz-linear-gradient(#e7e7e7, #d0d0d0)
  background: -ms-linear-gradient(#e7e7e7, #d0d0d0)
  background: -o-linear-gradient(#e7e7e7, #d0d0d0)
  background: linear-gradient(#e7e7e7, #d0d0d0)
  -webkit-box-shadow: inset 0 1px #f7f7f7, 0 1px #888, 0 2px #e7e7e7
  -moz-box-shadow: inset 0 1px #f7f7f7, 0 1px #888, 0 2px #e7e7e7
  box-shadow: inset 0 1px #f7f7f7, 0 1px #888, 0 2px #e7e7e7
  padding: 12px 16px
  white-space: nowrap

.color-worst pre
  background-color: rgb(230, 184, 175)
.color-worse pre
  background-color: rgb(244, 204, 204)
.color-bad pre
  background-color: rgb(252, 229, 205)
.color-neutral pre
  background-color: rgb(255, 242, 204)
.color-good pre
  background-color: rgb(217, 234, 211)
.color-better pre
  background-color: rgb(208, 224, 227)
.color-best pre
  background-color: rgb(201, 218, 248)
.completed pre
  background-color: rgb(217, 217, 217)
  color: rgb(153, 153, 153)
.reward pre
  background-color: white
  
.todos h1, .rewards h1
  float:left
  margin-right:15px

.help-icon
  float:right;

.task:hover
  cursor: move
  
li:hover .task-meta-controls .hover-show
  display: inline  

.task
  list-style:none

  pre
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
    font-size: 13px
    line-height: 18px
    color: black

  .task-meta-controls
    float:right
    i
      margin-left:5px    
    
  .task-controls,.task-text
    display:inline
    margin-right:10px

  .task-meta-controls .hover-show
    display: none;

  .vote-up, .vote-down
    text-decoration:none;

  .buy-link, .static-buy-link
    background-color: #ccffcc
    padding: 2px
    margin-right: 10px
    border-radius: 5px
  
    img
      height:20px  
  
  .static-buy-link
    background-color: #DEE5F2

#character 
  img
    width: 60px

  td#avatar
    vertical-align: top
    text-align: center
  td#bars
    padding: 10px 0 0 10px

#bars 
  width: 400px
  .progress
    height: 25px
  .bar
    height: 25px 
    border: 1px solid black
  .progress-text
    float: right 
    margin: 5px
    color: black

footer.footer
  position: absolute
  bottom: 10px
  right: 10px
  
/* ----- Items, Weapons, Armor -----*/
.item-store-popover img
  float:left
  padding-right:7px;

.item .task-text img
  max-height: 16px
don't import base. resets are part of bootstrap 2012-06-27 14:29:28 +00:00			`@import "nib/vendor";`
Add responsive.css 2012-07-07 21:45:06 +00:00			`@import "../bootstrap-responsive";`
Adding empty derby project 2012-04-27 02:03:01 +00:00
remove last remaining styles 2012-06-26 15:25:24 +00:00			`html,body,p,h1,ul,li,table,tr,th,td`
			`margin: 0`
			`padding: 0`
Backup demo.styl, copy in todos index.styl 2012-04-27 17:08:06 +00:00
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`#head`
remove last remaining styles 2012-06-26 15:25:24 +00:00			`background: #ddd`
			`background: -webkit-gradient(linear,0 0,0 100%,from(#e7e7e7),to(#d0d0d0))`
			`background: -moz-linear-gradient(#e7e7e7, #d0d0d0)`
			`background: -ms-linear-gradient(#e7e7e7, #d0d0d0)`
			`background: -o-linear-gradient(#e7e7e7, #d0d0d0)`
			`background: linear-gradient(#e7e7e7, #d0d0d0)`
			`-webkit-box-shadow: inset 0 1px #f7f7f7, 0 1px #888, 0 2px #e7e7e7`
			`-moz-box-shadow: inset 0 1px #f7f7f7, 0 1px #888, 0 2px #e7e7e7`
			`box-shadow: inset 0 1px #f7f7f7, 0 1px #888, 0 2px #e7e7e7`
			`padding: 12px 16px`
			`white-space: nowrap`
Move all of habits.styl into index.styl, conslidate 2012-06-26 12:41:28 +00:00
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00			`.color-worst pre`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`background-color: rgb(230, 184, 175)`
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00			`.color-worse pre`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`background-color: rgb(244, 204, 204)`
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00			`.color-bad pre`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`background-color: rgb(252, 229, 205)`
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00			`.color-neutral pre`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`background-color: rgb(255, 242, 204)`
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00			`.color-good pre`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`background-color: rgb(217, 234, 211)`
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00			`.color-better pre`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`background-color: rgb(208, 224, 227)`
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00			`.color-best pre`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`background-color: rgb(201, 218, 248)`
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00			`.completed pre`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`background-color: rgb(217, 217, 217)`
			`color: rgb(153, 153, 153)`
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00			`.reward pre`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`background-color: white`
float reward & todo h1s 2012-06-26 20:55:41 +00:00
Placed helpIcon & task columns in <app:taskColumn> component 2012-07-07 17:08:36 +00:00			`.todos h1, .rewards h1`
float reward & todo h1s 2012-06-26 20:55:41 +00:00			`float:left`
			`margin-right:15px`
much index.stly cleanup 2012-06-26 15:16:59 +00:00
Help icons 2012-07-07 16:58:34 +00:00			`.help-icon`
			`float:right;`

much index.stly cleanup 2012-06-26 15:16:59 +00:00			`.task:hover`
			`cursor: move`

General <taskMeta:> component for handling charts, edit, and whatever else might come along 2012-06-29 02:32:19 +00:00			`li:hover .task-meta-controls .hover-show`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`display: inline`

			`.task`
			`list-style:none`
Use <pre> for list styling. it's much prettier, but it's meant for code formatting, so this might cause issues in the future - revert if so 2012-06-27 14:54:04 +00:00
			`pre`
			`font-family: "Helvetica Neue", Helvetica, Arial, sans-serif`
			`font-size: 13px`
			`line-height: 18px`
			`color: black`
much index.stly cleanup 2012-06-26 15:16:59 +00:00
General <taskMeta:> component for handling charts, edit, and whatever else might come along 2012-06-29 02:32:19 +00:00			`.task-meta-controls`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`float:right`
Save button bug 2012-06-29 20:31:32 +00:00			`i`
			`margin-left:5px`
much index.stly cleanup 2012-06-26 15:16:59 +00:00
			`.task-controls,.task-text`
			`display:inline`
			`margin-right:10px`

General <taskMeta:> component for handling charts, edit, and whatever else might come along 2012-06-29 02:32:19 +00:00			`.task-meta-controls .hover-show`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`display: none;`

			`.vote-up, .vote-down`
			`text-decoration:none;`

Basic setup for static rewards 2012-07-08 02:43:49 +00:00			`.buy-link, .static-buy-link`
			`background-color: #ccffcc`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`padding: 2px`
			`margin-right: 10px`
			`border-radius: 5px`

			`img`
			`height:20px`
Basic setup for static rewards 2012-07-08 02:43:49 +00:00
			`.static-buy-link`
			`background-color: #DEE5F2`
much index.stly cleanup 2012-06-26 15:16:59 +00:00
			`#character`
			`img`
			`width: 60px`

user lvl is badge 2012-06-27 14:07:16 +00:00			`td#avatar`
			`vertical-align: top`
much index.stly cleanup 2012-06-26 15:16:59 +00:00			`text-align: center`
user lvl is badge 2012-06-27 14:07:16 +00:00			`td#bars`
			`padding: 10px 0 0 10px`
Move all of habits.styl into index.styl, conslidate 2012-06-26 12:41:28 +00:00
progress-text in progress-bar 2012-06-26 13:19:26 +00:00			`#bars`
			`width: 400px`
progress-bar heights 2012-06-26 13:49:26 +00:00			`.progress`
			`height: 25px`
			`.bar`
			`height: 25px`
progress-text in progress-bar 2012-06-26 13:19:26 +00:00			`border: 1px solid black`
			`.progress-text`
			`float: right`
			`margin: 5px`
Add footer (static right/bottom 0 0, need to fix this) 2012-07-07 21:03:58 +00:00			`color: black`

			`footer.footer`
			`position: absolute`
			`bottom: 10px`
			`right: 10px`
Basic setup for static rewards 2012-07-08 02:43:49 +00:00
Adding images as icons for static rewards 2012-07-08 18:50:56 +00:00			`/* ----- Items, Weapons, Armor -----*/`
Popover telling user they've unlocked Items Store 2012-07-08 21:59:50 +00:00			`.item-store-popover img`
			`float:left`
			`padding-right:7px;`

refactored so user = {stats: {hp, lvl, exp, money}, items = {weapon, armor, ..}, tasks, ...} 2012-07-08 20:59:07 +00:00			`.item .task-text img`
Adding images as icons for static rewards 2012-07-08 18:50:56 +00:00			`max-height: 16px`