diff options
Diffstat (limited to 'client/components/lists/list.styl')
-rw-r--r-- | client/components/lists/list.styl | 137 |
1 files changed, 129 insertions, 8 deletions
diff --git a/client/components/lists/list.styl b/client/components/lists/list.styl index fa32ff6d..dcbeb93f 100644 --- a/client/components/lists/list.styl +++ b/client/components/lists/list.styl @@ -10,7 +10,6 @@ // transparent, because that won't work during a list drag. background: darken(white, 13%) border-left: 1px solid darken(white, 20%) - border-bottom: 1px solid #CCC padding: 0 float: left @@ -44,11 +43,23 @@ background: white margin: -3px 0 8px +.list-header-card-count + height: 35px + +.list-header-add + flex: 0 0 auto + padding: 20px 12px 4px + position: relative + min-height: 20px + .list-header flex: 0 0 auto - margin: 20px 12px 4px + padding: 20px 12px 4px position: relative min-height: 20px + background-color: #e4e4e4; + border-bottom: 6px solid #e4e4e4; + &.ui-sortable-handle cursor: grab @@ -68,16 +79,18 @@ text-overflow: ellipsis word-wrap: break-word + .list-header-watch-icon padding-left: 10px color: #a6a6a6 + .list-header-menu position: absolute - padding: 7px + padding: 27px 19px margin-top: 1px - top: -@padding - right: -@padding + top: -7px + right: -7px .list-header-plus-icon color: #a6a6a6 @@ -143,9 +156,12 @@ float: left @media screen and (max-width: 800px) + .list-header-menu + margin-right: 30px + .mini-list flex: 0 0 60px - height: 60px + height: auto width: 100% border-left: 0px border-bottom: 1px solid darken(white, 20%) @@ -154,6 +170,8 @@ display: block width: 100% border-left: 0px + &:first-child + margin-left: 0px &.ui-sortable-helper flex: 0 0 60px @@ -172,8 +190,16 @@ border-left: 0px border-bottom: 1px solid darken(white, 20%) - .list-header + .list-body + padding: 15px 19px; + .list-header + padding: 0 12px 0px + border-bottom: 0px solid #e4e4e4 + height: 60px + margin-top: 10px + display: flex + align-items: center .list-header-left-icon display: inline padding: 7px @@ -185,5 +211,100 @@ .list-header-menu-icon position: absolute padding: 7px - top: -@padding + top: 50% + transform: translateY(-50%) right: 17px + font-size: 20px + +.link-board-wrapper + display: flex + align-items: baseline + + .js-link-board + margin-left: 15px + +.search-card-results + max-height: 250px + overflow: hidden + +.sk-spinner-list + margin-top: unset !important + +list-header-color(background, color...) + border-bottom: 6px solid background + +.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 |