From 6d6d04465dd82aa71fa173aa7cd582a380ca4179 Mon Sep 17 00:00:00 2001
From: EnixCoda <enixcoda@gmail.com>
Date: Tue, 21 Sep 2021 21:06:44 +0800
Subject: [PATCH 1/2] feat: hide sidebar when print

---
 src/styles/index.scss | 41 ++++++++++++++++++++++++++---------------
 1 file changed, 26 insertions(+), 15 deletions(-)

diff --git a/src/styles/index.scss b/src/styles/index.scss
index ad18391..7677d94 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -47,6 +47,12 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
   }
 }
 
+@mixin hide-for-print {
+  @media print {
+    display: none;
+  }
+}
+
 :root {
   --gitako-width: #{$side-bar-base-width};
 }
@@ -95,9 +101,16 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
     padding-right: 20px;
   }
 
+  // hide code fold handler if not enabled
+  .gitako-code-fold-handler {
+    display: none;
+  }
+
   .gitako-code-fold-attached:not(.gitako-code-fold-attached-disabled) {
     tr {
       .gitako-code-fold-handler {
+        @include hide-for-print();
+
         display: initial;
         position: absolute;
         top: 0px;
@@ -144,15 +157,13 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
           );
         }
       }
-    }
 
-    // cancel code fold if not wrapped with .gitako-code-fold-mark
-    .gitako-code-fold-handler {
-      display: none;
-    }
-
-    .gitako-code-fold-hidden {
-      display: none;
+      // hide folded sections, except for print
+      &.gitako-code-fold-hidden {
+        @media screen {
+          display: none;
+        }
+      }
     }
   }
   // code folding end
@@ -209,7 +220,9 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
 }
 
 .with-gitako-spacing {
-  margin-left: var(--gitako-width);
+  @media screen {
+    margin-left: var(--gitako-width);
+  }
 
   // gitee
   &.git-project {
@@ -276,6 +289,8 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
 }
 
 .#{$name}-toggle-show-button-wrapper {
+  @include hide-for-print();
+
   z-index: $minimal-z-index;
   position: fixed;
   top: 124px; // align with GitHub's navbar items
@@ -288,12 +303,6 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
     left: -40px;
   }
 
-  @media print {
-    & {
-      display: none;
-    }
-  }
-
   .#{$name}-toggle-show-button {
     @include icon-button(transparent, transparent, transparent);
     background: transparent;
@@ -363,6 +372,8 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
 }
 
 .#{$name}-side-bar {
+  @include hide-for-print();
+
   @import '~@primer/css/base/index.scss';
   button {
     border-radius: 6px;

From c137eeff011b9dec61168a333098830b79d485db Mon Sep 17 00:00:00 2001
From: EnixCoda <enixcoda@gmail.com>
Date: Tue, 21 Sep 2021 21:07:12 +0800
Subject: [PATCH 2/2] chore: rename code fold element class name

---
 src/platforms/GitHub/hooks/useGitHubCodeFold.tsx | 2 +-
 src/styles/index.scss                            | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/platforms/GitHub/hooks/useGitHubCodeFold.tsx b/src/platforms/GitHub/hooks/useGitHubCodeFold.tsx
index 303886d..83c49db 100644
--- a/src/platforms/GitHub/hooks/useGitHubCodeFold.tsx
+++ b/src/platforms/GitHub/hooks/useGitHubCodeFold.tsx
@@ -11,7 +11,7 @@ const tableSelector = `.blob-wrapper table`
 const selectorOfLineNumber = `.blob-num`
 const selectorOfLineContent = `.blob-code`
 
-const theCSSClassForToggleElementOnActive = 'active'
+const theCSSClassForToggleElementOnActive = 'gitako-code-fold-active'
 function init() {
   type LineNumber = number // alias
   const blocks: LineNumber[] = [] // startLine -> exclusiveEndLine
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 7677d94..d4f28eb 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -144,7 +144,7 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
         );
       }
 
-      &.active {
+      &.gitako-code-fold-active {
         .gitako-code-fold-handler {
           &::before {
             transform: rotate(-90deg);
@@ -655,7 +655,7 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
           @include interactive-background(
             var(--gitako-bg-primary),
             var(--gitako-bg-tertiary),
-            var(--gitako-bg-secondary),
+            var(--gitako-bg-secondary)
           );
 
           &.disabled {