mirror of
https://github.com/tachiyomiorg/website.git
synced 2024-12-21 15:41:59 +01:00
Containers overhaul (#363)
This commit is contained in:
Soitora
GitHub
parent
e45d7543d7
commit
4430781d3b
@ -35,6 +35,7 @@ export default {
|
||||
.agile {
|
||||
background: #f0f4f8;
|
||||
border-radius: 1em;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.agile__nav-button {
|
||||
|
||||
@ -123,5 +123,5 @@ blockquote
|
||||
.app-navigation
|
||||
.app-icon,
|
||||
.app-label
|
||||
color inherit
|
||||
color inherit !important
|
||||
</style>
|
||||
|
||||
@ -61,6 +61,33 @@ module.exports = [
|
||||
},
|
||||
],
|
||||
["vuepress-plugin-element-ui"],
|
||||
[
|
||||
"vuepress-plugin-container",
|
||||
{
|
||||
type: "c-tip",
|
||||
before: (info) => `<div class="custom-block c-tip"><h4 class="c-title">${info}</h4>`,
|
||||
after: "</div>",
|
||||
defaultTitle: "",
|
||||
},
|
||||
],
|
||||
[
|
||||
"vuepress-plugin-container",
|
||||
{
|
||||
type: "c-warning",
|
||||
before: (info) => `<div class="custom-block c-warning"><h4 class="c-title">${info}</h4>`,
|
||||
after: "</div>",
|
||||
defaultTitle: "",
|
||||
},
|
||||
],
|
||||
[
|
||||
"vuepress-plugin-container",
|
||||
{
|
||||
type: "c-danger",
|
||||
before: (info) => `<div class="custom-block c-danger"><h4 class="c-title">${info}</h4>`,
|
||||
after: "</div>",
|
||||
defaultTitle: "",
|
||||
},
|
||||
],
|
||||
[
|
||||
"vuepress-plugin-container",
|
||||
{
|
||||
|
||||
1
src/.vuepress/public/assets/icon_danger.svg
Normal file
1
src/.vuepress/public/assets/icon_danger.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.82 17.59"><defs><style>.cls-1{fill:none;stroke:#e5422b;stroke-miterlimit:10;}.cls-2{fill:#e5422b;}</style></defs><title>icon-danger</title><g id="Layer_2" data-name="Layer 2"><path class="cls-1" d="M9.06,2,.73,16.39A1.09,1.09,0,0,0,1.67,18H18.33a1.09,1.09,0,0,0,.94-1.63L10.94,2A1.08,1.08,0,0,0,9.06,2Z" transform="translate(-0.09 -0.92)"/></g><g id="Layer_3" data-name="Layer 3"><rect class="cls-2" x="9.09" y="13.63" width="1.66" height="1.66" rx="0.26"/><path class="cls-2" d="M8.66,6.65,9.13,13a.29.29,0,0,0,.29.28h1.17a.29.29,0,0,0,.29-.28l.47-6.39a.3.3,0,0,0-.3-.33H9A.3.3,0,0,0,8.66,6.65Z" transform="translate(-0.09 -0.92)"/></g></svg>
|
||||
|
After Width: | Height: | Size: 699 B |
1
src/.vuepress/public/assets/icon_tip.svg
Normal file
1
src/.vuepress/public/assets/icon_tip.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11.57 18.64"><defs><style>.cls-1,.cls-2{fill:none;stroke:#184cef;stroke-linecap:round;stroke-miterlimit:10;}.cls-1{stroke-width:1.2px;}.cls-2{stroke-width:1.1px;}</style></defs><title>bulb-icon</title><path class="cls-1" d="M12.5,12.76V11.65a1.84,1.84,0,0,1,.72-1.45,5.19,5.19,0,1,0-6.43,0,1.86,1.86,0,0,1,.71,1.45v1" transform="translate(-4.21 -0.37)"/><line class="cls-2" x1="2.99" y1="14.13" x2="8.58" y2="14.13"/><line class="cls-2" x1="3.56" y1="16.13" x2="8.01" y2="16.13"/><line class="cls-2" x1="5.17" y1="18.09" x2="6.41" y2="18.09"/><path class="cls-2" d="M10.36,3.25A2.31,2.31,0,0,1,12,4a2.46,2.46,0,0,1,.71,1.67" transform="translate(-4.21 -0.37)"/></svg>
|
||||
|
After Width: | Height: | Size: 753 B |
1
src/.vuepress/public/assets/icon_warning.svg
Normal file
1
src/.vuepress/public/assets/icon_warning.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.82 17.59"><defs><style>.cls-1{fill:none;stroke:#b29400;stroke-miterlimit:10;}.cls-2{fill:#b29400;}</style></defs><title>icon-danger-shit-colour</title><g id="Layer_2" data-name="Layer 2"><path class="cls-1" d="M9.06,2,.73,16.39A1.09,1.09,0,0,0,1.67,18H18.33a1.09,1.09,0,0,0,.94-1.63L10.94,2A1.08,1.08,0,0,0,9.06,2Z" transform="translate(-0.09 -0.92)"/></g><g id="Layer_3" data-name="Layer 3"><rect class="cls-2" x="9.09" y="13.63" width="1.66" height="1.66" rx="0.26"/><path class="cls-2" d="M8.66,6.65,9.13,13a.29.29,0,0,0,.29.28h1.17a.29.29,0,0,0,.29-.28l.47-6.39a.3.3,0,0,0-.3-.33H9A.3.3,0,0,0,8.66,6.65Z" transform="translate(-0.09 -0.92)"/></g></svg>
|
||||
|
After Width: | Height: | Size: 711 B |
@ -15,22 +15,87 @@ font-feature-settings()
|
||||
html,
|
||||
body,
|
||||
.theme-container
|
||||
background-color #fdfdfd
|
||||
background-color $backgroundColor
|
||||
|
||||
.navbar
|
||||
background-color $backgroundColor
|
||||
.links
|
||||
background-color transparent !important
|
||||
|
||||
.sidebar
|
||||
background-color $backgroundColorSecondary
|
||||
|
||||
// Custom block containers
|
||||
.custom-block
|
||||
&.tip
|
||||
&.warning
|
||||
&.error
|
||||
&.danger
|
||||
border-radius $containerBorderRadius
|
||||
padding-left 1.25rem
|
||||
padding-right 1rem
|
||||
border-radius .125rem
|
||||
overflow hidden
|
||||
position relative
|
||||
background-color $backgroundColorSecondary
|
||||
border 1px solid #e4e8ef
|
||||
border-radius 6px
|
||||
margin-bottom .5rem
|
||||
.c-title
|
||||
margin-top 1rem
|
||||
margin-bottom -0.75rem
|
||||
&:empty
|
||||
display none
|
||||
&.c-
|
||||
&tip
|
||||
&warning
|
||||
&danger
|
||||
padding-left 3.75rem
|
||||
&:before
|
||||
content ""
|
||||
display block
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
margin-top 1rem
|
||||
margin-left 1rem
|
||||
width 1.75rem
|
||||
height 1.75rem
|
||||
background-size contain
|
||||
&tip
|
||||
background-color alpha($customTip, 2%)
|
||||
border 1px solid alpha($customTip, 20%)
|
||||
&:before
|
||||
background transparent url(/assets/icon_tip.svg) no-repeat 0 0
|
||||
a
|
||||
color $customTip
|
||||
h4
|
||||
color darken($customTip, 60%)
|
||||
&warning
|
||||
background-color alpha($customWarning, 2%)
|
||||
border 1px solid alpha($customWarning, 20%)
|
||||
&:before
|
||||
background transparent url(/assets/icon_warning.svg) no-repeat 0 0
|
||||
a
|
||||
color $customWarning
|
||||
h4
|
||||
color darken($customWarning, 40%)
|
||||
&danger
|
||||
background-color alpha($customDanger, 2%)
|
||||
border 1px solid alpha($customDanger, 20%)
|
||||
&:before
|
||||
background transparent url(/assets/icon_danger.svg) no-repeat 0 0
|
||||
a
|
||||
color $customDanger
|
||||
h4
|
||||
color darken($customDanger, 40%)
|
||||
&.aside
|
||||
background-color transparent
|
||||
border none
|
||||
color transparentify($textColor, 0.4)
|
||||
font-size 0.9rem
|
||||
text-align right
|
||||
&.aside-guide
|
||||
background-color transparent
|
||||
border none
|
||||
font-size 0.9rem
|
||||
text-align left
|
||||
padding-left unset
|
||||
p
|
||||
margin-top: 0
|
||||
a
|
||||
@ -38,7 +103,7 @@ body,
|
||||
|
||||
// Guide container
|
||||
.guide
|
||||
background-color $containerBackgroundColor
|
||||
background-color $containerBackground
|
||||
border-radius $containerBorderRadius
|
||||
margin 1rem 0
|
||||
padding 0.1rem 1.5rem
|
||||
@ -49,7 +114,7 @@ body,
|
||||
|
||||
// Expander container
|
||||
.expander
|
||||
background-color $containerBackgroundColor
|
||||
background-color $containerBackground
|
||||
border-radius $containerBorderRadius
|
||||
margin 1rem 0
|
||||
padding 1rem 1.5rem
|
||||
|
||||
@ -9,8 +9,9 @@ $badgeTipColor = $accentColor
|
||||
$badgeWarningColor = darken(#ffe564, 35%)
|
||||
$badgeErrorColor = #DA5961
|
||||
$badgeVersionColor = #000000
|
||||
$containerBackgroundColor = #f0f4f8
|
||||
$backgroundColor = #FDFDFD
|
||||
$backgroundColorSecondary = #FAFBFE
|
||||
$containerBackground = #f0f4f8
|
||||
// Layout
|
||||
$navbarHeight = 3.6rem
|
||||
$sidebarWidth = 20rem
|
||||
@ -26,6 +27,10 @@ $MQMobileNarrow = 419px
|
||||
// Fonts
|
||||
$buttonFontFamily = "Open Sans", Roboto, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif
|
||||
$codeFontFamily = source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace
|
||||
// Custom blocks
|
||||
$customTip = #184cef
|
||||
$customWarning = #b29400
|
||||
$customDanger = #e5422b
|
||||
// Forks
|
||||
$nekoAccentColor = #3DDA83
|
||||
$j2kAccentColor = $accentColor
|
||||
|
||||
@ -21,10 +21,8 @@ Now that **Tachiyomi** is installed, open the app and navigate to <Navigation it
|
||||
|
||||
Find the extension that you'd like to use then press the <Navigation item="install"/> button next to your desired extension and then accept the installation prompt.
|
||||
|
||||
::: guide Security prompt
|
||||
You *might* be stopped by a security prompt while attempting to install an extension. If that were to happen then you need to allow **Tachiyomi** the permission to *install unknown apps*.
|
||||
::: aside
|
||||
Learn how you can do so [here](/help/faq/#how-do-i-allow-third-party-installations)
|
||||
::: c-warning
|
||||
You *might* need to give **Tachiyomi** the permission to *install unknown apps*, you can read how to do so [here](/help/faq/#how-do-i-allow-third-party-installations).
|
||||
:::
|
||||
|
||||
## Adding manga to your library
|
||||
|
||||
@ -22,8 +22,8 @@ This setting sets the reader's default direction when you open a manga.
|
||||
**Webtoon**
|
||||
- Webtoon is like vertical but stitches all the images together into one stream.
|
||||
|
||||
::: tip
|
||||
You can have different Viewer for different series. You can do this by going to the series, opening a chapter, tapping the middle of the screen, pressing the gear icon, and selecting a different viewer in **Viewer for this series**
|
||||
::: c-tip
|
||||
You can change viewer for different series by going to the series, opening a chapter, tapping the middle of the screen, pressing the gear icon, and selecting a different viewer in **Viewer for this series**.
|
||||
:::
|
||||
|
||||
## Scale type <Badge text="Fit screen" type="default-indicator" vertical="middle" />
|
||||
@ -75,7 +75,7 @@ All examples are illustrations and may not reflect what actually happens.
|
||||
</CarouselItem>
|
||||
</Carousel>
|
||||
|
||||
::: tip
|
||||
::: c-tip
|
||||
You can change scale type when reading a chapter. Tap the middle of the screen, press the gear icon at the top, select a different scale type under **Scale type**. This will change Scale type for all series.
|
||||
:::
|
||||
|
||||
@ -158,8 +158,8 @@ This settings shows the page number at the bottom of the page in current page/to
|
||||
## 32-bit color <Badge text="False" type="default-indicator" vertical="middle" />
|
||||
This setting decodes images in `ARGB888` format to allow the reader to display more colors.
|
||||
|
||||
::: warning
|
||||
This setting will only show up on smartphones running Android 8.0 Oreo and later versions.
|
||||
::: c-warning
|
||||
This setting will only show up on smartphones running **Android 8.0** or higher.
|
||||
:::
|
||||
|
||||
## Page transitions <Badge text="True" type="default-indicator" vertical="middle" />
|
||||
@ -196,6 +196,6 @@ This setting allows you to flip pages using the volume keys, with the volume up
|
||||
|
||||
Reverses the Volume keys function of volume up going to the next page and volume down going to the last page.
|
||||
|
||||
::: warning
|
||||
::: c-warning
|
||||
This setting can only be used when Volume keys setting is enabled.
|
||||
:::
|
||||
|
||||
@ -15,7 +15,10 @@ Follow the steps below to create local manga.
|
||||
If you add more chapters then you'll have to manually refresh the chapter list (by pulling down the list).
|
||||
|
||||
Supported chapter formats are folder with pictures inside (such as `.jpg`, `.png`, etc), `ZIP`/`CBZ`, `RAR`/`CBR` and `EPUB`. But expect better performance with directories and `ZIP`/`CBZ`.
|
||||
<el-alert type="warning" title="Warning!" show-icon :closable="false">Remember to give the app storage permissions on <strong>Android 6</strong> and newer.</el-alert>
|
||||
|
||||
::: c-warning
|
||||
Remember to give the app storage permissions on **Android 6** and newer.
|
||||
:::
|
||||
|
||||
## Folder Structure
|
||||
|
||||
|
||||
@ -8,7 +8,9 @@ lang: en-US
|
||||
|
||||
Migration is the process of moving manga between sources without losing progress. This is most often used when a source is no longer accessible or another source is more up-to-date.
|
||||
|
||||
<el-alert type="warning" title="Warning!" show-icon :closable="false">Always make sure to have a <el-link href="/help/guides/creating-backups/" :underline="false">backup</el-link> in case anything unexpected occurs.</el-alert>
|
||||
::: c-warning
|
||||
Always make sure to have a [backup](/help/guides/creating-backups/) in case anything unexpected occurs.
|
||||
:::
|
||||
|
||||
## Migrating on Stable/Preview
|
||||
|
||||
@ -38,7 +40,7 @@ Migration is the process of moving manga between sources without losing progress
|
||||
1. Choose which data you want to transfer over, and you're done.
|
||||
::::
|
||||
|
||||
::: tip Searching only pinned sources
|
||||
::: c-tip Searching only pinned sources
|
||||
You can restrict global searching to pinned sources if you wish to declutter your search.</br>To do this, go to <Navigation item="more"/> → <Navigation item="settings"/> → <Navigation item="browse"/> then toggle the **Only include pinned sources** setting.
|
||||
|
||||
Pin sources in <Navigation item="browse"/> using the <MaterialIcon icon="push_pin" /> pin icon next to the source name.
|
||||
|
||||
@ -8,15 +8,15 @@ lang: en-US
|
||||
|
||||
**This page is for when you encounter a problem with a source extension.**
|
||||
|
||||
::: danger It can be accompanied by these error messages:
|
||||
+ HTTP Error 5xx
|
||||
::: c-danger Common error messages
|
||||
- HTTP Error 4xx
|
||||
+ java.security.cert.CertPathValidatorException
|
||||
- HTTP Error 5xx
|
||||
- Unexpected URL
|
||||
- Page List is empty
|
||||
+ Unable to resolve host
|
||||
- unexpected url
|
||||
+ Attempt to invoke virtual method 'java.lang.String org.jsoup.nodes.Node.attr(java.lang.String)' on a null object reference
|
||||
- Unable to resolve host
|
||||
- Failed to bypass Cloudflare
|
||||
- java.security.cert.CertPathValidatorException
|
||||
- Attempt to invoke virtual method 'java.lang.String org.jsoup.nodes.Node.attr(java.lang.String)' on a null object reference
|
||||
:::
|
||||
|
||||
## Diagnosis
|
||||
@ -34,8 +34,8 @@ lang: en-US
|
||||
* If your downloads are getting stuck, try deleting the queue and trying again.
|
||||
* Force close **Tachiyomi** and reopen it.
|
||||
|
||||
::: tip Bonus step
|
||||
Try the latest Preview version, your issue may have been fixed.
|
||||
::: c-tip
|
||||
Your issue may have been fixed in the Preview version already, just wait for a new Stable release.
|
||||
:::
|
||||
|
||||
If any of these help, go to [it only happens to me](#it-only-happens-to-me).
|
||||
@ -50,7 +50,7 @@ You may be getting a **CAPTCHA**, may have been IP-banned, or encountered some o
|
||||
* Don't use downloads with the source.
|
||||
* Have less manga in library from the source.
|
||||
|
||||
::: tip
|
||||
::: c-warning
|
||||
All of the above are very imprecise and fuzzy rules, because each site has their own, non-public limits and triggers.
|
||||
:::
|
||||
|
||||
@ -117,7 +117,7 @@ If **WebView** doesn't work for you, please update the [Android System WebView](
|
||||
|
||||
When you've updated go to [Developer Options](https://developer.android.com/studio/debug/dev-options) in your phone's settings and set **WebView Implementation** to `Android System WebView`.
|
||||
|
||||
::: guide Still not working?
|
||||
::: c-tip
|
||||
If `Android System WebView` doesn't work, try setting `Google Chrome` as the default **WebView Implementation** instead.
|
||||
:::
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user