diff options
Diffstat (limited to 'client/components/cards/cardDetails.styl')
| -rw-r--r-- | client/components/cards/cardDetails.styl | 114 |
1 files changed, 107 insertions, 7 deletions
diff --git a/client/components/cards/cardDetails.styl b/client/components/cards/cardDetails.styl index e5739a93..c1d6b7e1 100644 --- a/client/components/cards/cardDetails.styl +++ b/client/components/cards/cardDetails.styl @@ -1,11 +1,12 @@ @import 'nib' .card-details - padding: 0 20px + padding: 0 flex-shrink: 0 - flex-basis: 470px + flex-basis: 510px will-change: flex-basis - overflow: hidden + overflow-y: scroll + overflow-x: hidden background: darken(white, 3%) border-radius: bottom 3px z-index: 20 !important @@ -13,8 +14,16 @@ box-shadow: 0 0 7px 0 darken(white, 30%) transition: flex-basis 0.1s + .mCustomScrollBox + padding-left: 0 + + .ps-scrollbar-y-rail + pointer-event: all + position: absolute; + .card-details-canvas width: 470px + padding-left: 20px; .card-details-header margin: 0 -20px 5px @@ -46,6 +55,12 @@ margin: 7px 0 0 padding: 0 + .linked-card-location + font-style: italic + font-size: 1em + margin-bottom: 0 + & p + margin-bottom: 0 form.inlined-form margin-top: 5px @@ -69,6 +84,7 @@ .card-details-items display: flex + flex-wrap: wrap margin: 15px 0 .card-details-item @@ -80,9 +96,11 @@ &.card-details-item-received, &.card-details-item-start, &.card-details-item-due, - &.card-details-item-end - width: 50% - flex-shrink: 1 + &.card-details-item-end, + &.card-details-item-customfield, + &.card-details-item-name + max-width: 50% + flex-grow: 1 .card-details-item-title font-size: 16px @@ -115,10 +133,92 @@ input[type="submit"].attachment-add-link-submit .card-details-canvas width: 100% - + padding-left: 0px; + .card-details-header .close-card-details margin-right: 0px .card-details-menu margin-right: 10px + +card-details-color(background, color...) + background: background !important + if color + color: color !important //overwrite text for better visibility + +.card-details-white + card-details-color(unset, #000) //Black text for better visibility + border: 1px solid #eee + +.card-details-green + card-details-color(#3cb500, #ffffff) //White text for better visibility + +.card-details-yellow + card-details-color(#fad900, #000) //Black text for better visibility + +.card-details-orange + card-details-color(#ff9f19, #000) //Black text for better visibility + +.card-details-red + card-details-color(#eb4646, #ffffff) //White text for better visibility + +.card-details-purple + card-details-color(#a632db, #ffffff) //White text for better visibility + +.card-details-blue + card-details-color(#0079bf, #ffffff) //White text for better visibility + +.card-details-pink + card-details-color(#ff78cb, #000) //Black text for better visibility + +.card-details-sky + card-details-color(#00c2e0, #ffffff) //White text for better visibility + +.card-details-black + card-details-color(#4d4d4d, #ffffff) //White text for better visibility + +.card-details-lime + card-details-color(#51e898, #000) //Black text for better visibility + +.card-details-silver + card-details-color(#c0c0c0, #000) //Black text for better visibility + +.card-details-peachpuff + card-details-color(#ffdab9, #000) //Black text for better visibility + +.card-details-crimson + card-details-color(#dc143c, #ffffff) //White text for better visibility + +.card-details-plum + card-details-color(#dda0dd, #000) //Black text for better visibility + +.card-details-darkgreen + card-details-color(#006400, #ffffff) //White text for better visibility + +.card-details-slateblue + card-details-color(#6a5acd, #ffffff) //White text for better visibility + +.card-details-magenta + card-details-color(#ff00ff, #ffffff) //White text for better visibility + +.card-details-gold + card-details-color(#ffd700, #000) //Black text for better visibility + +.card-details-navy + card-details-color(#000080, #ffffff) //White text for better visibility + +.card-details-gray + card-details-color(#808080, #ffffff) //White text for better visibility + +.card-details-saddlebrown + card-details-color(#8b4513, #ffffff) //White text for better visibility + +.card-details-paleturquoise + card-details-color(#afeeee, #000) //Black text for better visibility + +.card-details-mistyrose + card-details-color(#ffe4e1, #000) //Black text for better visibility + +.card-details-indigo + card-details-color(#4b0082, #ffffff) //White text for better visibility |