diff --git a/src/.vitepress/theme/styles/base.styl b/src/.vitepress/theme/styles/base.styl index 4f23fee6..c7fadedd 100644 --- a/src/.vitepress/theme/styles/base.styl +++ b/src/.vitepress/theme/styles/base.styl @@ -17,6 +17,30 @@ --vp-c-brand-dimm: rgba(100, 108, 255, 0.08) } +/** + * Dark/Light Theme Overrides + * -------------------------------------------------------------------------- */ + +html:not(.dark) { + img[data-mode="darkmode-only"] { + display: none !important + + & + figcaption { + display: none !important + } + } +} + +.dark { + img[data-mode="lightmode-only"] { + display: none !important + + & + figcaption { + display: none !important + } + } +} + /** * Component: Button * -------------------------------------------------------------------------- */ @@ -87,3 +111,44 @@ .VPImage.image-src { border-radius: 8px } + +/** + * Component: Image Figure + * -------------------------------------------------------------------------- */ + +figure:has(img) { + position: relative + display: flex + flex-direction: column + width: auto + text-align: center + transition: transform var(--vp-tt) +} + +figure:has(img) img { + overflow: hidden + margin: 0 auto + border-radius: 8px +} + +figure:has(img) img[tabindex]:hover, +figure:has(img) img[tabindex]:focus { + box-shadow: 2px 2px 10px 0 var(--card-shadow) +} + +@media print { + figure:has(img)>a[href^="http://"]:after, +figure:has(img)>a[href^="https://"]:after { + content: "" + } +} + +figure:has(img)>a .external-link-icon { + display: none +} + +figure:has(img) figcaption { + display: inline-block + margin: 6px auto + font-size: 0.8rem +} diff --git a/src/docs/guides/getting-started.md b/src/docs/guides/getting-started.md index da5f9bff..978e4242 100644 --- a/src/docs/guides/getting-started.md +++ b/src/docs/guides/getting-started.md @@ -5,44 +5,73 @@ description: Essential information to help you get set up with Tachiyomi. # Getting started -## Installation +Essential information to help you get set up with Tachiyomi. -You can download the latest version of **Tachiyomi** by going to our download page. -When you've completed the download, open the APK file and proceed with installing it. +## Installation Guide -## Installing an extension +### 1. Downloading Tachiyomi -Now that **Tachiyomi** is installed, open the app and navigate to Browse, and then switch to the **Extensions** tab. +To get started with **Tachiyomi**, follow these steps: -Find the extension that you'd like to use then press the INSTALL button next to your desired extension and then accept the installation prompt. +1. Visit our [download](/download) page to get the latest version of **Tachiyomi**. +1. After the download is complete, open the `tachiyomi-*.apk` file. +1. Proceed with the installation process. -You _might_ need to give **Tachiyomi** permission to _install unknown apps_, you can read how to do so here. +### 2. Installing Extensions -## Adding manga to your library +Once **Tachiyomi** is installed on your device, you can add extensions to access a wide range of sources. -Now that you've installed the desired extension, it will show in the **Sources** tab. -This page contains all of your sources, which is obtained through extensions, some extensions contain _multiple_ sources. +Here's how: -To find and add manga to your library, tap **Latest** for a source's most recently updated manga, or tap on the source itself to browse and search their catalog. +1. Open the **Tachiyomi** app. +1. Navigate to the "**Browse**" section. +1. Tap on the **Extensions** tab. +1. Look for the extension you want to use and press the "**INSTALL**" button next to it. +1. Accept the installation prompt that appears. -Now that you've presumably found manga that you want to add, click on it and then press the `Add to library` button, it should now appear in your Library ready to be read! +![Installing extensions](getting-started/installing-extensions_light.webp#light) -Other ways to search for manga +![Installing extensions](getting-started/installing-extensions_dark.webp#dark) -You can also search for manga globally across all your sources by using Search located in the top-right of Browse → **Sources**. +::: tip INSTALL PERMISSION +Depending on your device settings, you might need to grant **Tachiyomi** permission to install unknown apps. -Trouble finding a specific manga +![Security warning](getting-started/security-warning.webp) -Check your spelling and try again, there's also the chance that your used source may not host the manga you're looking for. +> Relevant guide: [How do I allow third-party installations?](/docs/faq/extensions#how-do-i-allow-third-party-installations) +::: -* Some sources use **Japanese romanized** titles instead of **English** ones. +### 3. Adding Series to Your Library - > For example **Boku no Hero Academia** instead of **My Hero Academia**. -* Some sources use different spellings. +After installing the desired extension, you'll find it in the **Sources** tab, which contains all your sources obtained through extensions. - > For example **Bungo Stray Dogs** instead of **Bungou Stray Dogs**. -* Some sources use different wordings +Here's how you can add series to your library: - > For example **3-gatsu no Lion** instead of **Sangatsu no Lion**. +1. Select the source you'd like to browse. +1. You can use the **Popular**/**Latest** filters to browse, or you can search for the series name. +1. Once you've found the series that you want to add, click on it for more details. +1. Press the "**Add to library**" button, and the series will be added to your Library, ready to be read! -Find more potential answers to your questions here. +## Additional Setup + +### Series Search Options + +If you want to search for series across all your sources, you can use the global search feature. + +Follow these steps: + +1. Go to the "**Browse**" section. +1. Tap on **Sources** located at the top-right corner. +1. Use the Search function to find series from all available sources. + +### Trouble Finding a Specific Series? + +If you encounter difficulties while searching for a specific series, consider the following points: + +* Double-check your spelling and try again, as some sources might use **Japanese romanized** titles instead of **English** ones. + > Example: **Boku no Hero Academia** instead of **My Hero Academia**. + +* Some sources may use different spellings or wordings for titles. + > Example: **Bungo Stray Dogs** instead of **Bungou Stray Dogs** + + > Example: **3-gatsu no Lion** instead of **Sangatsu no Lion**. diff --git a/src/public/docs/guides/getting-started/installing-extensions_dark.webp b/src/public/docs/guides/getting-started/installing-extensions_dark.webp new file mode 100644 index 00000000..7f3376a5 Binary files /dev/null and b/src/public/docs/guides/getting-started/installing-extensions_dark.webp differ diff --git a/src/public/docs/guides/getting-started/installing-extensions_light.webp b/src/public/docs/guides/getting-started/installing-extensions_light.webp new file mode 100644 index 00000000..a12c64b1 Binary files /dev/null and b/src/public/docs/guides/getting-started/installing-extensions_light.webp differ diff --git a/src/public/docs/guides/getting-started/security-warning.webp b/src/public/docs/guides/getting-started/security-warning.webp new file mode 100644 index 00000000..9e161a8c Binary files /dev/null and b/src/public/docs/guides/getting-started/security-warning.webp differ