From 1b700086f23dc835a60c66c045bcfb03d55fba48 Mon Sep 17 00:00:00 2001 From: shmyga Date: Mon, 15 Jun 2026 23:18:48 +0300 Subject: [PATCH] feat(weather): update navigate icons --- .../easel/route/view/common/utils/template.py | 5 ++++ gallery/easel/route/view/weather/__init__.py | 2 -- gallery/easel/route/view/weather/filters.py | 10 +++++-- .../route/view/weather/templates/weather.html | 29 ++++++++++++------- static/src/lib/bootstrap-icons.scss | 19 +++++++----- .../src/lib/weather-icons/weather-icons.scss | 7 +++++ 6 files changed, 50 insertions(+), 22 deletions(-) diff --git a/gallery/easel/route/view/common/utils/template.py b/gallery/easel/route/view/common/utils/template.py index dd846bd..c12f377 100644 --- a/gallery/easel/route/view/common/utils/template.py +++ b/gallery/easel/route/view/common/utils/template.py @@ -1,3 +1,4 @@ +import datetime from pathlib import Path from babel.dates import format_date @@ -7,6 +8,7 @@ from fastapi.templating import Jinja2Templates from gallery.version import __version__ from ...translation import _ +from .tag import TagUtil def is_widget(request: Request) -> bool: @@ -31,6 +33,9 @@ def build_templates(templates_dir: Path | None = None, filters: dict | None = No "_": _, "version": __version__, "format_date": format_date, + "datetime": datetime, + "tag_util": TagUtil, + "DATE_FORMAT": "E, d MMMM Y", } ) if filters: diff --git a/gallery/easel/route/view/weather/__init__.py b/gallery/easel/route/view/weather/__init__.py index df09178..fbff432 100644 --- a/gallery/easel/route/view/weather/__init__.py +++ b/gallery/easel/route/view/weather/__init__.py @@ -25,8 +25,6 @@ def build_weather_response(request: AppRequest, response: WeatherResponse): request=request, name="weather.html", context={ - "tag_util": TagUtil, - "datetime": datetime, "response": response, }, ) diff --git a/gallery/easel/route/view/weather/filters.py b/gallery/easel/route/view/weather/filters.py index c42318b..77bb247 100644 --- a/gallery/easel/route/view/weather/filters.py +++ b/gallery/easel/route/view/weather/filters.py @@ -1,6 +1,12 @@ import datetime -from gallery.sketch.weather.model import Cloudness, Precipitation, Sky, WindDirection, WindDirectionDeg +from gallery.sketch.weather.model import ( + Cloudness, + Precipitation, + Sky, + WindDirection, + WindDirectionDeg, +) def wind_direction_icon(wind_direction_deg: float) -> str: @@ -8,7 +14,7 @@ def wind_direction_icon(wind_direction_deg: float) -> str: if wind_direction == WindDirection.CALM: return "wind-calm" else: - return f"wind-from-{wind_direction.name.lower()}" + return f"wind-from-{wind_direction.name.lower()}" def cloudness_icon(sky: Sky, date: datetime.datetime, period: str) -> list[str]: diff --git a/gallery/easel/route/view/weather/templates/weather.html b/gallery/easel/route/view/weather/templates/weather.html index d8dc714..3922e0a 100644 --- a/gallery/easel/route/view/weather/templates/weather.html +++ b/gallery/easel/route/view/weather/templates/weather.html @@ -9,16 +9,24 @@ {% block content %}

{% if response.period == 'day' %} - ⬅️ - ⬆️ - {{response.location}} | {{format_date(response.date, 'E, d MMMM Y', locale=request.state.language)}} - ➡️ + + + + + + + {{response.location}} | {{format_date(response.date, DATE_FORMAT, locale=request.state.language)}} + + + {% endif %} {% if response.period == 'days' %} - {{response.location}} | {{format_date(response.date, 'E, d MMMM Y', locale=request.state.language)}} + {{response.location}} | {{format_date(response.date, DATE_FORMAT, locale=request.state.language)}} + - {{format_date(response.date + datetime.timedelta(days=(response.values | length - 1)), DATE_FORMAT, + locale=request.state.language)}} {% endif %}

@@ -58,8 +66,7 @@ data-bs-toggle="tooltip" data-bs-title="{{ value.sky }}"> {% for icon in value.sky | cloudness_icon(value.date, response.period) %} -
+
{% endfor %} {% endfor %} @@ -95,7 +102,7 @@ -
+
{% endfor %} diff --git a/static/src/lib/bootstrap-icons.scss b/static/src/lib/bootstrap-icons.scss index d9ba7a6..40143d1 100644 --- a/static/src/lib/bootstrap-icons.scss +++ b/static/src/lib/bootstrap-icons.scss @@ -1,4 +1,6 @@ -//$bootstrap-icons: "circle-half", "moon-stars-fill", "brightness-high", "gear", "sun-fill", "tv"; +.icon-link { + vertical-align: -0.25rem; +} .bi { display: inline-block; @@ -13,12 +15,6 @@ mask-repeat: no-repeat; background-color: currentColor; - //@each $icon in $bootstrap-icons { - // &.bi-#{$icon} { - // mask-image: url("bootstrap-icons/icons/#{$icon}.svg"); - // } - /// - &.bi-circle-half { mask-image: url(bootstrap-icons/icons/circle-half.svg); } @@ -37,4 +33,13 @@ &.bi-tv { mask-image: url(bootstrap-icons/icons/tv.svg); } + &.bi-arrow-left-square { + mask-image: url(bootstrap-icons/icons/arrow-left-square.svg); + } + &.bi-arrow-right-square { + mask-image: url(bootstrap-icons/icons/arrow-right-square.svg); + } + &.bi-arrow-up-square { + mask-image: url(bootstrap-icons/icons/arrow-up-square.svg); + } } diff --git a/static/src/lib/weather-icons/weather-icons.scss b/static/src/lib/weather-icons/weather-icons.scss index 1162750..199980e 100644 --- a/static/src/lib/weather-icons/weather-icons.scss +++ b/static/src/lib/weather-icons/weather-icons.scss @@ -13,4 +13,11 @@ mask-position: 50%; mask-repeat: no-repeat; background-color: currentColor; + + &.wi-l { + font-size: 2.5rem; + } + &.wi-xl { + font-size: 3.5rem; + } }