From 08905203584bac0a822f714d839a0ec29c7f3660 Mon Sep 17 00:00:00 2001 From: Arkadiusz Adamski Date: Fri, 4 Oct 2024 21:03:34 +0200 Subject: [PATCH 1/2] chore: add djlint and reformat templates --- .djlintrc | 4 + README.md | 7 + cardie/main/templates/authentication.html | 112 +++++--- cardie/main/templates/base.html | 29 ++- cardie/main/templates/card.html | 25 +- cardie/main/templates/card_view.html | 38 +-- cardie/main/templates/dialogs/print.html | 38 +-- cardie/main/templates/editor.html | 243 +++++++++++------- .../main/templates/editor/font_selector.html | 44 ++-- .../main/templates/editor/items_editor.html | 60 +++-- cardie/main/templates/footer.html | 34 ++- cardie/main/templates/home.html | 154 ++++++----- cardie/main/templates/index.html | 101 ++++---- cardie/main/templates/privacy.html | 46 ++-- cardie/main/templates/ui.html | 78 +++--- requirements-dev.txt | 1 + 16 files changed, 585 insertions(+), 429 deletions(-) create mode 100644 .djlintrc create mode 100644 requirements-dev.txt diff --git a/.djlintrc b/.djlintrc new file mode 100644 index 0000000..73726fb --- /dev/null +++ b/.djlintrc @@ -0,0 +1,4 @@ +{ + "max_line_length": "180" +} + diff --git a/README.md b/README.md index 8b0ca97..5cc8e80 100644 --- a/README.md +++ b/README.md @@ -65,6 +65,7 @@ Activate the virtual environment using the command for your system (Linux is use ```bash source ./.venv/bin/activate pip install -r requirements.txt +pip install -r requirements-dev.txt ``` Copy the `.env.example` file to a new file called `.env`. @@ -98,6 +99,12 @@ Set the following global environment variables: - `DEBUG` -> `False` - `DATABASE_URL` -> `${db.DATABASE_URL}` (This works on DigitalOcean, this may not work on every hosting provider) +## Development +### djlint +This project uses `djlint` to lint the templates. You can run this using the following command +```bash +djlint cardie --reformat +``` ## Contributing Please see [CONTRIBUTING.md](CONTRIBUTING.md) for instructions on how you can contribute to Cardie diff --git a/cardie/main/templates/authentication.html b/cardie/main/templates/authentication.html index 1706352..851c35d 100644 --- a/cardie/main/templates/authentication.html +++ b/cardie/main/templates/authentication.html @@ -1,58 +1,89 @@ {% extends "base.html" %} - {% load static %} - {% block head_title %}Authentication{% endblock %} - {% block stylesheets %} - - - + + {% endblock %} - - {% block body %}
{% csrf_token %} - - - - - -
- + + + + + + +
+
+

+ Create Account +

+
+ + + + + + + + +
+
+ Privacy Policy +
+ +
{% endblock %} - {% block scripts %} - {% endblock %} diff --git a/cardie/main/templates/base.html b/cardie/main/templates/base.html index e1d4910..003c530 100644 --- a/cardie/main/templates/base.html +++ b/cardie/main/templates/base.html @@ -2,34 +2,37 @@ - {% block head_scripts %}{% endblock head_scripts %} - + {% block head_scripts %} + {% endblock head_scripts %} - - - + + - + {% block stylesheets %}{% endblock %} - - - + - Cardie | {% block head_title %}{% endblock %} + Cardie | + {% block head_title %}{% endblock %} + - {% block body %}{% endblock %} {% include "footer.html" %} - - {% block scripts %}{% endblock %} diff --git a/cardie/main/templates/card.html b/cardie/main/templates/card.html index 3301ec6..23ab104 100644 --- a/cardie/main/templates/card.html +++ b/cardie/main/templates/card.html @@ -1,24 +1,17 @@
-
-

username

pronouns

- -
- -
-
+
-

Back of card

@@ -26,14 +19,14 @@
- - +

All Items

- -
- -
- +
- \ No newline at end of file +
+ diff --git a/cardie/main/templates/card_view.html b/cardie/main/templates/card_view.html index 6f182ce..c87dca5 100644 --- a/cardie/main/templates/card_view.html +++ b/cardie/main/templates/card_view.html @@ -1,16 +1,15 @@ {% extends "base.html" %} - {% load static %} - {% block head_title %}Card{% endblock %} - {% block stylesheets %} - - - + + {% endblock %} - {% block body %}
@@ -20,28 +19,29 @@

Created by username

- - -
- {% include "card.html" %} -
- +
{% include "card.html" %}
-

Created with Cardie. You can to save this card for later and to make your own.

+

+ Created with Cardie. You can + + to save this card for later and to make your own. +

-
-

Hello {{ username }}

+

+ Hello {{ username }} + +

-
-

This card is owned by you

+

+ This card is owned by you +

{% endblock %} - {% block scripts %} diff --git a/cardie/main/templates/dialogs/print.html b/cardie/main/templates/dialogs/print.html index c95c963..31953e3 100644 --- a/cardie/main/templates/dialogs/print.html +++ b/cardie/main/templates/dialogs/print.html @@ -1,25 +1,29 @@ - +

Print Card

- +
- - - - + +

Puts a total of 4 cards on one page, fronts and backs. After you print the page you can cut and glue the two halves together.

-
-

A layout of 8 cards per two pages. Print them both and select double sided (and flip on the long edge) or print the first page, put the paper back in the printer and print the second page again.

+

+ A layout of 8 cards per two pages. Print them both and select double sided (and flip on the long edge) or print the first page, put the paper back in the printer and print the second page again. +

- - - \ No newline at end of file + + diff --git a/cardie/main/templates/editor.html b/cardie/main/templates/editor.html index 317ce2b..05094da 100644 --- a/cardie/main/templates/editor.html +++ b/cardie/main/templates/editor.html @@ -1,144 +1,195 @@ {% extends "base.html" %} - {% load static %} - {% block head_title %}Editor{% endblock %} - {% block head_scripts %} - + {% endblock %} - {% block stylesheets %} - - + - - - - -{%endblock %} - + + + +{% endblock %} {% block body %}
- - -

Editor

+ + +

Editor

-
- +

Untitled Card

by {{ username }}

- -

Loading...

+

+ Loading... +

-
-

Layout

+

+ Layout +

- - - + + +
-
-

Details

-
- - -
- - {% include "editor/font_selector.html" %} - -
-

Colors

+

+ Details +

- -

Background color

- -

Accent color

- -

Text color

- -
- - {% include "editor/items_editor.html" %} - -
- -
- {% include "card.html" %} - -
- -
- - - - -
- -
-

or to save and share this card.

-
- -
- -
-
+ + + +
- -
-
- - -
- -
+ {% include "editor/font_selector.html" %} +
+

+ Colors +

+
+

Background color

+ + +

Accent color

+ + +

Text color

+ + +
+{% include "editor/items_editor.html" %} +
+
+ {% include "card.html" %} +
+
+ + + +
- -
-
-

Name Card

- -
- - - +
+

+ + or + + to save and share this card. +

+
+
+
+
+
+
+
+ + + +
+
+
+
+
+

Name Card

+
- - {% include "dialogs/print.html" %} - -
+ + + +
+{% include "dialogs/print.html" %} +
{% endblock %} - {% block scripts %} - - - - - {% endblock %} diff --git a/cardie/main/templates/editor/font_selector.html b/cardie/main/templates/editor/font_selector.html index 7e71c27..77eb654 100644 --- a/cardie/main/templates/editor/font_selector.html +++ b/cardie/main/templates/editor/font_selector.html @@ -1,40 +1,48 @@ -
-

Font Style

+
+

+ Font Style +

-

- +
- - -
+
- - +
-
- \ No newline at end of file + diff --git a/cardie/main/templates/editor/items_editor.html b/cardie/main/templates/editor/items_editor.html index 52a4c76..a3ae55b 100644 --- a/cardie/main/templates/editor/items_editor.html +++ b/cardie/main/templates/editor/items_editor.html @@ -1,31 +1,56 @@ -
-

Items

+
+

+ Items +

-
- - - +
- - \ No newline at end of file + diff --git a/cardie/main/templates/footer.html b/cardie/main/templates/footer.html index 767f5bb..ced8974 100644 --- a/cardie/main/templates/footer.html +++ b/cardie/main/templates/footer.html @@ -1,29 +1,39 @@ {% load static %} -
- - + +
-

Cardie is in active development

-

Bugs are to be expected and lots of work is still to be done. Please report bugs here

+

+ Bugs are to be expected and lots of work is still to be done. Please report bugs here +

-
- - + +
-
Home - Source Code - Report a Bug - Discord + Source Code + Report a Bug + Discord
diff --git a/cardie/main/templates/home.html b/cardie/main/templates/home.html index 3c77f41..fbfacfb 100644 --- a/cardie/main/templates/home.html +++ b/cardie/main/templates/home.html @@ -1,98 +1,114 @@ {% extends "base.html" %} - {% load static %} - {% block head_title %}Home{% endblock %} - {% block stylesheets %} - + {% endblock %} - {% block body %}
-
- - +
- +
-
- -
+
- - - + +
-
-

My Wallet

+

+ My Wallet +

Your wallet is where all of the cards you saved appear. You can save cards by going to the link for a card and pressing "Save this card"

-

You don't have any cards saved yet! Once you do, they will appear here for you to find later.

-
-

My Cards

+

+ My Cards +

This is where all of the cards you've designed appear

- +
-
- -
- - - -
- -
- - -
-

Rename Card

- -
- - - - - - -
-

Delete Card

- -
- -

Are you sure you want to delete this Card? This action is irreversible.

- - - - -
-{% endblock %} - -{% block scripts %} - - -{% endblock %} +
+
+ + + +
+ +
+ +
+

Rename Card

+ +
+ + + + + +
+

Delete Card

+ +
+

Are you sure you want to delete this Card? This action is irreversible.

+ + + +
+ {% endblock %} + {% block scripts %} + + + {% endblock %} diff --git a/cardie/main/templates/index.html b/cardie/main/templates/index.html index 711a0a3..bac9904 100644 --- a/cardie/main/templates/index.html +++ b/cardie/main/templates/index.html @@ -1,77 +1,80 @@ {% extends "base.html" %} - {% load static %} - {% block head_title %}Index{% endblock %} - {% block stylesheets %} - + {% endblock %} - {% block body %}
- -
- - + +
- - +
- -

Welcome to

- +

An open source business card designer and sharing platform

-
- - - + + +
-
-
- - -
-

Create a Card

-
    -
  • Add your name, title or pronouns to the top section
    • -
  • Add text information like your phone number, email, and more
    • -
  • You can also add links to any of your other online presences, like social accounts or links to your other work.
    • -
-
-
- -
- - -
-

Editor

-
    -
  • Add information and link items to your card
    • -
  • You can customize those items with a icon selector
    • -
  • Once you're finished, copy a link to your card so you can share it with anyone
    • -
-
+ + +
+

Create a Card

+
    +
  • Add your name, title or pronouns to the top section
    • +
  • Add text information like your phone number, email, and more
    • +
  • You can also add links to any of your other online presences, like social accounts or links to your other work.
    • +
- - {% endblock %} - - {% block scripts %} +
+
+ + +
+

Editor

+
    +
  • Add information and link items to your card
    • +
  • You can customize those items with a icon selector
    • +
  • Once you're finished, copy a link to your card so you can share it with anyone
    • +
+
+
+{% endblock %} +{% block scripts %} - - + - - - + + - You're not really supposed to be here... - - - - - + + + + -

Header Text

Header Text Left

Subheader Text

@@ -32,45 +39,36 @@

Smaller Subheader Text

Body Text

Description Text

- - - +

Information status box

-

Warning status box

-

Critical status box

- - - -
- -
- -
- -
-
-

Front of card

-
- -
-

Back of card

-
+ + +
+
+
+
+
+

Front of card

- - {% include "footer.html" %} - - - - +
+

Back of card

+
+
+ {% include "footer.html" %} + + + diff --git a/requirements-dev.txt b/requirements-dev.txt new file mode 100644 index 0000000..ad04b75 --- /dev/null +++ b/requirements-dev.txt @@ -0,0 +1 @@ +djlint==1.35.2 From 6bc05f63f8832c7d69574222a2e3cfb8483aa337 Mon Sep 17 00:00:00 2001 From: nfoert Date: Fri, 4 Oct 2024 20:15:33 -0400 Subject: [PATCH 2/2] Fix issue with unnecessary tags Make some adjustments to .djlintrc Create task for djlint --- .djlintrc | 4 +- .vscode/tasks.json | 10 ++ cardie/main/templates/authentication.html | 102 +++++++------ cardie/main/templates/editor.html | 173 +++++++++++----------- cardie/main/templates/home.html | 49 +++--- cardie/main/templates/ui.html | 29 ++-- 6 files changed, 186 insertions(+), 181 deletions(-) diff --git a/.djlintrc b/.djlintrc index 73726fb..b895850 100644 --- a/.djlintrc +++ b/.djlintrc @@ -1,4 +1,6 @@ { - "max_line_length": "180" + "max_line_length": "180", + "max_blank_lines": 1, + "profile": "django" } diff --git a/.vscode/tasks.json b/.vscode/tasks.json index 681f74c..bf1348e 100755 --- a/.vscode/tasks.json +++ b/.vscode/tasks.json @@ -64,6 +64,16 @@ "panel": "new" }, "problemMatcher": [] + }, + { + "label": "Format Django templats with djlint", + "type": "shell", + "command": "source .venv/bin/activate && djlint cardie --reformat", + "presentation": { + "reveal": "always", + "panel": "new" + }, + "problemMatcher": [] } ] } \ No newline at end of file diff --git a/cardie/main/templates/authentication.html b/cardie/main/templates/authentication.html index 851c35d..c8468e0 100644 --- a/cardie/main/templates/authentication.html +++ b/cardie/main/templates/authentication.html @@ -1,6 +1,7 @@ {% extends "base.html" %} {% load static %} {% block head_title %}Authentication{% endblock %} + {% block stylesheets %} {% endblock %} + {% block body %}
{% csrf_token %} @@ -31,59 +33,55 @@ type="text" class="ui_input_generic" placeholder="Username"> - - - - - -
-
-

- Create Account -

-
- - - - - - - - -
-
- Privacy Policy -
-
-
+ + + +
+
+

+ Create Account +

+
+ + + + + +
+
+ Privacy Policy +
+
+
{% endblock %} + {% block scripts %} {% endblock %} + {% block stylesheets %} @@ -19,6 +21,7 @@ type="text/css" href="{% static '/main/editor_print.css' %}"> {% endblock %} + {% block body %}
@@ -78,102 +81,96 @@ id="editor_main_settings_details_primary" placeholder="Primary text" data-tippy-content="Perfect for your name or username"> - + +
+ {% include "editor/font_selector.html" %} +
+

+ Colors +

+
+

Background color

+ +

Accent color

+ +

Text color

+ +
+ {% include "editor/items_editor.html" %} +
+
+ {% include "card.html" %} +
+
+ + + + +
+
+

+ + or + + to save and share this card. +

+
+
+
+
+
+
+
- -
- {% include "editor/font_selector.html" %} -
-

- Colors -

-
-

Background color

- - -

Accent color

- - -

Text color

- - -
-{% include "editor/items_editor.html" %} -
-
- {% include "card.html" %} -
-
- - - - -
-
-

- - or - - to save and share this card. -

+ id="editor-iconselector-top-search" + placeholder="Search for an icon"> + +
+
-
-
-
-
-
-
+
+
+

Name Card

+ +
- - -
-
-
-
-
-

Name Card

-
- - - -
-{% include "dialogs/print.html" %} -
+ {% include "dialogs/print.html" %} +
{% endblock %} + {% block scripts %} diff --git a/cardie/main/templates/home.html b/cardie/main/templates/home.html index fbfacfb..01c30f3 100644 --- a/cardie/main/templates/home.html +++ b/cardie/main/templates/home.html @@ -86,29 +86,28 @@ - - - - -
-

Delete Card

- -
-

Are you sure you want to delete this Card? This action is irreversible.

- - - -
- {% endblock %} - {% block scripts %} - - - {% endblock %} + + +
+

Delete Card

+ +
+

Are you sure you want to delete this Card? This action is irreversible.

+ + + +
+ {% endblock %} + {% block scripts %} + + + {% endblock %} diff --git a/cardie/main/templates/ui.html b/cardie/main/templates/ui.html index 6be0475..68733bc 100644 --- a/cardie/main/templates/ui.html +++ b/cardie/main/templates/ui.html @@ -55,20 +55,19 @@

Critical status box

- -
-
-
-
-
-

Front of card

+
+
+
+
+
+

Front of card

+
+
+

Back of card

+
-
-

Back of card

-
-
- {% include "footer.html" %} - - - + {% include "footer.html" %} + + +