1
0
Fork 0
forked from OpenNeo/impress
impress/app/assets/stylesheets/pets/_bulk.sass
Matchu 74197a6e9f Upgrade to latest Sass and Sprockets
This required a buncha fixes to how SASS scoping works! Needed to add a bunch of imports for stuff that previously would get read from the global scope by being imported *after* the constants and mixins etc.

There's clearly a lot of refactor opportunity here, but I'm not gonna worry about it!!
2023-10-23 19:05:09 -07:00

125 lines
2.7 KiB
Sass

@import "../partials/clean/constants"
@import "../partials/clean/mixins"
body.pets-bulk
#needed-items-form, #bulk-pets-form
text-align: center
#needed-items-form
#needed-items-pet
border-top: 1px solid $soft-border-color
display: none
margin-top: 1em
padding-top: 1em
h4
font-size: 150%
margin-bottom: .5em
#needed-items-reload
+inline-block
font-size: 12px
margin-left: 1em
vertical-align: middle
#needed-items-alert
display: none
margin-top: .5em
#needed-items-pet-thumbnail
height: 50px
width: 50px
#needed-items-pet-items
li.owned
background: $module-bg-color
border: 1px solid $module-border-color
.object-owned
color: $soft-text-color
display: block
font-size: 75%
font-style: italic
padding-bottom: .25em
&.loading-pet, &.loading-items
#needed-items-pet-name-field
background:
image: image-url("loading.gif")
position: center right
repeat: no-repeat
#needed-items-pet-items
+opacity(.50)
&.loading-pet
#needed-items-pet h4
+opacity(.50)
&.loaded
#needed-items-pet
display: block
&.failed
#needed-items-alert
display: block
#bulk-pets-form
border-top: 1px solid $module-border-color
margin-top: 12px
padding-top: 12px
textarea
+inline-block
// NOTE: This was previously `@extend input[type=text]`,
// I copied it in from _layout.sass!
border-radius: 3px
background: #fff
border: 1px solid $input-border-color
color: $text-color + #444444
padding: .25em
&:focus, &:active
color: inherit
display: inline
font: inherit
height: 1.5em
overflow: hidden
resize: none
ul
list-style: none
margin-top: 1em
li
+inline-block
background: #eee
margin: 0 auto
min-width: 25%
text-align: left
.waiting-message, .loading-message, .response
display: none
font:
size: 75%
style: italic
margin-left: 75px
&.waiting .waiting-message, &.loading .loading-message, &.loaded .response, &.failed .response
display: block
&.loaded
background: $notice-bg-color
&.failed
background: $error-bg-color
img
float: left
height: 50px
width: 50px
margin-right: 1em
vertical-align: middle
&.js
.noscript
display: none
.script-only
display: block
.script-only
display: none