Skip to content

Commit

Permalink
budgeting: style archived proposal
Browse files Browse the repository at this point in the history
  • Loading branch information
@hom3mad3
hom3mad3 committed Mar 11, 2025
1 parent 1355fde commit c86a27d
Show file tree
Hide file tree
Showing 8 changed files with 186 additions and 148 deletions.
3 changes: 3 additions & 0 deletions meinberlin/apps/contrib/templates/meinberlin_contrib/components/info-box.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,9 @@
role="status"
tabindex="0"
>
{% if info_title %}
<h3 class="info-box__title">{% translate info_title %}</h3>
{% endif %}
<p class="info-box__text">
{% translate info_message %}
</p>
Expand Down
89 changes: 38 additions & 51 deletions meinberlin/apps/contrib/templates/meinberlin_contrib/components/moderator_feedback.html
View file
Original file line number Diff line number Diff line change
@@ -1,60 +1,47 @@
{% load i18n item_tags contrib_tags moderatorremark_tags %}

{% with feedback_classification=object.moderator_status|classify|lower %}
<section class="moderator-feedback
moderator-feedback__bg
{% if object.moderator_feedback_text.feedback_text or object.moderator_status %}
moderator-feedback__bg--{{ feedback_classification }}
{% endif %}
"
id="moderator-feedback"
>
<h2 class="moderator-feedback__title">{% translate 'Feedback' %}</h2>
<section id="moderator-feedback" class="moderator-feedback moderator-feedback__bg {% if object.moderator_feedback_text.feedback_text or object.moderator_status %}moderator-feedback__bg--{{ feedback_classification }}{% endif %}">
<h2 class="moderator-feedback__title">{% translate 'Feedback' %}</h2>
{% if object.moderator_status %}
<div class="moderator-status" aria-label="Status Indicator">
<span class="moderator-status__color-indicator moderator-status__label--{{ feedback_classification }}" aria-hidden="true"></span>
<span>
<strong>{% translate 'Status: ' %}</strong>
{{ object.get_moderator_status_display }}
</span>
</div>
{% endif %}

{% if object.moderator_status %}
<!-- This div could be replaced by ModeratorStatus.jsx since it's exactly the same thing: -->
<div class="moderator-status" aria-label="Status Indicator">
<span class="moderator-status__color-indicator moderator-status__label--{{ feedback_classification }}" aria-hidden="true"></span>
<span>
<strong>
{% translate 'Status: ' %}
</strong>
{{ object.get_moderator_status_display }}
</span>
</div>
{% endif %}

{% if object.moderator_feedback_text.feedback_text or object.moderator_status %}
<div class="ck-content moderator-feedback__content">
{{ object.moderator_feedback_text.feedback_text | safe }}
</div>
{% else %}
<div class="ck-content moderator-feedback__content">
{% translate 'To add a feedback, please click edit.' %}
</div>
{% endif %}
{% if object.moderator_feedback_text.feedback_text or object.moderator_status %}
<div class="ck-content moderator-feedback__content">{{ object.moderator_feedback_text.feedback_text|safe }}</div>
{% else %}
<div class="ck-content moderator-feedback__content">
{% translate 'To add a feedback, please click edit.' %}
</div>
{% endif %}

{% if object.moderator_feedback_text.feedback_text %}
<div class="moderator-feedback__meta">
{{ object.module.project.organisation.name }}
{% if object.moderator_feedback_text.feedback_text %}
<div class="moderator-feedback__meta">
{{ object.module.project.organisation.name }}

{% if object.moderator_feedback_text.modified %}
{% translate 'updated on ' %}{% html_date object.moderator_feedback_text.modified %}
{% else %}
{% translate 'created on ' %}{% html_date object.moderator_feedback_text.created %}
{% endif %}
</div>
{% if object.moderator_feedback_text.modified %}
{% translate 'updated on ' %}
{% html_date object.moderator_feedback_text.modified %}
{% else %}
{% translate 'created on ' %}
{% html_date object.moderator_feedback_text.created %}
{% endif %}
</div>
{% endif %}

{% if is_moderator %}
{% get_item_url object 'moderate' False as moderate_url %}
{% if moderate_url %}
<div>
<a href="{{ moderate_url }}" data-embed-target="external">
{% translate 'Edit' %}
</a>
</div>
{% endif %}
{% endif %}
</section>
{% if is_moderator %}
{% get_item_url object 'moderate' False as moderate_url %}
{% if moderate_url %}
<div>
<a href="{{ moderate_url }}" data-embed-target="external">{% translate 'Edit' %}</a>
</div>
{% endif %}
{% endif %}
</section>
{% endwith %}
178 changes: 92 additions & 86 deletions meinberlin/apps/contrib/templates/meinberlin_contrib/item_detail.html
View file
Original file line number Diff line number Diff line change
@@ -1,107 +1,113 @@
{% extends "base.html" %}
{% extends 'base.html' %}
{% load i18n module_tags rules react_comments_async react_comments_async react_ratings wagtailcore_tags item_tags contrib_tags moderatorremark_tags %}

{% block title %}
{{ object.name }}
—
{{ block.super }}
{{ object.name }}
—
{{ block.super }}
{% endblock title %}

{% block breadcrumbs %}
<div id="content-header">
<nav class="breadcrumb" aria-label="{% translate 'You are here:' %}">
<ol>
<li>
<a href="{% url 'wagtail_serve' '' %}">meinBerlin</a>
</li>
<li>
<a href="{% url 'meinberlin_plans:plan-list' %}">{% translate 'Kiezradar' %}</a>
</li>
<li>
<a href="{% url 'project-detail' project.slug %}">{{ project.name|truncatechars:50 }}</a>
</li>
<li>
<a href="{{ module.get_absolute_url }}">{{ module.name|truncatechars:50 }}</a>
</li>
<li class="active" aria-current="page">{{ object.name }}</li>
</ol>
</nav>
</div>
<div id="content-header">
<nav class="breadcrumb" aria-label="{% translate 'You are here:' %}">
<ol>
<li>
<a href="{% url 'wagtail_serve' '' %}">meinBerlin</a>
</li>
<li>
<a href="{% url 'meinberlin_plans:plan-list' %}">{% translate 'Kiezradar' %}</a>
</li>
<li>
<a href="{% url 'project-detail' project.slug %}">{{ project.name|truncatechars:50 }}</a>
</li>
<li>
<a href="{{ module.get_absolute_url }}">{{ module.name|truncatechars:50 }}</a>
</li>
<li class="active" aria-current="page">{{ object.name }}</li>
</ol>
</nav>
</div>
{% endblock breadcrumbs %}

{% block content %}
<div id="layout-grid__area--maincontent">
<article class="item-detail">
<header>
{% if object.image %}
<div class="image item-detail__image">
<div class="image__image">
<img src="{{ object.image.url }}" alt="{{ object.image.alt }}"/>
</div>
</div>
{% endif %}
<div id="layout-grid__area--maincontent">
{% if object.is_archived %}
{% include 'meinberlin_contrib/components/info-box.html' with info_message='This idea has been archived.' info_title='Archived' %}
{% endif %}
<article class="item-detail {% if object.is_archived %}item-detail--archived{% endif %}">
<header class="item-detail__header">
{% if object.image %}
<div class="image item-detail__image">
<div class="image__image">
<img src="{{ object.image.url }}" alt="{{ object.image.alt }}" height="" width="" />
</div>
</div>
{% endif %}

<div class="item-detail__actions">
<h1 class="item-detail__title">
{{ object.name }}
</h1>
<div class="item-detail__actions">
<h1 class="item-detail__title">
{{ object.name }}
{% if object.is_archived %}
<span>{% translate '(Archived)' %}</span>
{% endif %}
</h1>

{% get_item_change_permission object as change_perm %}
{% has_perm change_perm request.user object as user_may_change %}
{% get_item_permission object 'moderate' as moderate_perm %}
{% has_perm moderate_perm request.user object as is_moderator %}
{% get_item_change_permission object as change_perm %}
{% has_perm change_perm request.user object as user_may_change %}
{% get_item_permission object 'moderate' as moderate_perm %}
{% has_perm moderate_perm request.user object as is_moderator %}

{% if request.user.is_authenticated %}
{% include "meinberlin_contrib/includes/item_detail_dropdown.html" with object=object %}
{% endif %}
</div>
{% if request.user.is_authenticated %}
{% include 'meinberlin_contrib/includes/item_detail_dropdown.html' with object=object %}
{% endif %}
</div>

<div class="item-detail__user">
<strong>{{ object.creator.username }}</strong>
{% if object.modified %}
{% translate 'updated on ' %}{% html_date object.modified class='list-item__date' %}
{% else %}
{% translate 'created on ' %}{% html_date object.created class='list-item__date' %}
{% endif %}
</div>
<div class="item-detail__user">
<strong>{{ object.creator.username }}</strong>
{% if object.modified %}
{% translate 'updated on ' %}
{% html_date object.modified class='list-item__date' %}
{% else %}
{% translate 'created on ' %}
{% html_date object.created class='list-item__date' %}
{% endif %}
</div>

{% include "meinberlin_contrib/includes/item_detail_labels.html" with object=object %}
</header>
{% include 'meinberlin_contrib/includes/item_detail_labels.html' with object=object %}
</header>

<section class="item-detail__content">
<div class="ck-content">
{{ object.description | richtext }}
</div>
<div class="item-detail__reference">
<strong>{% translate 'Reference No.' %}:</strong>
{{ object.reference_number }}
</div>
{% block additional_content %}{% endblock additional_content %}
</section>
<section class="item-detail__content">
<div class="ck-content">{{ object.description|richtext }}</div>
<div class="item-detail__reference">
<strong>{% translate 'Reference No.' %}:</strong>
{{ object.reference_number }}
</div>
{% block additional_content %}
{% endblock additional_content %}
</section>

<section>
{% block ratings %}
{% if object|has_feature:"rate" %}
<div>
{% react_ratings object %}
</div>
{% endif %}
{% endblock ratings %}
</section>
<section>
{% block ratings %}
{% if object|has_feature:'rate' %}
<div>
{% react_ratings object %}
</div>
{% endif %}
{% endblock ratings %}
</section>

{% block vote_button %}{% endblock vote_button %}
{% block vote_button %}
{% endblock vote_button %}

{% if module.blueprint_type in 'PB3,PB2,PB' %}
{% if is_moderator or object.moderator_status %}
{% include "meinberlin_contrib/components/moderator_feedback.html" %}
{% endif %}
{% endif %}
{% if module.blueprint_type in 'PB3,PB2,PB' %}
{% if is_moderator or object.moderator_status %}
{% include 'meinberlin_contrib/components/moderator_feedback.html' %}
{% endif %}
{% endif %}

{% include "meinberlin_contrib/components/moderator_notes.html" %}
{% include 'meinberlin_contrib/components/moderator_notes.html' %}
</article>

<section>
{% react_comments_async object %}
</section>
</article>
</div>
{% react_comments_async object %}
</div>
{% endblock content %}
29 changes: 23 additions & 6 deletions meinberlin/assets/scss/components_user_facing/_card.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,17 +55,15 @@
}
}

// Needed for due to Bo js not working
.card__header .title:hover {
cursor: pointer;
text-decoration: underline;
}

.card__header .title--no-underline:hover {
cursor: default;
text-decoration: none;
}

.card__link {
color: $link-color;
}

.card__link--hover {
text-decoration: underline !important; // BO overide
}
Expand Down Expand Up @@ -103,3 +101,22 @@
.card__button:hover i {
color: $body-bg;
}

.card--archived .card__stats,
.card--archived .title,
.card--archived .pill:not(.pill--archived) {
filter: grayscale(100%);
opacity: 0.7;
}

.pill--archived,
.card__link {
filter: none;
opacity: 1;
}

// Needed for due to Bo js not working
.card__header .title:hover {
cursor: pointer;
text-decoration: underline;
}
4 changes: 4 additions & 0 deletions meinberlin/assets/scss/components_user_facing/_info-box.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,10 @@
background-color: $message-light-blue;
}

.info-box__title {
margin-top: 0;
}

.info-box__text {
margin: 0;
}
Loading

0 comments on commit c86a27d

Please sign in to comment.