From 8b5b38e38bb792566fe21f8d3d7aabf5ad896473 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Lera=20Elvo=C3=A9?= Date: Thu, 27 Nov 2025 22:25:03 +0300 Subject: [PATCH] render motds in topic and topics views --- app/__init__.py | 1 + app/templates/common/macros.html | 15 ++++++++++++- app/templates/topics/topic.html | 10 ++++++++- app/templates/topics/topics.html | 9 +++++++- data/static/css/style.css | 27 +++++++++++++++++++++++ data/static/css/theme-otomotone.css | 27 +++++++++++++++++++++++ data/static/css/theme-peachy.css | 27 +++++++++++++++++++++++ sass/_default.scss | 34 +++++++++++++++++++++++++++++ sass/otomotone.scss | 1 + sass/peachy.scss | 1 + 10 files changed, 149 insertions(+), 3 deletions(-) diff --git a/app/__init__.py b/app/__init__.py index b74226b..01c0872 100644 --- a/app/__init__.py +++ b/app/__init__.py @@ -186,6 +186,7 @@ def create_app(): return { 'get_post_url': get_post_url, 'get_prefers_theme': get_prefers_theme, + 'get_motds': MOTD.get_all, } @app.template_filter("ts_datetime") diff --git a/app/templates/common/macros.html b/app/templates/common/macros.html index 9809cc5..a627d19 100644 --- a/app/templates/common/macros.html +++ b/app/templates/common/macros.html @@ -1,4 +1,4 @@ -{% from 'common/icons.html' import icn_image, icn_spoiler, icn_info, icn_lock, icn_warn, icn_error, icn_bookmark %} +{% from 'common/icons.html' import icn_image, icn_spoiler, icn_info, icn_lock, icn_warn, icn_error, icn_bookmark, icn_megaphone %} {% macro pager(current_page, page_count) %} {% set left_start = [1, current_page - 5] | max %} {% set right_end = [page_count, current_page + 5] | min %} @@ -61,6 +61,19 @@ {% endmacro %} +{% macro motd(motd_obj) %} +
+
+ {{ icn_megaphone(80) }} + MOTD +
+
+
{{ motd_obj.title }}
+
{{ motd_obj.body_rendered | safe}}
+
+
+{% endmacro %} + {% macro timestamp(unix_ts) -%} {{ unix_ts | ts_datetime('%Y-%m-%d %H:%M')}} ST {%- endmacro %} diff --git a/app/templates/topics/topic.html b/app/templates/topics/topic.html index cfa3170..92b876c 100644 --- a/app/templates/topics/topic.html +++ b/app/templates/topics/topic.html @@ -1,4 +1,4 @@ -{% from 'common/macros.html' import pager, timestamp %} +{% from 'common/macros.html' import pager, timestamp, motd %} {% from 'common/icons.html' import icn_lock, icn_sticky %} {% extends "base.html" %} {% block title %}browsing topic {{ topic['name'] }}{% endblock %} @@ -27,6 +27,14 @@ {{ infobox("This topic is locked.;Only moderators can create new threads.", InfoboxKind.INFO) }} {% endif %} +{%- with motds = get_motds() -%} + {%- if motds -%} + {%- for motd_obj in motds -%} + {{- motd(motd_obj) -}} + {%- endfor -%} + {%- endif -%} +{%- endwith -%} + {% if threads_list | length == 0 %}

There are no threads in this topic.

{% else %} diff --git a/app/templates/topics/topics.html b/app/templates/topics/topics.html index da6ef22..e50e410 100644 --- a/app/templates/topics/topics.html +++ b/app/templates/topics/topics.html @@ -1,5 +1,5 @@ {% from 'common/icons.html' import icn_lock %} -{% from 'common/macros.html' import timestamp %} +{% from 'common/macros.html' import timestamp, motd %} {% extends "base.html" %} {% block content %} +{%- with motds = get_motds() -%} + {%- if motds -%} + {%- for motd_obj in motds -%} + {{- motd(motd_obj) -}} + {%- endfor -%} + {%- endif -%} +{%- endwith -%} {% if topic_list | length == 0 %}

There are no topics.

{% else %} diff --git a/data/static/css/style.css b/data/static/css/style.css index 68b571b..83517f8 100644 --- a/data/static/css/style.css +++ b/data/static/css/style.css @@ -1381,3 +1381,30 @@ footer { max-height: 300px; overflow: scroll; } + +.motd { + display: flex; + background-color: #c1ceb1; + border: 2px outset rgb(217.26, 220.38, 213.42); + padding: 10px 15px; + margin: 10px 0; +} + +.motd-icon-container { + display: flex; + min-width: 80px; + padding-right: 15px; +} + +.motd-content-container { + display: flex; + flex-direction: column; + align-self: center; + flex-grow: 1; + padding-right: 25%; +} + +.motd-title { + font-weight: bold; + font-size: larger; +} diff --git a/data/static/css/theme-otomotone.css b/data/static/css/theme-otomotone.css index 78732ab..cc169c7 100644 --- a/data/static/css/theme-otomotone.css +++ b/data/static/css/theme-otomotone.css @@ -1382,6 +1382,33 @@ footer { overflow: scroll; } +.motd { + display: flex; + background-color: #503250; + border: 2px outset #503250; + padding: 10px 15px; + margin: 10px 0; +} + +.motd-icon-container { + display: flex; + min-width: 80px; + padding-right: 15px; +} + +.motd-content-container { + display: flex; + flex-direction: column; + align-self: center; + flex-grow: 1; + padding-right: 25%; +} + +.motd-title { + font-weight: bold; + font-size: larger; +} + #topnav { margin-bottom: 10px; border: 10px solid rgb(40, 40, 40); diff --git a/data/static/css/theme-peachy.css b/data/static/css/theme-peachy.css index 25aa03b..5ad4b9c 100644 --- a/data/static/css/theme-peachy.css +++ b/data/static/css/theme-peachy.css @@ -1382,6 +1382,33 @@ footer { overflow: scroll; } +.motd { + display: flex; + background-color: #f27a5a; + border: 1px solid black; + padding: 6px 8px; + margin: 6px 0; +} + +.motd-icon-container { + display: flex; + min-width: 80px; + padding-right: 8px; +} + +.motd-content-container { + display: flex; + flex-direction: column; + align-self: center; + flex-grow: 1; + padding-right: 25%; +} + +.motd-title { + font-weight: bold; + font-size: larger; +} + #topnav { border-top-left-radius: 16px; border-top-right-radius: 16px; diff --git a/sass/_default.scss b/sass/_default.scss index 9fc447d..4d110d2 100644 --- a/sass/_default.scss +++ b/sass/_default.scss @@ -1335,3 +1335,37 @@ $bookmark_dropdown_items_container_max_height: 300px !default; max-height: $bookmark_dropdown_items_container_max_height; overflow: scroll; } + +$motd_background_color: $ACCENT_COLOR !default; +$motd_border: 2px outset $LIGHT !default; +$motd_padding: $MEDIUM_PADDING $MEDIUM_BIG_PADDING !default; +$motd_margin: $MEDIUM_PADDING 0 !default; +.motd { + display: flex; + background-color: $motd_background_color; + border: $motd_border; + padding: $motd_padding; + margin: $motd_margin; +} + +$motd_icon_min_width: 80px !default; +$motd_icon_padding_right: $MEDIUM_BIG_PADDING !default; +.motd-icon-container { + display: flex; + min-width: $motd_icon_min_width; + padding-right: $motd_icon_padding_right; +} + +$motd_content_padding_right: 25% !default; +.motd-content-container { + display: flex; + flex-direction: column; + align-self: center; + flex-grow: 1; + padding-right: $motd_content_padding_right; +} + +.motd-title { + font-weight: bold; + font-size: larger; +} diff --git a/sass/otomotone.scss b/sass/otomotone.scss index 2544acc..28a8315 100644 --- a/sass/otomotone.scss +++ b/sass/otomotone.scss @@ -49,6 +49,7 @@ $crit: #d53232; $post_content_background: $dark_accent, $thread_info_background_color: $dark_accent, + $motd_background_color: $lightish_accent, $post_reactions_background: $lightish_accent, diff --git a/sass/peachy.scss b/sass/peachy.scss index 4712b65..de51d42 100644 --- a/sass/peachy.scss +++ b/sass/peachy.scss @@ -15,6 +15,7 @@ $br: 16px; $usercard_border: none, $usercard_border_right: none, $thread_locked_border: 1px solid black, + $motd_border: 1px solid black, $SETTINGS_WIDTH: 60%, $PAGE_SIDE_MARGIN: 50px,