From 6ea05e1cb20b3ae4fbbc13f6947d069841a6d0d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julius=20H=C3=A4rtl?= <jus@bitgrid.net>
Date: Sat, 25 Jan 2020 11:34:26 +0100
Subject: [PATCH] Fix dark mode shadow and markdown docs link (fix #1136)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Julius Härtl <jus@bitgrid.net>
---
 src/components/board/Stack.vue      |  1 +
 src/components/card/CardSidebar.vue | 18 ++++++++++++++++--
 src/components/cards/CardItem.vue   | 15 ++++++++-------
 3 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/src/components/board/Stack.vue b/src/components/board/Stack.vue
index a00c84f90..e412509fd 100644
--- a/src/components/board/Stack.vue
+++ b/src/components/board/Stack.vue
@@ -193,6 +193,7 @@ export default {
 		padding: 3px;
 		margin: 3px -3px;
 		margin-right: -10px;
+		margin-bottom: 5px;
 		margin-top: 0;
 		background-color: var(--color-main-background-translucent);
 
diff --git a/src/components/card/CardSidebar.vue b/src/components/card/CardSidebar.vue
index 58435cf8b..de47544f1 100644
--- a/src/components/card/CardSidebar.vue
+++ b/src/components/card/CardSidebar.vue
@@ -106,7 +106,13 @@
 					type="deck-card" />
 			</div>
 
-			<h5>{{ t('deck', 'Description') }}</h5>
+			<h5>
+				{{ t('deck', 'Description') }}
+				<a v-tooltip="t('deck', 'Formatting help')"
+					href="https://deck.readthedocs.io/en/latest/Markdown/"
+					target="_blank"
+					class="icon icon-info" />
+			</h5>
 			<!-- FIXME: make sure the editor is disabled when canEdit is false -->
 			<VueEasymde ref="markdownEditor" v-model="copiedCard.description" :configs="mdeConfig" />
 		</AppSidebarTab>
@@ -300,13 +306,21 @@ export default {
 	}
 </style>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 	h5 {
 		border-bottom: 1px solid var(--color-border);
 		margin-top: 20px;
 		margin-bottom: 5px;
 		color: var(--color-text-maxcontrast);
+
+		.icon-info {
+			display: inline-block;
+			width: 16px;
+			height: 16px;
+			float: right;
+			opacity: .7;
+		}
 	}
 
 	.section-wrapper {
diff --git a/src/components/cards/CardItem.vue b/src/components/cards/CardItem.vue
index f2c0d983d..97c7169da 100644
--- a/src/components/cards/CardItem.vue
+++ b/src/components/cards/CardItem.vue
@@ -237,14 +237,19 @@ export default {
 		opacity: 0;
 	}
 
+	body.dark .card {
+		border: 1px solid var(--color-border);
+	}
+
 	.card {
-		box-shadow: 0 0 3px 0 var(--color-box-shadow);
+		box-shadow: 0 0 2px 0 var(--color-box-shadow);
 		border-radius: 3px;
 		font-size: 100%;
 		background-color: var(--color-main-background);
 		margin-bottom: $card-spacing;
-		&.current {
-			box-shadow: 0 0 3px 1px var(--color-box-shadow);
+
+		&.current-card {
+			box-shadow: 0 0 5px 0 var(--color-box-shadow);
 		}
 
 		.card-upper {
@@ -315,10 +320,6 @@ export default {
 				height: 44px;
 			}
 		}
-
-		&.current-card {
-			box-shadow: 0 0 6px 0 var(--color-box-shadow);
-		}
 	}
 
 	.compact {