1
0
Fork 0
forked from OpenNeo/impress
impress/app/assets/stylesheets/closet_hangers/_index.sass

471 lines
9.1 KiB
Sass
Raw Normal View History

@import "../partials/clean/constants"
@import "../partials/campaign-progress"
@import "../partials/context_button"
@import "../partials/icon"
@import "../partials/secondary_nav"
2011-07-12 21:25:14 -07:00
body.closet_hangers-index
+campaign-progress
2011-07-29 07:52:04 -07:00
+secondary-nav
2011-07-12 21:25:14 -07:00
#title
2011-07-20 12:16:22 -07:00
margin-bottom: 0
2011-07-15 14:21:18 -07:00
2011-07-12 21:25:14 -07:00
#import-link
+awesome-button
+loud-awesome-button-color
#closet-hangers-items-search
float: right
input[name=q]
&.loading
background:
image: image-url("loading.gif")
position: 2px center
repeat: no-repeat
padding-left: $icon-width + 4px
2011-07-12 21:25:14 -07:00
2011-07-20 12:16:22 -07:00
#closet-hangers-contact
clear: both
2011-07-31 16:14:55 -07:00
color: $soft-text-color
2011-07-20 12:16:22 -07:00
margin-bottom: 1em
margin-left: 2em
min-height: image-height("neomail.png")
a
color: inherit
2014-05-15 22:34:00 -07:00
margin-right: .5em
text-decoration: none
&:hover
text-decoration: underline
a, > form
2011-07-20 12:16:22 -07:00
background:
position: left center
repeat: no-repeat
2011-07-31 16:14:55 -07:00
padding-left: image-width("neomail.png") + 4px
2014-05-15 22:34:00 -07:00
a.neomail, > form
background-image: image-url("neomail.png")
a.lookup
background-image: image-url("lookup.png")
select
2011-07-20 12:16:22 -07:00
width: 10em
label
font-weight: bold
margin-right: .5em
&:after
content: ":"
#toggle-help, #toggle-compare
+awesome-button
cursor: pointer
display: none
#closet-hangers-help.hidden
display: none
#closet-hangers-extras
2011-08-03 08:35:06 -07:00
font-size: 85%
margin:
bottom: 2em
top: 2em
text-align: center
a
+awesome-button
margin: 0 0.5em
2011-07-31 16:24:06 -07:00
#closet-hangers-share
margin-bottom: 1em
label
font-weight: bold
margin-right: .5em
input
width: 30em
.bulk-actions
display: none
2011-07-12 21:25:14 -07:00
#closet-hangers
clear: both
text-align: center
border-top: 1px solid $module-border-color
2011-07-12 21:25:14 -07:00
2011-07-15 14:21:18 -07:00
.object
.quantity
+opacity(.75)
background: white
padding: 6px 4px 4px
2011-07-15 14:21:18 -07:00
position: absolute
left: ($object-width - $object-img-size) / 2 + $object-padding
line-height: 1
2011-07-15 14:21:18 -07:00
text-align: left
top: 0
2011-07-15 14:21:18 -07:00
span, input[type=number]
font-size: 16px
font-weight: bold
form
display: none
&[data-quantity="1"]
.quantity
display: none
2011-07-29 07:52:04 -07:00
a
/* It's jarring to have line-height gaps in the linkiness. */
display: block
&:hover
text-decoration: underline
2015-09-26 14:22:11 -07:00
.object
margin: 0
label
display: block
input[type=checkbox]
display: none
position: absolute
top: 0
right: ($object-width - $object-img-size) / 2 + $object-padding
height: 16px
width: 16px
2015-09-26 14:22:11 -07:00
&:checked
display: block
& + label
background: $module-bg-color
outline: 1px solid $module-border-color
2011-07-29 07:52:04 -07:00
.closet-hangers-group
border-top: 1px solid $module-border-color
margin-bottom: 2em
padding-bottom: 1em
&:first-of-type
border-top: 0
2011-07-29 07:52:04 -07:00
> header
border-bottom: 1px solid $soft-border-color
display: block
margin-bottom: .25em
padding: .25em 0
position: relative
h3
font-size: 250%
margin: 0
.add-closet-list
+awesome-button
bottom: 50%
margin-bottom: -1em
position: absolute
right: 1em
&:active
margin-bottom: -1.1em
top: auto
span.show, span.hide
color: $soft-text-color
display: none
font-size: 85%
left: 1em
position: absolute
top: 1em
&:hover
color: inherit
text-decoration: underline
.closet-list
2011-07-22 14:55:05 -07:00
border-bottom: 1px solid $soft-border-color
2011-07-29 07:52:04 -07:00
padding: .5em 0
2011-07-30 16:45:28 -07:00
position: relative
.visibility-form
font-size: 85%
left: .5em
position: absolute
text-align: left
top: .25em
z-index: 10
2011-07-30 16:45:28 -07:00
input, select
font-size: inherit
2011-07-30 16:45:28 -07:00
margin:
bottom: 0
top: 0
select
border-color: $background-color
input[type=submit]
+context-button
font-size: inherit
2011-07-30 16:45:28 -07:00
visibility: hidden
&:active
top: 1px
2011-07-29 07:52:04 -07:00
.visibility-descriptions
+opacity(.75)
background: $background-color
font-style: italic
list-style: none
padding: 0 .5em
li
display: none
&:hover
.visibility-descriptions li.current
display: block
2011-07-29 07:52:04 -07:00
header
display: block
position: relative
2011-07-22 15:06:46 -07:00
2011-07-29 07:52:04 -07:00
h4
+header-text
font-size: 150%
2011-07-30 16:45:28 -07:00
line-height: 1
margin: 0 auto .67em
width: 50%
2011-07-22 15:06:46 -07:00
2011-07-29 07:52:04 -07:00
.empty-list
display: none
2011-07-29 07:52:04 -07:00
font-style: italic
.closet-list-controls
2011-07-22 15:06:46 -07:00
display: none
position: absolute
right: 1em
2011-07-29 07:52:04 -07:00
top: 0
2015-09-26 14:22:11 -07:00
a, input[type=submit], button
2011-07-29 07:52:04 -07:00
+context-button
form
display: inline
&[data-hangers-count="0"]
.empty-list
display: block
2011-07-29 07:52:04 -07:00
&.unlisted
h4
2011-07-30 16:45:28 -07:00
font:
size: 125%
style: italic
2011-07-22 15:06:46 -07:00
&:hover
2011-07-29 07:52:04 -07:00
.closet-list-controls
display: block
2011-07-22 14:55:05 -07:00
2011-07-30 16:45:28 -07:00
.visibility-form
input[type=submit]
visibility: visible
select
border-color: $soft-border-color
2011-07-29 07:52:04 -07:00
&:last-child
border-bottom: 0
2011-07-22 14:55:05 -07:00
2011-07-30 10:40:41 -07:00
&.droppable-active
border-radius: 1em
2011-07-30 10:40:41 -07:00
+module
border-bottom-width: 1px
border-style: dotted
margin: 1em 0
.object
// totally hiding these elements causes the original element to change
// position, throwing off the drag
+opacity(.25)
&.ui-draggable-dragging
+opacity(1)
.closet-list-controls
display: none
.closet-list-hangers
overflow: hidden
.visibility-form
display: none
.closet-hangers-group-autocomplete-item, .closet-list-autocomplete-item
span
+opacity(.5)
font-style: italic
padding: .2em .4em
.closet-list-autocomplete-item
a, span
font-size: 85%
padding-left: 2em
2011-07-29 08:25:17 -07:00
.closet-hangers-group
&[data-owned=true] .user-wants, &[data-owned=false] .user-owns
background: $module-bg-color
font-weight: bold
2011-07-22 11:02:04 -07:00
&.current-user
#closet-hangers
.object:hover
form
display: inline
2011-07-15 14:21:18 -07:00
.closet-hanger-destroy
position: absolute
right: ($object-width - $object-img-size) / 2 + $object-padding
top: $object-img-size - 28px
input
+context-button
.quantity
+opacity(1)
background: transparent
top: 0
padding: 0
span
display: none
input[type=number]
padding: 2px
width: 2em
input[type=submit]
font-size: 85%
input[type=checkbox]
display: block
2011-07-22 11:02:04 -07:00
&.js
#closet-hangers
.object:hover .quantity
2011-07-29 07:52:04 -07:00
display: block
input[type=number]
width: 2.5em
2011-07-15 14:21:18 -07:00
input[type=submit]
display: none
.object.loading
background: $module-bg-color
outline: 1px solid $module-border-color
2011-07-29 07:52:04 -07:00
.quantity
display: block
span:after
content: ""
2011-07-15 13:59:15 -07:00
.bulk-actions
2015-09-26 20:09:13 -07:00
background: $background-color
box-sizing: border-box
display: block
font-size: 85%
padding: .5em 1em
2015-09-26 20:09:13 -07:00
text-align: center
width: 800px
2015-09-26 20:09:13 -07:00
position: sticky
top: 0
border-bottom: 1px solid $module-border-color
z-index: 11 /* beat the visibility form */
.bulk-actions-intro, .bulk-actions-target-desc-singular
display: none
.bulk-actions-target-desc
display: inline-block
.bulk-actions-options
display: inline-block
list-style: none
> li
display: inline-block
margin-left: .75em
form
display: inline-block
&:not(:first-child)::before
content: " or "
display: inline-block
margin-right: .75em
&[data-target-count="0"]
.bulk-actions-intro
display: block
.bulk-actions-form
display: none
&[data-target-count="1"]
.bulk-actions-target-desc-singular
display: inline
.bulk-actions-target-desc-plural
display: none
2011-07-22 11:02:04 -07:00
#closet-hangers-contact
input[type=submit]
2011-07-22 11:02:04 -07:00
display: none
2011-07-22 15:06:46 -07:00
.closet-hangers-group
header
2011-07-29 07:52:04 -07:00
.show, .hide
cursor: pointer
2011-07-22 15:06:46 -07:00
.hide
display: block
&.hidden
header .hide, .closet-hangers-group-content
display: none
header .show
display: block
#toggle-help
display: inline-block
2015-09-26 14:22:11 -07:00
.remove-all
display: none
.select-all
display: inline-block
&.js
#toggle-compare
display: inline-block
#closet-hangers.comparing
.object
display: none
.closet-hangers-group
&[data-owned=true] .user-wants, &[data-owned=false] .user-owns
display: inline-block