Legibility of (Python) code, and alignment in default

[dcbbdc]

Hi,

I just started with marp, and I really like it so far – I cannot think of a more efficient way of creating presentations with a lot of code samples and math.

However, I've come across an issue with (Python) code legibility in the gaia theme, when using code formatting. Especially the blue shade of function parameters is almost illegible.

Is there a way to influence the background color of the code, or the colors of the code formatting?

Alternatively, is there a way to get the default theme to align top left? The vertical alignment is what brought me to use the gaia scheme. If it wasn't for the alignment, default would be great for me.

Thanks!
David

[yhatt]

Is there a way to influence the background color of the code, or the colors of the code formatting?

Yes, you can override code colors by tweaking style through <style> tag in Markdown.

---
theme: gaia
---

<style>
/* Change background color of the code block to black */
pre {
  background-color: #000;
}

/* Change foreground color of params in the code to pink */
.hljs-params {
  color: #f9c;
}
</style>

```python
@requires_authorization(roles=["ADMIN"])
def somefunc(param1='', param2=0):
    r'''A docstring'''
    if param1 > param2: # interesting
        print 'Gre\'ater'
    return (param2 - param1 + 1 + 0b10l) or None

class SomeClass:
    pass

>>> message = '''interpreter
... prompt'''
```

Marp Core uses highlight.js to make colorize the code block. (https://github.com/marp-team/marp-core/blob/9b9394d8cee54b1cf868efa1a67046b202ffa225/themes/gaia.scss#L20)

You can see original definition of highlight.js theme sunburst, used by Marp gaia theme, at https://github.com/highlightjs/highlight.js/blob/main/src/styles/sunburst.css.

Alternatively, is there a way to get the default theme to align top left? The vertical alignment is what brought me to use the gaia scheme. If it wasn't for the alignment, default would be great for me.

It's also available:

---
theme: default
---

<style>
section {
  justify-content: flex-start;
}
</style>

[dcbbdc]

Oh, this is awesome! Thank you so much!