From ccf3ce18220f3256a7cf96ed32f26511a5d01337 Mon Sep 17 00:00:00 2001 From: Wojtek Kosior Date: Sat, 3 Sep 2022 11:57:09 +0200 Subject: [proxy] improve the look of item lists in web UI --- src/hydrilla/locales/en_US/LC_MESSAGES/messages.po | 4 +-- .../proxy/web_ui/templates/base.html.jinja | 13 +++++---- .../templates/include/item_list_style.css.jinja | 23 ++++++++++++--- .../web_ui/templates/items/item_view.html.jinja | 25 ++++++++++++---- .../web_ui/templates/items/libraries.html.jinja | 7 +++++ .../web_ui/templates/items/packages.html.jinja | 20 +++++++++++-- .../proxy/web_ui/templates/repos/index.html.jinja | 34 ++++++++++++++-------- 7 files changed, 96 insertions(+), 30 deletions(-) (limited to 'src') diff --git a/src/hydrilla/locales/en_US/LC_MESSAGES/messages.po b/src/hydrilla/locales/en_US/LC_MESSAGES/messages.po index e637de1..23d1127 100644 --- a/src/hydrilla/locales/en_US/LC_MESSAGES/messages.po +++ b/src/hydrilla/locales/en_US/LC_MESSAGES/messages.po @@ -301,7 +301,7 @@ msgstr "Library view" #: src/hydrilla/proxy/web_ui/templates/items/library_view.html.jinja:25 msgid "web_ui.items.single.library.heading.name_{}" -msgstr "Libraries known by '{}'" +msgstr "Libraries named '{}'" #: src/hydrilla/proxy/web_ui/templates/items/library_view.html.jinja:35 msgid "web_ui.items.single.library.version_list_heading" @@ -361,7 +361,7 @@ msgstr "Package view" #: src/hydrilla/proxy/web_ui/templates/items/package_view.html.jinja:25 msgid "web_ui.items.single.package.heading.name_{}" -msgstr "Packages known by '{}'" +msgstr "Packages named '{}'" #: src/hydrilla/proxy/web_ui/templates/items/package_view.html.jinja:35 msgid "web_ui.items.single.package.version_list_heading" diff --git a/src/hydrilla/proxy/web_ui/templates/base.html.jinja b/src/hydrilla/proxy/web_ui/templates/base.html.jinja index a1de86a..0d74fc0 100644 --- a/src/hydrilla/proxy/web_ui/templates/base.html.jinja +++ b/src/hydrilla/proxy/web_ui/templates/base.html.jinja @@ -24,13 +24,16 @@ in a proprietary work, I am not going to enforce this in court.
{% for classes, text, action in buttons_data %} {% if 'disabled-button' in classes %} - + {% set disabled_attr = ' disabled=""' %} {% else %} -
- - -
+ {% set disabled_attr = '' %} {% endif %} +
+ + +
{% endfor %}
{% endmacro %} diff --git a/src/hydrilla/proxy/web_ui/templates/include/item_list_style.css.jinja b/src/hydrilla/proxy/web_ui/templates/include/item_list_style.css.jinja index 54315ed..86ac1b5 100644 --- a/src/hydrilla/proxy/web_ui/templates/include/item_list_style.css.jinja +++ b/src/hydrilla/proxy/web_ui/templates/include/item_list_style.css.jinja @@ -25,14 +25,29 @@ ul#item_list { ul#item_list > li { list-style-type: none; max-width: 100%; - overflow-x: scroll; white-space: nowrap; - margin: 5px; + margin: 0 5px 0 5px; } ul#item_list > li > :only-child { display: block; padding: 5px; - border: 2px solid #999; - border-radius: 5px; + overflow-x: scroll; + border-bottom: 2px solid #999; +} + +ul#item_list > li.entry-line-dashed > :only-child { + border-bottom-style: dashed +} + +ul#item_list > li.entry-line-green > :only-child { + border-color: #4caf50; +} + +ul#item_list > li.entry-line-blue > :only-child { + border-color: #504caf; +} + +ul#item_list > li.entry-line-red > :only-child { + border-color: #af504c; } diff --git a/src/hydrilla/proxy/web_ui/templates/items/item_view.html.jinja b/src/hydrilla/proxy/web_ui/templates/items/item_view.html.jinja index 1ad8df3..07212ff 100644 --- a/src/hydrilla/proxy/web_ui/templates/items/item_view.html.jinja +++ b/src/hydrilla/proxy/web_ui/templates/items/item_view.html.jinja @@ -21,7 +21,7 @@ in a proprietary work, I am not going to enforce this in court. {% extends "base.html.jinja" %} {% macro versioned_identifier_with_repo(info) %} - {{ info.info.versioned_identifier }} + {{ info.info.version_string }} {% if not info.is_local %} @ {{ info.info.repo }} @@ -32,6 +32,10 @@ in a proprietary work, I am not going to enforce this in court. {{ super() }} {% include 'include/item_list_style.css.jinja' %} + + .textcolor-gray { + color: #777; + } {% endblock %} {% block main %} {% block main_info %} @@ -49,12 +53,23 @@ in a proprietary work, I am not going to enforce this in court. version_display_info.ref != info.ref %} {% set entry_classes = [] %} - {% if info.is_local %} - {% do entry_classes.append('version-entry-local') %} + + {% if info.is_orphan or info.is_local %} + {% do entry_classes.append('textcolor-gray') %} {% endif %} - {% if info.is_orphan %} - {% do entry_classes.append('version-entry-orphan') %} + + {% if info.active == ActiveStatus.REQUIRED %} + {% do entry_classes.append('entry-line-blue') %} + {% + if display_info.type != ItemType.MAPPING or + display_info.enabled != EnabledStatus.ENABLED + %} + {% do entry_classes.append('entry-line-dashed') %} + {% endif %} + {% elif info.active == ActiveStatus.AUTO %} + {% do entry_classes.append('entry-line-green') %} {% endif %} +
  • {% set href = url_for( diff --git a/src/hydrilla/proxy/web_ui/templates/items/libraries.html.jinja b/src/hydrilla/proxy/web_ui/templates/items/libraries.html.jinja index 172c040..77874cb 100644 --- a/src/hydrilla/proxy/web_ui/templates/items/libraries.html.jinja +++ b/src/hydrilla/proxy/web_ui/templates/items/libraries.html.jinja @@ -24,6 +24,13 @@ in a proprietary work, I am not going to enforce this in court. {{ super() }} {% include 'include/item_list_style.css.jinja' %} + + ul#item_list > li > a { + display: flex !important; + flex-direction: column; + justify-content: center; + min-height: 2.2em; + } {% endblock %} {% block main %}

    {{ _('web_ui.libraries.heading') }}

    diff --git a/src/hydrilla/proxy/web_ui/templates/items/packages.html.jinja b/src/hydrilla/proxy/web_ui/templates/items/packages.html.jinja index d2eaaf3..093570d 100644 --- a/src/hydrilla/proxy/web_ui/templates/items/packages.html.jinja +++ b/src/hydrilla/proxy/web_ui/templates/items/packages.html.jinja @@ -24,17 +24,33 @@ in a proprietary work, I am not going to enforce this in court. {{ super() }} {% include 'include/item_list_style.css.jinja' %} + + ul#item_list > li > a { + display: flex !important; + flex-direction: column; + justify-content: center; + min-height: 2.2em; + } {% endblock %} {% block main %}

    {{ _('web_ui.packages.heading') }}