doc: docs compile (#211)

* ci: docs comple exclude expo-example * docs: update docs
JimmyDaddy · Jan 26, 2024 · ed17e98 · ed17e98
1 parent d0e2eda
commit ed17e98
Show file tree

Hide file tree

Showing 4 changed files with 108 additions and 35 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -0,0 +1,5 @@
+node_modules
+lib
+docs
+
+base64.js
diff --git a/README.MD b/README.MD
@@ -34,20 +34,26 @@
   * [React Native](#react-native)
   * [Expo](#expo)
 * [Compatibility](#compatibility)
-* [Usage](#usage)
-  * [Text background fit](#text-background-fit)
-  * [Text background stretchX](#text-background-stretchx)
-  * [Text background stretchY](#text-background-stretchy)
-  * [Text background border radius](#text-background-border-radius)
-  * [Text with shadow](#text-with-shadow)
-  * [Multiple text watermarks](#multiple-text-watermarks)
-  * [Text rotation](#text-rotation)
-  * [Icon watermarks](#icon-watermarks)
-  * [Multiple icon watermarks](#multiple-icon-watermarks)
-  * [Background rotation](#background-rotation)
-  * [Icon rotation](#icon-rotation)
-  * [Transparent background](#transparent-background)
-  * [Transparent icon](#transparent-icon)
+
+* <details>
+  <summary><a href="#usage">Usage</a></summary>
+
+    * [Text background fit](#text-background-fit)
+    * [Text background stretchX](#text-background-stretchx)
+    * [Text background stretchY](#text-background-stretchy)
+    * [Text background border radius](#text-background-border-radius)
+    * [Text with shadow](#text-with-shadow)
+    * [Multiple text watermarks](#multiple-text-watermarks)
+    * [Text rotation](#text-rotation)
+    * [Icon watermarks](#icon-watermarks)
+    * [Multiple icon watermarks](#multiple-icon-watermarks)
+    * [Background rotation](#background-rotation)
+    * [Icon rotation](#icon-rotation)
+    * [Transparent background](#transparent-background)
+    * [Transparent icon](#transparent-icon)
+
+</details>
+
 * [API](#api-6)
 * [Save image to file](#save-image-to-file)
 * [Contributors](#contributors)
@@ -133,6 +139,9 @@ npx expo prebuild
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -172,6 +181,7 @@ const options = {
 Marker.markText(options);
 
 ```
+</details>
 
 ### Text background stretchX
 
@@ -185,6 +195,9 @@ Marker.markText(options);
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -223,6 +236,7 @@ const options = {
 };
 Marker.markText(options);
 ```
+</details>
 
 ### Text background stretchY
 
@@ -236,6 +250,9 @@ Marker.markText(options);
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -276,6 +293,8 @@ ImageMarker.markText(options);
 
 ```
 
+</details>
+
 ### Text background border radius
 
 #### API
@@ -288,6 +307,9 @@ ImageMarker.markText(options);
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position } from "react-native-image-marker"
 ···
@@ -337,6 +359,8 @@ ImageMarker.markText(options);
 
 ```
 
+</details>
+
 ### Text with shadow
 
 #### API
@@ -349,6 +373,9 @@ ImageMarker.markText(options);
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -384,6 +411,8 @@ Marker.markText(options);
 
 ```
 
+</details>
+
 ### Multiple text watermarks
 
 #### Sample
@@ -392,6 +421,9 @@ Marker.markText(options);
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -433,18 +465,23 @@ Marker.markText({
 
 ```
 
+</details>
+
 ### Text rotation
 
 #### Sample
 
-<p>
- <img src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/rotatetexts_1.png" width='300'>
- <img src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/textswihoutbg.png" width='300'>
- <img src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/rotatetexts.png" width='300'>
+<p style="display: flex">
+ <img style="flex: 1" src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/rotatetexts_1.png" width='250'>
+ <img style="flex: 1; margin-left: 4px" src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/textswihoutbg.png" width='250'>
+ <img style="flex: 1; margin-left: 4px" src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/rotatetexts.png" width='250'>
 </p>
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -493,6 +530,8 @@ Marker.markText({
 
 ```
 
+</details>
+
 ### Icon watermarks
 
 #### Sample
@@ -501,6 +540,9 @@ Marker.markText({
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -518,6 +560,7 @@ Marker.markImage({
 })
 
 ```
+</details>
 
 ### Multiple icon watermarks
 
@@ -533,6 +576,9 @@ Marker.markImage({
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -561,17 +607,22 @@ Marker.markImage({
 
 ```
 
+</details>
+
 ### Background rotation
 
 #### Sample
 
-<p>
- <img src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/rotatebg.png" width='400'>
- <img src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/rotateimageicon.png" width='400'>
+<p style="display:flex">
+ <img style="flex: 1" src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/rotatebg.png" width='400'>
+ <img style="flex: 1;margin-left: 8px" src="https://raw.githubusercontent.com/JimmyDaddy/react-native-image-marker/master/assets/rotateimageicon.png" style="" width='400'>
 </p>
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -639,6 +690,8 @@ Marker.markText({
 
 ```
 
+</details>
+
 ### Icon rotation
 
 #### Sample
@@ -647,6 +700,9 @@ Marker.markText({
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -665,6 +721,8 @@ Marker.markImage({
 });
 ```
 
+</details>
+
 ### Transparent background
 
 #### Sample
@@ -673,6 +731,9 @@ Marker.markImage({
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -691,6 +752,8 @@ Marker.markImage({
 });
 ```
 
+</details>
+
 ### Transparent icon
 
 #### Sample
@@ -699,6 +762,9 @@ Marker.markImage({
 
 #### Example
 
+<details>
+<summary>example code</summary>
+
 ```typescript
 import Marker, { Position, TextBackgroundType } from "react-native-image-marker"
 ···
@@ -717,6 +783,8 @@ Marker.markImage({
 });
 ```
 
+</details>
+
 ## API
 
 * [the latest version](https://jimmydaddy.github.io/react-native-image-marker/classes/Marker.html)
@@ -738,7 +806,7 @@ Marker.markImage({
 [@gaoxiaosong](https://github.com/gaoxiaosong)
 [@onka13](https://github.com/onka13)
 [@OrangeFlavoredColdCoffee](https://github.com/OrangeFlavoredColdCoffee)
-[@Dendi](https://github.com/vioku)
+[@vioku](https://github.com/vioku)
 
 ## Examples
 

diff --git a/docs/latest/assets/highlight.css b/docs/latest/assets/highlight.css
@@ -1,20 +1,20 @@
 :root {
-    --light-hl-0: #AF00DB;
-    --dark-hl-0: #C586C0;
-    --light-hl-1: #000000;
-    --dark-hl-1: #D4D4D4;
-    --light-hl-2: #001080;
-    --dark-hl-2: #9CDCFE;
+    --light-hl-0: #008000;
+    --dark-hl-0: #6A9955;
+    --light-hl-1: #795E26;
+    --dark-hl-1: #DCDCAA;
+    --light-hl-2: #000000;
+    --dark-hl-2: #D4D4D4;
     --light-hl-3: #A31515;
     --dark-hl-3: #CE9178;
     --light-hl-4: #0000FF;
     --dark-hl-4: #569CD6;
-    --light-hl-5: #0070C1;
-    --dark-hl-5: #4FC1FF;
-    --light-hl-6: #008000;
-    --dark-hl-6: #6A9955;
-    --light-hl-7: #795E26;
-    --dark-hl-7: #DCDCAA;
+    --light-hl-5: #AF00DB;
+    --dark-hl-5: #C586C0;
+    --light-hl-6: #001080;
+    --dark-hl-6: #9CDCFE;
+    --light-hl-7: #0070C1;
+    --dark-hl-7: #4FC1FF;
     --light-hl-8: #098658;
     --dark-hl-8: #B5CEA8;
     --light-hl-9: #EE0000;