From b714a2661a3334b85ddd673d23d4c468b486076b Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Sun, 18 Sep 2022 12:57:28 +0800
Subject: [PATCH 1/3] On Safari PDF Highlights are not setting opacity

---
 .../web/components/templates/article/PdfArticleContainer.tsx     | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/web/components/templates/article/PdfArticleContainer.tsx b/packages/web/components/templates/article/PdfArticleContainer.tsx
index 06cb94286..5c6815509 100644
--- a/packages/web/components/templates/article/PdfArticleContainer.tsx
+++ b/packages/web/components/templates/article/PdfArticleContainer.tsx
@@ -275,6 +275,7 @@ export default function PdfArticleContainer(
             const annotation = new PSPDFKit.Annotations.HighlightAnnotation({
               pageIndex: highlightAnnotation.pageIndex,
               rects: rects,
+              opacity: 0.2,
               boundingBox: PSPDFKit.Geometry.Rect.union(rects),
               customData: {
                 omnivoreHighlight: {

From 4b84215970788bff76f0ab287914c467d87a69ca Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Sun, 18 Sep 2022 13:39:49 +0800
Subject: [PATCH 2/3] Set an annotation preset to override the default opacity
 when creating highlights

For some reason this was not being set on Safari.
---
 .../templates/article/PdfArticleContainer.tsx        | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/web/components/templates/article/PdfArticleContainer.tsx b/packages/web/components/templates/article/PdfArticleContainer.tsx
index 5c6815509..ac2bc9175 100644
--- a/packages/web/components/templates/article/PdfArticleContainer.tsx
+++ b/packages/web/components/templates/article/PdfArticleContainer.tsx
@@ -131,9 +131,17 @@ export default function PdfArticleContainer(
         return [copy, remove]
       }
 
+      const annotationPresets = PSPDFKit.defaultAnnotationPresets;
+      annotationPresets.highlight = {
+        opacity: 0.45,
+        color: new PSPDFKit.Color({ r: 255, g: 210, b: 52 }),
+        blendMode: PSPDFKit.BlendMode.multiply,
+      };
+
       instance = await PSPDFKit.load({
         container: container || '.pdf-container',
         toolbarItems,
+        annotationPresets,
         document: props.article.url,
         theme: isDarkTheme() ? PSPDFKit.Theme.DARK : PSPDFKit.Theme.LIGHT,
         baseUrl: `${window.location.protocol}//${window.location.host}/`,
@@ -146,6 +154,8 @@ export default function PdfArticleContainer(
         }),
       })
 
+      console.log('toolbars: ', instance.toolbarItems, instance.currentAnnotationPreset, instance.annotationPresets)
+
       instance.addEventListener('annotations.willChange', (event) => {
         const annotation = event.annotations.get(0)
         if (event.reason !== PSPDFKit.AnnotationsWillChangeReason.DELETE_END) {
@@ -275,7 +285,7 @@ export default function PdfArticleContainer(
             const annotation = new PSPDFKit.Annotations.HighlightAnnotation({
               pageIndex: highlightAnnotation.pageIndex,
               rects: rects,
-              opacity: 0.2,
+              opacity: 0.4,
               boundingBox: PSPDFKit.Geometry.Rect.union(rects),
               customData: {
                 omnivoreHighlight: {

From 08b5bab68a0231b99729ff735d64920c43306a53 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Sun, 18 Sep 2022 13:43:27 +0800
Subject: [PATCH 3/3] Set color/opacity when creating an overlaping highlight

---
 .../web/components/templates/article/PdfArticleContainer.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/packages/web/components/templates/article/PdfArticleContainer.tsx b/packages/web/components/templates/article/PdfArticleContainer.tsx
index ac2bc9175..52e7b48ab 100644
--- a/packages/web/components/templates/article/PdfArticleContainer.tsx
+++ b/packages/web/components/templates/article/PdfArticleContainer.tsx
@@ -154,8 +154,6 @@ export default function PdfArticleContainer(
         }),
       })
 
-      console.log('toolbars: ', instance.toolbarItems, instance.currentAnnotationPreset, instance.annotationPresets)
-
       instance.addEventListener('annotations.willChange', (event) => {
         const annotation = event.annotations.get(0)
         if (event.reason !== PSPDFKit.AnnotationsWillChangeReason.DELETE_END) {
@@ -285,7 +283,8 @@ export default function PdfArticleContainer(
             const annotation = new PSPDFKit.Annotations.HighlightAnnotation({
               pageIndex: highlightAnnotation.pageIndex,
               rects: rects,
-              opacity: 0.4,
+              opacity: 0.45,
+              color: new PSPDFKit.Color({ r: 255, g: 210, b: 52 }),
               boundingBox: PSPDFKit.Geometry.Rect.union(rects),
               customData: {
                 omnivoreHighlight: {