Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Template optimizations on version listing #493

Merged
merged 4 commits into from
Sep 25, 2024
Merged

Template optimizations on version listing #493

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
3780bf0
Template optimizations on version listing
agjohnson Sep 23, 2024
9209708
Lint
agjohnson Sep 23, 2024
db9fe59
Call build chip the same way in project listing
agjohnson Sep 23, 2024
0042504
Fix variable passed into chip
agjohnson Sep 23, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions readthedocsext/theme/static/readthedocsext/theme/css/site.css
View file
Open in desktop

Large diffs are not rendered by default.

79 changes: 40 additions & 39 deletions readthedocsext/theme/templates/builds/partials/version_list.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,7 @@
{% extends "includes/crud/table_list.html" %}

{% load i18n %}
{% load humanize %}

{% load core_tags %}
{% load privacy_tags %}
{% load projects_tags %}

{% load ext_theme_tags %}
{% load blocktrans trans from i18n %}
{% load naturaltime from humanize %}

{% block top_left_menu_items %}
<div data-bind="using: FilterView()">
Expand All @@ -17,14 +11,16 @@

{% block create_button %}
{% if is_project_admin %}
<a href="{% url "project_version_create" project.slug %}" class="ui primary button">
<a href="{% url "project_version_create" project.slug %}"
class="ui primary button">
<i class="fa-solid fa-plus icon"></i>
<span class="text">{% trans "Add version" %}</span>
</a>
{% endif %}
{% endblock %}
{% endblock create_button %}

{% block list_placeholder_icon_class %}{% endblock %}
{% block list_placeholder_icon_class %}
{% endblock list_placeholder_icon_class %}
{% block list_placeholder_header_filtered %}
{% trans "No matching versions found" %}
{% endblock list_placeholder_header_filtered %}
Expand All @@ -33,14 +29,17 @@
{% endblock list_placeholder_header_empty %}
{% block list_placeholder_text_empty %}
{% if is_project_admin %}
<a href="{% url "project_version_create" project.slug %}" class="ui primary button">
{% trans "Add version" %}
</a>
<a href="{% url "project_version_create" project.slug %}"
class="ui primary button">{% trans "Add version" %}</a>
{% endif %}
{% endblock list_placeholder_text_empty %}

{% block list_item_start %}
<tr class="middle aligned" data-bind="using: VersionListItemView({id: {{ object.pk }}, url: '{% url "projects-versions-detail" object.project.slug object.slug %}'})">
{# This confuses the formatter as it's just an opening element #}
{# djlint: off #}
<tr class="middle aligned"
data-bind="using: VersionListItemView({id: {{ object.pk }}, url: '{% url "projects-versions-detail" object.project.slug object.slug %}'})">
{# djlint: on #}
{% endblock list_item_start %}

{% block list_item_right_menu %}
Expand All @@ -49,7 +48,7 @@
{% blocktrans trimmed with version=object.verbose_name asvar label_link %}
View documentation for version {{ version }}
{% endblocktrans %}
<a class="ui {% if not object.built %} disabled{% endif %} button"
<a class="ui {% if not object.built %}disabled{% endif %} button"
data-bind="event: {mouseover: fetch, focusin: fetch}, attr: {href: url_docs}"
target="_blank"
data-content="{{ label_link }}"
Expand All @@ -61,24 +60,26 @@
{% blocktrans trimmed with version=object.verbose_name asvar label_download %}
Offline formats for version {{ version }}
{% endblocktrans %}
<button
class="ui {% if not object.has_epub and not object.has_htmlzip and not object.has_pdf %} disabled{% endif %} dropdown button"
data-bind="event: {focusin: fetch, click: fetch}"
data-content="{{ label_download }}"
aria-label="{{ label_download }}"
tabindex="{% if object.has_epub or object.has_htmlzip or object.has_pdf %}0{% else %}-1{% endif %}">
<button class="ui {% if not object.has_epub and not object.has_htmlzip and not object.has_pdf %} disabled{% endif %} dropdown button"
data-bind="event: {focusin: fetch, click: fetch}"
data-content="{{ label_download }}"
aria-label="{{ label_download }}"
tabindex="{% if object.has_epub or object.has_htmlzip or object.has_pdf %}0{% else %}-1{% endif %}">
<i class="fa-solid fa-download icon"></i>
<div class="menu">
<div class="header">{% trans "Offline formats" %}</div>
<a class="disabled item" data-bind="css: {disabled: !url_pdf()}, attr: {href: url_pdf()}">
<a class="disabled item"
data-bind="css: {disabled: !url_pdf()}, attr: {href: url_pdf()}">
<i class="fa-duotone fa-file icon"></i>
{% trans "PDF file" %}
</a>
<a class="disabled item" data-bind="css: {disabled: !url_epub()}, attr: {href: url_epub()}">
<a class="disabled item"
data-bind="css: {disabled: !url_epub()}, attr: {href: url_epub()}">
<i class="fa-duotone fa-file icon"></i>
{% trans "ePUB file" %}
</a>
<a class="disabled item" data-bind="css: {disabled: !url_html()}, attr: {href: url_html()}">
<a class="disabled item"
data-bind="css: {disabled: !url_html()}, attr: {href: url_html()}">
<i class="fa-duotone fa-file-zipper icon"></i>
{% trans "HTML archive" %}
</a>
Expand All @@ -89,20 +90,20 @@
Additional options for version {{ version }}
{% endblocktrans %}
{% if is_project_admin %}
<div class="ui dropdown button" data-content="{{ label_admin }}" aria-label="{{ label_admin }}">
<div class="ui dropdown button"
data-content="{{ label_admin }}"
aria-label="{{ label_admin }}">
<i class="fa-solid fa-ellipsis icon"></i>
<div class="menu">
<div class="header">{% trans "Admin" %}</div>
<readthedocs-menu-build-rebuild
class="item"
url="{% url "projects-versions-builds-list" object.project.slug object.slug %}"
csrf-token="{{ csrf_token }}">
<readthedocs-menu-build-rebuild class="item"
url="{% url "projects-versions-builds-list" object.project.slug object.slug %}"
csrf-token="{{ csrf_token }}">
<i class="fa-duotone fa-refresh icon"></i>
{% trans "Rebuild version" %}
</readthedocs-menu-build-rebuild>
<a
class="item"
href="{% url "project_version_detail" project.slug object.slug %}">
<a class="item"
href="{% url "project_version_detail" project.slug object.slug %}">
<i class="fa-duotone fa-wrench icon"></i>
{% trans "Configure version" %}
</a>
Expand All @@ -113,7 +114,7 @@
{% endblock list_item_right_menu %}

{% block list_item_icon %}
{% include "builds/includes/status_icon.html" with build=object.builds.first circular=True %}
{% include "builds/includes/status_icon.html" with build=object.latest_build circular=True %}
{% endblock list_item_icon %}

{% block list_item_header %}
Expand All @@ -122,7 +123,7 @@
</a>

<div class="sub header">
{% with build=object.last_build %}
{% with build=object.latest_build %}
<time data-content="{{ build.date }}">
{# Translators: this will read like "Last built 1 month, 3 days ago" #}
{% blocktrans with build.date|naturaltime as date trimmed %}
Expand Down Expand Up @@ -155,8 +156,8 @@
</div>
{% endif %}

{% if request.user in project.users.all %}
{% if object.privacy_level == 'private' %}
{% if object.privacy_level == 'private' %}
{% if request.user in project.users.all %}
{% trans "Private" context "Version is private" as text %}
{% blocktrans trimmed with version=object.verbose_name asvar popup %}
Version {{ version }} is private
Expand All @@ -180,10 +181,10 @@
{% endblock list_item_meta_items %}

{% block list_item_extra_items %}
{% with build=object.last_build %}
{% with build=object.latest_build %}
{% if build %}
<div class="item">
{% include "includes/elements/chips/build.html" with build=build text=object.project.name %}
{% include "includes/elements/chips/build.html" with project=project build=build text=project.name %}
</div>
{% endif %}
{% endwith %}
Expand Down
18 changes: 10 additions & 8 deletions readthedocsext/theme/templates/includes/elements/chips/base.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,10 +18,10 @@

{% endcomment %}
{# This is probably used inside another KO `with` binding, so we need to reference the root ApplicationView #}
<div data-bind="with: $root.PopupcardView({% spaceless %}{% block chip_view_params %}{% endblock %}{% endspaceless %})">
<a class="ui {% spaceless %}{% block chip_classes %}basic{% endblock %}{% endspaceless %} label"
<div data-bind="with: $root.PopupcardView({% spaceless %}{% block chip_view_params %}{% endblock chip_view_params %}{% endspaceless %})">
<a class="ui {% spaceless %}{% block chip_classes %}basic{% endblock chip_classes %}{% endspaceless %} label"
data-bind="semanticui: { popup: popup_config() }"
href="{% spaceless %}{% block chip_url %}{% endblock %}{% endspaceless %}">
href="{% spaceless %}{% block chip_url %}{% endblock chip_url %}{% endspaceless %}">

{% comment "rst" %}

Expand Down Expand Up @@ -67,8 +67,10 @@
</div>
{% endblock chip_detail %}
</a>
<div class="ui fluid popup" data-bind="using: data, css: { loading: is_loading() }">
<div class="ui small wide basic horizontal card" data-bind="if: $parent.is_loaded()">
<div class="ui flowing popup"
data-bind="using: data, css: { loading: is_loading() }">
<div class="ui small basic horizontal card"
data-bind="if: $parent.is_loaded()">

{% comment "rst" %}

Expand All @@ -95,7 +97,7 @@

{% endcomment %}
{% block popupcard_right %}
{% endblock %}
{% endblock popupcard_right %}

<div class="header">
{% comment "rst" %}
Expand Down Expand Up @@ -135,14 +137,14 @@
</div>

<div class="extra content">
{% comment "rst" %}
{% comment "rst" %}

.. describe:: popupcard_extra

The extra content for the card, a line for metadata below the card
content.

{% endcomment %}
{% endcomment %}
{% block popupcard_extra %}
{% endblock popupcard_extra %}
</div>
Expand Down
18 changes: 8 additions & 10 deletions readthedocsext/theme/templates/includes/elements/chips/build.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,14 @@
{% extends "includes/elements/chips/base.html" %}

{% load i18n %}
{% load humanize %}
{% block chip_view_params %}'{% url "projects-builds-detail" build.project.slug build.pk %}'{% endblock %}
{% load naturaltime from humanize %}

{% block chip_view_params %}
'{% url "projects-builds-detail" project.slug build.pk %}'
{% endblock chip_view_params %}

{% block chip_url %}
{% url "builds_detail" build.project.slug build.pk %}
{% endblock %}
{% url "builds_detail" project.slug build.pk %}
{% endblock chip_url %}

{% block chip_icon %}
{% include "builds/includes/status_icon.html" with build=build size="" %}
Expand Down Expand Up @@ -42,11 +44,7 @@
{% endblock popupcard_meta %}

{% block popupcard_content %}
{% if build.error %}
<p style="white-space: normal;">
{{ build.error }}
</p>
{% endif %}
{% if build.error %}<p>{{ build.error }}</p>{% endif %}
{% endblock popupcard_content %}

{% block popupcard_extra %}
Expand Down
4 changes: 2 additions & 2 deletions readthedocsext/theme/templates/projects/partials/project_list.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -95,8 +95,8 @@
{% if object.has_good_build %}
{% with build=object.get_latest_build %}
{# Safety check, there seems to be some case where `has_good_build` and `get_latest_build` still return a null build #}
{% if build and build.project %}
{% include "includes/elements/chips/build.html" with build=build %}
{% if build %}
{% include "includes/elements/chips/build.html" with project=object build=build %}
{% endif %}
{% endwith %}
{% endif %}
Expand Down
4 changes: 4 additions & 0 deletions src/sui/themes/rtd-application/modules/popup.overrides
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,3 +6,7 @@
border: none;
}
}

.ui.popup > .ui.card > .content > .description {
white-space: normal;
}