diff --git a/MANIFEST.in b/MANIFEST.in index bed5aeb..065eb5f 100644 --- a/MANIFEST.in +++ b/MANIFEST.in @@ -1,2 +1,3 @@ recursive-include wagtailterms/migrations * -recursive-include wagtailterms/static * \ No newline at end of file +recursive-include wagtailterms/static * +recursive-include wagtailterms/templates * diff --git a/README.md b/README.md index 9d788c9..62af2a3 100644 --- a/README.md +++ b/README.md @@ -102,8 +102,18 @@ Rendered HTML of the term in the frontend: ```html term 1 ``` +ℹ️ Above is the default style but this can be modified in the settings. -The most basic implementation: ([See full example](./example/home/templates/home/basic_page.html)) +#### Quick implementation: ([See full example](./example/home/templates/home/quick_start.html)) + +Include in the template at the bottom of the page template. +```html +... +{% include 'wagtailterms/wagtailterms.html' %} +``` +ℹ️ This loads the advanced implementation in page template. + +#### The most basic implementation: ([See full example](./example/home/templates/home/basic_page.html)) ```javascript function showterm(e){ const termid = e.target.dataset.term @@ -129,7 +139,7 @@ On hover

-A more advanced way would be to use a library like [tippy.js](https://atomiks.github.io/tippyjs/) to +#### A more advanced way would be to use a library like [tippy.js](https://atomiks.github.io/tippyjs/) to create a tooltip that appears when hovering over the term. ([See full example](./example/home/templates/home/advanced_page.html)) ```javascript function add_tooltips(){ @@ -214,6 +224,4 @@ On hover ### 0.1.3 - Added setting to change frontend styles - -## To Do -- Include a default javascript implementation for frontend \ No newline at end of file +- Added quick start template for default frontend implementation \ No newline at end of file diff --git a/example/example/static/css/example.css b/example/example/static/css/example.css deleted file mode 100644 index e69de29..0000000 diff --git a/example/example/static/js/example.js b/example/example/static/js/example.js deleted file mode 100644 index e69de29..0000000 diff --git a/example/home/migrations/0002_quickstart.py b/example/home/migrations/0002_quickstart.py new file mode 100644 index 0000000..2515dfb --- /dev/null +++ b/example/home/migrations/0002_quickstart.py @@ -0,0 +1,27 @@ +# Generated by Django 5.0.3 on 2024-05-01 03:15 + +import django.db.models.deletion +import wagtail.fields +from django.db import migrations, models + + +class Migration(migrations.Migration): + + dependencies = [ + ('home', '0001_initial'), + ('wagtailcore', '0091_remove_revision_submitted_for_moderation'), + ] + + operations = [ + migrations.CreateModel( + name='QuickStart', + fields=[ + ('page_ptr', models.OneToOneField(auto_created=True, on_delete=django.db.models.deletion.CASCADE, parent_link=True, primary_key=True, serialize=False, to='wagtailcore.page')), + ('content', wagtail.fields.RichTextField()), + ], + options={ + 'abstract': False, + }, + bases=('wagtailcore.page',), + ), + ] diff --git a/example/home/models.py b/example/home/models.py index c5e52d3..4e44804 100644 --- a/example/home/models.py +++ b/example/home/models.py @@ -9,6 +9,14 @@ class HomePage(Page): pass +class QuickStart(Page): + content = RichTextField() + + content_panels = Page.content_panels + [ + FieldPanel("content") + ] + + class BasicPage(Page): content = RichTextField() @@ -19,12 +27,12 @@ class BasicPage(Page): class AdvancedPage(Page): content = StreamField( - [ - ("heading", blocks.CharBlock(form_classname="title")), - ("paragraph", blocks.RichTextBlock()), - ], - blank=True, - use_json_field=True, + [ + ("heading", blocks.CharBlock(form_classname="title")), + ("paragraph", blocks.RichTextBlock()), + ], + blank=True, + use_json_field=True, ) content_panels = Page.content_panels + [ diff --git a/example/home/static/css/welcome_page.css b/example/home/static/css/welcome_page.css deleted file mode 100644 index bad2933..0000000 --- a/example/home/static/css/welcome_page.css +++ /dev/null @@ -1,184 +0,0 @@ -html { - box-sizing: border-box; -} - -*, -*:before, -*:after { - box-sizing: inherit; -} - -body { - max-width: 960px; - min-height: 100vh; - margin: 0 auto; - padding: 0 15px; - color: #231f20; - font-family: 'Helvetica Neue', 'Segoe UI', Arial, sans-serif; - line-height: 1.25; -} - -a { - background-color: transparent; - color: #308282; - text-decoration: underline; -} - -a:hover { - color: #ea1b10; -} - -h1, -h2, -h3, -h4, -h5, -p, -ul { - padding: 0; - margin: 0; - font-weight: 400; -} - -svg:not(:root) { - overflow: hidden; -} - -.header { - display: flex; - justify-content: space-between; - align-items: center; - padding-top: 20px; - padding-bottom: 10px; - border-bottom: 1px solid #e6e6e6; -} - -.logo { - width: 150px; - margin-inline-end: 20px; -} - -.logo a { - display: block; -} - -.figure-logo { - max-width: 150px; - max-height: 55.1px; -} - -.release-notes { - font-size: 14px; -} - -.main { - padding: 40px 0; - margin: 0 auto; - text-align: center; -} - -.figure-space { - max-width: 265px; -} - -@keyframes pos { - 0%, 100% { - transform: rotate(-6deg); - } - 50% { - transform: rotate(6deg); - } -} - -.egg { - fill: #43b1b0; - animation: pos 3s ease infinite; - transform: translateY(50px); - transform-origin: 50% 80%; -} - -.main-text { - max-width: 400px; - margin: 5px auto; -} - -.main-text h1 { - font-size: 22px; -} - -.main-text p { - margin: 15px auto 0; -} - -.footer { - display: flex; - flex-wrap: wrap; - justify-content: space-between; - border-top: 1px solid #e6e6e6; - padding: 10px; -} - -.option { - display: block; - padding: 10px 10px 10px 34px; - position: relative; - text-decoration: none; -} - -.option svg { - width: 24px; - height: 24px; - fill: gray; - border: 1px solid #d9d9d9; - padding: 5px; - border-radius: 100%; - top: 10px; - inset-inline-start: 0; - position: absolute; -} - -.option h2 { - font-size: 19px; - text-decoration: underline; -} - -.option p { - padding-top: 3px; - color: #231f20; - font-size: 15px; - font-weight: 300; -} - -@media (max-width: 996px) { - body { - max-width: 780px; - } -} - -@media (max-width: 767px) { - .option { - flex: 0 0 50%; - } -} - -@media (max-width: 599px) { - .main { - padding: 20px 0; - } - - .figure-space { - max-width: 200px; - } - - .footer { - display: block; - width: 300px; - margin: 0 auto; - } -} - -@media (max-width: 360px) { - .header-link { - max-width: 100px; - } -} diff --git a/example/home/templates/home/home_page.html b/example/home/templates/home/home_page.html deleted file mode 100644 index db9e9b0..0000000 --- a/example/home/templates/home/home_page.html +++ /dev/null @@ -1,21 +0,0 @@ -{% extends "base.html" %} -{% load static %} - -{% block body_class %}template-homepage{% endblock %} - -{% block extra_css %} - -{% comment %} -Delete the line below if you're just getting started and want to remove the welcome screen! -{% endcomment %} - -{% endblock extra_css %} - -{% block content %} - -{% comment %} -Delete the line below if you're just getting started and want to remove the welcome screen! -{% endcomment %} -{% include 'home/welcome_page.html' %} - -{% endblock content %} diff --git a/example/home/templates/home/quick_start.html b/example/home/templates/home/quick_start.html new file mode 100644 index 0000000..dd5f974 --- /dev/null +++ b/example/home/templates/home/quick_start.html @@ -0,0 +1,15 @@ +{% load wagtailcore_tags wagtailuserbar %} + + + + + Basic Terms + + +{% wagtailuserbar %} +
+ {{ page.content|richtext }} +
+{% include 'wagtailterms/wagtailterms.html' %} + + diff --git a/example/home/templates/home/welcome_page.html b/example/home/templates/home/welcome_page.html deleted file mode 100644 index dcacaf3..0000000 --- a/example/home/templates/home/welcome_page.html +++ /dev/null @@ -1,52 +0,0 @@ -{% load i18n wagtailcore_tags %} - -
- -
- {% comment %} - This works for all cases but prerelease versions: - {% endcomment %} - - {% trans "View the release notes" %} - -
-
-
-
- -
-
-

{% trans "Welcome to your new Wagtail site!" %}

-

{% trans 'Please feel free to join our community on Slack, or get started with one of the links below.' %}

-
-
- diff --git a/example/templates/base.html b/example/templates/base.html deleted file mode 100644 index 6271c98..0000000 --- a/example/templates/base.html +++ /dev/null @@ -1,46 +0,0 @@ -{% load static wagtailcore_tags wagtailuserbar %} - - - - - - - {% block title %} - {% if page.seo_title %}{{ page.seo_title }}{% else %}{{ page.title }}{% endif %} - {% endblock %} - {% block title_suffix %} - {% wagtail_site as current_site %} - {% if current_site and current_site.site_name %}- {{ current_site.site_name }}{% endif %} - {% endblock %} - - {% if page.search_description %} - - {% endif %} - - - {# Force all links in the live preview panel to be opened in a new tab #} - {% if request.in_preview_panel %} - - {% endif %} - - {# Global stylesheets #} - - - {% block extra_css %} - {# Override this in templates to add extra stylesheets #} - {% endblock %} - - - - {% wagtailuserbar %} - - {% block content %}{% endblock %} - - {# Global javascript #} - - - {% block extra_js %} - {# Override this in templates to add extra javascript #} - {% endblock %} - - diff --git a/wagtailterms/templates/wagtailterms/wagtailterms.html b/wagtailterms/templates/wagtailterms/wagtailterms.html new file mode 100644 index 0000000..c4c93df --- /dev/null +++ b/wagtailterms/templates/wagtailterms/wagtailterms.html @@ -0,0 +1,40 @@ + + +