# Table Of Contents - [Table Of Contents](#table-of-contents) - [Markdown Table](#markdown-table) - [Callout with icon](#callout-with-icon) - [Card](#card) - [Repo Card](#repo-card) - [Mermaid Diagram](#mermaid-diagram) - [github callout](#github-callout) - [Steps](#steps) - [Timeline Example](#timeline-example) # Markdown Table | Name | Age | | ----- | --- | | Alice | 20 | | Bob | 21 | # Callout with icon Success Vitae reprehenderit at aliquid error voluptates eum dignissimos. asfasasfasfsafasfsafasfasfasfasfasfasasdfa Success Vitae reprehenderit at aliquid error voluptates eum dignissimos. Success Vitae reprehenderit at aliquid error voluptates eum dignissimos. # Card # Repo Card # Mermaid Diagram ```mermaid graph LR A[信用卡優惠及現金回贈] --> B[海外及網上交易] A --> C[Chil 商戶優惠] B --> D[海外消費] B --> E[網上簽賬] ``` ```mermaid graph LR A[消費] --> B[選擇合適信用卡] B --> C[使用現金回贈網站] C --> D[購買商品/服務] D --> E[獲得雙重回贈] E --> F[節省金錢] style A fill:#f9d5e5,stroke:#333,stroke-width:2px style B fill:#eeac99,stroke:#333,stroke-width:2px style C fill:#e06377,stroke:#333,stroke-width:2px style D fill:#c83349,stroke:#333,stroke-width:2px style E fill:#5b9aa0,stroke:#333,stroke-width:2px style F fill:#d6eadf,stroke:#333,stroke-width:2px ``` # github callout > [!IMPORTANT] > If deploying with a URL base path, like https://example.org/myblog you need an extra `BASE_PATH` shell-var to the build command: > > ```sh > $ EXPORT=1 UNOPTIMIZED=1 BASE_PATH=/myblog yarn build > ``` > > => In your code, `${process.env.BASE_PATH || ''}/robots.txt` will print `"/myblog/robots.txt"` in the `out` build (or only `/robots.txt` if `yarn dev`, ie: on localhost:3000) > [!TIP] > Alternatively to `UNOPTIMIZED=1`, to continue using `next/image`, you can use an alternative image optimization provider such as Imgix, Cloudinary or Akamai. See [image optimization documentation](https://nextjs.org/docs/app/building-your-application/deploying/static-exports#image-optimization) for more details. # Timeline Example Description for phase 1. Description for phase 2.

Custom Components