mirror of
https://github.com/wekan/wekan.git
synced 2025-12-16 15:30:13 +01:00
When `Show card count` is enabled, the lists with the card counts have two lines of text while the lists without have only one. This results in the box around the list headers are not of the same size and this is visible when setting a color to the list.
285 lines
6 KiB
Stylus
285 lines
6 KiB
Stylus
@import 'nib'
|
|
|
|
.list
|
|
box-sizing: border-box
|
|
display: flex
|
|
flex-direction: column
|
|
flex: 0 0 270px
|
|
position: relative
|
|
// Even if this background color is the same as the body we can't leave it
|
|
// transparent, because that won't work during a list drag.
|
|
background: darken(white, 13%)
|
|
border-left: 1px solid darken(white, 20%)
|
|
padding: 0
|
|
float: left
|
|
|
|
&:first-child
|
|
margin-left: 5px
|
|
border-left: none
|
|
|
|
.card-details + &
|
|
border-left: none
|
|
|
|
&.ui-sortable-helper
|
|
box-shadow: -2px 2px 8px rgba(0, 0, 0, .3),
|
|
0 0 1px rgba(0, 0, 0, .5)
|
|
transform: rotate(4deg)
|
|
cursor: grabbing
|
|
|
|
.list-header.ui-sortable-handle
|
|
cursor: grabbing
|
|
|
|
&.placeholder
|
|
background-color: rgba(0, 0, 0, .2)
|
|
border-color: transparent
|
|
box-shadow: none
|
|
height: 100px
|
|
|
|
&.list-composer, & .list-composer
|
|
.open-list-composer
|
|
color: #8c8c8c
|
|
|
|
.list-name-input
|
|
background: white
|
|
margin: -3px 0 8px
|
|
|
|
.list-header-card-count
|
|
height: 35px
|
|
|
|
.list-header
|
|
flex: 0 0 auto
|
|
padding: 20px 12px 4px
|
|
position: relative
|
|
min-height: 20px
|
|
|
|
|
|
&.ui-sortable-handle
|
|
cursor: grab
|
|
|
|
.list-header-left-icon
|
|
display: none
|
|
|
|
.list-header-name
|
|
display: inline
|
|
font-size: 16px
|
|
line-height: 17px
|
|
margin: 0
|
|
font-weight: bold
|
|
min-height: 9px
|
|
min-width: 30px
|
|
overflow: hidden
|
|
text-overflow: ellipsis
|
|
word-wrap: break-word
|
|
|
|
|
|
.list-header-watch-icon
|
|
padding-left: 10px
|
|
color: #a6a6a6
|
|
|
|
.list-header-menu
|
|
position: absolute
|
|
padding: 27px 19px
|
|
margin-top: 1px
|
|
top: -7px
|
|
right: -7px
|
|
|
|
.list-header-plus-icon
|
|
color: #a6a6a6
|
|
margin-right: 10px
|
|
|
|
.highlight
|
|
color: #ce1414
|
|
|
|
.list-body
|
|
flex: 1 1 auto
|
|
flex-direction: column
|
|
display: flex
|
|
overflow-y: auto
|
|
padding: 5px 11px
|
|
|
|
.minicards
|
|
flex-grow: 1
|
|
flex-shrink: 0
|
|
|
|
form
|
|
margin-bottom: 9px
|
|
|
|
.ps-scrollbar-y-rail
|
|
transform: translateX(2px)
|
|
|
|
.open-minicard-composer
|
|
border-radius: 2px
|
|
color: #8c8c8c
|
|
display: block
|
|
padding: 7px 10px
|
|
position: relative
|
|
text-decoration: none
|
|
animation: fadeIn 0.3s
|
|
|
|
i.fa
|
|
margin-right: 7px
|
|
|
|
&:hover
|
|
background: #fafafa
|
|
color: #222
|
|
box-shadow: 0 1px 2px rgba(0,0,0,.2)
|
|
|
|
#js-wip-limit-edit
|
|
padding-top: 2%
|
|
|
|
p
|
|
margin-bottom: 0
|
|
|
|
input
|
|
display: inline-block
|
|
|
|
.wip-limit-value
|
|
width: 20%
|
|
margin-right: 5%
|
|
|
|
.wip-limit-error
|
|
display: none
|
|
|
|
.soft-wip-limit
|
|
margin-right: 8px
|
|
|
|
div
|
|
float: left
|
|
|
|
@media screen and (max-width: 800px)
|
|
.mini-list
|
|
flex: 0 0 60px
|
|
height: 60px
|
|
width: 100%
|
|
border-left: 0px
|
|
border-bottom: 1px solid darken(white, 20%)
|
|
|
|
.list
|
|
display: block
|
|
width: 100%
|
|
border-left: 0px
|
|
|
|
&.ui-sortable-helper
|
|
flex: 0 0 60px
|
|
height: 60px
|
|
width: 100%
|
|
border-left: 0px
|
|
border-bottom: 1px solid darken(white, 20%)
|
|
|
|
.list-header.ui-sortable-handle
|
|
cursor: grabbing
|
|
|
|
&.placeholder
|
|
flex: 0 0 60px
|
|
height: 60px
|
|
width: 100%
|
|
border-left: 0px
|
|
border-bottom: 1px solid darken(white, 20%)
|
|
|
|
.list-header
|
|
|
|
.list-header-left-icon
|
|
display: inline
|
|
padding: 7px
|
|
padding-right: 27px
|
|
margin-top: 1px
|
|
top: -@padding
|
|
left: -@padding
|
|
|
|
.list-header-menu-icon
|
|
position: absolute
|
|
padding: 7px
|
|
top: -@padding
|
|
right: 17px
|
|
|
|
.link-board-wrapper
|
|
display: flex
|
|
align-items: baseline
|
|
|
|
.js-link-board
|
|
margin-left: 15px
|
|
|
|
.search-card-results
|
|
max-height: 250px
|
|
overflow: hidden
|
|
|
|
list-header-color(background, color...)
|
|
background: background !important
|
|
if color
|
|
color: color !important //overwrite text for better visibility
|
|
|
|
.list-header-white
|
|
list-header-color(#ffffff, #4d4d4d) //Black text for better visibility
|
|
border: 1px solid #eee
|
|
|
|
.list-header-green
|
|
list-header-color(#3cb500, #ffffff) //White text for better visibility
|
|
|
|
.list-header-yellow
|
|
list-header-color(#fad900, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-orange
|
|
list-header-color(#ff9f19, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-red
|
|
list-header-color(#eb4646, #ffffff) //White text for better visibility
|
|
|
|
.list-header-purple
|
|
list-header-color(#a632db, #ffffff) //White text for better visibility
|
|
|
|
.list-header-blue
|
|
list-header-color(#0079bf, #ffffff) //White text for better visibility
|
|
|
|
.list-header-pink
|
|
list-header-color(#ff78cb, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-sky
|
|
list-header-color(#00c2e0, #ffffff) //White text for better visibility
|
|
|
|
.list-header-black
|
|
list-header-color(#4d4d4d, #ffffff) //White text for better visibility
|
|
|
|
.list-header-lime
|
|
list-header-color(#51e898, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-silver
|
|
list-header-color(unset, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-peachpuff
|
|
list-header-color(#ffdab9, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-crimson
|
|
list-header-color(#dc143c, #ffffff) //White text for better visibility
|
|
|
|
.list-header-plum
|
|
list-header-color(#dda0dd, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-darkgreen
|
|
list-header-color(#006400, #ffffff) //White text for better visibility
|
|
|
|
.list-header-slateblue
|
|
list-header-color(#6a5acd, #ffffff) //White text for better visibility
|
|
|
|
.list-header-magenta
|
|
list-header-color(#ff00ff, #ffffff) //White text for better visibility
|
|
|
|
.list-header-gold
|
|
list-header-color(#ffd700, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-navy
|
|
list-header-color(#000080, #ffffff) //White text for better visibility
|
|
|
|
.list-header-gray
|
|
list-header-color(#808080, #ffffff) //White text for better visibility
|
|
|
|
.list-header-saddlebrown
|
|
list-header-color(#8b4513, #ffffff) //White text for better visibility
|
|
|
|
.list-header-paleturquoise
|
|
list-header-color(#afeeee, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-mistyrose
|
|
list-header-color(#ffe4e1, #4d4d4d) //Black text for better visibility
|
|
|
|
.list-header-indigo
|
|
list-header-color(#4b0082, #ffffff) //White text for better visibility
|