diff options
Diffstat (limited to 'design/templates')
| -rw-r--r-- | design/templates/accounts/change-settings.html | 7 | ||||
| -rw-r--r-- | design/templates/base.html | 3 | ||||
| -rw-r--r-- | design/templates/forum/topic_detail.html | 114 | ||||
| -rw-r--r-- | design/templates/forum/topic_list.html | 86 | ||||
| -rw-r--r-- | design/templates/notes/notebook_detail.html | 4 | ||||
| -rw-r--r-- | design/templates/notes/notes_list.html | 2 | ||||
| -rw-r--r-- | design/templates/notes/notes_list_by_tag.html | 71 |
7 files changed, 257 insertions, 30 deletions
diff --git a/design/templates/accounts/change-settings.html b/design/templates/accounts/change-settings.html index a6e6ea6..e14a1e3 100644 --- a/design/templates/accounts/change-settings.html +++ b/design/templates/accounts/change-settings.html @@ -22,12 +22,5 @@ </form> </main> <script> -if (typeof(document.getElementById('id_photo')) != 'undefined' && document.getElementById('id_photo') != null) { - var input = document.getElementById('id_photo'); - input.fname = document.getElementById('filename'); - input.addEventListener('change', function(e){ - e.target.fname.innerHTML = e.target.value.split("\\")[2]; - }); -} </script> {% endblock %} diff --git a/design/templates/base.html b/design/templates/base.html index e02719b..cdbed90 100644 --- a/design/templates/base.html +++ b/design/templates/base.html @@ -18,7 +18,7 @@ {% block jsinclude %}{%endblock%} <script async src="/media/js/main.min.js?{%now "u"%}"></script> </head> -<body class="{% block bodyclass %}{% endblock %}"> +<body id="{% block bodyid %}{%endblock%}" class="{% block bodyclass %}{% endblock %}"> <div class="head-wrapper"> <header> <nav class="left"> @@ -73,6 +73,7 @@ </nav> </header> </div> + {% block color %}{%endblock%} <div class="wrapper"> {%comment%}<ul class="breadcrumb" id="breadcrumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <li> diff --git a/design/templates/forum/topic_detail.html b/design/templates/forum/topic_detail.html new file mode 100644 index 0000000..3873375 --- /dev/null +++ b/design/templates/forum/topic_detail.html @@ -0,0 +1,114 @@ +{% extends 'base.html' %} +{% load timesinceabbr %} +{% block bodyid %}body-topic{%endblock%} +{% block content %} +<main class="wide"> + <div class="">{% if messages %} + <ul class="messages"> + {% for message in messages %} + <li{% if message.tags %} class="{{ message.tags }}"{% endif %}> + {% if 'safe' in message.tags %}{{ message|safe }}{% else %}{{ message }}{% endif %} + </li> + {% endfor %} + </ul> + {% endif %} + </div> + <article class="topic-container single-col"> + <div class="topic-header"> + <h1>{{object.title}}</h1> + <h2 class="category-name"> + <a class="name" href="{{object.category.get_absolute_url}}"><span class="color-box" style="background-color: {{object.category.color_rgb}}"></span><span class="strong nb-name">{{object.category.name}}</span></a> + </h2> + </div> + <ol id="post-list">{% for post in object.post_set.all %} + <li class="post-list-item"> + <div class="post-header"> + <div class="avatar"><img src="{{post.user.get_avatar_url}}" alt="avatar for {{post.user.username}}" /></div> + <div class="username"> + {{post.user.username}} + </div> + <div class="user-title"> + {{post.user.category}} + </div> + <div class="post-created"> + {{post.date_created|timesinceabbr}} + </div> + </div> + <div class="post-body"> + {{post.body_html}} + </div> + <div class="post-footer"> + + </div> + </li> + {% endfor %}</ol> + + +<table id="" class="topic-list"> + <thead> + <tr> + <th data-sort-order="default" class="default">Topic</th> + <th data-sort-order="users" class="topic-users sortable num"></th> + <th data-sort-order="posts" class="topic-posts sortable num">Replies</th> + <th data-sort-order="views" class="topic-views sortable num">Views</th> + <th data-sort-order="activity" class="topic-age">Activity</th> + </tr> + </thead> + <tbody> + {% for object in object_list %} + <tr id="{{object.id}}" class="topic-list-item"> + <td class="" colspan="1"> + {% if object.statuses%}<div class="topic-statuses"> + <a href="" title="" class="topic-status"><svg class="fa d-icon d-icon-thumbtack svg-icon pinned svg-string" xmlns="http://www.w3.org/2000/svg"><use xlink:href="#thumbtack"></use></svg></a> + </div>{%endif%} + <a href="{{object.get_absolute_url}}" class="title" data-topic-id="{{object.id}}">{{object.title}}</a> + <span class="topic-post-badges"></span> + {% if object.pinned %}<div class="topic-excerpt">{{object.except}} + <a href="/t/lets-use-math-my-nerds/10030">read more</a>{%endif%} + <div class="category"> + <a href="{{object.category.get_absolute_url}}"><span class="color-box" style="background-color: {{object.category.color_rgb}}"></span>{{object.category}}</a> + </div> + </td> + <td class="topic-users"> + {% for user in object.user_set.all %}<a href="{{user.get_forum_url}}"><img alt="avatar for {{user}}" src="{{user.get_avatar_url}}" /></a>{%endfor%} + </td> + <td class="topic-posts center"> + {{object.reply_count}} + </td> + <td class="topic-views center"> + {{object.views}} + </td> + <td class="topic-age center"> + </td> + </tr> + {% endfor %} +</table> + </article> +</main> +{% endblock %} + + + + + + +{% block extra %} +{% if login_form %} +<div class="overlay-content" id="js-overlay-content" style="display: none;"> + {% include 'lib/login.html' with form=login_form %} +</div> +{% endif %} +{%endblock%} +{% block jsdomready %} +{% if login_form %} + // Select your overlay trigger + var trigger = document.querySelector('#overlay-trigger'); + trigger.addEventListener('click', function(e){ + e.preventDefault(); + novicell.overlay.create({ + 'selector': trigger.getAttribute('data-element'), + 'class': 'selector-overlay', + }); + }); +{% endif %} +{%endblock%} diff --git a/design/templates/forum/topic_list.html b/design/templates/forum/topic_list.html index 89a165e..5f933e9 100644 --- a/design/templates/forum/topic_list.html +++ b/design/templates/forum/topic_list.html @@ -1,4 +1,12 @@ {% extends 'base.html' %} +{% block bodyid %}body-forum{%endblock%} +{% block jsinclude %} + <script> + window.nbdata = [ {%spaceless%}{% for object in category_list %} {value: '{{object.get_absolute_url}}', label: '<span class="color-box" style="background-color: {{object.color_rgb}}"></span><span class="strong nb-name">{{object.name}}</span> x {{object.note_count}}' },{%endfor%} {value: '/forum/', label: '<span class="strong nb-name">All Categories</span>', selected: true, },{%endspaceless%} + ] + </script> +<script src="/media/js/choices.min.js"></script> +{%endblock%} {% block content %} <main class="wide"> <div class="single-col"> @@ -8,35 +16,69 @@ <p>The goal is for users of all levels to learn and share with each other, please treat this discussion forum with the same respect you would a public park. Remember to be kind, courteous and forgiving.</p> </span> </div> + <div class=""> + + <div id="list-header"> + <div id="choices-container" class="flex-wrapper"> + <ul class="list dropmenu-list list-style-none notebook-list" id="category-list">{% for object in category_list %} + <li ><a class="name" href="{{object.get_absolute_url}}"><span class="color-box" style="background-color: {{object.color_rgb}}"></span><span class="strong nb-name">{{object.name}}</span> x {{object.note_count}}</a></li> + {%endfor%}</ul> + </div> + </div> + + + + + + + + {% if messages %} + <ul class="messages"> + {% for message in messages %} + <li{% if message.tags %} class="{{ message.tags }}"{% endif %}> + {% if 'safe' in message.tags %}{{ message|safe }}{% else %}{{ message }}{% endif %} + </li> + {% endfor %} + </ul> + {% endif %} + </div> <table id="" class="topic-list"> <thead> <tr> <th data-sort-order="default" class="default">Topic</th> - <th data-sort-order="category" class="category sortable">Category</th> - <th data-sort-order="posters" class="posters">Users</th> - <th data-sort-order="posts" class="posts sortable num">Replies</th> - <th data-sort-order="views" class="views sortable num">Views</th> - <th data-sort-order="activity" class="activity sortable num">Activity</th> + <th data-sort-order="users" class="topic-users sortable num"></th> + <th data-sort-order="posts" class="topic-posts sortable num">Replies</th> + <th data-sort-order="views" class="topic-views sortable num">Views</th> + <th data-sort-order="activity" class="topic-age">Activity</th> </tr> </thead> -<tbody> + <tbody> {% for object in object_list %} - <tr data-topic-id="" id="ember1226" class="topic-list-item category-meta has-excerpt pinned ember-view"> - <td class="main-link clearfix" colspan="1"> - <span class="link-top-line"> - <div class="topic-statuses"> - <a href="" title="This topic is pinned for you; it will display at the top of its category" class="topic-status"><svg class="fa d-icon d-icon-thumbtack svg-icon pinned svg-string" xmlns="http://www.w3.org/2000/svg"><use xlink:href="#thumbtack"></use></svg></a> - </div> - <a href="/t/lets-use-math-my-nerds/10030" class="title raw-link raw-topic-link" data-topic-id="10030">Let’s use math my nerds</a> - <span class="topic-post-badges"></span> - </span> - <div class="topic-excerpt">For a while we had either to render math outside of the forum or using some kind of ascii art for them. But this is over now. We added the offical math plugin to our instance. And yes asciimath is enabled too. -$$ -E=mc… - <a href="/t/lets-use-math-my-nerds/10030">read more</a> - </div> - </td> - </tr> + <tr id="{{object.id}}" class="topic-list-item"> + <td class="" colspan="1"> + {% if object.statuses%}<div class="topic-statuses"> + <a href="" title="" class="topic-status"><svg class="fa d-icon d-icon-thumbtack svg-icon pinned svg-string" xmlns="http://www.w3.org/2000/svg"><use xlink:href="#thumbtack"></use></svg></a> + </div>{%endif%} + <a href="{{object.get_absolute_url}}" class="title" data-topic-id="{{object.id}}">{{object.title}}</a> + <span class="topic-post-badges"></span> + {% if object.pinned %}<div class="topic-excerpt">{{object.except}} + <a href="/t/lets-use-math-my-nerds/10030">read more</a>{%endif%} + <div class="category"> + <a href="{{object.category.get_absolute_url}}"><span class="color-box" style="background-color: {{object.category.color_rgb}}"></span>{{object.category}}</a> + </div> + </td> + <td class="topic-users"> + {% for user in object.user_set.all %}<a href="{{user.get_forum_url}}"><img alt="avatar for {{user}}" src="{{user.get_avatar_url}}" /></a>{%endfor%} + </td> + <td class="topic-posts center"> + {{object.reply_count}} + </td> + <td class="topic-views center"> + {{object.views}} + </td> + <td class="topic-age center"> + </td> + </tr> {% endfor %} </table> </main> diff --git a/design/templates/notes/notebook_detail.html b/design/templates/notes/notebook_detail.html index 49717ca..43ec1df 100644 --- a/design/templates/notes/notebook_detail.html +++ b/design/templates/notes/notebook_detail.html @@ -1,9 +1,13 @@ {% extends 'base.html' %} +{% block bodyid %}body-notebook{%endblock%} {% block extrastyles %} <script async src="/media/js/vanilla-picker.min.js"></script> {% endblock %} +{% block color %} +{% if object.color_rgb %}<div class="color" style="background-color: {{object.color_rgb}}"></div>{%endif%} +{%endblock%} {% block content %} <main> <article class="note-container single-col"> diff --git a/design/templates/notes/notes_list.html b/design/templates/notes/notes_list.html index 0799a1c..5b050b4 100644 --- a/design/templates/notes/notes_list.html +++ b/design/templates/notes/notes_list.html @@ -1,4 +1,6 @@ {% extends 'base.html' %} +{% block bodyid %}body-notebook{%endblock%} + {% block content %} <main> <div class="note-container"> diff --git a/design/templates/notes/notes_list_by_tag.html b/design/templates/notes/notes_list_by_tag.html new file mode 100644 index 0000000..d7cc350 --- /dev/null +++ b/design/templates/notes/notes_list_by_tag.html @@ -0,0 +1,71 @@ +{% extends 'base.html' %} +{% block jsinclude %} + <script> + window.nbdata = [ {%spaceless%}{% for object in notebook_list %} {value: '{{object.get_absolute_url}}', label: '<span class="color-box" style="background-color: {{object.color_rgb}}"></span><span class="strong nb-name">{{object.name}}</span> x {{object.note_count}}' },{%endfor%} {value: '/nb/', label: '<span class="strong nb-name">All Notebooks</span>', selected: true, },{%endspaceless%} + ] + window.tagdata = [ {% for object in tag_list %} {value: '{{object.get_absolute_url}}', label: '{% if object.color_rgb %}<span class="color-box" style="background-color: {{object.color_rgb}}"></span>{%endif%}<span class="strong nb-name">{{object.name}}</span> x {{object.note_count}}' },{%endfor%} {value: '/t/', label: '<span class="strong nb-name">All Tags</span>', selected: true, }, + ] + </script> +<script src="/media/js/choices.min.js"></script> +{%endblock%} +{% block content %} +<main> + <div class="note-container"> + <div class="note-hed-wrapper"> + <h1 class="note-hed">Notes</h1> + {% if messages %} + <ul class="messages"> + {% for message in messages %} + <li{% if message.tags %} class="{{ message.tags }}"{% endif %}> + {% if 'safe' in message.tags %}{{ message|safe }}{% else %}{{ message }}{% endif %} + </li> + {% endfor %} + </ul> + {% endif %} + {% if tag_list|length >= 1%}<h2 class="note-subhed">Tagged with: {% for tag in tag%}<a href="{{tag.slug}}">{{tag.name}}</a>{%endfor%}</h2>{%endif%} + <div id="choices-container" class="flex-wrapper"> + <ul class="list dropmenu-list list-style-none notebook-list" id="notebook-list">{% for object in notebook_list %} + <li ><a class="name" href="{{object.get_absolute_url}}"><span class="color-box" style="background-color: {{object.color_rgb}}"></span><span class="strong nb-name">{{object.name}}</span> x {{object.note_count}}</a></li> + {%endfor%}</ul> + <ul class="list dropmenu-list list-style-none notebook-list" id="tags-list">{% for object in tag_list %} + <li><a href="{{object.get_absolute_url}}">{% if object.color_rgb %}<span class="color-box" style="background-color: {{object.color_rgb}}"></span>{%endif%}<span class="strong nb-name">{{object.name}}</span> x {{object.note_count}}</a></li> + {%endfor%}</ul> + </div> + </div> + {%comment%} <label for="choices-single-default">Default</label> +<select class="form-control" data-trigger name="choices-single-default" id="choices-single-default" placeholder="This is a search placeholder"> +<option placeholder>This is a placeholder</option> + {% for object in notebook_list %} + <option value="{{object.name}}" id="">{{object.name}}</option> + {% endfor %} +</select>{%endcomment%} + + <ul class="list-note-preview">{% for object in object_list %} + {% include "notes/partials/note_list.html" with object=object %} + {% endfor %}</ul> + </div>{% if tags|length >= 1%} + {%comment%}<aside class="note-list-container"> + <div class="svg-wrapper"><svg class="svg-icon-arrow"> + <svg viewBox="0 0 16 13" id="shape-double-arrow" width="100%" height="100%"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="square"><g id="Showing-post-info" transform="translate(-297.000000, -105.000000)" stroke="currentColor"><g transform="translate(305.000000, 111.500000) scale(-1, 1) rotate(-180.000000) translate(-305.000000, -111.500000) translate(297.000000, 105.000000)"><path d="M2.20710678,6.5 L6.85355339,1.85355339 L7.20710678,1.5 L6.5,0.792893219 L6.14644661,1.14644661 L1.14644661,6.14644661 L1.05805826,6.23483496 L0.792893219,6.5 L1.14644661,6.85355339 L6.14644661,11.8535534 L6.5,12.2071068 L7.20710678,11.5 L6.85355339,11.1464466 L2.20710678,6.5 Z" id="Combined-Shape"></path><path d="M10.2071068,6.5 L14.8535534,1.85355339 L15.2071068,1.5 L14.5,0.792893219 L14.1464466,1.14644661 L9.14644661,6.14644661 L9.05805826,6.23483496 L8.79289322,6.5 L9.14644661,6.85355339 L14.1464466,11.8535534 L14.5,12.2071068 L15.2071068,11.5 L14.8535534,11.1464466 L10.2071068,6.5 Z" id="Combined-Shape"></path></g></g></g></svg> + </svg></div> + <div class=""> + <ul class="list-note-preview">{% for obj in notes_list %} + <li> + <a href="{{obj.get_absolute_url}}"> + <h4>{{obj.title}}</h4> + <div class="note-preview">{{obj.body_text|truncatewords:12}}</div> + </a> + </li> + {% endfor %}</ul> + </div> + </aside>{%endcomment%} + {%else%} + <!--<div class="balance-container-left"> + </div>--> + {%endif%} + <!--<div class="balance-container"> + </div>--> +</main> +{% endblock %} +{% block jsdomready %} +{% endblock %} |