From 14772216de5ed3778018f36e1f317148ddc30048 Mon Sep 17 00:00:00 2001
From: mgmeyers <matthew.gregory.meyers@gmail.com>
Date: Thu, 15 Jul 2021 11:53:25 -0700
Subject: [PATCH] Preview blockquotes

---
 obsidian.css         | 37 ++++++++++++++-----------------------
 src/020-document.css | 11 +++++++++--
 src/060-preview.css  | 26 +++++---------------------
 3 files changed, 28 insertions(+), 46 deletions(-)

diff --git a/obsidian.css b/obsidian.css
index 6400bac..1d836f5 100644
--- a/obsidian.css
+++ b/obsidian.css
@@ -4245,14 +4245,21 @@ input[type="checkbox"]:checked:before {
 }
 
 .markdown-preview-view .collapse-indicator > svg.right-triangle {
-  width: 16px;
-  height: 16px;
+  color: var(--shade-40);
+  width: 14px;
+  height: 14px;
   position: absolute;
   left: -2.33rem;
   top: 50%;
   transform: translateY(-50%);
 }
 
+.is-mobile .markdown-preview-view .collapse-indicator > svg.right-triangle {
+  width: 16px;
+  height: 16px;
+}
+
+
 .markdown-preview-view
   .heading-collapse-indicator.collapse-indicator
   > svg.right-triangle {
@@ -6386,13 +6393,13 @@ body {
   color: unset;
   padding: 0 0 0 1.4375rem;
   margin-inline-start: unset;
+  border-left: 2px solid var(--shade-plus-darker);
 }
 
-.markdown-preview-section blockquote:before {
-  position: absolute;
-  left: 0;
-  line-height: 1.88889 !important;
-}
+/* .theme-dark .markdown-preview-section blockquote {
+  border-left-color: var(--shade-10);
+} */
+
 
 .markdown-preview-view blockquote p {
   margin: 0;
@@ -6497,22 +6504,6 @@ body {
   padding: unset;
 }
 
-/* Icons */
-
-.markdown-preview-section blockquote:before {
-  display: inline-block;
-  line-height: 1;
-  margin-right: -0.6em;
-  opacity: 0.1;
-  width: 1rem;
-  height: 1rem;
-  content: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" style="fill:rgb(0, 0, 0);"><path d="M6.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35.208-.086.39-.16.539-.222.302-.125.474-.197.474-.197L9.758 4.03c0 0-.218.052-.597.144C8.97 4.222 8.737 4.278 8.472 4.345c-.271.05-.56.187-.882.312C7.272 4.799 6.904 4.895 6.562 5.123c-.344.218-.741.4-1.091.692C5.132 6.116 4.723 6.377 4.421 6.76c-.33.358-.656.734-.909 1.162C3.219 8.33 3.02 8.778 2.81 9.221c-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539.017.109.025.168.025.168l.026-.006C2.535 17.474 4.338 19 6.5 19c2.485 0 4.5-2.015 4.5-4.5S8.985 10 6.5 10zM17.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35.208-.086.39-.16.539-.222.302-.125.474-.197.474-.197L20.758 4.03c0 0-.218.052-.597.144-.191.048-.424.104-.689.171-.271.05-.56.187-.882.312-.317.143-.686.238-1.028.467-.344.218-.741.4-1.091.692-.339.301-.748.562-1.05.944-.33.358-.656.734-.909 1.162C14.219 8.33 14.02 8.778 13.81 9.221c-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539.017.109.025.168.025.168l.026-.006C13.535 17.474 15.338 19 17.5 19c2.485 0 4.5-2.015 4.5-4.5S19.985 10 17.5 10z"></path></svg>');
-}
-
-.theme-dark .markdown-preview-section blockquote:before {
-  content: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" style="fill:rgb(204,204,204);"><path d="M6.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35.208-.086.39-.16.539-.222.302-.125.474-.197.474-.197L9.758 4.03c0 0-.218.052-.597.144C8.97 4.222 8.737 4.278 8.472 4.345c-.271.05-.56.187-.882.312C7.272 4.799 6.904 4.895 6.562 5.123c-.344.218-.741.4-1.091.692C5.132 6.116 4.723 6.377 4.421 6.76c-.33.358-.656.734-.909 1.162C3.219 8.33 3.02 8.778 2.81 9.221c-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539.017.109.025.168.025.168l.026-.006C2.535 17.474 4.338 19 6.5 19c2.485 0 4.5-2.015 4.5-4.5S8.985 10 6.5 10zM17.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35.208-.086.39-.16.539-.222.302-.125.474-.197.474-.197L20.758 4.03c0 0-.218.052-.597.144-.191.048-.424.104-.689.171-.271.05-.56.187-.882.312-.317.143-.686.238-1.028.467-.344.218-.741.4-1.091.692-.339.301-.748.562-1.05.944-.33.358-.656.734-.909 1.162C14.219 8.33 14.02 8.778 13.81 9.221c-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539.017.109.025.168.025.168l.026-.006C13.535 17.474 15.338 19 17.5 19c2.485 0 4.5-2.015 4.5-4.5S19.985 10 17.5 10z"></path></svg>');
-}
-
 /* Pretty preview */
 .cc-pretty-preview .markdown-preview-section > div > * {
   line-height: var(--editor-line-height);
diff --git a/src/020-document.css b/src/020-document.css
index 0537e5a..3e006d0 100644
--- a/src/020-document.css
+++ b/src/020-document.css
@@ -309,14 +309,21 @@ input[type="checkbox"]:checked:before {
 }
 
 .markdown-preview-view .collapse-indicator > svg.right-triangle {
-  width: 16px;
-  height: 16px;
+  color: var(--shade-40);
+  width: 14px;
+  height: 14px;
   position: absolute;
   left: -2.33rem;
   top: 50%;
   transform: translateY(-50%);
 }
 
+.is-mobile .markdown-preview-view .collapse-indicator > svg.right-triangle {
+  width: 16px;
+  height: 16px;
+}
+
+
 .markdown-preview-view
   .heading-collapse-indicator.collapse-indicator
   > svg.right-triangle {
diff --git a/src/060-preview.css b/src/060-preview.css
index 99298d7..995440b 100644
--- a/src/060-preview.css
+++ b/src/060-preview.css
@@ -130,13 +130,13 @@ body {
   color: unset;
   padding: 0 0 0 1.4375rem;
   margin-inline-start: unset;
+  border-left: 2px solid var(--shade-plus-darker);
 }
 
-.markdown-preview-section blockquote:before {
-  position: absolute;
-  left: 0;
-  line-height: 1.88889 !important;
-}
+/* .theme-dark .markdown-preview-section blockquote {
+  border-left-color: var(--shade-10);
+} */
+
 
 .markdown-preview-view blockquote p {
   margin: 0;
@@ -241,22 +241,6 @@ body {
   padding: unset;
 }
 
-/* Icons */
-
-.markdown-preview-section blockquote:before {
-  display: inline-block;
-  line-height: 1;
-  margin-right: -0.6em;
-  opacity: 0.1;
-  width: 1rem;
-  height: 1rem;
-  content: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" style="fill:rgb(0, 0, 0);"><path d="M6.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35.208-.086.39-.16.539-.222.302-.125.474-.197.474-.197L9.758 4.03c0 0-.218.052-.597.144C8.97 4.222 8.737 4.278 8.472 4.345c-.271.05-.56.187-.882.312C7.272 4.799 6.904 4.895 6.562 5.123c-.344.218-.741.4-1.091.692C5.132 6.116 4.723 6.377 4.421 6.76c-.33.358-.656.734-.909 1.162C3.219 8.33 3.02 8.778 2.81 9.221c-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539.017.109.025.168.025.168l.026-.006C2.535 17.474 4.338 19 6.5 19c2.485 0 4.5-2.015 4.5-4.5S8.985 10 6.5 10zM17.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35.208-.086.39-.16.539-.222.302-.125.474-.197.474-.197L20.758 4.03c0 0-.218.052-.597.144-.191.048-.424.104-.689.171-.271.05-.56.187-.882.312-.317.143-.686.238-1.028.467-.344.218-.741.4-1.091.692-.339.301-.748.562-1.05.944-.33.358-.656.734-.909 1.162C14.219 8.33 14.02 8.778 13.81 9.221c-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539.017.109.025.168.025.168l.026-.006C13.535 17.474 15.338 19 17.5 19c2.485 0 4.5-2.015 4.5-4.5S19.985 10 17.5 10z"></path></svg>');
-}
-
-.theme-dark .markdown-preview-section blockquote:before {
-  content: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" style="fill:rgb(204,204,204);"><path d="M6.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35.208-.086.39-.16.539-.222.302-.125.474-.197.474-.197L9.758 4.03c0 0-.218.052-.597.144C8.97 4.222 8.737 4.278 8.472 4.345c-.271.05-.56.187-.882.312C7.272 4.799 6.904 4.895 6.562 5.123c-.344.218-.741.4-1.091.692C5.132 6.116 4.723 6.377 4.421 6.76c-.33.358-.656.734-.909 1.162C3.219 8.33 3.02 8.778 2.81 9.221c-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539.017.109.025.168.025.168l.026-.006C2.535 17.474 4.338 19 6.5 19c2.485 0 4.5-2.015 4.5-4.5S8.985 10 6.5 10zM17.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35.208-.086.39-.16.539-.222.302-.125.474-.197.474-.197L20.758 4.03c0 0-.218.052-.597.144-.191.048-.424.104-.689.171-.271.05-.56.187-.882.312-.317.143-.686.238-1.028.467-.344.218-.741.4-1.091.692-.339.301-.748.562-1.05.944-.33.358-.656.734-.909 1.162C14.219 8.33 14.02 8.778 13.81 9.221c-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539.017.109.025.168.025.168l.026-.006C13.535 17.474 15.338 19 17.5 19c2.485 0 4.5-2.015 4.5-4.5S19.985 10 17.5 10z"></path></svg>');
-}
-
 /* Pretty preview */
 .cc-pretty-preview .markdown-preview-section > div > * {
   line-height: var(--editor-line-height);