With Rough Notation integrated, you can easily add annotations to your content, making your posts more engaging and informative.
Mia is designed to be minimalist yet powerful, integrating the capabilities of Astro, MDX, and Rough Notation. Whether you're a developer, writer, or just someone who loves clean and efficient design, this theme is perfect for you.
Install the dependencies:
npm install
Run and visit http://localhost:4321.
npn run dev
Build the App:
npm run build
You will then see the dist
folder generated for publishing, which you can preview locally with the following command:
npm run preview
Mia is based on the Rough Notation library. You can use <Notation />
component in your MDX content, such as:
In Swift, the `Codable` protocol is a type alias for the <Notation type="box" color="blue">`Encodable` and `Decodable`</Notation> protocols:
And following is the type of this component:
type Props = {type?: "underline" | "circle" | "crossed-off" | "highlight" | "strike-through" | "bracket";color?: string;strokeWidth?: number;};
Update the src/config.ts
file to configure the theme:
SITE_FAVICON
: the favicon of the siteSITE_LOGO
: the logo of the siteSITE_TITLE
: the title of the siteSITE_DESCRIPTION
: the description of the siteMENUS
: the menus of the siteFOOTER_CONTENT
: the content of the footerGOOGLE_GTAG
: the Google Tag Manager IDWith Rough Notation integrated, you can easily add annotations to your content, making your posts more engaging and informative.
Mia is designed to be minimalist yet powerful, integrating the capabilities of Astro, MDX, and Rough Notation. Whether you're a developer, writer, or just someone who loves clean and efficient design, this theme is perfect for you.
Install the dependencies:
npm install
Run and visit http://localhost:4321.
npn run dev
Build the App:
npm run build
You will then see the dist
folder generated for publishing, which you can preview locally with the following command:
npm run preview
Mia is based on the Rough Notation library. You can use <Notation />
component in your MDX content, such as:
In Swift, the `Codable` protocol is a type alias for the <Notation type="box" color="blue">`Encodable` and `Decodable`</Notation> protocols:
And following is the type of this component:
type Props = {type?: "underline" | "circle" | "crossed-off" | "highlight" | "strike-through" | "bracket";color?: string;strokeWidth?: number;};
Update the src/config.ts
file to configure the theme:
SITE_FAVICON
: the favicon of the siteSITE_LOGO
: the logo of the siteSITE_TITLE
: the title of the siteSITE_DESCRIPTION
: the description of the siteMENUS
: the menus of the siteFOOTER_CONTENT
: the content of the footerGOOGLE_GTAG
: the Google Tag Manager ID