https://github.com/julien040/charcoal-datasette-theme

A minimalistic theme for Datasette
https://github.com/julien040/charcoal-datasette-theme

datasette datasette-plugin datasette-theme theme

Last synced: about 1 month ago
JSON representation

A minimalistic theme for Datasette

• Host: GitHub
• URL: https://github.com/julien040/charcoal-datasette-theme
• Owner: julien040
• License: mit
• Created: 2024-06-11T21:47:32.000Z (7 months ago)
• Default Branch: main
• Last Pushed: 2024-06-12T11:14:39.000Z (7 months ago)
• Last Synced: 2024-10-25T09:14:52.202Z (3 months ago)
• Topics: datasette, datasette-plugin, datasette-theme, theme
• Language: CSS
• Homepage:
• Size: 815 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Datasette charcoal theme

This is a small (5.1KB) custom theme for Datasette, inspired by my previous work on the [Alexandria library](https://alexandria-library.julienc.me/) (a curated collection of articles from [Hacker News](https://news.ycombinator.com/news)).

It provides a minimalistic and grayscale-based design. I consider it as a trade-off between the functionality of the default Datasette theme and the aesthetics of this custom theme.

It might not be your cup of tea, but I hope you'll like it!

![Table view](./images/table-view.png)

## Installation

The theme is available at [https://cdn.jsdelivr.net/gh/julien040/[email protected]/theme.min.css](https://cdn.jsdelivr.net/gh/julien040/[email protected]/theme.min.css).

Datasette is well made and allows you to [add custom CSS](https://docs.datasette.io/en/stable/custom_templates.html#custom-css-and-javascript) to your instance. You can do so by adding the URL to the `extra_css_urls` array in your `metadata.json` file.

```json

{

    "extra_css_urls": [

        "https://cdn.jsdelivr.net/gh/julien040/[email protected]/theme.min.css"

    ]

}

```

## Screenshots

![Table view](./images/table-view.png)

![SQL query view](./images/sql-query.png)

The theme also works on mobile devices, here is a screenshot of the table view on a mobile device:

![Mobile view](./images/mobile-view.png)

## License

This theme is released under the MIT license. See the [LICENSE](./LICENSE) file for more information.

## Contributing

I think the work is mostly done, but if you have any suggestions or improvements, feel free to open an issue or a pull request! I haven't tested the theme on plugins, so if you encounter any issues, please let me know.