carltongibson / neapolitan

Quick CRUD views for Django
https://noumenal.es/neapolitan/
MIT License
413 stars 30 forks source link

Show example templates using another CSS framework #9

Open carltongibson opened 1 year ago

carltongibson commented 1 year ago

The default templates use Tailwind, but it's not compulsory.

An examples/X_css mini-project showing overriding the default would be good to have.

Million dollar question: which framework? 😅

dertuxmalwieder commented 1 year ago

picocss.

carltongibson commented 1 year ago

@dertuxmalwieder — that's a speedy answer! Would you fancy submitting?

dertuxmalwieder commented 1 year ago

Not today - busy over the weekend. Bookmarked…

carltongibson commented 1 year ago

Good thread on Mastodon points to the survey which has Bootstrap the most used framework by far.

https://fosstodon.org/@carlton/110276421113060175

gelie commented 9 months ago

Hi @dertuxmalwieder

I just added picocss in my base.html

<!DOCTYPE html>
{% load static %}
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="{% static 'css/pico.min.css' %}" />
    <title>Neapolitan</title>
  </head>
  <body class="container">
    <main>
      {% block content %}
      {% endblock %}
    </main>
  </body>
</html>

To override the neapolitan templates, just create a neapolitan folder inside your django templates folder. Then rewrite the templates that you want to customize. I only rewrote the neapolitan/partial/detail.html as a test:

Screenshot_20231017_171823

{% for field, val in object %}
  <p>
    <strong>{{ field }}&colon;&emsp;&emsp;</strong>{{ val }}
  </p>
{% endfor %}

Hope this helps.

Screenshot 2023-10-17 at 17-03-28 Neapolitan Screenshot 2023-10-17 at 17-03-46 Neapolitan Screenshot 2023-10-17 at 17-04-41 Neapolitan Screenshot 2023-10-17 at 17-30-21 Neapolitan Screenshot 2023-10-17 at 17-05-15 Neapolitan Screenshot 2023-10-17 at 17-29-05 Neapolitan

carltongibson commented 9 months ago

@gelie would you like to add that as a sub folder in a examples/ dir?