summaryrefslogtreecommitdiffstats
path: root/client/components/cards/minicard.styl
diff options
context:
space:
mode:
Diffstat (limited to 'client/components/cards/minicard.styl')
-rw-r--r--client/components/cards/minicard.styl124
1 files changed, 123 insertions, 1 deletions
diff --git a/client/components/cards/minicard.styl b/client/components/cards/minicard.styl
index d59f1f63..e3d1ff20 100644
--- a/client/components/cards/minicard.styl
+++ b/client/components/cards/minicard.styl
@@ -9,7 +9,7 @@
&.placeholder
background: darken(white, 20%)
- border-radius: 2px
+ border-radius: 9px
&.ui-sortable-helper
cursor: grabbing
@@ -44,6 +44,16 @@
transition: transform 0.2s,
border-radius 0.2s
+ &.linked-board
+ &.linked-card
+ .linked-icon
+ display: inline-block
+ margin-right: 11px
+ vertical-align: baseline
+ font-size: 0.9em
+ .linked-archived
+ color: #937760
+
.is-selected &
transform: translateX(11px)
border-bottom-right-radius: 0
@@ -77,9 +87,31 @@
height: @width
border-radius: 2px
margin-left: 3px
+ .minicard-custom-fields
+ display:block;
+ .minicard-custom-field
+ display:flex;
+ .minicard-custom-field-item
+ max-width:50%;
+ flex-grow:1;
+ .handle
+ width: 20px;
+ height: 20px;
+ position: absolute;
+ right: 5px;
+ top: 5px;
+ display:none;
+ @media only screen and (max-width: 1199px) {
+ display:block;
+ }
+ .fa-arrows
+ font-size:20px;
+ color: #ccc;
.minicard-title
p:last-child
margin-bottom: 0
+ .viewer
+ display: inline-block
.dates
display: flex;
flex-direction: row;
@@ -155,6 +187,13 @@
margin-bottom: 20px
overflow-y: auto
+.parent-prefix
+ color: darken(white, 30%)
+ font-size: 0.9em
+.parent-subtext
+ color: darken(white, 30%)
+ font-size: 0.9em
+
@media screen and (max-width: 800px)
.minicard
.is-selected &
@@ -163,3 +202,86 @@
border-top-right-radius: 0
z-index: 15
box-shadow: 0 1px 2px rgba(0,0,0,.15)
+
+minicard-color(background, color...)
+ background-color: background
+ if color
+ color: color //overwrite text for better visibility
+ &:hover:not(.minicard-composer),
+ .is-selected &,
+ .draggable-hover-card &
+ background: darken(background, 3%)
+ .draggable-hover-card &
+ background: darken(background, 7%)
+
+.minicard-green
+ minicard-color(#3cb500, #ffffff) //White text for better visibility
+
+.minicard-yellow
+ minicard-color(#fad900)
+
+.minicard-orange
+ minicard-color(#ff9f19)
+
+.minicard-red
+ minicard-color(#eb4646, #ffffff) //White text for better visibility
+
+.minicard-purple
+ minicard-color(#a632db, #ffffff) //White text for better visibility
+
+.minicard-blue
+ minicard-color(#0079bf, #ffffff) //White text for better visibility
+
+.minicard-pink
+ minicard-color(#ff78cb)
+
+.minicard-sky
+ minicard-color(#00c2e0, #ffffff) //White text for better visibility
+
+.minicard-black
+ minicard-color(#4d4d4d, #ffffff) //White text for better visibility
+
+.minicard-lime
+ minicard-color(#51e898)
+
+.minicard-silver
+ minicard-color(#c0c0c0)
+
+.minicard-peachpuff
+ minicard-color(#ffdab9)
+
+.minicard-crimson
+ minicard-color(#dc143c, #ffffff) //White text for better visibility
+
+.minicard-plum
+ minicard-color(#dda0dd)
+
+.minicard-darkgreen
+ minicard-color(#006400, #ffffff) //White text for better visibility
+
+.minicard-slateblue
+ minicard-color(#6a5acd, #ffffff) //White text for better visibility
+
+.minicard-magenta
+ minicard-color(#ff00ff, #ffffff) //White text for better visibility
+
+.minicard-gold
+ minicard-color(#ffd700)
+
+.minicard-navy
+ minicard-color(#000080, #ffffff) //White text for better visibility
+
+.minicard-gray
+ minicard-color(#808080, #ffffff) //White text for better visibility
+
+.minicard-saddlebrown
+ minicard-color(#8b4513, #ffffff) //White text for better visibility
+
+.minicard-paleturquoise
+ minicard-color(#afeeee)
+
+.minicard-mistyrose
+ minicard-color(#ffe4e1)
+
+.minicard-indigo
+ minicard-color(#4b0082, #ffffff) //White text for better visibility