From 4620131f34117d0e1258fa4c13f74b60ccd17a48 Mon Sep 17 00:00:00 2001 From: Ivan Yordanov Date: Wed, 22 Nov 2023 15:52:36 +0200 Subject: [PATCH] Add malva to dprint (#385) closes #382 --------- Co-authored-by: Ramin Gharib --- .github/workflows/ci.yaml | 2 +- docs/docs/developer/contributing.md | 4 ++ docs/docs/stylesheets/extra.css | 68 +++++++++++++++++++---------- dprint.json | 7 ++- 4 files changed, 56 insertions(+), 25 deletions(-) diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml index 810381a09..384baecc2 100644 --- a/.github/workflows/ci.yaml +++ b/.github/workflows/ci.yaml @@ -70,7 +70,7 @@ jobs: - name: Install docs dependencies run: poetry install --with docs - - name: Check markdown, toml formatting + - name: Check markdown, toml, css formatting uses: dprint/check@v2.2 if: runner.os == 'Linux' diff --git a/docs/docs/developer/contributing.md b/docs/docs/developer/contributing.md index 5eb775e94..b38423192 100644 --- a/docs/docs/developer/contributing.md +++ b/docs/docs/developer/contributing.md @@ -18,6 +18,10 @@ Our configuration can be found in [KPOps](https://github.com/bakdata/kpops)' top To ensure a consistent markdown style, we use [dprint](https://dprint.dev)'s [Markdown code formatter](https://dprint.dev/plugins/markdown/). Our configuration can be found [here](https://github.com/bakdata/kpops/blob/main/dprint.json). +### CSS + +To ensure a consistent CSS style, we use the [malva](https://github.com/g-plane/malva) [dprint](https://dprint.dev)'s plugin. Our configuration can be found [here](https://github.com/bakdata/kpops/blob/main/dprint.json). + ### TOML To ensure a consistent TOML style, we use [dprint](https://dprint.dev)'s [TOML code formatter](https://dprint.dev/plugins/toml/). Our configuration can be found [here](https://github.com/bakdata/kpops/blob/main/dprint.json). diff --git a/docs/docs/stylesheets/extra.css b/docs/docs/stylesheets/extra.css index 24d84f6c4..9028d83fd 100644 --- a/docs/docs/stylesheets/extra.css +++ b/docs/docs/stylesheets/extra.css @@ -1,41 +1,65 @@ :root > * { - /* The primary color of KPOps docs */ - --md-primary-fg-color: #a599ff; + /* The primary color of KPOps docs */ + --md-primary-fg-color: #a599ff; - /* The second color of KPOps docs */ - --md-accent-fg-color: #B0A5FF; + /* The second color of KPOps docs */ + --md-accent-fg-color: #b0a5ff; - /* Create custom color variable to use for the buttons */ - --kpops-button-color: #7068AD; + /* Create custom color variable to use for the buttons */ + --kpops-button-color: #7068ad; - /* The footer color needs to be set sparately */ - --md-footer-bg-color: var(--md-primary-fg-color); + /* The footer color needs to be set sparately */ + --md-footer-bg-color: var(--md-primary-fg-color); - /* Color the links with the primary color */ - --md-typeset-a-color: var(--md-primary-fg-color); + /* Color the links with the primary color */ + --md-typeset-a-color: var(--md-primary-fg-color); - --md-admonition-icon--wip: url('data:image/svg+xml;charset=utf-8,') + --md-admonition-icon--wip: url("data:image/svg+xml;charset=utf-8,"); } .md-typeset .md-button, .md-button--primary { - background-color: var(--kpops-button-color); + background-color: var(--kpops-button-color); } .md-typeset .md-button:hover, .md-button--primary:hover { - border-color: white; + border-color: white; } -.md-typeset .admonition.wip, -.md-typeset details.wip { -border-color: rgb(160, 45, 0); +.md-typeset .admonition.wip, .md-typeset details.wip { + border-color: rgb(160, 45, 0); } -.md-typeset .wip > .admonition-title, -.md-typeset .wip > summary { -background-color: rgb(255, 195, 172); +.md-typeset .wip > .admonition-title, .md-typeset .wip > summary { + background-color: rgb(255, 195, 172); } .md-typeset .wip > .admonition-title::before, .md-typeset .wip > summary::before { -background-color: rgb(255, 77, 6); --webkit-mask-image: var(--md-admonition-icon--wip); - mask-image: var(--md-admonition-icon--wip); + background-color: rgb(255, 77, 6); + -webkit-mask-image: var(--md-admonition-icon--wip); + mask-image: var(--md-admonition-icon--wip); +} + +.md-typeset .admonition.wip, .md-typeset details.wip { + border-color: rgb(160, 45, 0); +} +.md-typeset .wip > .admonition-title, .md-typeset .wip > summary { + background-color: rgb(255, 195, 172); +} +.md-typeset .wip > .admonition-title::before, +.md-typeset .wip > summary::before { + background-color: rgb(255, 77, 6); + -webkit-mask-image: var(--md-admonition-icon--wip); + mask-image: var(--md-admonition-icon--wip); +} + +.md-typeset .admonition.wip, .md-typeset details.wip { + border-color: rgb(160, 45, 0); +} +.md-typeset .wip > .admonition-title, .md-typeset .wip > summary { + background-color: rgb(255, 195, 172); +} +.md-typeset .wip > .admonition-title::before, +.md-typeset .wip > summary::before { + background-color: rgb(255, 77, 6); + -webkit-mask-image: var(--md-admonition-icon--wip); + mask-image: var(--md-admonition-icon--wip); } diff --git a/dprint.json b/dprint.json index 296f5b2f9..e0a8652e6 100644 --- a/dprint.json +++ b/dprint.json @@ -3,9 +3,11 @@ "incremental": true, "markdown": {}, "toml": {}, + "malva": {}, "includes": [ "**/*.{md}", - "**/*.{toml}" + "**/*.{toml}", + "**/*.{css}" ], "excludes": [ ".pytest_cache/**", @@ -18,6 +20,7 @@ ], "plugins": [ "https://plugins.dprint.dev/markdown-0.16.0.wasm", - "https://plugins.dprint.dev/toml-0.5.4.wasm" + "https://plugins.dprint.dev/toml-0.5.4.wasm", + "https://plugins.dprint.dev/g-plane/malva-v0.1.2.wasm" ] }