@compiiile/compiiile 2.16.0 → 2.16.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
.reveal {
|
|
10
10
|
height: 100vh;
|
|
11
11
|
width: 100vw;
|
|
12
|
-
font-family:
|
|
12
|
+
font-family: var(--default-font) !important;
|
|
13
13
|
|
|
14
14
|
.slides {
|
|
15
15
|
text-align: inherit;
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
h4,
|
|
40
40
|
h5,
|
|
41
41
|
h6 {
|
|
42
|
-
font-family:
|
|
42
|
+
font-family: var(--heading-font);
|
|
43
43
|
font-variation-settings:
|
|
44
44
|
"wght" 900,
|
|
45
45
|
"wdth" 125;
|
|
@@ -3,7 +3,7 @@ h2,
|
|
|
3
3
|
h3,
|
|
4
4
|
h4,
|
|
5
5
|
h5 {
|
|
6
|
-
font-family:
|
|
6
|
+
font-family: var(--heading-font);
|
|
7
7
|
margin: 3rem 0 1.38rem;
|
|
8
8
|
line-height: 1;
|
|
9
9
|
font-variation-settings: "wght" 900;
|
|
@@ -87,3 +87,8 @@ body {
|
|
|
87
87
|
.hidden {
|
|
88
88
|
visibility: hidden;
|
|
89
89
|
}
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
details summary {
|
|
93
|
+
cursor: pointer;
|
|
94
|
+
}
|
|
@@ -8,6 +8,8 @@
|
|
|
8
8
|
--ease-in-out-quart: cubic-bezier(0.77, 0, 0.175, 1);
|
|
9
9
|
--monospace: "JetBrains Mono Variable", monospace;
|
|
10
10
|
--r-code-font: "JetBrains Mono Variable", monospace;
|
|
11
|
+
--heading-font: "Archivo Variable", sans-serif;
|
|
12
|
+
--default-font: "DM Sans Variable", sans-serif;
|
|
11
13
|
|
|
12
14
|
/* Dark theme by default */
|
|
13
15
|
--layout-background-color: #1b1b1f;
|
package/4-pro-features.mdx
CHANGED
|
@@ -5,6 +5,30 @@ description: "Use icons, admonitions, mermaid diagrams, markmap mindmaps in Mark
|
|
|
5
5
|
|
|
6
6
|
# compiiile-pro added features <Icon name="star" />
|
|
7
7
|
|
|
8
|
+
## Customize style by providing your own CSS file
|
|
9
|
+
|
|
10
|
+
You can customize every bit of the UI with your own style by passing a `css` param with the relative path to your css file :
|
|
11
|
+
|
|
12
|
+
```bash
|
|
13
|
+
compiiile-pro dev --css="./custom.css"
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
Here is an example of a CSS file content to set some colors and the default font:
|
|
17
|
+
|
|
18
|
+
```css
|
|
19
|
+
@import url(https://fonts.bunny.net/css?family=inter:200i,400,400i,900);
|
|
20
|
+
|
|
21
|
+
:root {
|
|
22
|
+
--layout-background-color: #0000FF;
|
|
23
|
+
--darker-background-color: #00FF00;
|
|
24
|
+
--default-font: 'Inter', sans-serif;
|
|
25
|
+
}
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
:nail_care: The list of global CSS variables can be found here : https://github.com/compiiile/compiiile/blob/master/.compiiile/src/style/variables.css
|
|
29
|
+
|
|
30
|
+
:rainbow: You can also just target CSS classes and tweak them the way you want.
|
|
31
|
+
|
|
8
32
|
## Admonitions
|
|
9
33
|
|
|
10
34
|
> [!NOTE]
|
|
@@ -572,7 +596,7 @@ The `CCard` component can be used as a traditional card or a link.
|
|
|
572
596
|
<details>
|
|
573
597
|
<summary>Source</summary>
|
|
574
598
|
|
|
575
|
-
````
|
|
599
|
+
````mdx
|
|
576
600
|
<CGrid gap="20px" template="1 1">
|
|
577
601
|
<CCard hintText="Go to the specific page">
|
|
578
602
|
[Check compiiile-pro installation](./3-pro-installation.md)
|
|
@@ -590,3 +614,23 @@ The `CCard` component can be used as a traditional card or a link.
|
|
|
590
614
|
````
|
|
591
615
|
|
|
592
616
|
</details>
|
|
617
|
+
|
|
618
|
+
### CDetails
|
|
619
|
+
|
|
620
|
+
The `CDetails` component allows you to hide a block and reveal it by clicking on an arrow, just like the `details` HTML tag.
|
|
621
|
+
|
|
622
|
+
- The title can be set via a `summary` prop or a `summary` slot
|
|
623
|
+
|
|
624
|
+
<CDetails summary="Example">
|
|
625
|
+
> [!TIP]
|
|
626
|
+
> This is lit! :sparkles:
|
|
627
|
+
</CDetails>
|
|
628
|
+
|
|
629
|
+
<CDetails summary="Source">
|
|
630
|
+
```mdx
|
|
631
|
+
<CDetails summary="Example">
|
|
632
|
+
> [!TIP]
|
|
633
|
+
> This is lit! :sparkles:
|
|
634
|
+
</CDetails>
|
|
635
|
+
```
|
|
636
|
+
</CDetails>
|
package/README.md
CHANGED
|
@@ -212,6 +212,7 @@ Here is the list of parameters that you can set to customize Compiiile (none are
|
|
|
212
212
|
| `publicDir` | `string` | The folder name in which you can serve public files, defaults to `public` |
|
|
213
213
|
| `vite.server.fs.allow` | `string[]` | Add local paths to vite's server fs allow list |
|
|
214
214
|
| `printReady` | `Boolean` | Add a `/print` page to display a full ready-to-print content (uses `@compiiile/compiiile-print`) |
|
|
215
|
+
| `css` | `string` | A relative path to a custom CSS file to customize the style <br/>:warning: Requires `compiiile-pro` |
|
|
215
216
|
|
|
216
217
|
You can use these parameters in 2 ways:
|
|
217
218
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@compiiile/compiiile",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "2.16.
|
|
4
|
+
"version": "2.16.1",
|
|
5
5
|
"description": "The most convenient way to render a folder containing markdown files. Previewing and searching markdown files has never been that easy.",
|
|
6
6
|
"author": "AlbanCrepel <alban.crepel@gmail.com>",
|
|
7
7
|
"license": "GPL-3.0-only",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"@babel/eslint-parser": "^7.25.9",
|
|
30
30
|
"@babel/parser": "^7.26.3",
|
|
31
31
|
"@compiiile/compiiile-print": "^1.0.6",
|
|
32
|
-
"@compiiile/compiiile-pro": "^1.
|
|
32
|
+
"@compiiile/compiiile-pro": "^1.2.0",
|
|
33
33
|
"@eslint/compat": "^1.2.4",
|
|
34
34
|
"@eslint/js": "^9.16.0",
|
|
35
35
|
"@fontsource-variable/archivo": "^5.1.0",
|