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

Move styles from stable.jade to inventory.styl file

Browse source
This commit is contained in:
benmanley 2014-02-21 12:14:58 +00:00
parent c04caefaac
commit 8c2c940d88
2 changed files with 12 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
public/css/inventory.styl
View file

@ -97,16 +97,9 @@ menu.pets .customize-menu
.pet-button
border: none
background: none white
//adjust position of flying pig down to leave some room between rows
button[class*="Pet-FlyingPig"]
position: relative
top: 16px
.pet-not-owned
width: 81px;
height: 99px;
position: relative;
/* Would use css3 filters and just display the original pet image with a black hue,
but doesn't seem to work in Firefox or Opera */
/*filter: brightness(0%)
@ -114,17 +107,15 @@ button[class*="Pet-FlyingPig"]
-moz-filter: brightness(0%)
-o-filter: brightness(0%)
-ms-filter: brightness(0%)*/
// align paw with pets, at the bottom of the button (changing margin-top doesn't work cross-browser)
.PixelPaw, .PixelPaw-Gold
position: absolute
top: 38px
left: 16px
//allow paw alignment to apply correctly to PixelPaw-Gold as it is inside a link
menu.pets-rare a
display: inline-block
vertical-align: top
.PixelPaw
margin-top: 36px // align paw with pets, at the bottom of the button
// styles for pets that have been fed until they evolve into a mount
.pet-evolved
opacity: 0.1
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"
//if this could be changed to the opacity talked about? can't figure it out
.selectableInventory
background-color: lightgreen !important

8
views/options/inventory/stable.jade
View file

@ -58,9 +58,7 @@ script(type='text/ng-template', id='partials/options.inventory.pets.html')
.progress-bar.progress-bar-success(style="width:{{user.items.pets[pet]/.5}}%")
button(class="pet-button pet-not-owned", ng-if='!user.items.pets[pet]')
.PixelPaw
// How to apply this style in stylus files?
button(class="pet-button Pet-{{pet}}" ng-if='user.items.pets[pet]<0',style='opacity:0.1;filter:alpha(opacity=10)')
//if this could be changed to the opacity talked about? can't figure it out
button(class="pet-evolved pet-button Pet-{{pet}}", ng-if='user.items.pets[pet]<0')
.col-md-12
h4=env.t('questPets')
menu.pets(type='list')
@ -72,11 +70,11 @@ script(type='text/ng-template', id='partials/options.inventory.pets.html')
.progress-bar.progress-bar-success(style="width:{{user.items.pets[pet]/.5}}%")
button(class="pet-button pet-not-owned", ng-if='!user.items.pets[pet]')
.PixelPaw
button(class="pet-button Pet-{{pet}}" ng-if='user.items.pets[pet]<0',style='opacity:0.1;filter:alpha(opacity=10)')
button(class="pet-evolved pet-button Pet-{{pet}}", ng-if='user.items.pets[pet]<0')
.col-md-12
h4=env.t('rarePets')
menu.pets-rare
menu
div
button(ng-if='user.items.pets["Wolf-Veteran"]', class="pet-button Pet-Wolf-Veteran", ng-class='{active: user.items.currentPet == "Wolf-Veteran"}', ng-click='choosePet("Wolf", "Veteran")', popover=env.t('veteranWolf'), popover-trigger='mouseenter', popover-placement='bottom')
button(ng-if='user.items.pets["Wolf-Cerberus"]', class="pet-button Pet-Wolf-Cerberus", ng-class='{active: user.items.currentPet == "Wolf-Cerberus"}', ng-click='choosePet("Wolf", "Cerberus")', popover=env.t('cerberusPup'), popover-trigger='mouseenter', popover-placement='bottom')